@tbela99/css-parser 1.1.1 → 1.3.0

package/dist/index.d.ts

@@ -142,6 +142,119 @@ declare enum EnumToken {
     TimingFunction = 17,
     TimelineFunction = 16
 }
+/**
+ * color types enum
+ */
+declare enum ColorType {
+    /**
+     * system colors
+     */
+    SYS = 0,
+    /**
+     * deprecated system colors
+     */
+    DPSYS = 1,
+    /**
+     * colors as literals
+     */
+    LIT = 2,
+    /**
+     * colors as hex values
+     */
+    HEX = 3,
+    /**
+     * colors as rgb values
+     */
+    RGBA = 4,
+    /**
+     * colors as hsl values
+     */
+    HSLA = 5,
+    /**
+     * colors as hwb values
+     */
+    HWB = 6,
+    /**
+     * colors as cmyk values
+     */
+    CMYK = 7,
+    /**
+     * colors as oklab values
+     * */
+    OKLAB = 8,
+    /**
+     * colors as oklch values
+     * */
+    OKLCH = 9,
+    /**
+     * colors as lab values
+     */
+    LAB = 10,
+    /**
+     * colors as lch values
+     */
+    LCH = 11,
+    /**
+     * colors using color() function
+     */
+    COLOR = 12,
+    /**
+     * color using srgb values
+     */
+    SRGB = 13,
+    /**
+     * color using prophoto-rgb values
+     */
+    PROPHOTO_RGB = 14,
+    /**
+     * color using a98-rgb values
+     */
+    A98_RGB = 15,
+    /**
+     * color using rec2020 values
+     */
+    REC2020 = 16,
+    /**
+     * color using display-p3 values
+     */
+    DISPLAY_P3 = 17,
+    /**
+     * color using srgb-linear values
+     */
+    SRGB_LINEAR = 18,
+    /**
+     * color using xyz-d50 values
+     */
+    XYZ_D50 = 19,
+    /**
+     * color using xyz-d65 values
+     */
+    XYZ_D65 = 20,
+    /**
+     * light-dark() color function
+     */
+    LIGHT_DARK = 21,
+    /**
+     * color-mix() color function
+     */
+    COLOR_MIX = 22,
+    /**
+     * alias for rgba
+     */
+    RGB = 4,
+    /**
+     * alias for hsl
+     */
+    HSL = 5,
+    /**
+     * alias for xyz-d65
+     */
+    XYZ = 20,
+    /**
+     * alias for cmyk
+     */
+    DEVICE_CMYK = 7
+}
 
 /**
  * minify ast
@@ -203,34 +316,19 @@ declare function renderToken(token: Token, options?: RenderOptions, cache?: {
     [key: string]: any;
 }, reducer?: (acc: string, curr: Token) => string, errors?: ErrorDescription[]): string;
 
-declare enum ColorKind {
-    SYS = 0,
-    DPSYS = 1,
-    LIT = 2,
-    HEX = 3,
-    RGB = 4,
-    RGBA = 5,
-    HSL = 6,
-    HSLA = 7,
-    HWB = 8,
-    DEVICE_CMYK = 9,
-    OKLAB = 10,
-    OKLCH = 11,
-    LAB = 12,
-    LCH = 13,
-    COLOR = 14,
-    SRGB = 15,
-    PROPHOTO_RGB = 16,
-    A98_RGB = 17,
-    REC2020 = 18,
-    DISPLAY_P3 = 19,
-    SRGB_LINEAR = 20,
-    XYZ = 21,
-    XYZ_D50 = 22,
-    XYZ_D65 = 23,
-    LIGHT_DARK = 24,
-    COLOR_MIX = 25
-}
+/**
+ * Calculate the distance between two okLab colors.
+ * @param okLab1
+ * @param okLab2
+ */
+declare function okLabDistance(okLab1: [number, number, number], okLab2: [number, number, number]): number;
+/**
+ * Check if two colors are close.
+ * @param color1
+ * @param color2
+ * @param threshold
+ */
+declare function isOkLabClose(color1: ColorToken, color2: ColorToken, threshold?: number): boolean;
 
 /**
  * parse css string
@@ -312,7 +410,7 @@ export declare interface NestingSelectorToken extends BaseToken {
 export declare interface NumberToken extends BaseToken {
 
     typ: EnumToken.NumberTokenType,
-    val: string | FractionToken;
+    val: number | FractionToken;
 }
 
 export declare interface AtRuleToken extends BaseToken {
@@ -325,13 +423,13 @@ export declare interface AtRuleToken extends BaseToken {
 export declare interface PercentageToken extends BaseToken {
 
     typ: EnumToken.PercentageTokenType,
-    val: string | FractionToken;
+    val: number | FractionToken;
 }
 
 export declare interface FlexToken extends BaseToken {
 
     typ: EnumToken.FlexTokenType,
-    val: string | FractionToken;
+    val: number | FractionToken;
 }
 
 export declare interface FunctionToken extends BaseToken {
@@ -397,42 +495,42 @@ export declare interface UnclosedStringToken extends BaseToken {
 export declare interface DimensionToken extends BaseToken {
 
     typ: EnumToken.DimensionTokenType;
-    val: string | FractionToken;
+    val: number | FractionToken;
     unit: string;
 }
 
 export declare interface LengthToken extends BaseToken {
 
     typ: EnumToken.LengthTokenType;
-    val: string | FractionToken;
+    val: number | FractionToken;
     unit: string;
 }
 
 export declare interface AngleToken extends BaseToken {
 
     typ: EnumToken.AngleTokenType;
-    val: string | FractionToken;
+    val: number | FractionToken;
     unit: string;
 }
 
 export declare interface TimeToken extends BaseToken {
 
     typ: EnumToken.TimeTokenType;
-    val: string | FractionToken;
+    val: number | FractionToken;
     unit: 'ms' | 's';
 }
 
 export declare interface FrequencyToken extends BaseToken {
 
     typ: EnumToken.FrequencyTokenType;
-    val: string | FractionToken;
+    val: number | FractionToken;
     unit: 'Hz' | 'Khz';
 }
 
 export declare interface ResolutionToken extends BaseToken {
 
     typ: EnumToken.ResolutionTokenType;
-    val: string | FractionToken;
+    val: number | FractionToken;
     unit: 'dpi' | 'dpcm' | 'dppx' | 'x';
 }
 
@@ -625,7 +723,7 @@ export declare interface ColorToken extends BaseToken {
 
     typ: EnumToken.ColorTokenType;
     val: string;
-    kin: ColorKind;
+    kin: ColorType;
     chi?: Token[];
     /* calculated */
     cal?: 'rel' | 'mix';
@@ -938,6 +1036,13 @@ interface ValidationToken {
     };
 }
 
+/**
+ * Converts a color to another color space
+ * @param token
+ * @param to
+ */
+declare function convertColor(token: ColorToken, to: ColorType): ColorToken | null;
+
 export declare interface Position {
 
     ind: number;
@@ -1149,7 +1254,8 @@ export declare interface ErrorDescription {
     // drop rule or declaration | fix rule or declaration
     action: 'drop' | 'ignore';
     message: string;
-    syntax?: string;
+    syntax?: string | null;
+    node?: Token | AstNode | null;
     location?: Location;
     error?: Error;
     rawTokens?: TokenizeResult[];
@@ -1160,6 +1266,7 @@ interface ValidationOptions {
     validation?: boolean | ValidationLevel;
     lenient?: boolean;
     visited?: WeakMap<Token, Map<string, Set<ValidationToken>>>;
+    isOptional?:boolean | null;
     isRepeatable?:boolean | null;
     isList?:boolean | null;
     occurence?:boolean | null;
@@ -1245,7 +1352,7 @@ export declare interface RenderOptions {
     indent?: string;
     newLine?: string;
     removeComments?: boolean;
-    convertColor?: boolean;
+    convertColor?: boolean | ColorType;
     withParents?: boolean;
     output?: string;
     cwd?: string;
@@ -1355,4 +1462,4 @@ declare function parse(iterator: string, opt?: ParserOptions): Promise<ParseResu
  */
 declare function transform(css: string, options?: TransformOptions): Promise<TransformResult>;
 
-export { EnumToken, ValidationLevel, dirname, expand, load, minify, parse, parseString, parseTokens, render, renderToken, resolve, transform, walk, walkValues };
+export { ColorType, EnumToken, ValidationLevel, convertColor, dirname, expand, isOkLabClose, load, minify, okLabDistance, parse, parseString, parseTokens, render, renderToken, resolve, transform, walk, walkValues };

package/dist/lib/ast/expand.js

@@ -5,7 +5,7 @@ import '../parser/utils/config.js';
 import { EnumToken } from './types.js';
 import { walkValues } from './walk.js';
 import { renderToken } from '../renderer/render.js';
-import '../renderer/color/utils/constants.js';
+import '../syntax/color/utils/constants.js';
 
 /**
  * expand nested css ast
@@ -13,18 +13,22 @@ import '../renderer/color/utils/constants.js';
  */
 function expand(ast) {
     //
-    if (![EnumToken.RuleNodeType, EnumToken.StyleSheetNodeType, EnumToken.AtRuleNodeType].includes(ast.typ)) {
-        return ast;
-    }
-    if (EnumToken.RuleNodeType == ast.typ) {
-        return {
-            typ: EnumToken.StyleSheetNodeType,
-            chi: expandRule(ast)
-        };
-    }
-    if (!('chi' in ast)) {
-        return ast;
-    }
+    // if (![EnumToken.RuleNodeType, EnumToken.StyleSheetNodeType, EnumToken.AtRuleNodeType].includes(ast.typ)) {
+    //
+    //     return ast;
+    // }
+    // if (EnumToken.RuleNodeType == ast.typ) {
+    //
+    //     return <AstRuleStyleSheet>{
+    //         typ: EnumToken.StyleSheetNodeType,
+    //         chi: expandRule(<AstRule>ast)
+    //     }
+    // }
+    //
+    // if (!('chi' in ast)) {
+    //
+    //     return ast;
+    // }
     const result = { ...ast, chi: [] };
     // @ts-ignore
     for (let i = 0; i < ast.chi.length; i++) {
@@ -48,10 +52,11 @@ function expand(ast) {
             // @ts-ignore
             result.chi.push({ ...(hasRule ? expand(node) : node) });
         }
-        else {
-            // @ts-ignore
-            result.chi.push(node);
-        }
+        // else {
+        //
+        //     // @ts-ignore
+        //     result.chi.push(node);
+        // }
     }
     return result;
 }
@@ -65,24 +70,26 @@ function expandRule(node) {
                 const rule = ast.chi[i];
                 if (!rule.sel.includes('&')) {
                     const selRule = splitRule(rule.sel);
-                    if (selRule.length > 1) {
-                        const r = ':is(' + selRule.map(a => a.join('')).join(',') + ')';
-                        rule.sel = splitRule(ast.sel).reduce((a, b) => a.concat([b.join('') + r]), []).join(',');
-                    }
-                    else {
-                        // selRule = splitRule(selRule.reduce((acc, curr) => acc + (acc.length > 0 ? ',' : '') + curr.join(''), ''));
-                        const arSelf = splitRule(ast.sel).filter((r) => r.every((t) => t != ':before' && t != ':after' && !t.startsWith('::'))).reduce((acc, curr) => acc.concat([curr.join('')]), []).join(',');
-                        if (arSelf.length == 0) {
-                            ast.chi.splice(i--, 1);
-                            continue;
-                        }
-                        //
-                        selRule.forEach(arr => combinators.includes(arr[0].charAt(0)) ? arr.unshift(arSelf) : arr.unshift(arSelf, ' '));
-                        rule.sel = selRule.reduce((acc, curr) => {
-                            acc.push(curr.join(''));
-                            return acc;
-                        }, []).join(',');
+                    // if (selRule.length > 1) {
+                    //
+                    //     const r: string = ':is(' + selRule.map(a => a.join('')).join(',') + ')';
+                    //     rule.sel = splitRule(ast.sel).reduce((a: string[], b: string[]): string[] => a.concat([b.join('') + r]), <string[]>[]).join(',');
+                    //
+                    // }
+                    // else {
+                    // selRule = splitRule(selRule.reduce((acc, curr) => acc + (acc.length > 0 ? ',' : '') + curr.join(''), ''));
+                    const arSelf = splitRule(ast.sel).filter((r) => r.every((t) => t != ':before' && t != ':after' && !t.startsWith('::'))).reduce((acc, curr) => acc.concat([curr.join('')]), []).join(',');
+                    if (arSelf.length == 0) {
+                        ast.chi.splice(i--, 1);
+                        continue;
                     }
+                    //
+                    selRule.forEach(arr => combinators.includes(arr[0].charAt(0)) ? arr.unshift(arSelf) : arr.unshift(arSelf, ' '));
+                    rule.sel = selRule.reduce((acc, curr) => {
+                        acc.push(curr.join(''));
+                        return acc;
+                    }, []).join(',');
+                    // }
                 }
                 else {
                     let childSelectorCompound = [];
@@ -108,9 +115,10 @@ function expandRule(node) {
                                         if (s == '&' || parentSelector) {
                                             withCompound.push(s);
                                         }
-                                        else {
-                                            withoutCompound.push(s.slice(1));
-                                        }
+                                        // else {
+                                        //
+                                        //     withoutCompound.push(s.slice(1));
+                                        // }
                                     }
                                 }
                                 else {
@@ -121,9 +129,10 @@ function expandRule(node) {
                                 withCompound.push(s);
                             }
                         }
-                        else {
-                            withoutCompound.push(s);
-                        }
+                        // else {
+                        //
+                        //     withoutCompound.push(s);
+                        // }
                     }
                     const selectors = [];
                     const selector = rules.length > 1 ? ':is(' + rules.map(a => a.join('')).join(',') + ')' : rules[0].join('');
@@ -155,11 +164,13 @@ function expandRule(node) {
                         if (withCompound.length == 1) {
                             selectors.push(replaceCompound(withCompound[0], selector));
                         }
-                        else {
-                            for (const w of withCompound) {
-                                selectors.push(replaceCompound(w, selector));
-                            }
-                        }
+                        // else {
+                        //
+                        //     for (const w of withCompound) {
+                        //
+                        //         selectors.push(replaceCompound(w, selector));
+                        //     }
+                        // }
                     }
                     rule.sel = selectors.reduce((acc, curr) => curr.length == 0 ? acc : acc + (acc.length > 0 ? ',' : '') + curr, '');
                 }
@@ -200,10 +211,11 @@ function expandRule(node) {
                             // @ts-ignore
                             astAtRule.chi.push(...expandRule(r));
                         }
-                        else {
-                            // @ts-ignore
-                            astAtRule.chi.push(r);
-                        }
+                        // else {
+                        //
+                        //     // @ts-ignore
+                        //     astAtRule.chi.push(r);
+                        // }
                     }
                 }
                 // @ts-ignore
@@ -230,21 +242,23 @@ function replaceCompound(input, replace) {
                     if (replacement == null) {
                         replacement = parseString(replace);
                     }
-                    if (tokens[1].typ == EnumToken.IdenTokenType) {
-                        t.value.val = replacement.length == 1 || (!replace.includes(' ') && replace.charAt(0).match(/[:.]/)) ? tokens[1].val + replace : replaceCompoundLiteral(tokens[1].val + '&', replace);
-                        tokens.splice(1, 1);
-                    }
-                    else {
-                        t.value.val = replaceCompoundLiteral(t.value.val, replace);
-                    }
+                    // if (tokens[1].typ == EnumToken.IdenTokenType) {
+                    //
+                    //
+                    //     (t.value as LiteralToken).val = (replacement as Token[]).length == 1 || (!replace.includes(' ') && replace.charAt(0).match(/[:.]/)) ? (tokens[1] as IdentToken).val + replace : replaceCompoundLiteral((tokens[1] as IdentToken).val + '&', replace);
+                    //     tokens.splice(1, 1);
+                    // } else {
+                    t.value.val = replaceCompoundLiteral(t.value.val, replace);
+                    // }
                     continue;
                 }
                 const rule = splitRule(replace);
                 t.value.val = rule.length > 1 ? ':is(' + replace + ')' : replace;
             }
-            else if (t.value.val.length > 1 && t.value.val.charAt(0) == '&') {
-                t.value.val = replaceCompoundLiteral(t.value.val, replace);
-            }
+            // else if ((t.value as LiteralToken).val.length > 1 && (t.value as LiteralToken).val.charAt(0) == '&') {
+            //
+            //     (t.value as LiteralToken).val = replaceCompoundLiteral((t.value as LiteralToken).val, replace);
+            // }
         }
     }
     return tokens.reduce((acc, curr) => acc + renderToken(curr), '');
@@ -257,9 +271,10 @@ function replaceCompoundLiteral(selector, replace) {
             tokens.push('&');
             tokens.push('');
         }
-        else {
-            tokens[tokens.length - 1] += selector.charAt(i);
-        }
+        // else {
+        //
+        //     tokens[tokens.length - 1] += selector.charAt(i);
+        // }
     }
     return tokens.sort((a, b) => {
         if (a == '&') {
@@ -267,9 +282,10 @@ function replaceCompoundLiteral(selector, replace) {
         }
         return b == '&' ? -1 : 0;
     }).reduce((acc, curr) => {
-        if (acc.length > 0 && curr == '&' && (replace.charAt(0) != '.' || replace.includes(' '))) {
-            return acc + ':is(' + replace + ')';
-        }
+        // if (acc.length > 0 && curr == '&' && (replace.charAt(0) != '.' || replace.includes(' '))) {
+        //
+        //     return acc + ':is(' + replace + ')';
+        // }
         return acc + (curr == '&' ? replace : curr);
     }, '');
 }

package/dist/lib/ast/features/calc.js

@@ -2,7 +2,7 @@ import { EnumToken } from '../types.js';
 import { walkValues, WalkerValueEvent, WalkerOptionEnum } from '../walk.js';
 import { evaluate } from '../math/expression.js';
 import { renderToken } from '../../renderer/render.js';
-import '../../renderer/color/utils/constants.js';
+import '../../syntax/color/utils/constants.js';
 import '../minify.js';
 import '../../parser/parse.js';
 import '../../parser/tokenize.js';
@@ -56,8 +56,6 @@ class ComputeCalcExpressionFeature {
                     const slice = (node.typ == EnumToken.FunctionTokenType ? node.chi : (node.typ == EnumToken.DeclarationNodeType ? node.val : node.chi))?.slice();
                     if (slice != null && node.typ == EnumToken.FunctionTokenType && mathFuncs.includes(node.val)) {
                         // @ts-ignore
-                        const cp = (node.typ == EnumToken.FunctionTokenType && mathFuncs.includes(node.val) && node.val != 'calc' ? [node] : (node.typ == EnumToken.DeclarationNodeType ? node.val : node.chi)).slice();
-                        const values = evaluate(cp);
                         const key = 'chi' in node ? 'chi' : 'val';
                         const str1 = renderToken({ ...node, [key]: slice });
                         const str2 = renderToken(node); // values.reduce((acc: string, curr: Token): string => acc + renderToken(curr), '');
@@ -65,10 +63,6 @@ class ComputeCalcExpressionFeature {
                             // @ts-ignore
                             node[key] = slice;
                         }
-                        else {
-                            // @ts-ignore
-                            node[key] = values;
-                        }
                         return WalkerOptionEnum.Ignore;
                     }
                     return null;
@@ -84,41 +78,25 @@ class ComputeCalcExpressionFeature {
                             // @ts-ignore
                             const children = parent.typ == EnumToken.DeclarationNodeType ? parent.val : parent.chi;
                             if (values.length == 1 && values[0].typ != EnumToken.BinaryExpressionTokenType) {
-                                if (parent.typ == EnumToken.BinaryExpressionTokenType) {
-                                    if (parent.l == value) {
-                                        parent.l = values[0];
-                                    }
-                                    else {
-                                        parent.r = values[0];
-                                    }
-                                }
-                                else {
-                                    for (let i = 0; i < children.length; i++) {
-                                        if (children[i] == value) {
-                                            // @ts-ignore
-                                            children.splice(i, 1, !(parent.typ == EnumToken.FunctionTokenType && parent.val == 'calc') && typeof values[0].val != 'string' ? {
-                                                typ: EnumToken.FunctionTokenType,
-                                                val: 'calc',
-                                                chi: values
-                                            } : values[0]);
-                                            break;
-                                        }
+                                for (let i = 0; i < children.length; i++) {
+                                    if (children[i] == value) {
+                                        children.splice(i, 1, !(parent.typ == EnumToken.FunctionTokenType && parent.val == 'calc') && (typeof values[0].val != 'number' && !(values[0].typ == EnumToken.FunctionTokenType && mathFuncs.includes(values[0].val))) ? {
+                                            typ: EnumToken.FunctionTokenType,
+                                            val: 'calc',
+                                            chi: values
+                                        } : values[0]);
+                                        break;
                                     }
                                 }
                             }
                             else {
                                 for (let i = 0; i < children.length; i++) {
                                     if (children[i] == value) {
-                                        if (parent.typ == EnumToken.FunctionTokenType && parent.val == 'calc') {
-                                            children.splice(i, 1, ...values);
-                                        }
-                                        else {
-                                            children.splice(i, 1, {
-                                                typ: EnumToken.FunctionTokenType,
-                                                val: 'calc',
-                                                chi: values
-                                            });
-                                        }
+                                        children.splice(i, 1, {
+                                            typ: EnumToken.FunctionTokenType,
+                                            val: 'calc',
+                                            chi: values
+                                        });
                                         break;
                                     }
                                 }

package/dist/lib/ast/features/inlinecssvariables.js

@@ -1,7 +1,7 @@
 import { EnumToken } from '../types.js';
 import { walkValues } from '../walk.js';
 import { renderToken } from '../../renderer/render.js';
-import '../../renderer/color/utils/constants.js';
+import '../../syntax/color/utils/constants.js';
 import { splitRule } from '../minify.js';
 import '../../parser/parse.js';
 import '../../parser/tokenize.js';
@@ -106,18 +106,6 @@ class InlineCssVariablesFeature {
                         replace(node, variableScope);
                     }
                 }
-                else {
-                    const info = variableScope.get(node.nam);
-                    info.globalScope = isRoot;
-                    if (!isRoot) {
-                        ++info.declarationCount;
-                    }
-                    if (info.replaceable) {
-                        info.replaceable = isRoot && info.declarationCount == 1;
-                    }
-                    info.parent.add(ast);
-                    info.node = node;
-                }
             }
             else {
                 replace(node, variableScope);
@@ -126,9 +114,10 @@ class InlineCssVariablesFeature {
     }
     cleanup(ast, options = {}, context) {
         const variableScope = context.variableScope;
-        if (variableScope == null) {
-            return;
-        }
+        // if (variableScope == null) {
+        //
+        //     return;
+        // }
         for (const info of variableScope.values()) {
             if (info.replaceable) {
                 let i;
@@ -140,7 +129,7 @@ class InlineCssVariablesFeature {
                             // @ts-ignore
                             parent.chi.splice(i, 1, {
                                 typ: EnumToken.CommentTokenType,
-                                val: `/* ${info.node.nam}: ${info.values.reduce((acc, curr) => acc + renderToken(curr), '')} */`
+                                val: `/* ${info.node.nam}: ${info.values.reduce((acc, curr) => acc + renderToken(curr, { convertColor: false }), '')} */`
                             });
                             break;
                         }