@tbela99/css-parser 0.0.1-rc4 → 0.0.1-rc6

package/dist/lib/parser/utils/syntax.js

@@ -1,3 +1,6 @@
+import { colorsFunc } from '../../renderer/render.js';
+import { COLORS_NAMES } from '../../renderer/utils/color.js';
+
 // https://www.w3.org/TR/CSS21/syndata.html#syntax
 // https://www.w3.org/TR/2021/CRD-css-syntax-3-20211224/#typedef-ident-token
 // '\\'
@@ -23,6 +26,25 @@ function isTime(dimension) {
 function isFrequency(dimension) {
     return 'unit' in dimension && ['hz', 'khz'].includes(dimension.unit.toLowerCase());
 }
+function isColor(token) {
+    if (token.typ == 'Color') {
+        return true;
+    }
+    if (token.typ == 'Iden') {
+        // named color
+        return token.val.toLowerCase() in COLORS_NAMES;
+    }
+    if (token.typ == 'Func' && token.chi.length > 0 && colorsFunc.includes(token.val)) {
+        // @ts-ignore
+        for (const v of token.chi) {
+            if (!['Number', 'Perc', 'Comma', 'Whitespace'].includes(v.typ)) {
+                return false;
+            }
+        }
+        return true;
+    }
+    return false;
+}
 function isLetter(codepoint) {
     // lowercase
     return (codepoint >= 0x61 && codepoint <= 0x7a) ||
@@ -74,20 +96,22 @@ function isIdent(name) {
     }
     return true;
 }
+function isNonPrintable(codepoint) {
+    // null -> backspace
+    return (codepoint >= 0 && codepoint <= 0x8) ||
+        // tab
+        codepoint == 0xb ||
+        // delete
+        codepoint == 0x7f ||
+        (codepoint >= 0xe && codepoint <= 0x1f);
+}
 function isPseudo(name) {
-    if (name.charAt(0) != ':') {
-        return false;
-    }
-    if (name.endsWith('(')) {
-        return isIdent(name.charAt(1) == ':' ? name.slice(2, -1) : name.slice(1, -1));
-    }
-    return isIdent(name.charAt(1) == ':' ? name.slice(2) : name.slice(1));
+    return name.charAt(0) == ':' &&
+        ((name.endsWith('(') && isIdent(name.charAt(1) == ':' ? name.slice(2, -1) : name.slice(1, -1))) ||
+            isIdent(name.charAt(1) == ':' ? name.slice(2) : name.slice(1)));
 }
 function isHash(name) {
-    if (name.charAt(0) != '#') {
-        return false;
-    }
-    return isIdent(name.charAt(1));
+    return name.charAt(0) == '#' && isIdent(name.charAt(1));
 }
 function isNumber(name) {
     if (name.length == 0) {
@@ -224,22 +248,6 @@ function isHexColor(name) {
     }
     return true;
 }
-function isHexDigit(name) {
-    if (name.length || name.length > 6) {
-        return false;
-    }
-    for (let chr of name) {
-        let codepoint = chr.charCodeAt(0);
-        if (!isDigit(codepoint) &&
-            // A F
-            !(codepoint >= 0x41 && codepoint <= 0x46) &&
-            // a f
-            !(codepoint >= 0x61 && codepoint <= 0x66)) {
-            return false;
-        }
-    }
-    return true;
-}
 function isFunction(name) {
     return name.endsWith('(') && isIdent(name.slice(0, -1));
 }
@@ -256,4 +264,4 @@ function isWhiteSpace(codepoint) {
         codepoint == 0xa || codepoint == 0xc || codepoint == 0xd;
 }
 
-export { isAngle, isAtKeyword, isDigit, isDimension, isFrequency, isFunction, isHash, isHexColor, isHexDigit, isIdent, isIdentCodepoint, isIdentStart, isLength, isNewLine, isNumber, isPercentage, isPseudo, isResolution, isTime, isWhiteSpace, parseDimension };
+export { isAngle, isAtKeyword, isColor, isDigit, isDimension, isFrequency, isFunction, isHash, isHexColor, isIdent, isIdentCodepoint, isIdentStart, isLength, isNewLine, isNonPrintable, isNumber, isPercentage, isPseudo, isResolution, isTime, isWhiteSpace, parseDimension };

package/dist/lib/parser/utils/type.js

@@ -13,4 +13,4 @@ function matchType(val, properties) {
     return false;
 }
 
-export { matchType };
+export { funcList, matchType };

package/dist/lib/renderer/render.js

@@ -1,5 +1,7 @@
 import { getAngle, COLORS_NAMES, rgb2Hex, hsl2Hex, hwb2hex, cmyk2hex, NAMES_COLORS } from './utils/color.js';
+import { expand } from '../ast/expand.js';
 
+const colorsFunc = ['rgb', 'rgba', 'hsl', 'hsla', 'hwb', 'device-cmyk'];
 function reduceNumber(val) {
     val = (+val).toString();
     if (val === '0') {
@@ -19,6 +21,7 @@ function reduceNumber(val) {
 }
 function render(data, opt = {}) {
     const startTime = performance.now();
+    const errors = [];
     const options = Object.assign(opt.minify ?? true ? {
         indent: '',
         newLine: '',
@@ -28,23 +31,23 @@ function render(data, opt = {}) {
         newLine: '\n',
         compress: false,
         removeComments: false,
-    }, { colorConvert: true, preserveLicense: false }, opt);
+    }, { colorConvert: true, expandNestingRules: false, preserveLicense: false }, opt);
     return {
-        code: doRender(data, options, function reducer(acc, curr) {
+        code: doRender(options.expandNestingRules ? expand(data) : data, options, errors, function reducer(acc, curr) {
             if (curr.typ == 'Comment' && options.removeComments) {
                 if (!options.preserveLicense || !curr.val.startsWith('/*!')) {
                     return acc;
                 }
                 return acc + curr.val;
             }
-            return acc + renderToken(curr, options, reducer);
-        }, 0), stats: {
+            return acc + renderToken(curr, options, reducer, errors);
+        }, 0), errors, stats: {
             total: `${(performance.now() - startTime).toFixed(2)}ms`
         }
     };
 }
 // @ts-ignore
-function doRender(data, options, reducer, level = 0, indents = []) {
+function doRender(data, options, errors, reducer, level = 0, indents = []) {
     if (indents.length < level + 1) {
         indents.push(options.indent.repeat(level));
     }
@@ -57,10 +60,11 @@ function doRender(data, options, reducer, level = 0, indents = []) {
         case 'Declaration':
             return `${data.nam}:${options.indent}${data.val.reduce(reducer, '')}`;
         case 'Comment':
+        case 'CDOCOMM':
             return !options.removeComments || (options.preserveLicense && data.val.startsWith('/*!')) ? data.val : '';
         case 'StyleSheet':
             return data.chi.reduce((css, node) => {
-                const str = doRender(node, options, reducer, level, indents);
+                const str = doRender(node, options, errors, reducer, level, indents);
                 if (str === '') {
                     return css;
                 }
@@ -82,7 +86,8 @@ function doRender(data, options, reducer, level = 0, indents = []) {
                 }
                 else if (node.typ == 'Declaration') {
                     if (node.val.length == 0) {
-                        console.error(`invalid declaration`, node);
+                        // @ts-ignore
+                        errors.push({ action: 'ignore', message: `render: invalid declaration ${JSON.stringify(node)}`, location: node.loc });
                         return '';
                     }
                     str = `${node.nam}:${options.indent}${node.val.reduce(reducer, '').trimEnd()};`;
@@ -91,7 +96,7 @@ function doRender(data, options, reducer, level = 0, indents = []) {
                     str = `${data.val === '' ? '' : options.indent || ' '}${data.val};`;
                 }
                 else {
-                    str = doRender(node, options, reducer, level + 1, indents);
+                    str = doRender(node, options, errors, reducer, level + 1, indents);
                 }
                 if (css === '') {
                     return str;
@@ -111,7 +116,7 @@ function doRender(data, options, reducer, level = 0, indents = []) {
     }
     return '';
 }
-function renderToken(token, options = {}, reducer) {
+function renderToken(token, options = {}, reducer, errors) {
     if (reducer == null) {
         reducer = function (acc, curr) {
             if (curr.typ == 'Comment' && options.removeComments) {
@@ -120,7 +125,7 @@ function renderToken(token, options = {}, reducer) {
                 }
                 return acc + curr.val;
             }
-            return acc + renderToken(curr, options, reducer);
+            return acc + renderToken(curr, options, reducer, errors);
         };
     }
     switch (token.typ) {
@@ -257,14 +262,14 @@ function renderToken(token, options = {}, reducer) {
                 }
             }
             if (val === '0') {
-                if (unit == 'Time') {
+                if (token.typ == 'Time') {
                     return '0s';
                 }
-                if (unit == 'Frequency') {
+                if (token.typ == 'Frequency') {
                     return '0Hz';
                 }
                 // @ts-ignore
-                if (unit == 'Resolution') {
+                if (token.typ == 'Resolution') {
                     return '0x';
                 }
                 return '0';
@@ -273,18 +278,7 @@ function renderToken(token, options = {}, reducer) {
         case 'Perc':
             return token.val + '%';
         case 'Number':
-            const num = (+token.val).toString();
-            if (token.val.length < num.length) {
-                return token.val;
-            }
-            if (num.charAt(0) === '0' && num.length > 1) {
-                return num.slice(1);
-            }
-            const slice = num.slice(0, 2);
-            if (slice == '-0') {
-                return '-' + num.slice(2);
-            }
-            return num;
+            return reduceNumber(token.val);
         case 'Comment':
             if (options.removeComments && (!options.preserveLicense || !token.val.startsWith('/*!'))) {
                 return '';
@@ -299,9 +293,8 @@ function renderToken(token, options = {}, reducer) {
         case 'Delim':
             return /* options.minify && 'Pseudo-class' == token.typ && '::' == token.val.slice(0, 2) ? token.val.slice(1) :  */ token.val;
     }
-    console.error(`unexpected token ${JSON.stringify(token, null, 1)}`);
-    // throw  new Error(`unexpected token ${JSON.stringify(token, null, 1)}`);
+    errors?.push({ action: 'ignore', message: `render: unexpected token ${JSON.stringify(token, null, 1)}` });
     return '';
 }
 
-export { render, renderToken };
+export { colorsFunc, render, renderToken };

package/dist/lib/transform.js

@@ -1,5 +1,6 @@
 import { parse } from './parser/parse.js';
 import { render } from './renderer/render.js';
+import './renderer/utils/color.js';
 
 async function transform(css, options = {}) {
     options = { minify: true, removeEmpty: true, ...options };
@@ -7,7 +8,10 @@ async function transform(css, options = {}) {
     return parse(css, options).then((parseResult) => {
         const rendered = render(parseResult.ast, options);
         return {
-            ...parseResult, ...rendered, stats: {
+            ...parseResult,
+            ...rendered,
+            errors: parseResult.errors.concat(rendered.errors),
+            stats: {
                 bytesOut: rendered.code.length,
                 ...parseResult.stats,
                 render: rendered.stats.total,

package/dist/node/index.js

@@ -1,21 +1,22 @@
+export { combinators, hasDeclaration, minify, minifyRule, reduceSelector, splitRule } from '../lib/ast/minify.js';
+export { walk, walkValues } from '../lib/ast/walk.js';
+export { expand } from '../lib/ast/expand.js';
+export { colorsFunc, render, renderToken } from '../lib/renderer/render.js';
 import { parse as parse$1 } from '../lib/parser/parse.js';
 export { parseString, urlTokenMatcher } from '../lib/parser/parse.js';
 export { tokenize } from '../lib/parser/tokenize.js';
-export { isAngle, isAtKeyword, isDigit, isDimension, isFrequency, isFunction, isHash, isHexColor, isHexDigit, isIdent, isIdentCodepoint, isIdentStart, isLength, isNewLine, isNumber, isPercentage, isPseudo, isResolution, isTime, isWhiteSpace, parseDimension } from '../lib/parser/utils/syntax.js';
+export { isAngle, isAtKeyword, isColor, isDigit, isDimension, isFrequency, isFunction, isHash, isHexColor, isIdent, isIdentCodepoint, isIdentStart, isLength, isNewLine, isNonPrintable, isNumber, isPercentage, isPseudo, isResolution, isTime, isWhiteSpace, parseDimension } from '../lib/parser/utils/syntax.js';
 export { getConfig } from '../lib/parser/utils/config.js';
-export { matchType } from '../lib/parser/utils/type.js';
-export { render, renderToken } from '../lib/renderer/render.js';
+export { funcList, matchType } from '../lib/parser/utils/type.js';
 import { transform as transform$1 } from '../lib/transform.js';
-export { combinators, hasDeclaration, minify, minifyRule, reduceSelector } from '../lib/ast/minify.js';
-export { walk } from '../lib/ast/walk.js';
 import { load } from './load.js';
 import { resolve } from '../lib/fs/resolve.js';
 export { dirname, matchUrl } from '../lib/fs/resolve.js';
 
-function parse(iterator, opt = {}) {
+async function parse(iterator, opt = {}) {
     return parse$1(iterator, Object.assign(opt, { load, resolve, cwd: opt.cwd ?? process.cwd() }));
 }
-function transform(css, options = {}) {
+async function transform(css, options = {}) {
     return transform$1(css, Object.assign(options, { load, resolve, cwd: options.cwd ?? process.cwd() }));
 }
 

package/dist/web/index.js

@@ -1,25 +1,26 @@
+export { combinators, hasDeclaration, minify, minifyRule, reduceSelector, splitRule } from '../lib/ast/minify.js';
+export { walk, walkValues } from '../lib/ast/walk.js';
+export { expand } from '../lib/ast/expand.js';
+export { colorsFunc, render, renderToken } from '../lib/renderer/render.js';
 import { parse as parse$1 } from '../lib/parser/parse.js';
 export { parseString, urlTokenMatcher } from '../lib/parser/parse.js';
 export { tokenize } from '../lib/parser/tokenize.js';
-export { isAngle, isAtKeyword, isDigit, isDimension, isFrequency, isFunction, isHash, isHexColor, isHexDigit, isIdent, isIdentCodepoint, isIdentStart, isLength, isNewLine, isNumber, isPercentage, isPseudo, isResolution, isTime, isWhiteSpace, parseDimension } from '../lib/parser/utils/syntax.js';
+export { isAngle, isAtKeyword, isColor, isDigit, isDimension, isFrequency, isFunction, isHash, isHexColor, isIdent, isIdentCodepoint, isIdentStart, isLength, isNewLine, isNonPrintable, isNumber, isPercentage, isPseudo, isResolution, isTime, isWhiteSpace, parseDimension } from '../lib/parser/utils/syntax.js';
 export { getConfig } from '../lib/parser/utils/config.js';
-export { matchType } from '../lib/parser/utils/type.js';
-export { render, renderToken } from '../lib/renderer/render.js';
+export { funcList, matchType } from '../lib/parser/utils/type.js';
 import { transform as transform$1 } from '../lib/transform.js';
-export { combinators, hasDeclaration, minify, minifyRule, reduceSelector } from '../lib/ast/minify.js';
-export { walk } from '../lib/ast/walk.js';
 import { load } from './load.js';
 import { resolve, dirname } from '../lib/fs/resolve.js';
 export { matchUrl } from '../lib/fs/resolve.js';
 
-function parse(iterator, opt = {}) {
+async function parse(iterator, opt = {}) {
     return parse$1(iterator, Object.assign(opt, {
         load,
         resolve,
         cwd: opt.cwd ?? self.location.pathname.endsWith('/') ? self.location.pathname : dirname(self.location.pathname)
     }));
 }
-function transform(css, options = {}) {
+async function transform(css, options = {}) {
     return transform$1(css, Object.assign(options, {
         load,
         resolve,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tbela99/css-parser",
   "description": "CSS parser for node and the browser",
-  "version": "0.0.1-rc4",
+  "version": "0.0.1-rc6",
   "exports": {
     ".": "./dist/node/index.js",
     "./umd": "./dist/index-umd-web.js",