@tbela99/css-parser 1.3.0 → 1.3.2

package/dist/lib/parser/parse.js

@@ -6,9 +6,10 @@ import { expand } from '../ast/expand.js';
 import './utils/config.js';
 import { parseDeclarationNode } from './utils/declaration.js';
 import { renderToken } from '../renderer/render.js';
+import '../renderer/sourcemap/lib/encode.js';
 import { funcLike, timingFunc, timelineFunc, COLORS_NAMES, systemColors, deprecatedSystemColors, colorsFunc } from '../syntax/color/utils/constants.js';
 import { buildExpression } from '../ast/math/expression.js';
-import { tokenize } from './tokenize.js';
+import { tokenize, tokenizeStream } from './tokenize.js';
 import '../validation/config.js';
 import '../validation/parser/types.js';
 import '../validation/parser/parse.js';
@@ -40,10 +41,12 @@ function reject(reason) {
 }
 /**
  * parse css string
- * @param iterator
+ * @param iter
  * @param options
+ *
+ * @private
  */
-async function doParse(iterator, options = {}) {
+async function doParse(iter, options = {}) {
     if (options.signal != null) {
         options.signal.addEventListener('abort', reject);
     }
@@ -113,12 +116,13 @@ async function doParse(iterator, options = {}) {
             src: ''
         };
     }
-    const iter = tokenize(iterator);
     let item;
     let node;
     const rawTokens = [];
     const imports = [];
-    while (item = iter.next().value) {
+    // @ts-ignore ignore error
+    const isAsync = typeof iter[Symbol.asyncIterator] === 'function';
+    while (item = isAsync ? (await iter.next()).value : iter.next().value) {
         stats.bytesIn = item.bytesIn;
         rawTokens.push(item);
         if (item.hint != null && BadTokensTypes.includes(item.hint)) {
@@ -162,7 +166,7 @@ async function doParse(iterator, options = {}) {
                 let inBlock = 1;
                 tokens = [item];
                 do {
-                    item = iter.next().value;
+                    item = isAsync ? (await iter.next()).value : iter.next().value;
                     if (item == null) {
                         break;
                     }
@@ -224,8 +228,8 @@ async function doParse(iterator, options = {}) {
             }
         }
         if (context != null && context.typ == EnumToken.InvalidRuleTokenType) {
-            // @ts-ignore
-            const index = context.chi.findIndex((node) => node == context);
+            // @ts-ignore ignore error
+            const index = context.chi.findIndex((node) => node === context);
             if (index > -1) {
                 context.chi.splice(index, 1);
             }
@@ -236,13 +240,21 @@ async function doParse(iterator, options = {}) {
             const token = node.tokens[0];
             const url = token.typ == EnumToken.StringTokenType ? token.val.slice(1, -1) : token.val;
             try {
-                const root = await options.load(url, options.src).then((src) => {
-                    return doParse(src, Object.assign({}, options, {
+                const root = await options.getStream(url, options.src).then(async (stream) => {
+                    return doParse(tokenizeStream(stream), Object.assign({}, options, {
                         minify: false,
                         setParent: false,
                         src: options.resolve(url, options.src).absolute
-                    }));
+                    })); // )
                 });
+                // const root: ParseResult = await options.load!(url, <string>options.src).then((src: string) => {
+                //
+                //     return doParse(src, Object.assign({}, options, {
+                //         minify: false,
+                //         setParent: false,
+                //         src: options.resolve!(url, options.src as string).absolute
+                //     }))
+                // });
                 stats.importedBytesIn += root.stats.bytesIn;
                 stats.imports.push(root.stats);
                 node.parent.chi.splice(node.parent.chi.indexOf(node), 1, ...root.ast.chi);
@@ -251,7 +263,7 @@ async function doParse(iterator, options = {}) {
                 }
             }
             catch (error) {
-                // @ts-ignore
+                // @ts-ignore ignore error
                 errors.push({ action: 'ignore', message: 'doParse: ' + error.message, error });
             }
         }));
@@ -275,28 +287,33 @@ async function doParse(iterator, options = {}) {
             if (result.node.typ == EnumToken.DeclarationNodeType &&
                 (typeof options.visitor.Declaration == 'function' || options.visitor.Declaration?.[result.node.nam] != null)) {
                 const callable = typeof options.visitor.Declaration == 'function' ? options.visitor.Declaration : options.visitor.Declaration[result.node.nam];
-                const results = await callable(result.node);
+                const isAsync = Object.getPrototypeOf(callable).constructor.name == 'AsyncFunction';
+                const results = isAsync ? await callable(result.node) : callable(result.node);
                 if (results == null || (Array.isArray(results) && results.length == 0)) {
                     continue;
                 }
+                // @ts-ignore
                 result.parent.chi.splice(result.parent.chi.indexOf(result.node), 1, ...(Array.isArray(results) ? results : [results]));
             }
             else if (options.visitor.Rule != null && result.node.typ == EnumToken.RuleNodeType) {
-                const results = await options.visitor.Rule(result.node);
+                const isAsync = Object.getPrototypeOf(options.visitor.Rule).constructor.name == 'AsyncFunction';
+                const results = isAsync ? await options.visitor.Rule(result.node) : options.visitor.Rule(result.node);
                 if (results == null || (Array.isArray(results) && results.length == 0)) {
                     continue;
                 }
+                // @ts-ignore
                 result.parent.chi.splice(result.parent.chi.indexOf(result.node), 1, ...(Array.isArray(results) ? results : [results]));
             }
             else if (options.visitor.AtRule != null &&
                 result.node.typ == EnumToken.AtRuleNodeType &&
-                // @ts-ignore
                 (typeof options.visitor.AtRule == 'function' || options.visitor.AtRule?.[result.node.nam] != null)) {
                 const callable = typeof options.visitor.AtRule == 'function' ? options.visitor.AtRule : options.visitor.AtRule[result.node.nam];
-                const results = await callable(result.node);
+                const isAsync = Object.getPrototypeOf(callable).constructor.name == 'AsyncFunction';
+                const results = isAsync ? await callable(result.node) : callable(result.node);
                 if (results == null || (Array.isArray(results) && results.length == 0)) {
                     continue;
                 }
+                // @ts-ignore
                 result.parent.chi.splice(result.parent.chi.indexOf(result.node), 1, ...(Array.isArray(results) ? results : [results]));
             }
         }
@@ -407,7 +424,13 @@ function parseNode(results, context, options, errors, src, map, rawTokens) {
                             // @ts-ignore
                             ['charset', 'layer', 'import'].includes(context.chi[i].nam))) {
                             // @ts-ignore
-                            errors.push({ action: 'drop', message: 'invalid @import', location, rawTokens: [atRule, ...tokens] });
+                            errors.push({
+                                action: 'drop',
+                                message: 'invalid @import',
+                                location,
+                                // @ts-ignore
+                                rawTokens: [atRule, ...tokens]
+                            });
                             return null;
                         }
                     }
@@ -1004,6 +1027,27 @@ function parseAtRulePrelude(tokens, atRule) {
     }
     return tokens;
 }
+/**
+ * parse a string as an array of declaration nodes
+ * @param declaration
+ *
+ * Example:
+ * ````ts
+ *
+ * const declarations = await parseDeclarations('color: red; background: blue');
+ * console.log(declarations);
+ * ```
+ */
+async function parseDeclarations(declaration) {
+    return doParse(tokenize({
+        stream: `.x{${declaration}}`,
+        buffer: '',
+        position: { ind: 0, lin: 1, col: 1 },
+        currentPosition: { ind: -1, lin: 1, col: 0 }
+    }), { setParent: false, minify: false, validation: false }).then(result => {
+        return result.ast.chi[0].chi.filter(t => t.typ == EnumToken.DeclarationNodeType);
+    });
+}
 /**
  * parse selector
  * @param tokens
@@ -1105,12 +1149,33 @@ function parseSelector(tokens) {
     return tokens;
 }
 /**
- * parse css string
+ * parse css string and return an array of tokens
  * @param src
  * @param options
+ *
+ * @private
+ *
+ * Example:
+ *
+ * ```ts
+ *
+ * import {parseString} from '@tbela99/css-parser';
+ *
+ * let tokens = parseString('body { color: red; }');
+ * console.log(tokens);
+ *
+ *  tokens = parseString('#c322c980');
+ * console.log(tokens);
+ * ```
  */
 function parseString(src, options = { location: false }) {
-    return parseTokens([...tokenize(src)].reduce((acc, t) => {
+    const parseInfo = {
+        stream: src,
+        buffer: '',
+        position: { ind: 0, lin: 1, col: 1 },
+        currentPosition: { ind: -1, lin: 1, col: 0 }
+    };
+    return parseTokens([...tokenize(parseInfo)].reduce((acc, t) => {
         if (t.hint == EnumToken.EOFTokenType) {
             return acc;
         }
@@ -1122,6 +1187,11 @@ function parseString(src, options = { location: false }) {
         return acc;
     }, []));
 }
+/**
+ * get token type from a string
+ * @param val
+ * @param hint
+ */
 function getTokenType(val, hint) {
     if (hint != null) {
         return enumTokenHints.has(hint) ? { typ: hint } : { typ: hint, val };
@@ -1287,9 +1357,24 @@ function getTokenType(val, hint) {
     };
 }
 /**
- * parse token array into a tree structure
+ * parse function tokens in a token array
  * @param tokens
  * @param options
+ *
+ * Example:
+ *
+ * ```ts
+ *
+ * import {parseString, parseTokens} from '@tbela99/css-parser';
+ *
+ * let tokens = parseString('body { color: red; }');
+ * console.log(parseTokens(tokens));
+ *
+ *  tokens = parseString('#c322c980');
+ * console.log(parseTokens(tokens));
+ * ```
+ *
+ * @private
  */
 function parseTokens(tokens, options = {}) {
     for (let i = 0; i < tokens.length; i++) {
@@ -1577,4 +1662,4 @@ function parseTokens(tokens, options = {}) {
     return tokens;
 }
 
-export { doParse, getTokenType, parseAtRulePrelude, parseSelector, parseString, parseTokens, urlTokenMatcher };
+export { doParse, getTokenType, parseAtRulePrelude, parseDeclarations, parseSelector, parseString, parseTokens, urlTokenMatcher };

package/dist/lib/parser/tokenize.js

@@ -40,7 +40,7 @@ var TokenMap;
 })(TokenMap || (TokenMap = {}));
 function consumeWhiteSpace(parseInfo) {
     let count = 0;
-    while (isWhiteSpace(parseInfo.stream.charAt(count + parseInfo.currentPosition.ind + 1).charCodeAt(0))) {
+    while (isWhiteSpace(parseInfo.stream.charCodeAt(count + parseInfo.currentPosition.ind + 1))) {
         count++;
     }
     next(parseInfo, count);
@@ -146,11 +146,8 @@ function peek(parseInfo, count = 1) {
     }
     return parseInfo.stream.slice(parseInfo.currentPosition.ind + 1, parseInfo.currentPosition.ind + count + 1);
 }
-function prev(parseInfo, count = 1) {
-    if (count == 1) {
-        return parseInfo.currentPosition.ind == 0 ? '' : parseInfo.stream.charAt(parseInfo.currentPosition.ind - 1);
-    }
-    return parseInfo.stream.slice(parseInfo.currentPosition.ind - 1 - count, parseInfo.currentPosition.ind - 1);
+function prev(parseInfo) {
+    return parseInfo.stream.charAt(parseInfo.currentPosition.ind - 1);
 }
 function next(parseInfo, count = 1) {
     let char = '';
@@ -170,17 +167,14 @@ function next(parseInfo, count = 1) {
 }
 /**
  * tokenize css string
- * @param stream
+ * @param parseInfo
+ * @param yieldEOFToken
  */
-function* tokenize(stream) {
-    const parseInfo = {
-        stream,
-        position: { ind: 0, lin: 1, col: 1 },
-        currentPosition: { ind: -1, lin: 1, col: 0 }
-    };
+function* tokenize(parseInfo, yieldEOFToken = true) {
     let value;
-    let buffer = '';
+    let buffer = parseInfo.buffer;
     let charCode;
+    parseInfo.buffer = '';
     while (value = next(parseInfo)) {
         charCode = value.charCodeAt(0);
         if (isWhiteSpace(charCode)) {
@@ -443,11 +437,6 @@ function* tokenize(stream) {
                                             break;
                                         }
                                     }
-                                    if (value === '') {
-                                        yield pushToken(buffer, parseInfo, EnumToken.BadUrlTokenType);
-                                        buffer = '';
-                                        break;
-                                    }
                                     charCode = value.charCodeAt(0);
                                 }
                                 // '\\'
@@ -485,16 +474,6 @@ function* tokenize(stream) {
                                 }
                                 while (value = next(parseInfo)) {
                                     charCode = value.charCodeAt(0);
-                                    if (charCode == 0x5c) {
-                                        buffer += value + next(parseInfo);
-                                        continue;
-                                    }
-                                    if (charCode == 0x29) {
-                                        yield pushToken(buffer, parseInfo, EnumToken.BadStringTokenType);
-                                        yield pushToken('', parseInfo, EnumToken.EndParensTokenType);
-                                        buffer = '';
-                                        break;
-                                    }
                                     buffer += value;
                                 }
                                 if (hasNewLine) {
@@ -511,40 +490,12 @@ function* tokenize(stream) {
                         buffer = '';
                         while (value = next(parseInfo)) {
                             charCode = value.charCodeAt(0);
-                            // ')'
-                            if (charCode == 0x29) {
+                            if (charCode == 0x29) { // ')'
                                 yield pushToken(buffer, parseInfo, EnumToken.UrlTokenTokenType);
                                 yield pushToken('', parseInfo, EnumToken.EndParensTokenType);
                                 buffer = '';
                                 break;
                             }
-                            // if (errorState) {
-                            //
-                            //     buffer += whitespace + value;
-                            //
-                            //     while (value = peek(parseInfo)) {
-                            //
-                            //         charCode = value.charCodeAt(0);
-                            //
-                            //         if (charCode == 0x5c) {
-                            //
-                            //             buffer += next(parseInfo, 2);
-                            //             continue;
-                            //         }
-                            //
-                            //         // ')'
-                            //         if (charCode == 0x29) {
-                            //
-                            //             break;
-                            //         }
-                            //
-                            //         buffer += next(parseInfo);
-                            //     }
-                            //
-                            //     yield pushToken(buffer, parseInfo, EnumToken.BadUrlTokenType);
-                            //     buffer = '';
-                            //     break;
-                            // }
                             buffer += value;
                         }
                     }
@@ -583,10 +534,6 @@ function* tokenize(stream) {
                 buffer = '!';
                 break;
             case 64 /* TokenMap.AT */:
-                if (buffer.length > 0) {
-                    yield pushToken(buffer, parseInfo);
-                    buffer = '';
-                }
                 buffer = value;
                 {
                     let val = peek(parseInfo);
@@ -604,27 +551,40 @@ function* tokenize(stream) {
                 break;
             default:
                 buffer += value;
-                if (buffer.length == 1) {
-                    if (buffer == 'h') {
-                        if (match(parseInfo, 'ttp://') || match(parseInfo, 'ttps://')) {
-                            let val = peek(parseInfo);
-                            while (val != ')' && val != ';' && !isWhiteSpace(val.charCodeAt(0))) {
-                                buffer += next(parseInfo);
-                                val = peek(parseInfo);
-                            }
-                            yield pushToken(buffer, parseInfo);
-                            buffer = '';
-                            break;
-                        }
-                    }
-                }
                 break;
         }
     }
-    if (buffer.length > 0) {
-        yield pushToken(buffer, parseInfo);
+    if (yieldEOFToken) {
+        if (buffer.length > 0) {
+            yield pushToken(buffer, parseInfo);
+        }
+        yield pushToken('', parseInfo, EnumToken.EOFTokenType);
+    }
+    else {
+        parseInfo.buffer = buffer;
+    }
+}
+/**
+ * tokenize readable stream
+ * @param input
+ */
+async function* tokenizeStream(input) {
+    const parseInfo = {
+        stream: '',
+        buffer: '',
+        position: { ind: 0, lin: 1, col: 1 },
+        currentPosition: { ind: -1, lin: 1, col: 0 }
+    };
+    const decoder = new TextDecoder('utf-8');
+    const reader = input.getReader();
+    while (true) {
+        const { done, value } = await reader.read();
+        parseInfo.stream += decoder.decode(value, { stream: true });
+        yield* tokenize(parseInfo, done);
+        if (done) {
+            break;
+        }
     }
-    yield pushToken('', parseInfo, EnumToken.EOFTokenType);
 }
 
-export { tokenize };
+export { tokenize, tokenizeStream };

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) {
@@ -590,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/color.js

@@ -31,6 +31,13 @@ import '../../renderer/sourcemap/lib/encode.js';
  * 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 ||

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

@@ -13,15 +13,19 @@ 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.
+ * 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);

package/dist/lib/syntax/syntax.js

@@ -21,6 +21,11 @@ const dimensionUnits = new Set([
 const fontFormat = ['collection', 'embedded-opentype', 'opentype', 'svg', 'truetype', 'woff', 'woff2'];
 const colorFontTech = ['color-colrv0', 'color-colrv1', 'color-svg', 'color-sbix', 'color-cbdt'];
 const fontFeaturesTech = ['features-opentype', 'features-aat', 'features-graphite', 'incremental-patch', 'incremental-range', 'incremental-auto', 'variations', 'palettes'];
+/**
+ * supported transform functions
+ *
+ * @internal
+ */
 const transformFunctions = [
     'translate', 'scale', 'rotate', 'skew', 'perspective',
     'translateX', 'translateY', 'translateZ',
@@ -34,6 +39,11 @@ const mediaTypes = ['all', 'print', 'screen',
     /* deprecated */
     'aural', 'braille', 'embossed', 'handheld', 'projection', 'tty', 'tv', 'speech'];
 // https://www.w3.org/TR/css-values-4/#math-function
+/**
+ * supported math functions
+ *
+ * @internal
+ */
 const mathFuncs = ['minmax', 'repeat', 'fit-content', 'calc', 'clamp', 'min', 'max', 'round', 'mod', 'rem', 'sin', 'cos', 'tan', 'asin', 'acos', 'atan', 'atan2', 'pow', 'sqrt', 'hypot', 'log', 'exp', 'abs', 'sign'];
 const wildCardFuncs = ['var', 'env'];
 const pseudoElements = [':before', ':after', ':first-line', ':first-letter'];