diff --git a/benchmarks.js b/benchmarks.js index a7fb5b3..b50fbee 100644 --- a/benchmarks.js +++ b/benchmarks.js @@ -123,6 +123,7 @@ bench.add('real world sort example #2 (nerdy.dev)', () => { }) bench.add('convert hex', () => convert('#f00')) +bench.add('convert hex with alpha', () => convert('#f000')) bench.add('convert rgba()', () => convert('rgba(255,0,0,0.5)')) bench.add('convert rgba() (modern syntax)', () => convert('rgba(255 0 0 / 0.5)')) bench.add('convert rgb()', () => convert('rgb(255,0,0)')) @@ -131,10 +132,13 @@ bench.add('convert hsl()', () => convert('hsl(0,100%,50%)')) bench.add('convert hsl() (modern syntax)', () => convert('hsl(0 100% 50%)')) bench.add('convert hsla()', () => convert('hsla(0,100%,50%,0.5)')) bench.add('convert hsla() (modern syntax)', () => convert('hsla(0 100% 50% / 0.5)')) +bench.add('convert lch()', () => convert('lch(52.2345% 72.2 56.2 / .5)')) +bench.add('convert oklch()', () => convert('oklch(25% .148 81.72)')) +bench.add('convert color()', () => convert('color(display-p3 1 0.5 0 / .5)')) +bench.add('convert relative color()', () => convert('color(from green srgb r g b / 0.5)')) bench.add('convert named color', () => convert('red')) bench.add('convert transparent', () => convert('transparent')) bench.add('convert invalid color', () => convert('invalid')) -bench.add('convert oklch()', () => convert('oklch(25% .148 81.72)')) bench.add('convert system color', () => convert('Highlight')) await bench.warmup() diff --git a/index.js b/index.js index a287a0a..bda0c14 100644 --- a/index.js +++ b/index.js @@ -1,4 +1,20 @@ -import Color from 'colorjs.io' +import { + parse, + to as convertColor, + ColorSpace, + sRGB, + P3, + LCH, + HSL, + OKLCH, +} from "colorjs.io/fn" + +// Register color spaces for parsing and converting +ColorSpace.register(sRGB) // Can parse keywords and hex colors +ColorSpace.register(P3) +ColorSpace.register(HSL) +ColorSpace.register(LCH) +ColorSpace.register(OKLCH) /** * @typedef NormalizedColor @@ -32,11 +48,10 @@ function numerify(value) { * @returns {NormalizedColor & { authored: string }} */ export function convert(authored) { - // TODO: get rid of try/catch - // TODO: use Color.js's faster exports try { - let converted = new Color(authored) - let hsl = converted.hsl + let parsed = parse(authored) + let converted = parsed.spaceId === 'hsl' ? parsed : convertColor(parsed, HSL) + let hsl = converted.coords let hue = numerify(hsl[0]) let saturation = numerify(hsl[1]) let lightness = numerify(hsl[2]) diff --git a/test.js b/test.js index bdfb592..857d0c4 100644 --- a/test.js +++ b/test.js @@ -20,17 +20,18 @@ test('the convert fn converts colors to an HSLA object', () => { 'hsla(0, 100%, 50%, 1)', 'hsl(0, 100%, 50%)', 'rgb(255, 0, 0)', - 'rgba(255, 0, 0, 1)' + 'rgba(255, 0, 0, 1)', + 'oklch(62.8% 0.25768330773615683 29.2338851923426)' ] for (let color of colors) { - assert.equal(convert(color), { - hue: 0, - saturation: 100, - lightness: 50, - alpha: 1, - authored: color - }, `Failed convert for '${color}'`) + let converted = convert(color) + // Making sure most colors are mostly within the range + assert.ok(converted.hue >= 0 && converted.hue <= 0.01, `Failed hue for '${color}', got ${converted.hue}`) + assert.ok(converted.saturation >= 99.9 && converted.saturation <= 100.02, `Failed saturation for '${color}', got ${converted.saturation}`) + assert.ok(converted.lightness >= 49.9 && converted.lightness <= 50.02, `Failed lightness for '${color}', got ${converted.lightness}`) + assert.equal(converted.alpha, 1, `Failed alpha for '${color}'`) + assert.equal(converted.authored, color, `Failed authored for '${color}'`) } })