@master/css 2.0.0-rc.25 → 2.0.0-rc.27

package/dist/common.cjs

@@ -0,0 +1,124 @@
+'use strict';
+
+const VALUE_DELIMITERS = {
+    '(': ')',
+    '\'': '\'',
+    '"': '"',
+    '{': '}'
+};
+const BASE_UNIT_REGEX = /^([+-]?(?:\d+(?:\.?\d+)?|\.\d+))x$/m // 1x, 1.1x, -1x, -.1x
+;
+const TRANSITION_SIGN = '~';
+const ANIMATION_SIGN = '@';
+const SELECTOR_SIGNS = [
+    ':',
+    '_',
+    '>',
+    '+',
+    '~'
+];
+const QUERY_COMPARISON_OPERATORS = [
+    '>',
+    '<',
+    '='
+];
+const QUERY_LOGICAL_OPERATORS = [
+    '&'
+];
+const SEPARATOR_SIGNS = [
+    ',',
+    '|'
+];
+const DELIMITER_SIGN = '|';
+const SEPARATOR_SIGN = ',';
+const AT_SIGN = '@';
+const VALUE_UNITS = [
+    '%',
+    'cm',
+    'mm',
+    'q',
+    'in',
+    'pt',
+    'pc',
+    'px',
+    'em',
+    'rem',
+    'ex',
+    'rex',
+    'cap',
+    'rcap',
+    'ch',
+    'rch',
+    'ic',
+    'ric',
+    'lh',
+    'rlh',
+    'vw',
+    'svw',
+    'lvw',
+    'dvw',
+    'vh',
+    'svh',
+    'lvh',
+    'dvh',
+    'vi',
+    'svi',
+    'lvi',
+    'dvi',
+    'vb',
+    'svb',
+    'lvb',
+    'dvb',
+    'vmin',
+    'svmin',
+    'lvmin',
+    'dvmin',
+    'vmax',
+    'svmax',
+    'lvmax',
+    'dvmax',
+    'cqw',
+    'cqh',
+    'cqi',
+    'cqb',
+    'cqmin',
+    'cqmax',
+    'deg',
+    'grad',
+    'rad',
+    'turn',
+    's',
+    'ms',
+    'hz',
+    'khz',
+    'dpi',
+    'dpcm',
+    'dppx',
+    'x',
+    'fr',
+    'db',
+    'st'
+];
+const UNIT_REGEX = /^([+-.]?\d+(\.?\d+)?)(%|cm|mm|q|in|pt|pc|px|em|rem|ex|rex|cap|rcap|ch|rch|ic|ric|lh|rlh|vw|svw|lvw|dvw|vh|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax|cqw|cqh|cqi|cqb|cqmin|cqmax|deg|grad|rad|turn|s|ms|hz|khz|dpi|dpcm|dppx|x|fr|db|st)?$/;
+const IMAGE_VALUE_REGEX = /(?:url|linear-gradient|radial-gradient|repeating-linear-gradient|repeating-radial-gradient|conic-gradient)\(.*\)/;
+const COLOR_VALUE_REGEX = /(?:#|(?:color|color-contrast|color-mix|hwb|lab|lch|oklab|oklch|rgb|rgba|hsl|hsla)\\(.*\\)|(?:\$colors)(?![a-zA-Z0-9-]))/;
+const NUMBER_VALUE_REGEX = /(?:[\d.]|(?:max|min|calc|clamp)\(.*\))/;
+const OFFICIAL_URL = new URL('https://rc.css.master.co');
+
+exports.ANIMATION_SIGN = ANIMATION_SIGN;
+exports.AT_SIGN = AT_SIGN;
+exports.BASE_UNIT_REGEX = BASE_UNIT_REGEX;
+exports.COLOR_VALUE_REGEX = COLOR_VALUE_REGEX;
+exports.DELIMITER_SIGN = DELIMITER_SIGN;
+exports.IMAGE_VALUE_REGEX = IMAGE_VALUE_REGEX;
+exports.NUMBER_VALUE_REGEX = NUMBER_VALUE_REGEX;
+exports.OFFICIAL_URL = OFFICIAL_URL;
+exports.QUERY_COMPARISON_OPERATORS = QUERY_COMPARISON_OPERATORS;
+exports.QUERY_LOGICAL_OPERATORS = QUERY_LOGICAL_OPERATORS;
+exports.SELECTOR_SIGNS = SELECTOR_SIGNS;
+exports.SEPARATOR_SIGN = SEPARATOR_SIGN;
+exports.SEPARATOR_SIGNS = SEPARATOR_SIGNS;
+exports.TRANSITION_SIGN = TRANSITION_SIGN;
+exports.UNIT_REGEX = UNIT_REGEX;
+exports.VALUE_DELIMITERS = VALUE_DELIMITERS;
+exports.VALUE_UNITS = VALUE_UNITS;

package/dist/common.d.ts

@@ -0,0 +1,22 @@
+export declare const VALUE_DELIMITERS: {
+    '(': string;
+    '\'': string;
+    '"': string;
+    '{': string;
+};
+export declare const BASE_UNIT_REGEX: RegExp;
+export declare const TRANSITION_SIGN = "~";
+export declare const ANIMATION_SIGN = "@";
+export declare const SELECTOR_SIGNS: string[];
+export declare const QUERY_COMPARISON_OPERATORS: string[];
+export declare const QUERY_LOGICAL_OPERATORS: string[];
+export declare const SEPARATOR_SIGNS: string[];
+export declare const DELIMITER_SIGN = "|";
+export declare const SEPARATOR_SIGN = ",";
+export declare const AT_SIGN = "@";
+export declare const VALUE_UNITS: string[];
+export declare const UNIT_REGEX: RegExp;
+export declare const IMAGE_VALUE_REGEX: RegExp;
+export declare const COLOR_VALUE_REGEX: RegExp;
+export declare const NUMBER_VALUE_REGEX: RegExp;
+export declare const OFFICIAL_URL: URL;

package/dist/common.mjs

@@ -0,0 +1,106 @@
+const VALUE_DELIMITERS = {
+    '(': ')',
+    '\'': '\'',
+    '"': '"',
+    '{': '}'
+};
+const BASE_UNIT_REGEX = /^([+-]?(?:\d+(?:\.?\d+)?|\.\d+))x$/m // 1x, 1.1x, -1x, -.1x
+;
+const TRANSITION_SIGN = '~';
+const ANIMATION_SIGN = '@';
+const SELECTOR_SIGNS = [
+    ':',
+    '_',
+    '>',
+    '+',
+    '~'
+];
+const QUERY_COMPARISON_OPERATORS = [
+    '>',
+    '<',
+    '='
+];
+const QUERY_LOGICAL_OPERATORS = [
+    '&'
+];
+const SEPARATOR_SIGNS = [
+    ',',
+    '|'
+];
+const DELIMITER_SIGN = '|';
+const SEPARATOR_SIGN = ',';
+const AT_SIGN = '@';
+const VALUE_UNITS = [
+    '%',
+    'cm',
+    'mm',
+    'q',
+    'in',
+    'pt',
+    'pc',
+    'px',
+    'em',
+    'rem',
+    'ex',
+    'rex',
+    'cap',
+    'rcap',
+    'ch',
+    'rch',
+    'ic',
+    'ric',
+    'lh',
+    'rlh',
+    'vw',
+    'svw',
+    'lvw',
+    'dvw',
+    'vh',
+    'svh',
+    'lvh',
+    'dvh',
+    'vi',
+    'svi',
+    'lvi',
+    'dvi',
+    'vb',
+    'svb',
+    'lvb',
+    'dvb',
+    'vmin',
+    'svmin',
+    'lvmin',
+    'dvmin',
+    'vmax',
+    'svmax',
+    'lvmax',
+    'dvmax',
+    'cqw',
+    'cqh',
+    'cqi',
+    'cqb',
+    'cqmin',
+    'cqmax',
+    'deg',
+    'grad',
+    'rad',
+    'turn',
+    's',
+    'ms',
+    'hz',
+    'khz',
+    'dpi',
+    'dpcm',
+    'dppx',
+    'x',
+    'fr',
+    'db',
+    'st'
+];
+const UNIT_REGEX = /^([+-.]?\d+(\.?\d+)?)(%|cm|mm|q|in|pt|pc|px|em|rem|ex|rex|cap|rcap|ch|rch|ic|ric|lh|rlh|vw|svw|lvw|dvw|vh|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax|cqw|cqh|cqi|cqb|cqmin|cqmax|deg|grad|rad|turn|s|ms|hz|khz|dpi|dpcm|dppx|x|fr|db|st)?$/;
+const IMAGE_VALUE_REGEX = /(?:url|linear-gradient|radial-gradient|repeating-linear-gradient|repeating-radial-gradient|conic-gradient)\(.*\)/;
+const COLOR_VALUE_REGEX = /(?:#|(?:color|color-contrast|color-mix|hwb|lab|lch|oklab|oklch|rgb|rgba|hsl|hsla)\\(.*\\)|(?:\$colors)(?![a-zA-Z0-9-]))/;
+const NUMBER_VALUE_REGEX = /(?:[\d.]|(?:max|min|calc|clamp)\(.*\))/;
+const OFFICIAL_URL = new URL('https://rc.css.master.co');
+
+export { ANIMATION_SIGN, AT_SIGN, BASE_UNIT_REGEX, COLOR_VALUE_REGEX, DELIMITER_SIGN, IMAGE_VALUE_REGEX, NUMBER_VALUE_REGEX, OFFICIAL_URL, QUERY_COMPARISON_OPERATORS, QUERY_LOGICAL_OPERATORS, SELECTOR_SIGNS, SEPARATOR_SIGN, SEPARATOR_SIGNS, TRANSITION_SIGN, UNIT_REGEX, VALUE_DELIMITERS, VALUE_UNITS };

package/dist/config/functions.cjs

@@ -1,10 +1,9 @@
 'use strict';
 
-var baseUnitRegex = require('../constants/base-unit-regex.cjs');
+var common = require('../common.cjs');
 
 const functions = {
     $: {
-        colored: true,
         transform (value) {
             let name;
             let fallback;
@@ -19,7 +18,8 @@ const functions = {
                 {
                     type: 'variable',
                     name,
-                    fallback
+                    fallback,
+                    token: value
                 }
             ];
         }
@@ -46,13 +46,16 @@ const functions = {
                     }
                     if (current) {
                         if (!isVarFunction) {
-                            const result = baseUnitRegex.BASE_UNIT_REGEX.exec(current);
+                            const result = common.BASE_UNIT_REGEX.exec(current);
                             if (result) {
                                 current = (+result[1] * (this.css.config.baseUnit ?? 1)).toString();
                             }
                         }
                         if (!bypassParsing && !parentBypassParsing) {
-                            const valueComponent = this.parseValueComponent(current);
+                            const valueComponent = {
+                                ...this.parseValue(current),
+                                token: current
+                            };
                             if (!hasUnit && isNaN(+current) && valueComponent.type === 'number') {
                                 hasUnit = true;
                             }
@@ -67,14 +70,16 @@ const functions = {
                                 } else {
                                     currentValueComponents.push({
                                         type: 'number',
-                                        value: +current
+                                        value: +current,
+                                        token: current
                                     });
                                 }
                             } else {
                                 if (isChildHandler) {
                                     const newValueComponent = {
                                         type: 'string',
-                                        value: current
+                                        value: current,
+                                        token: current
                                     };
                                     unparsedValueComponents.push(newValueComponent);
                                     currentValueComponents.push(newValueComponent);
@@ -85,7 +90,8 @@ const functions = {
                         } else {
                             currentValueComponents.push({
                                 type: 'string',
-                                value: current
+                                value: current,
+                                token: current
                             });
                         }
                         current = '';
@@ -104,13 +110,15 @@ const functions = {
                             currentValueComponents.push({
                                 type: 'separator',
                                 value: separator,
-                                text: separator
+                                text: separator,
+                                token: separator
                             });
                         } else {
                             currentValueComponents.push({
                                 type: 'separator',
                                 value: separator,
-                                text: prefix + separator + suffix
+                                text: prefix + separator + suffix,
+                                token: separator
                             });
                         }
                     }
@@ -121,20 +129,24 @@ const functions = {
                         currentValueComponents.push({
                             type: 'separator',
                             value: '/',
-                            text: ' / '
+                            text: ' / ',
+                            token: '/'
                         }, {
                             type: 'number',
-                            value: this.css.config.rootSize
+                            value: this.css.config.rootSize,
+                            token: String(this.css.config.rootSize)
                         });
                     }
                     currentValueComponents.push({
                         type: 'separator',
                         value: '*',
-                        text: ' * '
+                        text: ' * ',
+                        token: '*'
                     }, {
                         type: 'number',
                         value: 1,
-                        unit: this.definition.unit
+                        unit: this.definition.unit,
+                        token: this.definition.unit
                     });
                 };
                 const handleUnitChecking = ()=>{
@@ -151,7 +163,8 @@ const functions = {
                         if (symbolResult) {
                             currentValueComponents.push({
                                 type: 'string',
-                                value: symbolResult[1]
+                                value: symbolResult[1],
+                                token: symbolResult[1]
                             });
                         }
                         const functionName = symbolResult ? current.slice(1) : current;
@@ -160,7 +173,8 @@ const functions = {
                             name: functionName,
                             symbol: char,
                             children: [],
-                            bypassTransform: functionName === 'calc'
+                            bypassTransform: functionName === 'calc',
+                            token: current
                         };
                         currentValueComponents.push(newValueComponent);
                         current = '';
@@ -179,7 +193,7 @@ const functions = {
                         clear('');
                         if (hasUnit) {
                             for (const eachUnparsedValueComponent of unparsedValueComponents){
-                                Object.assign(eachUnparsedValueComponent, this.parseValueComponent(eachUnparsedValueComponent.value));
+                                Object.assign(eachUnparsedValueComponent, this.parseValue(eachUnparsedValueComponent.value));
                             }
                         }
                         return hasUnit;
@@ -297,16 +311,13 @@ const functions = {
         unit: ''
     },
     color: {
-        unit: '',
-        colored: true
+        unit: ''
     },
     'color-contrast': {
-        unit: '',
-        colored: true
+        unit: ''
     },
     'color-mix': {
-        unit: '',
-        colored: true
+        unit: ''
     },
     hwb: {
         unit: ''
@@ -329,24 +340,12 @@ const functions = {
     repeat: {
         unit: ''
     },
-    'linear-gradient': {
-        colored: true
-    },
-    'radial-gradient': {
-        colored: true
-    },
-    'conic-gradient': {
-        colored: true
-    },
-    'repeating-linear-gradient': {
-        colored: true
-    },
-    'repeating-radial-gradient': {
-        colored: true
-    },
-    'repeating-conic-gradient': {
-        colored: true
-    }
+    'linear-gradient': {},
+    'radial-gradient': {},
+    'conic-gradient': {},
+    'repeating-linear-gradient': {},
+    'repeating-radial-gradient': {},
+    'repeating-conic-gradient': {}
 };
 
 module.exports = functions;

package/dist/config/functions.mjs

@@ -1,8 +1,7 @@
-import { BASE_UNIT_REGEX } from '../constants/base-unit-regex.mjs';
+import { BASE_UNIT_REGEX } from '../common.mjs';
 
 const functions = {
     $: {
-        colored: true,
         transform (value) {
             let name;
             let fallback;
@@ -17,7 +16,8 @@ const functions = {
                 {
                     type: 'variable',
                     name,
-                    fallback
+                    fallback,
+                    token: value
                 }
             ];
         }
@@ -50,7 +50,10 @@ const functions = {
                             }
                         }
                         if (!bypassParsing && !parentBypassParsing) {
-                            const valueComponent = this.parseValueComponent(current);
+                            const valueComponent = {
+                                ...this.parseValue(current),
+                                token: current
+                            };
                             if (!hasUnit && isNaN(+current) && valueComponent.type === 'number') {
                                 hasUnit = true;
                             }
@@ -65,14 +68,16 @@ const functions = {
                                 } else {
                                     currentValueComponents.push({
                                         type: 'number',
-                                        value: +current
+                                        value: +current,
+                                        token: current
                                     });
                                 }
                             } else {
                                 if (isChildHandler) {
                                     const newValueComponent = {
                                         type: 'string',
-                                        value: current
+                                        value: current,
+                                        token: current
                                     };
                                     unparsedValueComponents.push(newValueComponent);
                                     currentValueComponents.push(newValueComponent);
@@ -83,7 +88,8 @@ const functions = {
                         } else {
                             currentValueComponents.push({
                                 type: 'string',
-                                value: current
+                                value: current,
+                                token: current
                             });
                         }
                         current = '';
@@ -102,13 +108,15 @@ const functions = {
                             currentValueComponents.push({
                                 type: 'separator',
                                 value: separator,
-                                text: separator
+                                text: separator,
+                                token: separator
                             });
                         } else {
                             currentValueComponents.push({
                                 type: 'separator',
                                 value: separator,
-                                text: prefix + separator + suffix
+                                text: prefix + separator + suffix,
+                                token: separator
                             });
                         }
                     }
@@ -119,20 +127,24 @@ const functions = {
                         currentValueComponents.push({
                             type: 'separator',
                             value: '/',
-                            text: ' / '
+                            text: ' / ',
+                            token: '/'
                         }, {
                             type: 'number',
-                            value: this.css.config.rootSize
+                            value: this.css.config.rootSize,
+                            token: String(this.css.config.rootSize)
                         });
                     }
                     currentValueComponents.push({
                         type: 'separator',
                         value: '*',
-                        text: ' * '
+                        text: ' * ',
+                        token: '*'
                     }, {
                         type: 'number',
                         value: 1,
-                        unit: this.definition.unit
+                        unit: this.definition.unit,
+                        token: this.definition.unit
                     });
                 };
                 const handleUnitChecking = ()=>{
@@ -149,7 +161,8 @@ const functions = {
                         if (symbolResult) {
                             currentValueComponents.push({
                                 type: 'string',
-                                value: symbolResult[1]
+                                value: symbolResult[1],
+                                token: symbolResult[1]
                             });
                         }
                         const functionName = symbolResult ? current.slice(1) : current;
@@ -158,7 +171,8 @@ const functions = {
                             name: functionName,
                             symbol: char,
                             children: [],
-                            bypassTransform: functionName === 'calc'
+                            bypassTransform: functionName === 'calc',
+                            token: current
                         };
                         currentValueComponents.push(newValueComponent);
                         current = '';
@@ -177,7 +191,7 @@ const functions = {
                         clear('');
                         if (hasUnit) {
                             for (const eachUnparsedValueComponent of unparsedValueComponents){
-                                Object.assign(eachUnparsedValueComponent, this.parseValueComponent(eachUnparsedValueComponent.value));
+                                Object.assign(eachUnparsedValueComponent, this.parseValue(eachUnparsedValueComponent.value));
                             }
                         }
                         return hasUnit;
@@ -295,16 +309,13 @@ const functions = {
         unit: ''
     },
     color: {
-        unit: '',
-        colored: true
+        unit: ''
     },
     'color-contrast': {
-        unit: '',
-        colored: true
+        unit: ''
     },
     'color-mix': {
-        unit: '',
-        colored: true
+        unit: ''
     },
     hwb: {
         unit: ''
@@ -327,24 +338,12 @@ const functions = {
     repeat: {
         unit: ''
     },
-    'linear-gradient': {
-        colored: true
-    },
-    'radial-gradient': {
-        colored: true
-    },
-    'conic-gradient': {
-        colored: true
-    },
-    'repeating-linear-gradient': {
-        colored: true
-    },
-    'repeating-radial-gradient': {
-        colored: true
-    },
-    'repeating-conic-gradient': {
-        colored: true
-    }
+    'linear-gradient': {},
+    'radial-gradient': {},
+    'conic-gradient': {},
+    'repeating-linear-gradient': {},
+    'repeating-radial-gradient': {},
+    'repeating-conic-gradient': {}
 };
 
 export { functions as default };

package/dist/config/index.cjs

@@ -1,17 +1,17 @@
 'use strict';
 
+var queries = require('./queries.cjs');
 var selectors = require('./selectors.cjs');
-var semantics = require('./semantics.cjs');
+var utilities = require('./utilities.cjs');
 var animations = require('./animations.cjs');
 var variables = require('./variables.cjs');
 var rules = require('./rules.cjs');
 var functions = require('./functions.cjs');
-var screenSizes = require('../tokens/screen-sizes.cjs');
 
 const config = {
-    mediaQueries: screenSizes,
+    queries,
     selectors,
-    semantics,
+    utilities,
     rules: rules.default,
     functions,
     animations,
@@ -21,14 +21,14 @@ const config = {
     baseUnit: 4,
     override: false,
     important: false,
-    themeDriver: 'class'
+    modeDriver: 'class'
 };
 
+exports.queries = queries;
 exports.selectors = selectors;
-exports.semantics = semantics;
+exports.utilities = utilities;
 exports.animations = animations;
 exports.variables = variables;
 exports.rules = rules.default;
 exports.functions = functions;
-exports.mediaQueries = screenSizes;
 exports.config = config;