Use .js imports in src (#727)

* Use .js in src imports

* Bump dev

packages/ui-shared/src/bundle.ts

@@ -1,5 +1,5 @@
 // Copyright 2018-2023 @polkadot/ui-shared authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-export * from './icons';
-export { packageInfo } from './packageInfo';
+export * from './icons/index.js';
+export { packageInfo } from './packageInfo.js';

packages/ui-shared/src/detectPackage.ts

@@ -5,7 +5,7 @@
 
 import { detectPackage } from '@polkadot/util';
 
-import others from './detectOther';
-import { packageInfo } from './packageInfo';
+import others from './detectOther.js';
+import { packageInfo } from './packageInfo.js';
 
 detectPackage(packageInfo, null, others);

packages/ui-shared/src/icons/beachball/colors.spec.ts

@@ -3,10 +3,10 @@
 
 /// <reference types="@polkadot/dev/node/test/node" />
 
-import type { ColorGen } from './types';
+import type { ColorGen } from './types.js';
 
-import { colors as newColors } from './colors';
-import { seeder as newSeeder } from './seeder';
+import { colors as newColors } from './colors.js';
+import { seeder as newSeeder } from './seeder.js';
 
 describe('colors', (): void => {
   let colors: ColorGen;

packages/ui-shared/src/icons/beachball/colors.ts

@@ -3,11 +3,11 @@
 
 // Copyright 2016 Dan Finlay
 
-import type { ColorGen, Seeder } from './types';
+import type { ColorGen, Seeder } from './types.js';
 
 import Color from 'color';
 
-import { COLORS } from './defaults';
+import { COLORS } from './defaults.js';
 
 const WOBBLE = 30;
 

packages/ui-shared/src/icons/beachball/container.spec.ts

@@ -3,7 +3,7 @@
 
 /// <reference types="@polkadot/dev/node/test/node" />
 
-import { container } from './container';
+import { container } from './container.js';
 
 describe('container', (): void => {
   it('applies default styles', (): void => {

packages/ui-shared/src/icons/beachball/demo.ts

@@ -6,7 +6,7 @@
 import { isNull } from '@polkadot/util';
 import { encodeAddress, randomAsU8a } from '@polkadot/util-crypto';
 
-import { beachballIcon } from '.';
+import { beachballIcon } from './index.js';
 
 const element = document.getElementById('demo');
 

packages/ui-shared/src/icons/beachball/index.spec.ts

@@ -5,7 +5,7 @@
 
 import xmlserializer from 'xmlserializer';
 
-import { beachballIcon } from '.';
+import { beachballIcon } from './index.js';
 
 describe('identicon', (): void => {
   it('generates a basic [0,..,0] identicon', (): void => {

packages/ui-shared/src/icons/beachball/index.ts

@@ -5,12 +5,12 @@
 
 import type { Options } from '../types';
 
-import { circle } from './shape/circle';
-import { element } from './svg/element';
-import { colors } from './colors';
-import { container as newContainer } from './container';
-import { SHAPE_COUNT } from './defaults';
-import { seeder as newSeeder } from './seeder';
+import { circle } from './shape/circle.js';
+import { element } from './svg/element.js';
+import { colors } from './colors.js';
+import { container as newContainer } from './container.js';
+import { SHAPE_COUNT } from './defaults.js';
+import { seeder as newSeeder } from './seeder.js';
 
 export function beachballIcon (seed: string | Uint8Array, { size = 256 }: Options, className = '', style?: { [index: string]: string }): HTMLElement {
   const seeder = newSeeder(seed);

packages/ui-shared/src/icons/beachball/seeder.spec.ts

@@ -5,7 +5,7 @@
 
 import type { Seeder } from './types';
 
-import { seeder as newSeeder } from './seeder';
+import { seeder as newSeeder } from './seeder.js';
 
 describe('seeder', (): void => {
   let seeder: Seeder;

packages/ui-shared/src/icons/beachball/shape/circle.spec.ts

@@ -5,8 +5,8 @@
 
 import xmlserializer from 'xmlserializer';
 
-import { seeder } from '../seeder';
-import { circle } from './circle';
+import { seeder } from '../seeder.js';
+import { circle } from './circle.js';
 
 describe('circle', (): void => {
   it('creates a circle shape', (): void => {

packages/ui-shared/src/icons/beachball/shape/circle.ts

@@ -5,8 +5,8 @@
 
 import type { Seeder } from '../types';
 
-import { SHAPE_COUNT } from '../defaults';
-import { circle as newCircle } from '../svg/circle';
+import { SHAPE_COUNT } from '../defaults.js';
+import { circle as newCircle } from '../svg/circle.js';
 
 export function circle (seeder: Seeder, fill: string, diameter: number, count: number): Element {
   const center = diameter / 2;

packages/ui-shared/src/icons/beachball/shape/square.ts

@@ -5,8 +5,8 @@
 
 import type { Seeder } from '../types';
 
-import { SHAPE_COUNT } from '../defaults';
-import { rect as newRect } from '../svg/rect';
+import { SHAPE_COUNT } from '../defaults.js';
+import { rect as newRect } from '../svg/rect.js';
 
 export function square (seeder: Seeder, fill: string, diameter: number, count: number): Element {
   const center = diameter / 2;

packages/ui-shared/src/icons/beachball/svg/circle.spec.ts

@@ -5,7 +5,7 @@
 
 import xs from 'xmlserializer';
 
-import { circle } from './circle';
+import { circle } from './circle.js';
 
 describe('circle', (): void => {
   it('creates a basic SVG circle element', (): void => {

packages/ui-shared/src/icons/beachball/svg/circle.ts

@@ -1,7 +1,7 @@
 // Copyright 2017-2023 @polkadot/ui-shared authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { svg } from './svg';
+import { svg } from './svg.js';
 
 export function circle (r: number, cx: number, cy: number): Element {
   const elem = svg('circle');

packages/ui-shared/src/icons/beachball/svg/element.spec.ts

@@ -5,7 +5,7 @@
 
 import xs from 'xmlserializer';
 
-import { element } from './element';
+import { element } from './element.js';
 
 describe('element', (): void => {
   it('creates a basic SVG element', (): void => {

packages/ui-shared/src/icons/beachball/svg/element.ts

@@ -3,7 +3,7 @@
 
 // Copyright 2016 Dan Finlay
 
-import { svg } from './svg';
+import { svg } from './svg.js';
 
 export function element (size: number, type = 'svg', x = 0, y = 0): Element {
   const elem = svg(type);

packages/ui-shared/src/icons/beachball/svg/rect.spec.ts

@@ -5,7 +5,7 @@
 
 import xs from 'xmlserializer';
 
-import { rect } from './rect';
+import { rect } from './rect.js';
 
 describe('rect', (): void => {
   it('creates a basic SVG rect element', (): void => {

packages/ui-shared/src/icons/beachball/svg/rect.ts

@@ -1,7 +1,7 @@
 // Copyright 2017-2023 @polkadot/ui-shared authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import { element } from './element';
+import { element } from './element.js';
 
 export function rect (size: number): Element {
   const elem = element(size, 'rect');

packages/ui-shared/src/icons/beachball/svg/svg.spec.ts

@@ -5,7 +5,7 @@
 
 import xs from 'xmlserializer';
 
-import { svg } from './svg';
+import { svg } from './svg.js';
 
 describe('svg', (): void => {
   it('creates a basic SVG element', (): void => {

packages/ui-shared/src/icons/index.ts

@@ -1,5 +1,5 @@
 // Copyright 2018-2023 @polkadot/ui-shared authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-export { beachballIcon } from './beachball';
-export { polkadotIcon } from './polkadot';
+export { beachballIcon } from './beachball/index.js';
+export { polkadotIcon } from './polkadot.js';

packages/ui-shared/src/icons/polkadot.spec.ts

@@ -3,7 +3,7 @@
 
 /// <reference types="@polkadot/dev/node/test/node" />
 
-import { polkadotIcon } from './polkadot';
+import { polkadotIcon } from './polkadot.js';
 
 describe('polkadotIcon', (): void => {
   it('generates the correct points from known', (): void => {

packages/ui-shared/src/index.ts

@@ -1,6 +1,6 @@
 // Copyright 2018-2023 @polkadot/ui-shared authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
-import './detectPackage';
+import './detectPackage.js';
 
-export * from './bundle';
+export * from './bundle.js';