@tbela99/css-parser 1.3.1 → 1.3.3

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

@@ -1,5 +1,5 @@
 import { hwb2hsv } from './hsv.js';
-import { color2srgbvalues, toPrecisionAngle, getNumber } from './color.js';
+import { color2srgbvalues, toPrecisionAngle, toPrecisionValue, getNumber } from './color.js';
 import { lch2rgbvalues, lab2rgbvalues, cmyk2rgbvalues } from './rgb.js';
 import './utils/constants.js';
 import { getComponents } from './utils/components.js';
@@ -76,12 +76,15 @@ function color2HslToken(token) {
 function hslToken(values) {
     values[0] = toPrecisionAngle(values[0] * 360);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: values[0] },
-        { typ: EnumToken.PercentageTokenType, val: values[1] * 100 },
-        { typ: EnumToken.PercentageTokenType, val: values[2] * 100 },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[0]) },
+        { typ: EnumToken.PercentageTokenType, val: toPrecisionValue(values[1]) * 100 },
+        { typ: EnumToken.PercentageTokenType, val: toPrecisionValue(values[2]) * 100 },
     ];
     if (values.length == 4 && values[3] != 1) {
-        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, { typ: EnumToken.PercentageTokenType, val: values[3] * 100 });
+        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {
+            typ: EnumToken.PercentageTokenType,
+            val: values[3] * 100
+        });
     }
     return {
         typ: EnumToken.ColorTokenType,
@@ -147,12 +150,20 @@ function hwb2hslvalues(token) {
     return hsv2hsl(...hwb2hsv(...Object.values(hslvalues(token))));
 }
 function lab2hslvalues(token) {
+    const values = lab2rgbvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return rgbvalues2hslvalues(...lab2rgbvalues(token));
+    return rgbvalues2hslvalues(...values);
 }
 function lch2hslvalues(token) {
+    const values = lch2rgbvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return rgbvalues2hslvalues(...lch2rgbvalues(token));
+    return rgbvalues2hslvalues(...values);
 }
 function oklab2hslvalues(token) {
     const t = oklab2srgbvalues(token);

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

@@ -1,7 +1,7 @@
 import { hsl2hsv } from './hsv.js';
 import './utils/constants.js';
 import { getComponents } from './utils/components.js';
-import { color2srgbvalues, toPrecisionAngle, getAngle, getNumber } from './color.js';
+import { color2srgbvalues, toPrecisionAngle, toPrecisionValue, getAngle, getNumber } from './color.js';
 import { cmyk2srgbvalues, lch2srgbvalues, lab2srgbvalues, oklch2srgbvalues, oklab2srgbvalues } from './srgb.js';
 import { EnumToken, ColorType } from '../../ast/types.js';
 import '../../ast/minify.js';
@@ -71,8 +71,8 @@ function hwbToken(values) {
     values[0] = toPrecisionAngle(values[0] * 360);
     const chi = [
         { typ: EnumToken.NumberTokenType, val: values[0] },
-        { typ: EnumToken.PercentageTokenType, val: values[1] * 100 },
-        { typ: EnumToken.PercentageTokenType, val: values[2] * 100 },
+        { typ: EnumToken.PercentageTokenType, val: toPrecisionValue(values[1]) * 100 },
+        { typ: EnumToken.PercentageTokenType, val: toPrecisionValue(values[2]) * 100 },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {

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

@@ -1,6 +1,6 @@
 import { e, k, D50 } from './utils/constants.js';
 import { getComponents } from './utils/components.js';
-import { color2srgbvalues, getNumber } from './color.js';
+import { color2srgbvalues, toPrecisionValue, getNumber } from './color.js';
 import { getOKLABComponents, OKLab_to_XYZ } from './oklab.js';
 import { EnumToken, ColorType } from '../../ast/types.js';
 import '../../ast/minify.js';
@@ -76,9 +76,9 @@ function color2labToken(token) {
 }
 function labToken(values) {
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: values[0] },
-        { typ: EnumToken.NumberTokenType, val: values[1] },
-        { typ: EnumToken.NumberTokenType, val: values[2] },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[0]) },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[1]) },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[2]) },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {

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

@@ -1,6 +1,6 @@
 import './utils/constants.js';
 import { getComponents } from './utils/components.js';
-import { color2srgbvalues, toPrecisionAngle, getNumber, getAngle } from './color.js';
+import { color2srgbvalues, toPrecisionAngle, toPrecisionValue, getNumber, getAngle } from './color.js';
 import { cmyk2srgbvalues } from './srgb.js';
 import { EnumToken, ColorType } from '../../ast/types.js';
 import '../../ast/minify.js';
@@ -77,12 +77,15 @@ function color2lchToken(token) {
 function lchToken(values) {
     values[2] = toPrecisionAngle(values[2]);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: values[0] },
-        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[0]) },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(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 });
+        chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {
+            typ: EnumToken.PercentageTokenType,
+            val: values[3] * 100
+        });
     }
     return {
         typ: EnumToken.ColorTokenType,

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

@@ -1,7 +1,7 @@
 import { multiplyMatrices } from './utils/matrix.js';
 import './utils/constants.js';
 import { getComponents } from './utils/components.js';
-import { color2srgbvalues, getNumber } from './color.js';
+import { color2srgbvalues, toPrecisionValue, getNumber } from './color.js';
 import { srgb2lsrgbvalues, lch2srgbvalues, lab2srgbvalues, cmyk2srgbvalues, hwb2srgbvalues, hsl2srgb, rgb2srgb, hex2srgbvalues, lsrgb2srgbvalues } from './srgb.js';
 import { EnumToken, ColorType } from '../../ast/types.js';
 import '../../ast/minify.js';
@@ -78,9 +78,9 @@ function color2oklabToken(token) {
 }
 function oklabToken(values) {
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: values[0] },
-        { typ: EnumToken.NumberTokenType, val: values[1] },
-        { typ: EnumToken.NumberTokenType, val: values[2] },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[0]) },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[1]) },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[2]) },
     ];
     if (values.length == 4) {
         chi.push({ typ: EnumToken.LiteralTokenType, val: '/' }, {

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

@@ -1,6 +1,6 @@
 import './utils/constants.js';
 import { getComponents } from './utils/components.js';
-import { color2srgbvalues, toPrecisionAngle, getNumber, getAngle } from './color.js';
+import { color2srgbvalues, toPrecisionAngle, toPrecisionValue, getNumber, getAngle } from './color.js';
 import { srgb2oklab, lch2oklabvalues, getOKLABComponents, lab2oklabvalues, hwb2oklabvalues, hsl2oklabvalues, rgb2oklabvalues, hex2oklabvalues } from './oklab.js';
 import { EnumToken, ColorType } from '../../ast/types.js';
 import '../../ast/minify.js';
@@ -76,8 +76,8 @@ function color2oklchToken(token) {
 function oklchToken(values) {
     values[2] = toPrecisionAngle(values[2]);
     const chi = [
-        { typ: EnumToken.NumberTokenType, val: values[0] },
-        { typ: EnumToken.NumberTokenType, val: values[1] },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[0]) },
+        { typ: EnumToken.NumberTokenType, val: toPrecisionValue(values[1]) },
         { typ: EnumToken.NumberTokenType, val: values[2] },
     ];
     if (values.length == 4) {
@@ -119,16 +119,28 @@ function cmyk2oklchvalues(token) {
     return values == null ? null : srgb2oklch(...values);
 }
 function lab2oklchvalues(token) {
+    const values = lab2oklabvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return labvalues2lchvalues(...lab2oklabvalues(token));
+    return labvalues2lchvalues(...values);
 }
 function lch2oklchvalues(token) {
+    const values = lch2oklabvalues(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return labvalues2lchvalues(...lch2oklabvalues(token));
+    return labvalues2lchvalues(...values);
 }
 function oklab2oklchvalues(token) {
+    const values = getOKLABComponents(token);
+    if (values == null) {
+        return null;
+    }
     // @ts-ignore
-    return labvalues2lchvalues(...getOKLABComponents(token));
+    return labvalues2lchvalues(...values);
 }
 function srgb2oklch(r, g, blue, alpha) {
     // @ts-ignore

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

@@ -18,7 +18,7 @@ function parseRelativeColor(relativeKeys, original, rExp, gExp, bExp, aExp) {
     let keys = {};
     let values = {};
     // colorFuncColorSpace x,y,z or r,g,b
-    const names = relativeKeys.startsWith('xyz') ? 'xyz' : relativeKeys.slice(-3);
+    const names = relativeKeys.startsWith('xyz') ? 'xyz' : ['srgb', 'srgb-linear', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec2020', 'rgb'].includes(relativeKeys.toLowerCase()) ? 'rgb' : relativeKeys.slice(-3);
     const converted = convertColor(original, ColorType[relativeKeys.toUpperCase().replaceAll('-', '_')]);
     if (converted == null) {
         return null;
@@ -32,13 +32,13 @@ function parseRelativeColor(relativeKeys, original, rExp, gExp, bExp, aExp) {
         // @ts-ignore
         alpha: alpha == null ? {
             typ: EnumToken.NumberTokenType,
-            val: '1'
+            val: 1
         } : (alpha.typ == EnumToken.IdenTokenType && alpha.val == 'none') ? {
             typ: EnumToken.NumberTokenType,
-            val: '0'
+            val: 0
         } : (alpha.typ == EnumToken.PercentageTokenType ? {
             typ: EnumToken.NumberTokenType,
-            val: String(getNumber(alpha))
+            val: getNumber(alpha)
         } : alpha)
     };
     keys = {
@@ -48,19 +48,15 @@ function parseRelativeColor(relativeKeys, original, rExp, gExp, bExp, aExp) {
         // @ts-ignore
         alpha: getValue(aExp == null ? {
             typ: EnumToken.NumberTokenType,
-            val: '1'
+            val: 1
         } : (aExp.typ == EnumToken.IdenTokenType && aExp.val == 'none') ? {
             typ: EnumToken.NumberTokenType,
-            val: '0'
+            val: 0
         } : aExp)
     };
     return computeComponentValue(keys, converted, values);
 }
 function getValue(t, converted, component) {
-    // if (t == null) {
-    //
-    //     return t;
-    // }
     if (t.typ == EnumToken.PercentageTokenType) {
         let value = getNumber(t);
         let colorSpace = ColorType[converted.kin].toLowerCase().replaceAll('-', '_');
@@ -90,55 +86,13 @@ function computeComponentValue(expr, converted, values) {
         }
     }
     for (const [key, exp] of Object.entries(expr)) {
-        /*
-        if (exp == null) {
-
-            if (key in values) {
-
-                if (typeof values[<RelativeColorTypes>key] == 'number') {
-
-                    expr[<RelativeColorTypes>key] = {
-                        typ: EnumToken.NumberTokenType,
-                        val: reduceNumber(<number>values[<RelativeColorTypes>key])
-                    };
-                } else {
-
-                    expr[<RelativeColorTypes>key] = <Token>values[<RelativeColorTypes>key];
-                }
-            }
-
-        } else
-            */
         if ([EnumToken.NumberTokenType, EnumToken.PercentageTokenType, EnumToken.AngleTokenType, EnumToken.LengthTokenType].includes(exp.typ)) ;
         else if (exp.typ == EnumToken.IdenTokenType && exp.val in values) {
-            // if (typeof values[<RelativeColorTypes>exp.val] == 'number') {
-            //
-            //     expr[<RelativeColorTypes>key] = {
-            //         typ: EnumToken.NumberTokenType,
-            //         val: reduceNumber(<number>values[<RelativeColorTypes>exp.val])
-            //     };
-            // } else {
             expr[key] = values[exp.val];
-            // }
         }
         else if (exp.typ == EnumToken.FunctionTokenType && mathFuncs.includes(exp.val)) {
             for (let { value, parent } of walkValues(exp.chi, exp)) {
-                // if (parent == null) {
-                //
-                //     parent = exp;
-                // }
-                /*
-                if (value.typ == EnumToken.PercentageTokenType) {
-
-                    replaceValue(parent as BinaryExpressionToken | FunctionToken | ParensToken, value, getValue(value, converted, <RelativeColorTypes>key));
-                } else
-                    */
                 if (value.typ == EnumToken.IdenTokenType) {
-                    // @ts-ignore
-                    // if (!(value.val in values || typeof Math[(value as IdentToken).val.toUpperCase()] == 'number')) {
-                    //
-                    //     return null;
-                    // }
                     // @ts-ignore
                     replaceValue(parent, value, values[value.val] ?? {
                         typ: EnumToken.NumberTokenType,
@@ -152,10 +106,6 @@ function computeComponentValue(expr, converted, values) {
             if (result.length == 1 && result[0].typ != EnumToken.BinaryExpressionTokenType) {
                 expr[key] = result[0];
             }
-            // else {
-            //
-            //     return null;
-            // }
         }
     }
     return expr;
@@ -166,13 +116,16 @@ function replaceValue(parent, value, newValue) {
             if (pr.typ == EnumToken.BinaryExpressionTokenType) {
                 if (pr.l == val) {
                     pr.l = newValue;
+                    return;
                 }
                 else {
                     pr.r = newValue;
+                    return;
                 }
             }
             else {
                 pr.chi.splice(pr.chi.indexOf(val), 1, newValue);
+                return;
             }
         }
     }

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

@@ -235,7 +235,7 @@ function lab2srgbvalues(token) {
         return null;
     }
     const rgb = Lab_to_sRGB(l, a, b);
-    if (alpha != null && alpha != 1) {
+    if (alpha != null && alpha < 1) {
         rgb.push(alpha);
     }
     return rgb;

package/dist/lib/validation/config.json.js

@@ -1619,6 +1619,9 @@ var declarations = {
 	"text-anchor": {
 		syntax: "start | middle | end"
 	},
+	"text-autospace": {
+		syntax: "normal | <autospace> | auto"
+	},
 	"text-box": {
 		syntax: "normal | <'text-box-trim'> || <'text-box-edge'>"
 	},
@@ -4186,19 +4189,8 @@ var atRules = {
 			}
 		}
 	},
-	charset: {
-		syntax: "<string>"
-	},
-	container: {
-		syntax: "[ <container-name> ]? <container-condition>"
-	},
-	nest: {
+	"@nest": {
 		syntax: "<complex-selector-list>"
-	},
-	scope: {
-		syntax: "[ ( <scope-start> ) ]? [ to ( <scope-end> ) ]?"
-	},
-	"position-try": {
 	}
 };
 var config = {

package/dist/node.js

@@ -21,31 +21,40 @@ import './lib/validation/syntax.js';
 import { resolve, matchUrl, dirname } from './lib/fs/resolve.js';
 import { Readable } from 'node:stream';
 import { createReadStream } from 'node:fs';
+import { lstat } from 'node:fs/promises';
 export { FeatureWalkMode } from './lib/ast/features/type.js';
 
-/**
- * node module entry point
- * @module node
- */
 /**
  * load file or url as stream
  * @param url
  * @param currentFile
+ * @throws Error file not found
  *
  * @private
  */
-async function getStream(url, currentFile = '.') {
+async function load(url, currentFile = '.') {
     const resolved = resolve(url, currentFile);
     // @ts-ignore
-    return matchUrl.test(resolved.absolute) ? fetch(resolved.absolute).then((response) => {
-        if (!response.ok) {
-            throw new Error(`${response.status} ${response.statusText} ${response.url}`);
+    if (matchUrl.test(resolved.absolute)) {
+        return fetch(resolved.absolute).then((response) => {
+            if (!response.ok) {
+                throw new Error(`${response.status} ${response.statusText} ${response.url}`);
+            }
+            return response.body;
+        });
+    }
+    try {
+        const stats = await lstat(resolved.absolute);
+        if (stats.isFile()) {
+            return Readable.toWeb(createReadStream(resolved.absolute));
         }
-        return response.body;
-    }) : Readable.toWeb(createReadStream(resolved.absolute));
+    }
+    catch (error) {
+    }
+    throw new Error(`File not found: '${resolved.absolute || url}'`);
 }
 /**
- * render ast tree
+ * render the ast tree
  * @param data
  * @param options
  *
@@ -55,23 +64,33 @@ async function getStream(url, currentFile = '.') {
  *
  *  import {render, ColorType} from '@tbela99/css-parser';
  *
- *  // remote file
- * let result = render(ast);
- * console.log(result.code);
+ *  const css = 'body { color: color(from hsl(0 100% 50%) xyz x y z); }';
+ *  const parseResult = await parse(css);
  *
- * // local file
- * result = await parseFile(ast, {beatify: true, convertColor: ColorType.SRGB});
+ * let renderResult = render(parseResult.ast);
  * console.log(result.code);
+ *
+ * // body{color:red}
+ *
+ *
+ * renderResult = render(parseResult.ast, {beautify: true, convertColor: ColorType.SRGB});
+ * console.log(renderResult.code);
+ *
+ * // body {
+ * //  color: color(srgb 1 0 0)
+ * // }
  * ```
  */
 function render(data, options = {}) {
-    return doRender(data, Object.assign(options, { getStream, resolve, dirname, cwd: options.cwd ?? process.cwd() }));
+    return doRender(data, Object.assign(options, { resolve, dirname, cwd: options.cwd ?? process.cwd() }));
 }
 /**
  * parse css file
  * @param file url or path
  * @param options
  *
+ * @throws Error file not found
+ *
  * Example:
  *
  * ```ts
@@ -88,22 +107,22 @@ function render(data, options = {}) {
  * ```
  */
 async function parseFile(file, options = {}) {
-    return getStream(file).then(stream => parse(stream, { src: file, ...options }));
+    return load(file).then(stream => parse(stream, { src: file, ...options }));
 }
 /**
  * parse css
  * @param stream
- * @param opt
+ * @param options
  *
  * Example:
  *
  * ```ts
  *
- * import {transform} from '@tbela99/css-parser';
+ * import {parse} from '@tbela99/css-parser';
  *
  *  // css string
- *  let result = await transform(css);
- *  console.log(result.code);
+ *  let result = await parse(css);
+ *  console.log(result.ast);
  * ```
  *
  * Example using stream
@@ -116,36 +135,38 @@ async function parseFile(file, options = {}) {
  * // usage: node index.ts < styles.css or cat styles.css | node index.ts
  *
  *  const readableStream = Readable.toWeb(process.stdin);
- *  const result = await parse(readableStream, {beautify: true});
+ *  let result = await parse(readableStream, {beautify: true});
  *
  *  console.log(result.ast);
  * ```
  *
- * Example using fetch
+ * Example using fetch and readable stream
  *
  * ```ts
  *
  *  import {parse} from '@tbela99/css-parser';
  *
  *  const response = await fetch('https://docs.deno.com/styles.css');
- *  result = await parse(response.body, {beautify: true});
+ *  const result = await parse(response.body, {beautify: true});
  *
  *  console.log(result.ast);
  * ```
  */
-async function parse(stream, opt = {}) {
+async function parse(stream, options = {}) {
     return doParse(stream instanceof ReadableStream ? tokenizeStream(stream) : tokenize({
         stream,
         buffer: '',
         position: { ind: 0, lin: 1, col: 1 },
         currentPosition: { ind: -1, lin: 1, col: 0 }
-    }), Object.assign(opt, { getStream, resolve, dirname, cwd: opt.cwd ?? process.cwd() }));
+    }), Object.assign(options, { load, resolve, dirname, cwd: options.cwd ?? process.cwd() }));
 }
 /**
  * transform css file
  * @param file url or path
  * @param options
  *
+ * @throws Error file not found
+ *
  * Example:
  *
  * ```ts
@@ -162,7 +183,7 @@ async function parse(stream, opt = {}) {
  * ```
  */
 async function transformFile(file, options = {}) {
-    return getStream(file).then(stream => transform(stream, { src: file, ...options }));
+    return load(file).then(stream => transform(stream, { src: file, ...options }));
 }
 /**
  * transform css
@@ -176,7 +197,7 @@ async function transformFile(file, options = {}) {
  * import {transform} from '@tbela99/css-parser';
  *
  *  // css string
- *  let result = await transform(css);
+ *  const result = await transform(css);
  *  console.log(result.code);
  * ```
  *
@@ -211,7 +232,8 @@ async function transform(css, options = {}) {
     options = { minify: true, removeEmpty: true, removeCharset: true, ...options };
     const startTime = performance.now();
     return parse(css, options).then((parseResult) => {
-        const rendered = render(parseResult.ast, options);
+        // ast already expanded by parse
+        const rendered = render(parseResult.ast, { ...options, expandNestingRules: false });
         return {
             ...parseResult,
             ...rendered,
@@ -226,4 +248,4 @@ async function transform(css, options = {}) {
     });
 }
 
-export { dirname, getStream, parse, parseFile, render, resolve, transform, transformFile };
+export { dirname, load, parse, parseFile, render, resolve, transform, transformFile };