@tbela99/css-parser 1.2.0 → 1.3.1

package/dist/lib/renderer/render.js

@@ -8,6 +8,11 @@ import { isColor, pseudoElements, mathFuncs, isNewLine } from '../syntax/syntax.
 import { minifyNumber } from '../syntax/utils.js';
 import { SourceMap } from './sourcemap/sourcemap.js';
 
+/**
+ * Update position
+ * @param position
+ * @param str
+ */
 function update(position, str) {
     let i = 0;
     for (; i < str.length; i++) {
@@ -24,6 +29,7 @@ function update(position, str) {
  * render ast
  * @param data
  * @param options
+ * @private
  */
 function doRender(data, options = {}) {
     const minify = options.minify ?? true;
@@ -91,6 +97,17 @@ function doRender(data, options = {}) {
     }
     return result;
 }
+/**
+ * Update source map
+ * @param node
+ * @param options
+ * @param cache
+ * @param sourcemap
+ * @param position
+ * @param str
+ *
+ * @internal
+ */
 function updateSourceMap(node, options, cache, sourcemap, position, str) {
     if ([
         EnumToken.RuleNodeType, EnumToken.AtRuleNodeType,
@@ -126,6 +143,8 @@ function updateSourceMap(node, options, cache, sourcemap, position, str) {
  * @param cache
  * @param level
  * @param indents
+ *
+ * @internal
  */
 function renderAstNode(data, options, sourcemap, position, errors, reducer, cache, level = 0, indents = []) {
     if (indents.length < level + 1) {
@@ -224,9 +243,6 @@ function renderAstNode(data, options, sourcemap, position, errors, reducer, cach
  * render ast token
  * @param token
  * @param options
- * @param cache
- * @param reducer
- * @param errors
  */
 function renderToken(token, options = {}, cache = Object.create(null), reducer, errors) {
     if (reducer == null) {
@@ -325,7 +341,7 @@ function renderToken(token, options = {}, cache = Object.create(null), reducer,
             if (Array.isArray(token.chi)) {
                 const isLegacy = ['rgb', 'rgba', 'hsl', 'hsla'].includes(token.val.toLowerCase());
                 const useAlpha = (['rgb', 'rgba', 'hsl', 'hsla', 'hwb', 'oklab', 'oklch', 'lab', 'lch'].includes(token.val.toLowerCase()) && token.chi.length == 4) ||
-                    ('color'.localeCompare(token.val, undefined, { sensitivity: 'base' }) == 0 && token.chi.length == 5);
+                    ('color' == token.val.toLowerCase() && token.chi.length == 5);
                 return (token.val.endsWith('a') ? token.val.slice(0, -1) : token.val) + '(' + token.chi.reduce((acc, curr, index, array) => {
                     if (/[,/]\s*$/.test(acc)) {
                         if (curr.typ == EnumToken.WhitespaceTokenType) {
@@ -522,32 +538,41 @@ function renderToken(token, options = {}, cache = Object.create(null), reducer,
                 return token.val.slice(1);
             }
         case EnumToken.UrlTokenTokenType:
-            if (token.typ == EnumToken.UrlTokenTokenType) {
-                if (options.output != null) {
-                    if (!('original' in token)) {
-                        // do not modify original token
-                        token = { ...token };
-                        Object.defineProperty(token, 'original', {
-                            enumerable: false,
-                            writable: false,
-                            value: token.val
-                        });
-                    }
-                    // @ts-ignore
-                    if (!(token.original in cache)) {
-                        let output = options.output ?? '';
-                        const key = output + 'abs';
-                        if (!(key in cache)) {
-                            // @ts-ignore
-                            cache[key] = options.dirname(options.resolve(output, options.cwd).absolute);
-                        }
-                        // @ts-ignore
-                        cache[token.original] = options.resolve(token.original, cache[key]).relative;
-                    }
-                    // @ts-ignore
-                    token.val = cache[token.original];
-                }
-            }
+        // if (token.typ == EnumToken.UrlTokenTokenType) {
+        //
+        //     if (options.output != null) {
+        //
+        //         if (!('original' in token)) {
+        //
+        //             // do not modify original token
+        //             token = {...token};
+        //             Object.defineProperty(token, 'original', {
+        //                 enumerable: false,
+        //                 writable: false,
+        //                 value: (token as UrlToken).val
+        //             })
+        //         }
+        //
+        //         // @ts-ignore
+        //         if (!(token.original in cache)) {
+        //
+        //             let output: string = <string>options.output ?? '';
+        //             const key = output + 'abs';
+        //
+        //             if (!(key in cache)) {
+        //
+        //                 // @ts-ignore
+        //                 cache[key] = options.dirname(options.resolve(output, options.cwd).absolute);
+        //             }
+        //
+        //             // @ts-ignore
+        //             cache[token.original] = options.resolve(token.original, cache[key]).relative;
+        //         }
+        //
+        //         // @ts-ignore
+        //         token.val = cache[token.original];
+        //     }
+        // }
         case EnumToken.HashTokenType:
         case EnumToken.IdenTokenType:
         case EnumToken.AtRuleTokenType:
@@ -581,6 +606,12 @@ function renderToken(token, options = {}, cache = Object.create(null), reducer,
     errors?.push({ action: 'ignore', message: `render: unexpected token ${JSON.stringify(token, null, 1)}` });
     return '';
 }
+/**
+ * Remove whitespace tokens that are not needed
+ * @param values
+ *
+ * @internal
+ */
 function filterValues(values) {
     let i = 0;
     for (; i < values.length; i++) {

package/dist/lib/renderer/sourcemap/sourcemap.js

@@ -1,11 +1,39 @@
 import { encode } from './lib/encode.js';
 
+/**
+ * Source map class
+ * @internal
+ */
 class SourceMap {
+    /**
+     * Last location
+     */
     lastLocation = null;
+    /**
+     * Version
+     * @private
+     */
     #version = 3;
+    /**
+     * Sources
+     * @private
+     */
     #sources = [];
+    /**
+     * Map
+     * @private
+     */
     #map = new Map;
+    /**
+     * Line
+     * @private
+     */
     #line = -1;
+    /**
+     * Add a location
+     * @param source
+     * @param original
+     */
     add(source, original) {
         if (original.src !== '') {
             if (!this.#sources.includes(original.src)) {
@@ -32,10 +60,16 @@ class SourceMap {
             this.lastLocation = original;
         }
     }
+    /**
+     * Convert to URL encoded string
+     */
     toUrl() {
         // /*# sourceMappingURL = ${url} */
         return `data:application/json,${encodeURIComponent(JSON.stringify(this.toJSON()))}`;
     }
+    /**
+     * Convert to JSON object
+     */
     toJSON() {
         const mappings = [];
         let i = 0;

package/dist/lib/syntax/color/cmyk.js

@@ -92,11 +92,11 @@ function cmyktoken(values) {
         chi: values.reduce((acc, curr, index) => index < 4 ? [...acc, {
                 typ: EnumToken.PercentageTokenType,
                 // @ts-ignore
-                val: (curr * 100) + ''
+                val: curr * 100
             }] : [...acc, {
                 typ: EnumToken.LiteralTokenType,
                 val: '/'
-            }, { typ: EnumToken.PercentageTokenType, val: (curr * 100).toFixed() }], []),
+            }, { typ: EnumToken.PercentageTokenType, val: curr * 100 }], []),
         kin: ColorType.DEVICE_CMYK
     };
 }

package/dist/lib/syntax/color/color-mix.js

@@ -57,7 +57,7 @@ function interpolateHue(interpolationMethod, h1, h2) {
     return [h1, h2];
 }
 function colorMix(colorSpace, hueInterpolationMethod, color1, percentage1, color2, percentage2) {
-    if (color1.val == 'currentcolor' || color2.val == 'currentcolor') {
+    if (color1.val.toLowerCase() == 'currentcolor' || color2.val == 'currentcolor'.toLowerCase()) {
         return null;
     }
     if (hueInterpolationMethod != null && isRectangularOrthogonalColorspace(colorSpace)) {
@@ -69,20 +69,19 @@ function colorMix(colorSpace, hueInterpolationMethod, color1, percentage1, color
     if (percentage1 == null) {
         if (percentage2 == null) {
             // @ts-ignore
-            percentage1 = { typ: EnumToken.NumberTokenType, val: '.5' };
+            percentage1 = { typ: EnumToken.NumberTokenType, val: .5 };
             // @ts-ignore
-            percentage2 = { typ: EnumToken.NumberTokenType, val: '.5' };
+            percentage2 = { typ: EnumToken.NumberTokenType, val: .5 };
         }
         else {
             if (+percentage2.val <= 0) {
                 return null;
             }
             if (+percentage2.val >= 100) {
-                // @ts-ignore
-                percentage2 = { typ: EnumToken.NumberTokenType, val: '1' };
+                percentage2 = { typ: EnumToken.NumberTokenType, val: 1 };
             }
             // @ts-ignore
-            percentage1 = { typ: EnumToken.NumberTokenType, val: String(1 - percentage2.val / 100) };
+            percentage1 = { typ: EnumToken.NumberTokenType, val: 1 - percentage2.val / 100 };
         }
     }
     else {
@@ -94,10 +93,10 @@ function colorMix(colorSpace, hueInterpolationMethod, color1, percentage1, color
             // @ts-ignore
             if (percentage1.val >= 100) {
                 // @ts-ignore
-                percentage1 = { typ: EnumToken.NumberTokenType, val: '1' };
+                percentage1 = { typ: EnumToken.NumberTokenType, val: 1 };
             }
             // @ts-ignore
-            percentage2 = { typ: EnumToken.NumberTokenType, val: String(1 - percentage1.val / 100) };
+            percentage2 = { typ: EnumToken.NumberTokenType, val: 1 - percentage1.val / 100 };
         }
         else {
             // @ts-ignore
@@ -275,7 +274,7 @@ function colorMix(colorSpace, hueInterpolationMethod, color1, percentage1, color
                 chi: values.map(v => {
                     return {
                         typ: EnumToken.NumberTokenType,
-                        val: String(v)
+                        val: v
                     };
                 }),
                 kin: ColorType.LCH
@@ -332,11 +331,11 @@ function colorMix(colorSpace, hueInterpolationMethod, color1, percentage1, color
             };
             if (colorSpace.val == 'hsl' || colorSpace.val == 'hwb') {
                 // @ts-ignore
-                result.chi[0] = { typ: EnumToken.AngleTokenType, val: String(result.chi[0].val * 360), unit: 'deg' };
+                result.chi[0] = { typ: EnumToken.AngleTokenType, val: result.chi[0].val * 360 };
                 // @ts-ignore
-                result.chi[1] = { typ: EnumToken.PercentageTokenType, val: String(result.chi[1].val * 100) };
+                result.chi[1] = { typ: EnumToken.PercentageTokenType, val: result.chi[1].val * 100 };
                 // @ts-ignore
-                result.chi[2] = { typ: EnumToken.PercentageTokenType, val: String(result.chi[2].val * 100) };
+                result.chi[2] = { typ: EnumToken.PercentageTokenType, val: result.chi[2].val * 100 };
             }
             return result;
     }

package/dist/lib/syntax/color/color.js

@@ -28,15 +28,22 @@ import { a98rgb2srgbvalues, srgb2a98values } from './a98rgb.js';
 import '../../renderer/sourcemap/lib/encode.js';
 
 /**
- * Converts a color token to another color space
+ * Converts a color to another color space
  * @param token
  * @param to
+ *
+ * <code>
+ *
+ *     const token = {typ: EnumToken.ColorTokenType, kin: ColorType.HEX, val: '#F00'}
+ *     const result = convertColor(token, ColorType.LCH);
+ *
+ * </code>
  */
 function convertColor(token, to) {
     if (token.kin == ColorType.SYS ||
         token.kin == ColorType.DPSYS ||
         (isIdentColor(token) &&
-            ('currentcolor'.localeCompare(token.val, undefined, { sensitivity: 'base' }) == 0))) {
+            'currentcolor' == token.val.toLowerCase())) {
         return token;
     }
     if (token.kin == ColorType.COLOR_MIX && to != ColorType.COLOR_MIX) {
@@ -505,14 +512,14 @@ function color2srgbvalues(token) {
 function values2colortoken(values, to) {
     values = srgb2srgbcolorspace(values, to);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[1]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[2]) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: "/" }, {
             typ: EnumToken.PercentageTokenType,
-            val: (values[3] * 100).toFixed()
+            val: values[3] * 100
         });
     }
     const colorSpace = ColorType[to].toLowerCase().replaceAll('_', '-');
@@ -533,7 +540,7 @@ function getNumber(token) {
         return 0;
     }
     // @ts-ignore
-    return token.typ == EnumToken.PercentageTokenType ? token.val / 100 : +token.val;
+    return token.typ == EnumToken.PercentageTokenType ? token.val / 100 : token.val;
 }
 /**
  * convert angle to turn

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

@@ -76,12 +76,12 @@ function color2HslToken(token) {
 function hslToken(values) {
     values[0] = toPrecisionAngle(values[0] * 360);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]), uni: 'deg' },
-        { typ: EnumToken.PercentageTokenType, val: String(values[1] * 100) },
-        { typ: EnumToken.PercentageTokenType, val: String(values[2] * 100) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.PercentageTokenType, val: values[1] * 100 },
+        { typ: EnumToken.PercentageTokenType, val: values[2] * 100 },
     ];
     if (values.length == 4 && values[3] != 1) {
-        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, { typ: EnumToken.PercentageTokenType, val: (values[3] * 100).toFixed() });
+        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, { typ: EnumToken.PercentageTokenType, val: values[3] * 100 });
     }
     return {
         typ: EnumToken.ColorTokenType,

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

@@ -70,12 +70,15 @@ function color2hwbToken(token) {
 function hwbToken(values) {
     values[0] = toPrecisionAngle(values[0] * 360);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.PercentageTokenType, val: String(values[1] * 100) },
-        { typ: EnumToken.PercentageTokenType, val: String(values[2] * 100) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.PercentageTokenType, val: values[1] * 100 },
+        { typ: EnumToken.PercentageTokenType, val: values[2] * 100 },
     ];
     if (values.length == 4) {
-        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, { typ: EnumToken.PercentageTokenType, val: String((values[3] * 100).toFixed()) });
+        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {
+            typ: EnumToken.PercentageTokenType,
+            val: values[3] * 100
+        });
     }
     return {
         typ: EnumToken.ColorTokenType,
@@ -110,16 +113,28 @@ function hsl2hwbvalues(token) {
     }));
 }
 function lab2hwbvalues(token) {
+    const values = lab2srgbvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return srgb2hwb(...lab2srgbvalues(token));
+    return srgb2hwb(...values);
 }
 function lch2hwbvalues(token) {
+    const values = lch2srgbvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return srgb2hwb(...lch2srgbvalues(token));
+    return srgb2hwb(...values);
 }
 function oklab2hwbvalues(token) {
+    const values = oklab2srgbvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return srgb2hwb(...oklab2srgbvalues(token));
+    return srgb2hwb(...values);
 }
 function oklch2hwbvalues(token) {
     const values = oklch2srgbvalues(token);
@@ -153,8 +168,12 @@ function rgb2whiteness(r, g, b) {
     return Math.min(r, g, b);
 }
 function color2hwbvalues(token) {
+    const values = color2srgbvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return srgb2hwb(...color2srgbvalues(token));
+    return srgb2hwb(...values);
 }
 function srgb2hwb(r, g, b, a = null, fallback = 0) {
     r *= 100;

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

@@ -76,14 +76,14 @@ function color2labToken(token) {
 }
 function labToken(values) {
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[1]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[2]) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {
             typ: EnumToken.PercentageTokenType,
-            val: (values[3] * 100).toFixed()
+            val: values[3] * 100
         });
     }
     return {

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

@@ -77,12 +77,12 @@ function color2lchToken(token) {
 function lchToken(values) {
     values[2] = toPrecisionAngle(values[2]);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[1]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[2]) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
-        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, { typ: EnumToken.PercentageTokenType, val: (values[3] * 100).toFixed() });
+        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, { typ: EnumToken.PercentageTokenType, val: values[3] * 100 });
     }
     return {
         typ: EnumToken.ColorTokenType,

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

@@ -78,14 +78,14 @@ function color2oklabToken(token) {
 }
 function oklabToken(values) {
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[1]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[2]) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {
             typ: EnumToken.PercentageTokenType,
-            val: (values[3] * 100).toFixed()
+            val: values[3] * 100
         });
     }
     return {

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

@@ -76,14 +76,14 @@ function color2oklchToken(token) {
 function oklchToken(values) {
     values[2] = toPrecisionAngle(values[2]);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[1]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[2]) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {
             typ: EnumToken.PercentageTokenType,
-            val: (values[3] * 100).toFixed()
+            val: values[3] * 100
         });
     }
     return {

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

@@ -70,7 +70,7 @@ function getValue(t, converted, component) {
         }
         return {
             typ: EnumToken.NumberTokenType,
-            val: String(value)
+            val: value
         };
     }
     return t;

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

@@ -74,12 +74,12 @@ function color2RgbToken(token) {
 }
 function rgb2RgbToken(values) {
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: String(values[0]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[1]) },
-        { typ: EnumToken.NumberTokenType, val: String(values[2]) },
+        { typ: EnumToken.NumberTokenType, val: values[0] },
+        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
-        chi.push({ typ: EnumToken.PercentageTokenType, val: (values[3] * 100).toFixed() });
+        chi.push({ typ: EnumToken.PercentageTokenType, val: values[3] * 100 });
     }
     return {
         typ: EnumToken.ColorTokenType,

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

@@ -1,6 +1,6 @@
 import { ColorType, EnumToken } from '../../../ast/types.js';
 import '../../../ast/minify.js';
-import '../../../ast/walk.js';
+import { walkValues } from '../../../ast/walk.js';
 import '../../../parser/parse.js';
 import '../../../parser/tokenize.js';
 import '../../../parser/utils/config.js';
@@ -13,7 +13,7 @@ function getComponents(token) {
         const value = expandHexValue(token.kin == ColorType.LIT ? COLORS_NAMES[token.val.toLowerCase()] : token.val);
         // @ts-ignore
         return value.slice(1).match(/([a-fA-F0-9]{2})/g).map((t, index) => {
-            return { typ: EnumToken.Number, val: (index < 3 ? parseInt(t, 16) : parseInt(t, 16) / 255).toString() };
+            return { typ: EnumToken.Number, val: index < 3 ? parseInt(t, 16) : parseInt(t, 16) / 255 };
         });
     }
     const result = [];
@@ -23,7 +23,19 @@ function getComponents(token) {
         ].includes(child.typ)) {
             continue;
         }
-        if (child.typ == EnumToken.ColorTokenType && child.val.localeCompare('currentcolor', undefined, { sensitivity: 'base' }) == 0) {
+        if (child.typ == EnumToken.FunctionTokenType) {
+            if ('var' == child.val.toLowerCase()) {
+                return null;
+            }
+            else {
+                for (const { value } of walkValues(child.chi)) {
+                    if (value.typ == EnumToken.FunctionTokenType && 'var' === value.val.toLowerCase()) {
+                        return null;
+                    }
+                }
+            }
+        }
+        if (child.typ == EnumToken.ColorTokenType && 'currentcolor' === child.val.toLowerCase()) {
             return null;
         }
         result.push(child);

package/dist/lib/syntax/color/utils/distance.js

@@ -9,13 +9,27 @@ import '../../../parser/utils/config.js';
 import './constants.js';
 import '../../../renderer/sourcemap/lib/encode.js';
 
+/**
+ * Calculate the distance between two okLab colors.
+ * @param okLab1
+ * @param okLab2
+ *
+ * @private
+ */
 function okLabDistance(okLab1, okLab2) {
     return Math.sqrt(Math.pow(okLab1[0] - okLab2[0], 2) + Math.pow(okLab1[1] - okLab2[1], 2) + Math.pow(okLab1[2] - okLab2[2], 2));
 }
+/**
+ * Check if two colors are close in okLab space.
+ * @param color1
+ * @param color2
+ * @param threshold
+ *
+ * @private
+ */
 function isOkLabClose(color1, color2, threshold = .01) {
     color1 = convertColor(color1, ColorType.OKLAB);
     color2 = convertColor(color2, ColorType.OKLAB);
-    // console.error(JSON.stringify({color1, color2}, null, 1));
     if (color1 == null || color2 == null) {
         return false;
     }