@tbela99/css-parser 0.9.1 → 1.1.0

package/dist/lib/renderer/color/hex.js

@@ -2,12 +2,13 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { minmax, getNumber } from './color.js';
 import { hsl2rgb, hwb2rgb, cmyk2rgb, oklab2rgb, oklch2rgb, lab2rgb, lch2rgb } from './rgb.js';
 import { NAMES_COLORS } from './utils/constants.js';
 import { getComponents } from './utils/components.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function toHexString(acc, value) {
     return acc + value.toString(16).padStart(2, '0');
@@ -67,25 +68,35 @@ function rgb2hex(token) {
     return value;
 }
 function hsl2hex(token) {
-    return `${hsl2rgb(token).reduce(toHexString, '#')}`;
+    const t = hsl2rgb(token);
+    return t == null ? null : `${t.reduce(toHexString, '#')}`;
 }
 function hwb2hex(token) {
-    return `${hwb2rgb(token).reduce(toHexString, '#')}`;
+    const t = hwb2rgb(token);
+    return t == null ? null : `${t.reduce(toHexString, '#')}`;
 }
 function cmyk2hex(token) {
-    return `#${cmyk2rgb(token).reduce(toHexString, '')}`;
+    const t = cmyk2rgb(token);
+    return t == null ? null : `#${t.reduce(toHexString, '')}`;
 }
 function oklab2hex(token) {
-    return `${oklab2rgb(token).reduce(toHexString, '#')}`;
+    const t = oklab2rgb(token);
+    return t == null ? null : `${t.reduce(toHexString, '#')}`;
 }
 function oklch2hex(token) {
-    return `${oklch2rgb(token).reduce(toHexString, '#')}`;
+    const value = oklch2rgb(token);
+    if (value == null) {
+        return null;
+    }
+    return `${value.reduce(toHexString, '#')}`;
 }
 function lab2hex(token) {
-    return `${lab2rgb(token).reduce(toHexString, '#')}`;
+    const t = lab2rgb(token);
+    return t == null ? null : `${t.reduce(toHexString, '#')}`;
 }
 function lch2hex(token) {
-    return `${lch2rgb(token).reduce(toHexString, '#')}`;
+    const t = lch2rgb(token);
+    return t == null ? null : `${t.reduce(toHexString, '#')}`;
 }
 function srgb2hexvalues(r, g, b, alpha) {
     return [r, g, b].concat(alpha == null || alpha == 1 ? [] : [alpha]).reduce((acc, value) => acc + minmax(Math.round(255 * value), 0, 255).toString(16).padStart(2, '0'), '#');

package/dist/lib/renderer/color/hsl.js

@@ -7,9 +7,10 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { hslvalues } from './srgb.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function hex2hsl(token) {
     // @ts-ignore
@@ -17,6 +18,9 @@ function hex2hsl(token) {
 }
 function rgb2hsl(token) {
     const chi = getComponents(token);
+    if (chi == null) {
+        return null;
+    }
     // @ts-ignore
     let t = chi[0];
     // @ts-ignore
@@ -75,12 +79,14 @@ function lch2hsl(token) {
     return rgb2hslvalues(...lch2rgb(token));
 }
 function oklab2hsl(token) {
+    const t = oklab2rgb(token);
     // @ts-ignore
-    return rgb2hslvalues(...oklab2rgb(token));
+    return t == null ? null : rgb2hslvalues(...t);
 }
 function oklch2hsl(token) {
+    const t = oklch2rgb(token);
     // @ts-ignore
-    return rgb2hslvalues(...oklch2rgb(token));
+    return t == null ? null : rgb2hslvalues(...t);
 }
 function rgb2hslvalues(r, g, b, a = null) {
     return srgb2hsl(r / 255, g / 255, b / 255, a);

package/dist/lib/renderer/color/hwb.js

@@ -6,9 +6,10 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { lch2srgb, lab2srgb, oklch2srgb, oklab2srgb } from './srgb.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function rgb2hwb(token) {
     // @ts-ignore

package/dist/lib/renderer/color/lab.js

@@ -9,9 +9,10 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { xyzd502srgb } from './xyzd50.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 // L: 0% = 0.0, 100% = 100.0
 // for a and b: -100% = -125, 100% = 125
@@ -87,6 +88,14 @@ function lch2labvalues(l, c, h, a = null) {
 }
 function getLABComponents(token) {
     const components = getComponents(token);
+    if (components == null) {
+        return null;
+    }
+    for (let i = 0; i < components.length; i++) {
+        if (![EnumToken.NumberTokenType, EnumToken.PercentageTokenType, EnumToken.AngleTokenType, EnumToken.IdenTokenType].includes(components[i].typ)) {
+            return [];
+        }
+    }
     // @ts-ignore
     let t = components[0];
     // @ts-ignore

package/dist/lib/renderer/color/lch.js

@@ -5,9 +5,10 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { srgb2lab, xyz2lab, oklch2lab, oklab2lab, getLABComponents, hwb2lab, hsl2lab, rgb2lab, hex2lab } from './lab.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function hex2lch(token) {
     // @ts-ignore
@@ -59,6 +60,14 @@ function xyz2lchvalues(x, y, z, alpha) {
 }
 function getLCHComponents(token) {
     const components = getComponents(token);
+    if (components == null) {
+        return null;
+    }
+    for (let i = 0; i < components.length; i++) {
+        if (![EnumToken.NumberTokenType, EnumToken.PercentageTokenType, EnumToken.AngleTokenType, EnumToken.IdenTokenType].includes(components[i].typ)) {
+            return null;
+        }
+    }
     // @ts-ignore
     let t = components[0];
     // @ts-ignore

package/dist/lib/renderer/color/oklab.js

@@ -7,10 +7,11 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { lch2labvalues } from './lab.js';
 import { getOKLCHComponents } from './oklch.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function hex2oklab(token) {
     // @ts-ignore
@@ -52,6 +53,14 @@ function srgb2oklab(r, g, blue, alpha) {
 }
 function getOKLABComponents(token) {
     const components = getComponents(token);
+    if (components == null) {
+        return null;
+    }
+    for (let i = 0; i < components.length; i++) {
+        if (![EnumToken.NumberTokenType, EnumToken.PercentageTokenType, EnumToken.AngleTokenType, EnumToken.IdenTokenType].includes(components[i].typ)) {
+            return null;
+        }
+    }
     // @ts-ignore
     let t = components[0];
     // @ts-ignore

package/dist/lib/renderer/color/oklch.js

@@ -5,10 +5,11 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { lab2lchvalues } from './lch.js';
 import { srgb2oklab, lch2oklab, getOKLABComponents, lab2oklab, hwb2oklab, hsl2oklab, rgb2oklab, hex2oklab } from './oklab.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function hex2oklch(token) {
     // @ts-ignore
@@ -44,6 +45,14 @@ function srgb2oklch(r, g, blue, alpha) {
 }
 function getOKLCHComponents(token) {
     const components = getComponents(token);
+    if (components == null) {
+        return null;
+    }
+    for (let i = 0; i < components.length; i++) {
+        if (![EnumToken.NumberTokenType, EnumToken.PercentageTokenType, EnumToken.AngleTokenType, EnumToken.IdenTokenType].includes(components[i].typ)) {
+            return [];
+        }
+    }
     // @ts-ignore
     let t = components[0];
     // @ts-ignore

package/dist/lib/renderer/color/p3.js

@@ -5,9 +5,10 @@ import '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { srgb2xyz } from './xyz.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function p32srgbvalues(r, g, b, alpha) {
     // @ts-ignore

package/dist/lib/renderer/color/rec2020.js

@@ -5,9 +5,10 @@ import '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { srgb2xyz } from './xyz.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function rec20202srgb(r, g, b, a) {
     // @ts-ignore

package/dist/lib/renderer/color/relativecolor.js

@@ -3,11 +3,12 @@ import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import { walkValues } from '../../ast/walk.js';
 import '../../parser/parse.js';
-import { mathFuncs } from '../../syntax/syntax.js';
+import '../../parser/tokenize.js';
 import '../../parser/utils/config.js';
+import { mathFuncs } from '../../syntax/syntax.js';
 import { reduceNumber } from '../render.js';
+import { ColorKind, colorRange } from './utils/constants.js';
 import { evaluateFunc, evaluate } from '../../ast/math/expression.js';
-import { colorRange } from './utils/constants.js';
 
 function parseRelativeColor(relativeKeys, original, rExp, gExp, bExp, aExp) {
     let r;
@@ -18,21 +19,23 @@ function parseRelativeColor(relativeKeys, original, rExp, gExp, bExp, aExp) {
     let values = {};
     // colorFuncColorSpace x,y,z or r,g,b
     const names = relativeKeys.startsWith('xyz') ? 'xyz' : relativeKeys.slice(-3);
-    // @ts-ignore
-    const converted = convert(original, relativeKeys);
+    const converted = convert(original, ColorKind[relativeKeys.toUpperCase().replaceAll('-', '_')]);
     if (converted == null) {
         return null;
     }
     const children = converted.chi.filter(t => ![EnumToken.WhitespaceTokenType, EnumToken.LiteralTokenType, EnumToken.CommentTokenType].includes(t.typ));
-    [r, g, b, alpha] = converted.kin == 'color' ? children.slice(1) : children;
+    [r, g, b, alpha] = converted.kin == ColorKind.COLOR ? children.slice(1) : children;
     values = {
         [names[0]]: getValue(r, converted, names[0]),
         [names[1]]: getValue(g, converted, names[1]), // string,
         [names[2]]: getValue(b, converted, names[2]),
         // @ts-ignore
-        alpha: alpha == null || (alpha.typ == EnumToken.IdenTokenType && alpha.val == 'none') ? {
+        alpha: alpha == null ? {
             typ: EnumToken.NumberTokenType,
             val: '1'
+        } : (alpha.typ == EnumToken.IdenTokenType && alpha.val == 'none') ? {
+            typ: EnumToken.NumberTokenType,
+            val: '0'
         } : (alpha.typ == EnumToken.PercentageTokenType ? {
             typ: EnumToken.NumberTokenType,
             val: String(getNumber(alpha))
@@ -43,9 +46,12 @@ function parseRelativeColor(relativeKeys, original, rExp, gExp, bExp, aExp) {
         [names[1]]: getValue(gExp, converted, names[1]),
         [names[2]]: getValue(bExp, converted, names[2]),
         // @ts-ignore
-        alpha: getValue(aExp == null || (aExp.typ == EnumToken.IdenTokenType && aExp.val == 'none') ? {
+        alpha: getValue(aExp == null ? {
             typ: EnumToken.NumberTokenType,
             val: '1'
+        } : (aExp.typ == EnumToken.IdenTokenType && aExp.val == 'none') ? {
+            typ: EnumToken.NumberTokenType,
+            val: '0'
         } : aExp)
     };
     return computeComponentValue(keys, converted, values);
@@ -56,9 +62,10 @@ function getValue(t, converted, component) {
     }
     if (t.typ == EnumToken.PercentageTokenType) {
         let value = getNumber(t);
-        if (converted.kin in colorRange) {
+        let colorSpace = ColorKind[converted.kin].toLowerCase().replaceAll('-', '_');
+        if (colorSpace in colorRange) {
             // @ts-ignore
-            value *= colorRange[converted.kin][component].at(-1);
+            value *= colorRange[colorSpace][component].at(-1);
         }
         return {
             typ: EnumToken.NumberTokenType,
@@ -71,7 +78,6 @@ function computeComponentValue(expr, converted, values) {
     for (const object of [values, expr]) {
         if ('h' in object) {
             // normalize hue
-            // @ts-ignore
             for (const k of walkValues([object.h])) {
                 if (k.value.typ == EnumToken.AngleTokenType && k.value.unit == 'deg') {
                     // @ts-ignore
@@ -142,32 +148,21 @@ function computeComponentValue(expr, converted, values) {
     return expr;
 }
 function replaceValue(parent, value, newValue) {
-    if (parent.typ == EnumToken.BinaryExpressionTokenType) {
-        if (parent.l == value) {
-            parent.l = newValue;
-        }
-        else {
-            parent.r = newValue;
-        }
-    }
-    else {
-        for (let i = 0; i < parent.chi.length; i++) {
-            if (parent.chi[i] == value) {
-                parent.chi.splice(i, 1, newValue);
-                break;
-            }
-            if (parent.chi[i].typ == EnumToken.BinaryExpressionTokenType) {
-                if (parent.chi[i].l == value) {
-                    parent.chi[i].l = newValue;
-                    break;
+    for (const { value: val, parent: pr } of walkValues([parent])) {
+        if (val.typ == value.typ && val.val == value.val) {
+            if (pr.typ == EnumToken.BinaryExpressionTokenType) {
+                if (pr.l == val) {
+                    pr.l = newValue;
                 }
-                else if (parent.chi[i].r == value) {
-                    parent.chi[i].r = newValue;
-                    break;
+                else {
+                    pr.r = newValue;
                 }
             }
+            else {
+                pr.chi.splice(pr.chi.indexOf(val), 1, newValue);
+            }
         }
     }
 }
 
-export { parseRelativeColor };
+export { parseRelativeColor, replaceValue };

package/dist/lib/renderer/color/rgb.js

@@ -1,19 +1,20 @@
 import { minmax } from './color.js';
-import { COLORS_NAMES } from './utils/constants.js';
+import { COLORS_NAMES, ColorKind } from './utils/constants.js';
 import '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { expandHexValue } from './hex.js';
 import { hslvalues, hsl2srgbvalues, hwb2srgb, cmyk2srgb, oklab2srgb, oklch2srgb, lab2srgb, lch2srgb } from './srgb.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 function srgb2rgb(value) {
     return minmax(Math.round(value * 255), 0, 255);
 }
 function hex2rgb(token) {
-    const value = expandHexValue(token.kin == 'lit' ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
+    const value = expandHexValue(token.kin == ColorKind.LIT ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
     const rgb = [];
     for (let i = 1; i < value.length; i += 2) {
         rgb.push(parseInt(value.slice(i, i + 2), 16));
@@ -21,26 +22,29 @@ function hex2rgb(token) {
     return rgb;
 }
 function hwb2rgb(token) {
-    return hwb2srgb(token).map(srgb2rgb);
+    return hwb2srgb(token)?.map?.(srgb2rgb) ?? null;
 }
 function hsl2rgb(token) {
-    let { h, s, l, a } = hslvalues(token);
+    let { h, s, l, a } = hslvalues(token) ?? {};
+    if (h == null || s == null || l == null) {
+        return null;
+    }
     return hsl2srgbvalues(h, s, l, a).map((t) => minmax(Math.round(t * 255), 0, 255));
 }
 function cmyk2rgb(token) {
-    return cmyk2srgb(token).map(srgb2rgb);
+    return cmyk2srgb(token)?.map?.(srgb2rgb) ?? null;
 }
 function oklab2rgb(token) {
-    return oklab2srgb(token).map(srgb2rgb);
+    return oklab2srgb(token)?.map?.(srgb2rgb) ?? null;
 }
 function oklch2rgb(token) {
-    return oklch2srgb(token).map(srgb2rgb);
+    return oklch2srgb(token)?.map?.(srgb2rgb) ?? null;
 }
 function lab2rgb(token) {
-    return lab2srgb(token).map(srgb2rgb);
+    return lab2srgb(token)?.map?.(srgb2rgb) ?? null;
 }
 function lch2rgb(token) {
-    return lch2srgb(token).map(srgb2rgb);
+    return lch2srgb(token)?.map?.(srgb2rgb) ?? null;
 }
 
 export { cmyk2rgb, hex2rgb, hsl2rgb, hwb2rgb, lab2rgb, lch2rgb, oklab2rgb, oklch2rgb, srgb2rgb };

package/dist/lib/renderer/color/srgb.js

@@ -1,10 +1,12 @@
-import { COLORS_NAMES } from './utils/constants.js';
+import { ColorKind, COLORS_NAMES } from './utils/constants.js';
 import { getComponents } from './utils/components.js';
 import { color2srgbvalues, getNumber, getAngle } from './color.js';
 import { EnumToken } from '../../ast/types.js';
 import '../../ast/minify.js';
 import '../../ast/walk.js';
 import '../../parser/parse.js';
+import '../../parser/tokenize.js';
+import '../../parser/utils/config.js';
 import { expandHexValue } from './hex.js';
 import { lch2labvalues, Lab_to_sRGB, getLABComponents } from './lab.js';
 import { OKLab_to_sRGB, getOKLABComponents } from './oklab.js';
@@ -12,42 +14,41 @@ import { getLCHComponents } from './lch.js';
 import { getOKLCHComponents } from './oklch.js';
 import { XYZ_to_lin_sRGB } from './xyz.js';
 import '../sourcemap/lib/encode.js';
-import '../../parser/utils/config.js';
 
 // from https://www.w3.org/TR/css-color-4/#color-conversion-code
 // srgb-linear -> srgb
 // 0 <= r, g, b <= 1
 function srgbvalues(token) {
     switch (token.kin) {
-        case 'lit':
-        case 'hex':
+        case ColorKind.LIT:
+        case ColorKind.HEX:
             return hex2srgb(token);
-        case 'rgb':
-        case 'rgba':
+        case ColorKind.RGB:
+        case ColorKind.RGBA:
             return rgb2srgb(token);
-        case 'hsl':
-        case 'hsla':
+        case ColorKind.HSL:
+        case ColorKind.HSLA:
             return hsl2srgb(token);
-        case 'hwb':
+        case ColorKind.HWB:
             return hwb2srgb(token);
-        case 'lab':
+        case ColorKind.LAB:
             return lab2srgb(token);
-        case 'lch':
+        case ColorKind.LCH:
             return lch2srgb(token);
-        case 'oklab':
+        case ColorKind.OKLAB:
             return oklab2srgb(token);
-        case 'oklch':
+        case ColorKind.OKLCH:
             return oklch2srgb(token);
-        case 'color':
+        case ColorKind.COLOR:
             return color2srgbvalues(token);
     }
     return null;
 }
 function rgb2srgb(token) {
-    return getComponents(token).map((t, index) => index == 3 ? ((t.typ == EnumToken.IdenTokenType && t.val == 'none') ? 1 : getNumber(t)) : (t.typ == EnumToken.PercentageTokenType ? 255 : 1) * getNumber(t) / 255);
+    return getComponents(token)?.map?.((t, index) => index == 3 ? ((t.typ == EnumToken.IdenTokenType && t.val == 'none') ? 1 : getNumber(t)) : (t.typ == EnumToken.PercentageTokenType ? 255 : 1) * getNumber(t) / 255) ?? null;
 }
 function hex2srgb(token) {
-    const value = expandHexValue(token.kin == 'lit' ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
+    const value = expandHexValue(token.kin == ColorKind.LIT ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
     const rgb = [];
     for (let i = 1; i < value.length; i += 2) {
         rgb.push(parseInt(value.slice(i, i + 2), 16) / 255);
@@ -59,7 +60,10 @@ function xyz2srgb(x, y, z) {
     return lsrgb2srgbvalues(...XYZ_to_lin_sRGB(x, y, z));
 }
 function hwb2srgb(token) {
-    const { h: hue, s: white, l: black, a: alpha } = hslvalues(token);
+    const { h: hue, s: white, l: black, a: alpha } = hslvalues(token) ?? {};
+    if (hue == null || white == null || black == null) {
+        return [];
+    }
     const rgb = hsl2srgbvalues(hue, 1, .5);
     for (let i = 0; i < 3; i++) {
         rgb[i] *= (1 - white - black);
@@ -71,11 +75,17 @@ function hwb2srgb(token) {
     return rgb;
 }
 function hsl2srgb(token) {
-    let { h, s, l, a } = hslvalues(token);
+    let { h, s, l, a } = hslvalues(token) ?? {};
+    if (h == null || s == null || l == null) {
+        return null;
+    }
     return hsl2srgbvalues(h, s, l, a);
 }
 function cmyk2srgb(token) {
     const components = getComponents(token);
+    if (components == null) {
+        return null;
+    }
     // @ts-ignore
     let t = components[0];
     // @ts-ignore
@@ -107,7 +117,10 @@ function cmyk2srgb(token) {
     return rgb;
 }
 function oklab2srgb(token) {
-    const [l, a, b, alpha] = getOKLABComponents(token);
+    const [l, a, b, alpha] = getOKLABComponents(token) ?? [];
+    if (l == null || a == null || b == null) {
+        return null;
+    }
     const rgb = OKLab_to_sRGB(l, a, b);
     if (alpha != null && alpha != 1) {
         rgb.push(alpha);
@@ -115,7 +128,10 @@ function oklab2srgb(token) {
     return rgb;
 }
 function oklch2srgb(token) {
-    const [l, c, h, alpha] = getOKLCHComponents(token);
+    const [l, c, h, alpha] = getOKLCHComponents(token) ?? [];
+    if (l == null || c == null || h == null) {
+        return null;
+    }
     // @ts-ignore
     const rgb = OKLab_to_sRGB(...lch2labvalues(l, c, h));
     if (alpha != 1) {
@@ -125,6 +141,9 @@ function oklch2srgb(token) {
 }
 function hslvalues(token) {
     const components = getComponents(token);
+    if (components == null) {
+        return null;
+    }
     let t;
     // @ts-ignore
     let h = getAngle(components[0]);
@@ -137,9 +156,9 @@ function hslvalues(token) {
     // @ts-ignore
     let l = getNumber(t);
     let a = null;
-    if (token.chi?.length == 4) {
+    if (components.length == 4) {
         // @ts-ignore
-        t = token.chi[3];
+        t = components[3];
         // @ts-ignore
         a = getNumber(t);
     }
@@ -199,7 +218,10 @@ function hsl2srgbvalues(h, s, l, a = null) {
     return values;
 }
 function lab2srgb(token) {
-    const [l, a, b, alpha] = getLABComponents(token);
+    const [l, a, b, alpha] = getLABComponents(token) ?? [];
+    if (l == null || a == null || b == null) {
+        return null;
+    }
     const rgb = Lab_to_sRGB(l, a, b);
     if (alpha != null && alpha != 1) {
         rgb.push(alpha);
@@ -209,6 +231,9 @@ function lab2srgb(token) {
 function lch2srgb(token) {
     // @ts-ignore
     const [l, a, b, alpha] = lch2labvalues(...getLCHComponents(token));
+    if (l == null || a == null || b == null) {
+        return null;
+    }
     // https://www.w3.org/TR/css-color-4/#lab-to-lch
     const rgb = Lab_to_sRGB(l, a, b);
     if (alpha != 1) {

package/dist/lib/renderer/color/utils/components.js

@@ -2,21 +2,33 @@ import { EnumToken } from '../../../ast/types.js';
 import '../../../ast/minify.js';
 import '../../../ast/walk.js';
 import '../../../parser/parse.js';
-import { COLORS_NAMES } from './constants.js';
+import '../../../parser/tokenize.js';
+import '../../../parser/utils/config.js';
+import { ColorKind, COLORS_NAMES } from './constants.js';
 import { expandHexValue } from '../hex.js';
 import '../../sourcemap/lib/encode.js';
-import '../../../parser/utils/config.js';
 
 function getComponents(token) {
-    if (token.kin == 'hex' || token.kin == 'lit') {
-        const value = expandHexValue(token.kin == 'lit' ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
+    if (token.kin == ColorKind.HEX || token.kin == ColorKind.LIT) {
+        const value = expandHexValue(token.kin == ColorKind.LIT ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
         // @ts-ignore
         return value.slice(1).match(/([a-fA-F0-9]{2})/g).map((t) => {
             return { typ: EnumToken.Number, val: parseInt(t, 16).toString() };
         });
     }
-    return token.chi
-        .filter((t) => ![EnumToken.LiteralTokenType, EnumToken.CommentTokenType, EnumToken.CommaTokenType, EnumToken.WhitespaceTokenType].includes(t.typ));
+    const result = [];
+    for (const child of (token.chi)) {
+        if ([
+            EnumToken.LiteralTokenType, EnumToken.CommentTokenType, EnumToken.CommaTokenType, EnumToken.WhitespaceTokenType
+        ].includes(child.typ)) {
+            continue;
+        }
+        if (child.typ == EnumToken.ColorTokenType && child.val.localeCompare('currentcolor', undefined, { sensitivity: 'base' }) == 0) {
+            return null;
+        }
+        result.push(child);
+    }
+    return result;
 }
 
 export { getComponents };