@react-x11/components 0.8.0 → 0.10.0

package/dist/html/css/color.js

@@ -0,0 +1,740 @@
+import * as ntk from 'react-x11/ntk';
+// CSS Color 4's functional colours: read here, and written back in the one
+// form every drawing context reads — `#rrggbb`, or `rgba(r, g, b, a)` with
+// channels from 0 to 255.
+//
+// They used to be handed to the context as written, since ntk's context
+// parses a CSS colour for `fillStyle` itself. It reads less than CSS has: the
+// comma forms of `rgb()` and `hsl()` and nothing else — no space-separated
+// `rgb(59 130 246 / 1)`, which Tailwind 3's utilities are written in, no
+// `oklch()`, which Tailwind 4's palette is, no `lab()`, `hwb()` or `color()`
+// — and it read `rgb()`'s percentages as numbers from 0 to 255, so
+// `rgb(0%, 50%, 0%)` was nearly black. Reading the value here also leaves a
+// document one reading of a colour on both backends.
+//
+// A colour outside sRGB is clipped into it channel by channel, which is what
+// an sRGB drawing context can show.
+/** The value of a colour function, or null where it is not one. */
+export function functionalColor(value) {
+    let hit = CACHE.get(value);
+    if (hit === undefined) {
+        hit = readFunction(value);
+        // a document repeats its colours, a utility stylesheet most of all
+        if (CACHE.size >= 1024)
+            CACHE.clear();
+        CACHE.set(value, hit);
+    }
+    return hit;
+}
+const CACHE = new Map();
+const NUMBER = /^([+-]?(?:\d*\.\d+|\d+)(?:e[+-]?\d+)?)(%|deg|grad|rad|turn)?$/i;
+function component(token) {
+    if (token.toLowerCase() === 'none')
+        return { value: 0, unit: 'none' };
+    const m = NUMBER.exec(token);
+    if (!m)
+        return null;
+    return {
+        value: parseFloat(m[1]),
+        unit: (m[2] ?? '').toLowerCase(),
+    };
+}
+function readFunction(value) {
+    const colour = readRgbaFunction(value);
+    return colour ? serialize(colour.rgb, colour.a) : null;
+}
+/**
+ * The two shades a 3D border style paints in (`groove`, `ridge`, `inset`,
+ * `outset`), as Chromium shades them: the shadowed sides the colour
+ * darkened — its brightest channel down by a third — and the lit sides the
+ * colour itself; but where darkening leaves black, the colour is the
+ * shadow and the lit sides are lightened instead, so a black groove is
+ * black against #545454 rather than black against black. Null for a
+ * colour this cannot read, `currentColor` resolved first.
+ */
+export function borderShades(color) {
+    const read = readRgba(color);
+    if (!read)
+        return null;
+    const { rgb, a } = read;
+    const v = Math.max(rgb[0], rgb[1], rgb[2]);
+    const dark = v > 0.33 ? (v - 0.33) / v : 0;
+    const css = (c) => `rgba(${c.map((n) => Math.round(Math.min(1, Math.max(0, n)) * 255)).join(', ')}, ${a})`;
+    if (dark > 0)
+        return { lit: css(rgb), shadowed: css(scaled(rgb, dark)) };
+    const light = v === 0
+        ? [0.33, 0.33, 0.33]
+        : scaled(rgb, Math.min(1, v + 0.33) / v);
+    return { lit: css(light), shadowed: css(rgb) };
+}
+/**
+ * The colour a fraction `t` of the way from `a` to `b`, premultiplied, as a
+ * gradient interpolates between two stops (CSS Images 4, 3.4.3): so a
+ * transparent stop lends its alpha and not its colour. Null for a colour
+ * this cannot read.
+ */
+export function blend(a, b, t) {
+    const x = readRgba(a);
+    const y = readRgba(b);
+    if (!x || !y)
+        return null;
+    const alpha = x.a + (y.a - x.a) * t;
+    if (!(alpha > 0))
+        return 'transparent';
+    const rgb = [0, 1, 2].map((i) => (x.rgb[i] * x.a + (y.rgb[i] * y.a - x.rgb[i] * x.a) * t) / alpha);
+    return serialize(rgb, alpha);
+}
+function scaled(c, k) {
+    return [c[0] * k, c[1] * k, c[2] * k];
+}
+/** Any colour but `currentColor`, as numbers: what `color-mix()` mixes. */
+function readRgba(value) {
+    const v = value.trim();
+    const lower = v.toLowerCase();
+    if (lower === 'transparent')
+        return { rgb: [0, 0, 0], a: 0 };
+    if (v.startsWith('#'))
+        return readHex(v);
+    if (v.includes('('))
+        return readRgbaFunction(v);
+    const named = cssColorStraight?.(lower);
+    if (!Array.isArray(named) || named.length < 3)
+        return null;
+    return {
+        rgb: [named[0], named[1], named[2]],
+        a: named.length > 3 ? named[3] : 1,
+    };
+}
+function readHex(v) {
+    const hex = v.slice(1);
+    if (!/^(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(hex))
+        return null;
+    const long = hex.length <= 4 ? [...hex].map((c) => c + c).join('') : hex;
+    const byte = (i) => parseInt(long.slice(i * 2, i * 2 + 2), 16) / 255;
+    return {
+        rgb: [byte(0), byte(1), byte(2)],
+        a: long.length === 8 ? byte(3) : 1,
+    };
+}
+/** ntk's reading of a named colour. It is on ntk's entry point but not in
+ *  react-x11/ntk's declarations, so it is probed. */
+const cssColorStraight = ntk.cssColorStraight;
+function readRgbaFunction(value) {
+    const open = value.indexOf('(');
+    if (open < 0)
+        return null;
+    const name = value.slice(0, open).toLowerCase();
+    let body = value.slice(open + 1);
+    // the end of a style sheet closes whatever is still open (CSS 2.1 4.2):
+    // `rgb(0, 128, 0` as a sheet's last words is green
+    if (body.endsWith(')'))
+        body = body.slice(0, -1);
+    if (name === 'color-mix')
+        return mix(body);
+    // `calc()`, `var()`, a relative colour's channel keywords: not read here,
+    // and a declaration this cannot read is dropped
+    if (body.includes('(') || body.includes(')'))
+        return null;
+    let channels;
+    let alpha = null;
+    let space = '';
+    if (body.includes(',')) {
+        // the legacy comma form, which only these four have
+        if (!LEGACY.has(name))
+            return null;
+        const parts = body.split(',');
+        if (parts.length !== 3 && parts.length !== 4)
+            return null;
+        const read = [];
+        for (const part of parts) {
+            const token = part.trim();
+            if (!token || /\s/.test(token))
+                return null;
+            const c = component(token);
+            if (!c || c.unit === 'none')
+                return null;
+            read.push(c);
+        }
+        channels = read.slice(0, 3);
+        alpha = read[3] ?? null;
+        if (name === 'rgb' || name === 'rgba') {
+            // all numbers or all percentages
+            const unit = channels[0].unit;
+            if (unit !== '' && unit !== '%')
+                return null;
+            if (channels[1].unit !== unit || channels[2].unit !== unit)
+                return null;
+        }
+        else if (channels[1].unit !== '%' || channels[2].unit !== '%') {
+            return null;
+        }
+    }
+    else {
+        const slash = body.split('/');
+        if (slash.length > 2)
+            return null;
+        const tokens = slash[0].trim().split(/\s+/);
+        if (name === 'color')
+            space = (tokens.shift() ?? '').toLowerCase();
+        if (tokens.length !== 3)
+            return null;
+        const read = [];
+        for (const token of tokens) {
+            const c = component(token);
+            if (!c)
+                return null;
+            read.push(c);
+        }
+        channels = read;
+        if (slash.length === 2) {
+            const token = slash[1].trim();
+            if (!token || /\s/.test(token))
+                return null;
+            alpha = component(token);
+            if (!alpha)
+                return null;
+        }
+    }
+    let a = 1;
+    if (alpha) {
+        if (alpha.unit !== '' && alpha.unit !== '%' && alpha.unit !== 'none') {
+            return null;
+        }
+        a = clamp01(alpha.unit === '%' ? alpha.value / 100 : alpha.value);
+    }
+    const rgb = toSrgb(name, space, channels);
+    return rgb ? { rgb, a } : null;
+}
+const LEGACY = new Set(['rgb', 'rgba', 'hsl', 'hsla']);
+/** A channel as a number, or null where its unit is not one it takes:
+ *  `pct` is what 100% means for it. */
+function amount(c, pct) {
+    if (c.unit === '')
+        return c.value;
+    if (c.unit === 'none')
+        return 0;
+    if (c.unit === '%')
+        return (c.value / 100) * pct;
+    return null;
+}
+function hue(c) {
+    switch (c.unit) {
+        case '':
+        case 'deg':
+            return c.value;
+        case 'grad':
+            return c.value * 0.9;
+        case 'rad':
+            return (c.value * 180) / Math.PI;
+        case 'turn':
+            return c.value * 360;
+        case 'none':
+            return 0;
+        default:
+            return null;
+    }
+}
+/** The colour in gamma-encoded sRGB, each channel from 0 to 1 (before
+ *  clipping), or null where a channel is not one its function takes. */
+function toSrgb(name, space, c) {
+    switch (name) {
+        case 'rgb':
+        case 'rgba': {
+            const r = amount(c[0], 255);
+            const g = amount(c[1], 255);
+            const b = amount(c[2], 255);
+            if (r === null || g === null || b === null)
+                return null;
+            return [r / 255, g / 255, b / 255];
+        }
+        case 'hsl':
+        case 'hsla': {
+            const h = hue(c[0]);
+            const s = amount(c[1], 100);
+            const l = amount(c[2], 100);
+            if (h === null || s === null || l === null)
+                return null;
+            return hslToRgb(h, clamp01(s / 100), clamp01(l / 100));
+        }
+        case 'hwb': {
+            const h = hue(c[0]);
+            const w = amount(c[1], 100);
+            const b = amount(c[2], 100);
+            if (h === null || w === null || b === null)
+                return null;
+            return hwbToRgb(h, clamp01(w / 100), clamp01(b / 100));
+        }
+        case 'lab':
+        case 'lch': {
+            const l = amount(c[0], 100);
+            if (l === null)
+                return null;
+            let a;
+            let b;
+            if (name === 'lab') {
+                a = amount(c[1], 125);
+                b = amount(c[2], 125);
+            }
+            else {
+                const chroma = amount(c[1], 150);
+                const h = hue(c[2]);
+                if (chroma === null || h === null)
+                    return null;
+                [a, b] = polar(Math.max(0, chroma), h);
+            }
+            if (a === null || b === null)
+                return null;
+            // the gamut mapping CSS draws with takes a lightness at either end to
+            // white or black, whatever its chroma (CSS Color 4 13.2)
+            if (l >= 100)
+                return [1, 1, 1];
+            if (l <= 0)
+                return [0, 0, 0];
+            const xyz = labToXyzD50(l, a, b);
+            return gamma(multiply(XYZ_TO_LINEAR_SRGB, multiply(D50_TO_D65, xyz)));
+        }
+        case 'oklab':
+        case 'oklch': {
+            const l = amount(c[0], 1);
+            if (l === null)
+                return null;
+            let a;
+            let b;
+            if (name === 'oklab') {
+                a = amount(c[1], 0.4);
+                b = amount(c[2], 0.4);
+            }
+            else {
+                const chroma = amount(c[1], 0.4);
+                const h = hue(c[2]);
+                if (chroma === null || h === null)
+                    return null;
+                [a, b] = polar(Math.max(0, chroma), h);
+            }
+            if (a === null || b === null)
+                return null;
+            if (l >= 1)
+                return [1, 1, 1];
+            if (l <= 0)
+                return [0, 0, 0];
+            return gamma(oklabToLinearSrgb(l, a, b));
+        }
+        case 'color': {
+            const v = [];
+            for (const channel of c) {
+                const x = amount(channel, 1);
+                if (x === null)
+                    return null;
+                v.push(x);
+            }
+            return predefined(space, v);
+        }
+        default:
+            return null;
+    }
+}
+/** One of `color()`'s predefined spaces, in gamma-encoded sRGB. */
+function predefined(space, v) {
+    switch (space) {
+        case 'srgb':
+            return v;
+        case 'srgb-linear':
+            return gamma(v);
+        case 'display-p3':
+            return fromXyzD65(multiply(P3_TO_XYZ, v.map(srgbLinear)));
+        case 'display-p3-linear':
+            return fromXyzD65(multiply(P3_TO_XYZ, v));
+        case 'a98-rgb':
+            return fromXyzD65(multiply(A98_TO_XYZ, v.map((x) => Math.sign(x) * Math.abs(x) ** (563 / 256))));
+        case 'prophoto-rgb':
+            return fromXyzD65(multiply(D50_TO_D65, multiply(PROPHOTO_TO_XYZ_D50, v.map(prophotoLinear))));
+        case 'rec2020':
+            return fromXyzD65(multiply(REC2020_TO_XYZ, v.map(rec2020Linear)));
+        case 'xyz':
+        case 'xyz-d65':
+            return fromXyzD65(v);
+        case 'xyz-d50':
+            return fromXyzD65(multiply(D50_TO_D65, v));
+        default:
+            return null;
+    }
+}
+// --- color-mix() (CSS Color 5 3) ---------------------------------------------
+/** `color-mix(in <space> [<hue> hue]?, <colour> <p>?, <colour> <p>?)`: the
+ *  two colours in `space`, premultiplied, weighted by their percentages. */
+function mix(body) {
+    const parts = topLevelParts(body, ',');
+    if (parts.length !== 3)
+        return null;
+    const head = parts[0].trim().toLowerCase().split(/\s+/);
+    if (head[0] !== 'in' || head.length < 2)
+        return null;
+    const space = head[1];
+    let method = 'shorter';
+    if (head.length === 4 && head[3] === 'hue' && space in HUE) {
+        if (!HUE_METHODS.has(head[2]))
+            return null;
+        method = head[2];
+    }
+    else if (head.length !== 2) {
+        return null;
+    }
+    const first = weighted(parts[1]);
+    const second = weighted(parts[2]);
+    if (!first || !second)
+        return null;
+    let p1 = first.pct;
+    let p2 = second.pct;
+    if (p1 === null && p2 === null)
+        p1 = p2 = 50;
+    else if (p1 === null)
+        p1 = 100 - p2;
+    else if (p2 === null)
+        p2 = 100 - p1;
+    const sum = p1 + p2;
+    if (!(sum > 0))
+        return null;
+    const t = p2 / sum;
+    const x = toSpace(space, first.colour.rgb);
+    const y = toSpace(space, second.colour.rgb);
+    if (!x || !y)
+        return null;
+    const a1 = first.colour.a;
+    const a2 = second.colour.a;
+    const alpha = a1 * (1 - t) + a2 * t;
+    const hueAt = HUE[space] ?? -1;
+    const out = [0, 0, 0];
+    for (let i = 0; i < 3; i += 1) {
+        if (i === hueAt) {
+            out[i] = mixHue(x[i], y[i], t, method);
+        }
+        else {
+            // premultiplied, so a transparent side lends its alpha and not its
+            // colour: Tailwind's `bg-blue-500/50` is blue, half as opaque
+            const v = x[i] * a1 * (1 - t) + y[i] * a2 * t;
+            out[i] = alpha === 0 ? 0 : v / alpha;
+        }
+    }
+    const rgb = fromSpace(space, out);
+    // percentages that come to less than 100% take their share of the alpha
+    return rgb ? { rgb, a: alpha * Math.min(1, sum / 100) } : null;
+}
+/** Which component of a polar space is its hue. */
+const HUE = { hsl: 0, hwb: 0, lch: 2, oklch: 2 };
+const HUE_METHODS = new Set(['shorter', 'longer', 'increasing', 'decreasing']);
+/** A colour and the percentage beside it, either way round. */
+function weighted(text) {
+    const tokens = topLevelParts(text.trim(), ' ').filter(Boolean);
+    let pct = null;
+    let colour = null;
+    for (const token of tokens) {
+        const m = /^((?:\d*\.\d+|\d+)(?:e[+-]?\d+)?)%$/i.exec(token);
+        if (m) {
+            if (pct !== null)
+                return null;
+            pct = Number(m[1]);
+            if (pct > 100)
+                return null;
+        }
+        else {
+            if (colour !== null)
+                return null;
+            colour = token;
+        }
+    }
+    const read = colour === null ? null : readRgba(colour);
+    return read ? { colour: read, pct } : null;
+}
+/** `text` split on `sep` outside brackets. */
+function topLevelParts(text, sep) {
+    const out = [];
+    let depth = 0;
+    let start = 0;
+    for (let i = 0; i < text.length; i += 1) {
+        const c = text[i];
+        if (c === '(')
+            depth += 1;
+        else if (c === ')')
+            depth -= 1;
+        else if (depth === 0 && (c === sep || (sep === ' ' && /\s/.test(c)))) {
+            out.push(text.slice(start, i));
+            start = i + 1;
+        }
+    }
+    out.push(text.slice(start));
+    return out;
+}
+function mixHue(h1, h2, t, method) {
+    // an achromatic side has no hue, and takes the other's
+    if (Number.isNaN(h1))
+        return Number.isNaN(h2) ? 0 : h2;
+    if (Number.isNaN(h2))
+        return h1;
+    let a = ((h1 % 360) + 360) % 360;
+    let b = ((h2 % 360) + 360) % 360;
+    const d = b - a;
+    if (method === 'longer') {
+        if (d > 0 && d < 180)
+            a += 360;
+        else if (d > -180 && d <= 0)
+            b += 360;
+    }
+    else if (method === 'increasing') {
+        if (d < 0)
+            b += 360;
+    }
+    else if (method === 'decreasing') {
+        if (d > 0)
+            a += 360;
+    }
+    else if (d > 180) {
+        a += 360;
+    }
+    else if (d < -180) {
+        b += 360;
+    }
+    return (((a + (b - a) * t) % 360) + 360) % 360;
+}
+/** Gamma-encoded sRGB into a space a mix can be taken in. */
+function toSpace(space, rgb) {
+    switch (space) {
+        case 'srgb':
+            return rgb;
+        case 'srgb-linear':
+            return linearize(rgb);
+        case 'xyz':
+        case 'xyz-d65':
+            return multiply(LINEAR_SRGB_TO_XYZ, linearize(rgb));
+        case 'xyz-d50':
+            return multiply(D65_TO_D50, multiply(LINEAR_SRGB_TO_XYZ, linearize(rgb)));
+        case 'lab':
+        case 'lch': {
+            const lab = xyzD50ToLab(multiply(D65_TO_D50, multiply(LINEAR_SRGB_TO_XYZ, linearize(rgb))));
+            return space === 'lab' ? lab : toPolar(lab, 0.0015);
+        }
+        case 'oklab':
+        case 'oklch': {
+            const oklab = linearSrgbToOklab(linearize(rgb));
+            return space === 'oklab' ? oklab : toPolar(oklab, 0.000004);
+        }
+        case 'hsl':
+            return srgbToHsl(rgb);
+        case 'hwb': {
+            const [h] = srgbToHsl(rgb);
+            return [h, Math.min(...rgb) * 100, (1 - Math.max(...rgb)) * 100];
+        }
+        default:
+            return null;
+    }
+}
+/** A space's components back to gamma-encoded sRGB. */
+function fromSpace(space, c) {
+    switch (space) {
+        case 'srgb':
+            return c;
+        case 'srgb-linear':
+            return gamma(c);
+        case 'xyz':
+        case 'xyz-d65':
+            return fromXyzD65(c);
+        case 'xyz-d50':
+            return fromXyzD65(multiply(D50_TO_D65, c));
+        case 'lab':
+        case 'lch': {
+            const [l, a, b] = space === 'lab' ? c : [c[0], ...polar(Math.max(0, c[1]), c[2])];
+            return fromXyzD65(multiply(D50_TO_D65, labToXyzD50(l, a, b)));
+        }
+        case 'oklab':
+        case 'oklch': {
+            const [l, a, b] = space === 'oklab' ? c : [c[0], ...polar(Math.max(0, c[1]), c[2])];
+            return gamma(oklabToLinearSrgb(l, a, b));
+        }
+        case 'hsl':
+            return hslToRgb(c[0], clamp01(c[1] / 100), clamp01(c[2] / 100));
+        case 'hwb':
+            return hwbToRgb(c[0], clamp01(c[1] / 100), clamp01(c[2] / 100));
+        default:
+            return null;
+    }
+}
+function linearize(rgb) {
+    return rgb.map(srgbLinear);
+}
+function linearSrgbToOklab([r, g, b]) {
+    const l = Math.cbrt(0.4122214708 * r + 0.5363325363 * g + 0.0514459929 * b);
+    const m = Math.cbrt(0.2119034982 * r + 0.6806995451 * g + 0.1073969566 * b);
+    const s = Math.cbrt(0.0883024619 * r + 0.2817188376 * g + 0.6299787005 * b);
+    return [
+        0.2104542553 * l + 0.793617785 * m - 0.0040720468 * s,
+        1.9779984951 * l - 2.428592205 * m + 0.4505937099 * s,
+        0.0259040371 * l + 0.7827717662 * m - 0.808675766 * s,
+    ];
+}
+function xyzD50ToLab(xyz) {
+    const f = xyz.map((v, i) => {
+        const x = v / D50_WHITE[i];
+        return x > EPSILON ? Math.cbrt(x) : (KAPPA * x + 16) / 116;
+    });
+    return [116 * f[1] - 16, 500 * (f[0] - f[1]), 200 * (f[1] - f[2])];
+}
+/** Lightness, chroma and hue — no hue where there is next to no chroma,
+ *  which is what a grey's hue is. */
+function toPolar([l, a, b], grey) {
+    const chroma = Math.sqrt(a * a + b * b);
+    if (chroma < grey)
+        return [l, chroma, NaN];
+    const h = (Math.atan2(b, a) * 180) / Math.PI;
+    return [l, chroma, h < 0 ? h + 360 : h];
+}
+function srgbToHsl([r, g, b]) {
+    const max = Math.max(r, g, b);
+    const min = Math.min(r, g, b);
+    const l = (min + max) / 2;
+    const d = max - min;
+    if (d === 0)
+        return [NaN, 0, l * 100];
+    const s = l === 0 || l === 1 ? 0 : (max - l) / Math.min(l, 1 - l);
+    let h;
+    if (max === r)
+        h = (g - b) / d + (g < b ? 6 : 0);
+    else if (max === g)
+        h = (b - r) / d + 2;
+    else
+        h = (r - g) / d + 4;
+    return [h * 60, s * 100, l * 100];
+}
+function serialize(rgb, a) {
+    const [r, g, b] = rgb.map((x) => Math.round(clamp01(x) * 255));
+    if (a === 1)
+        return `#${hex2(r)}${hex2(g)}${hex2(b)}`;
+    return `rgba(${r}, ${g}, ${b}, ${Math.round(a * 1000) / 1000})`;
+}
+function hex2(n) {
+    return n.toString(16).padStart(2, '0');
+}
+function clamp01(x) {
+    return x < 0 ? 0 : x > 1 ? 1 : x;
+}
+function polar(chroma, h) {
+    const rad = (h * Math.PI) / 180;
+    return [chroma * Math.cos(rad), chroma * Math.sin(rad)];
+}
+// --- the conversions: CSS Color 4's sample code (§18) -----------------------
+function hslToRgb(h, s, l) {
+    const hue = ((h % 360) + 360) % 360;
+    const f = (n) => {
+        const k = (n + hue / 30) % 12;
+        const a = s * Math.min(l, 1 - l);
+        return l - a * Math.max(-1, Math.min(k - 3, 9 - k, 1));
+    };
+    return [f(0), f(8), f(4)];
+}
+function hwbToRgb(h, w, b) {
+    if (w + b >= 1) {
+        const gray = w / (w + b);
+        return [gray, gray, gray];
+    }
+    const rgb = hslToRgb(h, 1, 0.5);
+    return rgb.map((x) => x * (1 - w - b) + w);
+}
+const KAPPA = 24389 / 27;
+const EPSILON = 216 / 24389;
+const D50_WHITE = [0.3457 / 0.3585, 1, (1 - 0.3457 - 0.3585) / 0.3585];
+function labToXyzD50(l, a, b) {
+    const f1 = (l + 16) / 116;
+    const f0 = a / 500 + f1;
+    const f2 = f1 - b / 200;
+    const x = f0 ** 3 > EPSILON ? f0 ** 3 : (116 * f0 - 16) / KAPPA;
+    const y = l > KAPPA * EPSILON ? f1 ** 3 : l / KAPPA;
+    const z = f2 ** 3 > EPSILON ? f2 ** 3 : (116 * f2 - 16) / KAPPA;
+    return [x * D50_WHITE[0], y * D50_WHITE[1], z * D50_WHITE[2]];
+}
+function oklabToLinearSrgb(l, a, b) {
+    const l1 = (l + 0.3963377774 * a + 0.2158037573 * b) ** 3;
+    const m1 = (l - 0.1055613458 * a - 0.0638541728 * b) ** 3;
+    const s1 = (l - 0.0894841775 * a - 1.291485548 * b) ** 3;
+    return [
+        4.0767416621 * l1 - 3.3077115913 * m1 + 0.2309699292 * s1,
+        -1.2684380046 * l1 + 2.6097574011 * m1 - 0.3413193965 * s1,
+        -0.0041960863 * l1 - 0.7034186147 * m1 + 1.707614701 * s1,
+    ];
+}
+function fromXyzD65(xyz) {
+    return gamma(multiply(XYZ_TO_LINEAR_SRGB, xyz));
+}
+function srgbLinear(x) {
+    const abs = Math.abs(x);
+    return abs <= 0.04045
+        ? x / 12.92
+        : Math.sign(x) * ((abs + 0.055) / 1.055) ** 2.4;
+}
+function gamma(rgb) {
+    return rgb.map((x) => {
+        const abs = Math.abs(x);
+        return abs > 0.0031308
+            ? Math.sign(x) * (1.055 * abs ** (1 / 2.4) - 0.055)
+            : 12.92 * x;
+    });
+}
+function prophotoLinear(x) {
+    const abs = Math.abs(x);
+    return abs <= 16 / 512 ? x / 16 : Math.sign(x) * abs ** 1.8;
+}
+function rec2020Linear(x) {
+    const alpha = 1.09929682680944;
+    const beta = 0.018053968510807;
+    const abs = Math.abs(x);
+    return abs < beta * 4.5
+        ? x / 4.5
+        : Math.sign(x) * ((abs + alpha - 1) / alpha) ** (1 / 0.45);
+}
+function multiply(m, v) {
+    return [
+        m[0][0] * v[0] + m[0][1] * v[1] + m[0][2] * v[2],
+        m[1][0] * v[0] + m[1][1] * v[1] + m[1][2] * v[2],
+        m[2][0] * v[0] + m[2][1] * v[1] + m[2][2] * v[2],
+    ];
+}
+// Each takes its space's white to its white point's XYZ, which the tests
+// check by sending white through every space.
+const LINEAR_SRGB_TO_XYZ = [
+    [506752 / 1228815, 87881 / 245763, 12673 / 70218],
+    [87098 / 409605, 175762 / 245763, 12673 / 175545],
+    [7918 / 409605, 87881 / 737289, 1001167 / 1053270],
+];
+const D65_TO_D50 = [
+    [1.0479297925449969, 0.022946870601609652, -0.05019226628920524],
+    [0.02962780877005599, 0.9904344267538799, -0.017073799063418826],
+    [-0.009243040646204504, 0.015055191490298152, 0.7518742814281371],
+];
+const XYZ_TO_LINEAR_SRGB = [
+    [12831 / 3959, -329 / 214, -1974 / 3959],
+    [-851781 / 878810, 1648619 / 878810, 36519 / 878810],
+    [705 / 12673, -2585 / 12673, 705 / 667],
+];
+const D50_TO_D65 = [
+    [0.955473421488075, -0.02309845494876471, 0.06325924320057072],
+    [-0.0283697093338637, 1.0099953980813041, 0.021041441191917323],
+    [0.012314014864481998, -0.020507649298898964, 1.330365926242124],
+];
+const P3_TO_XYZ = [
+    [608311 / 1250200, 189793 / 714400, 198249 / 1000160],
+    [35783 / 156275, 247089 / 357200, 198249 / 2500400],
+    [0, 32229 / 714400, 5220557 / 5000800],
+];
+const A98_TO_XYZ = [
+    [573536 / 994567, 263643 / 1420810, 187206 / 994567],
+    [591459 / 1989134, 6239551 / 9945670, 374412 / 4972835],
+    [53769 / 1989134, 351524 / 4972835, 4929758 / 4972835],
+];
+const PROPHOTO_TO_XYZ_D50 = [
+    [0.7977666449006423, 0.13518129740053308, 0.0313477341283922],
+    [0.2880748288194013, 0.711835234241873, 0.00008993693872564],
+    [0, 0, 0.8251046025104602],
+];
+const REC2020_TO_XYZ = [
+    [63426534 / 99577255, 20160776 / 139408157, 47086771 / 278816314],
+    [26158966 / 99577255, 472592308 / 697040785, 8267143 / 139408157],
+    [0, 19567812 / 697040785, 295819943 / 278816314],
+];
+//# sourceMappingURL=color.js.map