diff --git a/CHANGELOG.md b/CHANGELOG.md index 312fc50..f3f1877 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,7 +7,7 @@ - Improve `getHarmony` method overloads to make it possible to omit optional parameters - Improve types for `Mix` and `Harmony` making it possible to send also strings - Make optional the `shades` and `tints` parameters of the `getShades` and `getTints` methods respectively -- Fix a bug in the `getBlendXXX` which was ignoring the `decimals` sent and always suing `MAX_DECIMALS` +- Fix a bug in the `getBlendXXX` and `toXXX` methods which were ignoring the `decimals` sent and always using `MAX_DECIMALS` - Fix `CIELabObject` not being exported with the library ## [4.0.0] - 2023-11-26 diff --git a/src/index.ts b/src/index.ts index 35dd705..9593250 100644 --- a/src/index.ts +++ b/src/index.ts @@ -20,8 +20,7 @@ import { Mix, MixString, DEFAULT_BLEND_STEPS, - DEFAULT_SHADES_TINTS_STEPS, - MAX_DECIMALS + DEFAULT_SHADES_TINTS_STEPS } from '#constants'; import { rgbToHSL, @@ -585,7 +584,7 @@ export class ColorTranslator { const rgb = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.RGB ); return CSS.RGB(rgb, detectedOptions); @@ -607,7 +606,7 @@ export class ColorTranslator { const rgba = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.RGBA ); return CSS.RGB(rgba, detectedOptions); @@ -629,7 +628,7 @@ export class ColorTranslator { const hsl = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.HSL ); return CSS.HSL(hsl, detectedOptions); @@ -651,7 +650,7 @@ export class ColorTranslator { const hsla = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.HSLA ); return CSS.HSL(hsla, detectedOptions); @@ -673,7 +672,7 @@ export class ColorTranslator { const lab = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.CIELab ); return CSS.CIELab(lab, detectedOptions); @@ -695,7 +694,7 @@ export class ColorTranslator { const lab = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.CIELabA ); return CSS.CIELab(lab, detectedOptions); @@ -717,7 +716,7 @@ export class ColorTranslator { const cmyk = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.CMYK ); return CSS.CMYK(cmyk, detectedOptions); @@ -739,7 +738,7 @@ export class ColorTranslator { const cmyka = getColorReturn( color, model, - MAX_DECIMALS, + options.decimals, utils.translateColor.CMYKA ); return CSS.CMYK(cmyka, detectedOptions); diff --git a/tests/__snapshots__/blending.test.ts.snap b/tests/__snapshots__/blending.test.ts.snap index 76221ea..af43b4e 100644 --- a/tests/__snapshots__/blending.test.ts.snap +++ b/tests/__snapshots__/blending.test.ts.snap @@ -85,6 +85,65 @@ exports[`ColorTranslator blending tests Blending with L*a*b colors 4`] = ` ] `; +exports[`ColorTranslator blending tests Blending with L*a*b colors 5`] = ` +[ + "lab(54.291734 80.812455 69.88504)", + "lab(29.563244 55.959822 -36.18907)", + "lab(29.567573 68.298653 -112.02943)", +] +`; + +exports[`ColorTranslator blending tests Blending with L*a*b colors 6`] = ` +[ + "lab(54.291734 80.812455 69.88504 / 1)", + "lab(29.563244 55.959822 -36.18907 / 1)", + "lab(29.567573 68.298653 -112.02943 / 1)", +] +`; + +exports[`ColorTranslator blending tests Blending with L*a*b colors 7`] = ` +[ + { + "L": 54.291734, + "a": 80.812455, + "b": 69.88504, + }, + { + "L": 29.563244, + "a": 55.959822, + "b": -36.18907, + }, + { + "L": 29.567573, + "a": 68.298653, + "b": -112.02943, + }, +] +`; + +exports[`ColorTranslator blending tests Blending with L*a*b colors 8`] = ` +[ + { + "A": 1, + "L": 54.291734, + "a": 80.812455, + "b": 69.88504, + }, + { + "A": 1, + "L": 29.563244, + "a": 55.959822, + "b": -36.18907, + }, + { + "A": 1, + "L": 29.567573, + "a": 68.298653, + "b": -112.02943, + }, +] +`; + exports[`ColorTranslator blending tests Blending with decimals snapshots 1`] = ` [ "rgb(255 0 0)", diff --git a/tests/__snapshots__/shades-tints.test.ts.snap b/tests/__snapshots__/shades-tints.test.ts.snap index 092f986..8c88d26 100644 --- a/tests/__snapshots__/shades-tints.test.ts.snap +++ b/tests/__snapshots__/shades-tints.test.ts.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`ColorTranslator shades and tints tests Shades snapshots with L*a*b functions from "lab(54.291734 80.812455 69.88504 / 1)" 1`] = ` +exports[`ColorTranslator shades and tints tests Shades snapshots with L*a*b functions from "lab(54.2917337686 80.812455318 69.8850403235 / 1)" 1`] = ` [ "lab(45 70 61 / 1)", "lab(36 60 51 / 1)", @@ -10,7 +10,7 @@ exports[`ColorTranslator shades and tints tests Shades snapshots with L*a*b func ] `; -exports[`ColorTranslator shades and tints tests Shades snapshots with L*a*b functions from "lab(54.291734 80.812455 69.88504)" 1`] = ` +exports[`ColorTranslator shades and tints tests Shades snapshots with L*a*b functions from "lab(54.2917337686 80.812455318 69.8850403235)" 1`] = ` [ "lab(45 70 61)", "lab(36 60 51)", @@ -255,7 +255,7 @@ exports[`ColorTranslator shades and tints tests Shades tests from {"R":255,"G":0 ] `; -exports[`ColorTranslator shades and tints tests Tints snapshots with L*a*b functions from "lab(54.291734 80.812455 69.88504 / 1)" 1`] = ` +exports[`ColorTranslator shades and tints tests Tints snapshots with L*a*b functions from "lab(54.2917337686 80.812455318 69.8850403235 / 1)" 1`] = ` [ "lab(56 76 56 / 1)", "lab(61 65 38 / 1)", @@ -265,7 +265,7 @@ exports[`ColorTranslator shades and tints tests Tints snapshots with L*a*b funct ] `; -exports[`ColorTranslator shades and tints tests Tints snapshots with L*a*b functions from "lab(54.291734 80.812455 69.88504)" 1`] = ` +exports[`ColorTranslator shades and tints tests Tints snapshots with L*a*b functions from "lab(54.2917337686 80.812455318 69.8850403235)" 1`] = ` [ "lab(56 76 56)", "lab(61 65 38)", diff --git a/tests/blending.test.ts b/tests/blending.test.ts index b42a472..f205a4f 100644 --- a/tests/blending.test.ts +++ b/tests/blending.test.ts @@ -57,6 +57,26 @@ describe('ColorTranslator blending tests', (): void => { expect(obj.blendFn(from, to, r2.length, options)).toMatchObject(r2); expect(obj.blendFn(from, to).length).toBe(5); + expect( + obj.blendFn(from, to, { decimals: 6 }) + ).toMatchObject( + obj.blendFn(from, to) + ); + expect( + obj.blendFn(from, to, 4, { decimals: 6 }) + ).toMatchObject( + obj.blendFn(from, to, 4) + ); + expect( + obj.blendFn(from, to, { cmykUnit: 'percent' }) + ).toMatchObject( + obj.blendFn(from, to) + ); + expect( + obj.blendFn(from, to, 3, { cmykUnit: 'percent' }) + ).toMatchObject( + obj.blendFn(from, to, 3) + ); }); @@ -76,6 +96,10 @@ describe('ColorTranslator blending tests', (): void => { blendLabFunctions.forEach((fn) => { expect(fn(from, to)).toMatchSnapshot(); }); + + blendLabFunctions.forEach((fn) => { + expect(fn(from, to, 3)).toMatchSnapshot(); + }); }); }); \ No newline at end of file diff --git a/tests/color-mixing.test.ts b/tests/color-mixing.test.ts index 2f56303..a71e7ac 100644 --- a/tests/color-mixing.test.ts +++ b/tests/color-mixing.test.ts @@ -116,6 +116,11 @@ describe('Color mixing with L*a*b colors', (): void => { ); }); it('Return a mix in lab color with decimals', (): void => { + expect( + ColorTranslator.getMixCIELab(['#F00', '#00F'], Mix.ADDITIVE) + ).toBe( + 'lab(60.169696 93.550025 -60.498556)' + ); expect( ColorTranslator.getMixCIELab(['#F00', '#00F']) ).toBe( diff --git a/tests/shades-tints.test.ts b/tests/shades-tints.test.ts index 6efc349..a05dc32 100644 --- a/tests/shades-tints.test.ts +++ b/tests/shades-tints.test.ts @@ -41,6 +41,11 @@ describe('ColorTranslator shades and tints tests', (): void => { const shades = ColorTranslator.getShades(input, 5); expect(shades).toMatchObject(output); }); + it(`Shades tests without number of shades is equal to 5 from ${JSON.stringify(input)}`, (): void => { + const shades = ColorTranslator.getShades(input, 5); + const shadesDefault = ColorTranslator.getShades(input); + expect(shades).toMatchObject(shadesDefault); + }); it(`Shades tests with alpha from ${JSON.stringify(inputWithAlpha)}`, (): void => { const output = shades_results.map((color: string) => fn(color + alpha)); const shades = ColorTranslator.getShades(inputWithAlpha, 5); @@ -48,13 +53,18 @@ describe('ColorTranslator shades and tints tests', (): void => { }); it(`Tints tests from ${JSON.stringify(input)}`, (): void => { const output = tints_results.map((color: string) => fn(color)); - const shades = ColorTranslator.getTints(input, 5); - expect(shades).toMatchObject(output); + const tints = ColorTranslator.getTints(input, 5); + expect(tints).toMatchObject(output); + }); + it(`Tints tests without number of tints from ${JSON.stringify(input)}`, (): void => { + const tints = ColorTranslator.getTints(input, 5); + const tintsDefault = ColorTranslator.getTints(input); + expect(tints).toMatchObject(tintsDefault); }); it(`Tints tests with alpha from ${JSON.stringify(inputWithAlpha)}`, (): void => { const output = tints_results.map((color: string) => fn(color + alpha)); - const shades = ColorTranslator.getTints(inputWithAlpha, 5); - expect(shades).toMatchObject(output); + const tints = ColorTranslator.getTints(inputWithAlpha, 5); + expect(tints).toMatchObject(output); }); }); @@ -75,13 +85,13 @@ describe('ColorTranslator shades and tints tests', (): void => { }); it(`Tints tests from ${JSON.stringify(input)}`, (): void => { const output = tints_results.map((color: string) => fn(color, options)); - const shades = ColorTranslator.getTints(input, 5, options); - expect(shades).toMatchObject(output); + const tints = ColorTranslator.getTints(input, 5, options); + expect(tints).toMatchObject(output); }); it(`Tints tests with alpha from ${JSON.stringify(inputWithAlpha)}`, (): void => { const output = tints_results.map((color: string) => fn(color + alpha, options)); - const shades = ColorTranslator.getTints(inputWithAlpha, 5, options); - expect(shades).toMatchObject(output); + const tints = ColorTranslator.getTints(inputWithAlpha, 5, options); + expect(tints).toMatchObject(output); }); it(`Shades tests from ${JSON.stringify(input)} with decimals`, (): void => { const shades = ColorTranslator.getShades(input, 5, options); diff --git a/tsconfig.json b/tsconfig.json index 7973494..7cfbba0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -2,8 +2,8 @@ "compilerOptions": { "outDir": "./dist/", "module": "esnext", - "target": "es5", - "lib": ["ES2017"], + "target": "ES2020", + "lib": ["ES2020"], "moduleResolution": "node", "esModuleInterop": true, "declaration": true,