Fixed module imports (#7)

package.json

@@ -82,7 +82,7 @@
     "clean": "rimraf docs gen lib",
     "test": "jest",
     "perf": "toofast perf.js",
-    "docs": "typedoc src/main/color-model/* src/main/plugin/* src/main/utils.ts src/main/index.ts"
+    "docs": "typedoc"
   },
   "repository": {
     "type": "git",
@@ -108,21 +108,21 @@
   "homepage": "https://github.com/smikhalevski/paint-bucket#readme",
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^15.2.1",
-    "@rollup/plugin-typescript": "^11.1.2",
-    "@types/jest": "^29.5.4",
+    "@rollup/plugin-typescript": "^11.1.3",
+    "@types/jest": "^29.5.5",
     "chroma-js": "^2.4.2",
-    "jest": "^29.6.3",
-    "prettier": "^3.0.2",
+    "jest": "^29.7.0",
+    "prettier": "^3.0.3",
     "rimraf": "^5.0.1",
-    "rollup": "^3.28.1",
-    "rollup-plugin-dts": "^5.3.1",
+    "rollup": "^3.29.2",
+    "rollup-plugin-dts": "^6.0.2",
     "tinycolor2": "^1.6.0",
     "toofast": "^2.0.0",
     "ts-jest": "^29.1.1",
     "tslib": "^2.6.2",
-    "typedoc": "^0.24.8",
+    "typedoc": "^0.25.1",
     "typedoc-custom-css": "github:smikhalevski/typedoc-custom-css#master",
-    "typescript": "^5.1.6"
+    "typescript": "^5.2.2"
   },
   "dependencies": {
     "algomatic": "^3.2.1"

rollup.config.js

@@ -3,23 +3,34 @@ const dts = require('rollup-plugin-dts');
 const fs = require('fs');
 const path = require('path');
 
+const external = /algomatic|\..*\/(core|utils|color-model|plugin)/;
+
 module.exports = ['index', 'core', 'utils']
-  .concat(fs.readdirSync('./gen/color-model').map(name => 'color-model/' + path.basename(name) + '/index'))
-  .concat(fs.readdirSync('./gen/plugin').map(name => 'plugin/' + path.basename(name) + '/index'))
-  .flatMap(name => [
+  .concat(
+    fs.readdirSync('gen/color-model').map(it => `color-model/${it}/index`),
+    fs.readdirSync('gen/plugin').map(it => `plugin/${it}/index`)
+  )
+  .flatMap(input => [
     {
-      input: './gen/' + name + '.js',
+      input: `gen/${input}.js`,
       output: [
-        { file: './lib/' + name + '.js', format: 'cjs' },
-        { file: './lib/' + name + '.mjs', format: 'es' },
+        { file: `lib/${input}.js`, format: 'cjs' },
+        { file: `lib/${input}.mjs`, format: 'es' },
+      ],
+      plugins: [
+        nodeResolve(),
+
+        // Append a file extension to relative imports and exports
+        {
+          renderChunk: (code, chunk) => code.replace(/(require\(|from )'\.[^']+/g, '$&' + path.extname(chunk.fileName)),
+        },
       ],
-      plugins: [nodeResolve()],
-      external: /algomatic|(\..*\/(color-model|plugin|core|utils))/,
+      external,
     },
     {
-      input: './gen/' + name + '.d.ts',
-      output: { file: './lib/' + name + '.d.ts', format: 'es' },
+      input: `gen/${input}.d.ts`,
+      output: { file: `lib/${input}.d.ts`, format: 'es' },
       plugins: [dts.default()],
-      external: /algomatic|(\..*\/(color-model|plugin|core|utils))/,
+      external,
     },
   ]);

src/main/color-model/cmyk/index.ts

@@ -5,7 +5,7 @@
  * import { CMYK } from 'paint-bucket/color-model/cmyk';
  * ```
  *
- * @module paint-bucket/color-model/cmyk
+ * @module color-model/cmyk
  */
 
 export * from './cmyk';

src/main/color-model/hsl/index.ts

@@ -5,7 +5,7 @@
  * import { HSL } from 'paint-bucket/color-model/hsl';
  * ```
  *
- * @module paint-bucket/color-model/hsl
+ * @module color-model/hsl
  */
 
 export * from './hsl';

src/main/color-model/hsv/index.ts

@@ -5,7 +5,7 @@
  * import { HSV } from 'paint-bucket/color-model/hsv';
  * ```
  *
- * @module paint-bucket/color-model/hsv
+ * @module color-model/hsv
  */
 
 export * from './hsv';

src/main/color-model/hwb/index.ts

@@ -5,7 +5,7 @@
  * import { HWB } from 'paint-bucket/color-model/hwb';
  * ```
  *
- * @module paint-bucket/color-model/hwb
+ * @module color-model/hwb
  */
 
 export * from './hwb';

src/main/color-model/lab/index.ts

@@ -5,7 +5,7 @@
  * import { LAB } from 'paint-bucket/color-model/lab';
  * ```
  *
- * @module paint-bucket/color-model/lab
+ * @module color-model/lab
  */
 
 export * from './lab';

src/main/color-model/labh/index.ts

@@ -5,7 +5,7 @@
  * import { LABh } from 'paint-bucket/color-model/labh';
  * ```
  *
- * @module paint-bucket/color-model/labh
+ * @module color-model/labh
  */
 
 export * from './labh';

src/main/color-model/xyz/index.ts

@@ -5,7 +5,7 @@
  * import { XYZ } from 'paint-bucket/color-model/xyz';
  * ```
  *
- * @module paint-bucket/color-model/xyz
+ * @module color-model/xyz
  */
 
 export * from './xyz';

src/main/index.ts

@@ -1,20 +1,20 @@
 /**
- * @module paint-bucket/core
+ * @module core
  */
 
 import { Color } from './core';
 
-import cmykPlugin from './plugin/cmyk';
-import cssPlugin from './plugin/css';
-import differencePlugin from './plugin/difference';
-import hslPlugin from './plugin/hsl';
-import hsvPlugin from './plugin/hsv';
-import hwbPlugin from './plugin/hwb';
-import labPlugin from './plugin/lab';
-import labhPlugin from './plugin/labh';
-import palettePlugin from './plugin/palette';
-import rgbPlugin from './plugin/rgb';
-import x11Plugin from './plugin/x11';
+import cmykPlugin from './plugin/cmyk/index';
+import cssPlugin from './plugin/css/index';
+import differencePlugin from './plugin/difference/index';
+import hslPlugin from './plugin/hsl/index';
+import hsvPlugin from './plugin/hsv/index';
+import hwbPlugin from './plugin/hwb/index';
+import labPlugin from './plugin/lab/index';
+import labhPlugin from './plugin/labh/index';
+import palettePlugin from './plugin/palette/index';
+import rgbPlugin from './plugin/rgb/index';
+import x11Plugin from './plugin/x11/index';
 
 cmykPlugin(Color);
 cssPlugin(Color);
@@ -28,21 +28,21 @@ palettePlugin(Color);
 rgbPlugin(Color);
 x11Plugin(Color);
 
-export type * from './plugin/cmyk';
-export type * from './plugin/css';
-export type * from './plugin/difference';
-export type * from './plugin/hsl';
-export type * from './plugin/lab';
-export type * from './plugin/palette';
-export type * from './plugin/rgb';
-export type * from './plugin/x11';
+export type * from './plugin/cmyk/index';
+export type * from './plugin/css/index';
+export type * from './plugin/difference/index';
+export type * from './plugin/hsl/index';
+export type * from './plugin/lab/index';
+export type * from './plugin/palette/index';
+export type * from './plugin/rgb/index';
+export type * from './plugin/x11/index';
 
 export * from './core';
 
-export { CMYK } from './color-model/cmyk';
-export { HSL } from './color-model/hsl';
-export { HSV } from './color-model/hsv';
-export { HWB } from './color-model/hwb';
-export { LAB } from './color-model/lab';
-export { LABh } from './color-model/labh';
-export { XYZ } from './color-model/xyz';
+export { CMYK } from './color-model/cmyk/index';
+export { HSL } from './color-model/hsl/index';
+export { HSV } from './color-model/hsv/index';
+export { HWB } from './color-model/hwb/index';
+export { LAB } from './color-model/lab/index';
+export { LABh } from './color-model/labh/index';
+export { XYZ } from './color-model/xyz/index';

src/main/plugin/cmyk/index.ts

@@ -1,10 +1,10 @@
 /**
  * CMYKa color model manipulation plugin.
  *
- * @module paint-bucket/plugin/cmyk
+ * @module plugin/cmyk
  */
 
-import { CMYK } from '../../color-model/cmyk';
+import { CMYK } from '../../color-model/cmyk/index';
 import { Applicator, Color } from '../../core';
 import { clamp, createAccessor } from '../../utils';
 
@@ -21,7 +21,7 @@ declare module '../../core' {
      *
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     cmyk(): CMYK;
 
@@ -37,7 +37,7 @@ declare module '../../core' {
      * omitted it is set to 1.
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     cmyk(cmyk: Applicator<CMYK, Partial<CMYK>>): Color;
 
@@ -47,7 +47,7 @@ declare module '../../core' {
      * @returns Cyan ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     cyan(): number;
 
@@ -62,7 +62,7 @@ declare module '../../core' {
      * @param c Cyan ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     cyan(c: Applicator<number>): Color;
 
@@ -72,7 +72,7 @@ declare module '../../core' {
      * @returns Magenta ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     magenta(): number;
 
@@ -87,7 +87,7 @@ declare module '../../core' {
      * @param m Magenta ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     magenta(m: Applicator<number>): Color;
 
@@ -97,7 +97,7 @@ declare module '../../core' {
      * @returns Yellow ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     yellow(): number;
 
@@ -112,7 +112,7 @@ declare module '../../core' {
      * @param y Yellow ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     yellow(y: Applicator<number>): Color;
 
@@ -122,7 +122,7 @@ declare module '../../core' {
      * @returns Black ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     black(): number;
 
@@ -137,13 +137,13 @@ declare module '../../core' {
      * @param k Black ∈ [0, 100].
      * @group Plugin Methods
      * @see {@link https://en.wikipedia.org/wiki/CMYK_color_model CMYK color model}
-     * @plugin {@link paint-bucket/plugin/cmyk!}
+     * @plugin {@link plugin/cmyk! plugin/cmyk}
      */
     black(k: Applicator<number>): Color;
   }
 }
 
-export default function (ctor: typeof Color): void {
+export default function cmykPlugin(ctor: typeof Color): void {
   ctor.prototype.cmyk = createAccessor<CMYK, Partial<CMYK>>(
     color => {
       const cmyk = color.getComponents(CMYK);

src/main/plugin/css/index.ts

@@ -1,7 +1,7 @@
 /**
  * CSS color values parsing and serialization plugin.
  *
- * @module paint-bucket/plugin/css
+ * @module plugin/css
  */
 
 import { Applicator, Color, RGB } from '../../core';
@@ -37,7 +37,7 @@ declare module '../../core' {
      * ```
      *
      * @group Plugin Methods
-     * @plugin {@link paint-bucket/plugin/css!}
+     * @plugin {@link plugin/css! plugin/css}
      */
     css(): string;
 
@@ -50,7 +50,7 @@ declare module '../../core' {
      * ```
      *
      * @group Plugin Methods
-     * @plugin {@link paint-bucket/plugin/css!}
+     * @plugin {@link plugin/css! plugin/css}
      */
     css(color: Applicator<string>): Color;
 
@@ -63,7 +63,7 @@ declare module '../../core' {
      * ```
      *
      * @group Plugin Methods
-     * @plugin {@link paint-bucket/plugin/css!}
+     * @plugin {@link plugin/css! plugin/css}
      */
     cssHex(): string;
 
@@ -76,7 +76,7 @@ declare module '../../core' {
      * ```
      *
      * @group Plugin Methods
-     * @plugin {@link paint-bucket/plugin/css!}
+     * @plugin {@link plugin/css! plugin/css}
      */
     cssRGB(): string;
 
@@ -89,13 +89,13 @@ declare module '../../core' {
      * ```
      *
      * @group Plugin Methods
-     * @plugin {@link paint-bucket/plugin/css!}
+     * @plugin {@link plugin/css! plugin/css}
      */
     cssHSL(): string;
   }
 }
 
-export default function (ctor: typeof Color): void {
+export default function cssPlugin(ctor: typeof Color): void {
   const nextParse = ctor.parse;
 
   ctor.parse = value => (typeof value === 'string' && parseColor(value, new ctor())) || nextParse(value);

src/main/plugin/css/parseColor.ts

@@ -1,6 +1,6 @@
 import { Color, RGB } from '../../core';
 import { clamp, getColorInt32Component, normalizeColorInt } from '../../utils';
-import { HSL } from '../../color-model/hsl';
+import { HSL } from '../../color-model/hsl/index';
 
 const valuePattern = '\\s*(\\d+(?:\\.\\d+)?%?)';