@master/css 2.0.0-rc.4 → 2.0.0-rc.41

package/dist/config/functions.mjs

@@ -0,0 +1,349 @@
+import { BASE_UNIT_REGEX } from '../common.mjs';
+
+const functions = {
+    $: {
+        transform (value) {
+            let name;
+            let fallback;
+            const firstCommaIndex = value.indexOf(',');
+            if (firstCommaIndex !== -1) {
+                name = value.slice(0, firstCommaIndex);
+                fallback = value.slice(firstCommaIndex + 1);
+            } else {
+                name = value;
+            }
+            return [
+                {
+                    type: 'variable',
+                    name,
+                    fallback,
+                    token: value
+                }
+            ];
+        }
+    },
+    calc: {
+        transform (value, bypassVariableNames) {
+            const valueComponents = [];
+            let i = 0;
+            const anaylzeDeeply = (currentValueComponents, bypassHandlingSeparator, parentBypassParsing, parentUnitChecking, isVarFunction)=>{
+                const isChildHandler = valueComponents !== currentValueComponents;
+                const unparsedValueComponents = [];
+                let bypassParsing = false;
+                let hasUnit = false;
+                let currentHasUnit = false;
+                let unitChecking = false;
+                let childHasUnit = undefined;
+                let current = '';
+                const clear = (separator, prefix = '', suffix = '')=>{
+                    if (childHasUnit === false && separator !== ' ' && this.definition.unit) {
+                        childHasUnit = undefined;
+                        if (!unitChecking) {
+                            pushUnitValueComponents();
+                        }
+                    }
+                    if (current) {
+                        if (!isVarFunction) {
+                            const result = BASE_UNIT_REGEX.exec(current);
+                            if (result) {
+                                current = (+result[1] * (this.css.config.baseUnit ?? 1)).toString();
+                            }
+                        }
+                        if (!bypassParsing && !parentBypassParsing) {
+                            const valueComponent = {
+                                ...this.parseValue(current),
+                                token: current
+                            };
+                            if (!hasUnit && isNaN(+current) && valueComponent.type === 'number') {
+                                hasUnit = true;
+                            }
+                            if (unitChecking) {
+                                if (isNaN(+current)) {
+                                    if (valueComponent.type === 'number') {
+                                        currentValueComponents.push(valueComponent);
+                                        currentHasUnit = true;
+                                    } else {
+                                        currentValueComponents.push(valueComponent);
+                                    }
+                                } else {
+                                    currentValueComponents.push({
+                                        type: 'number',
+                                        value: +current,
+                                        token: current
+                                    });
+                                }
+                            } else {
+                                if (isChildHandler) {
+                                    const newValueComponent = {
+                                        type: 'string',
+                                        value: current,
+                                        token: current
+                                    };
+                                    unparsedValueComponents.push(newValueComponent);
+                                    currentValueComponents.push(newValueComponent);
+                                } else {
+                                    currentValueComponents.push(valueComponent);
+                                }
+                            }
+                        } else {
+                            currentValueComponents.push({
+                                type: 'string',
+                                value: current,
+                                token: current
+                            });
+                        }
+                        current = '';
+                    }
+                    if (separator) {
+                        if (separator === '+' || separator === '-') {
+                            handleUnitChecking();
+                        }
+                        if (prefix && value[i - 1] === ' ') {
+                            prefix = '';
+                        }
+                        if (suffix && value[i + 1] === ' ') {
+                            suffix = '';
+                        }
+                        if (bypassHandlingSeparator) {
+                            currentValueComponents.push({
+                                type: 'separator',
+                                value: separator,
+                                text: separator,
+                                token: separator
+                            });
+                        } else {
+                            currentValueComponents.push({
+                                type: 'separator',
+                                value: separator,
+                                text: prefix + separator + suffix,
+                                token: separator
+                            });
+                        }
+                    }
+                    bypassParsing = false;
+                };
+                const pushUnitValueComponents = ()=>{
+                    if (this.definition.unit === 'rem' || this.definition.unit === 'em') {
+                        currentValueComponents.push({
+                            type: 'separator',
+                            value: '/',
+                            text: ' / ',
+                            token: '/'
+                        }, {
+                            type: 'number',
+                            value: this.css.config.rootSize,
+                            token: String(this.css.config.rootSize)
+                        });
+                    }
+                    currentValueComponents.push({
+                        type: 'separator',
+                        value: '*',
+                        text: ' * ',
+                        token: '*'
+                    }, {
+                        type: 'number',
+                        value: 1,
+                        unit: this.definition.unit,
+                        token: this.definition.unit
+                    });
+                };
+                const handleUnitChecking = ()=>{
+                    if (unitChecking && !currentHasUnit && !parentUnitChecking && (!isChildHandler || hasUnit)) {
+                        pushUnitValueComponents();
+                    }
+                    unitChecking = false;
+                    currentHasUnit = false;
+                };
+                for(; i < value.length; i++){
+                    const char = value[i];
+                    if (char === '(') {
+                        const symbolResult = /^([+-])/.exec(current);
+                        if (symbolResult) {
+                            currentValueComponents.push({
+                                type: 'string',
+                                value: symbolResult[1],
+                                token: symbolResult[1]
+                            });
+                        }
+                        const functionName = symbolResult ? current.slice(1) : current;
+                        const newValueComponent = {
+                            type: 'function',
+                            name: functionName,
+                            symbol: char,
+                            children: [],
+                            bypassTransform: functionName === 'calc',
+                            token: current
+                        };
+                        currentValueComponents.push(newValueComponent);
+                        current = '';
+                        i++;
+                        const isVarFunction = functionName === '$' || functionName === 'var';
+                        childHasUnit = anaylzeDeeply(newValueComponent.children, functionName !== '' && functionName !== 'calc' && (isVarFunction || Object.prototype.hasOwnProperty.call(functions, functionName)), bypassParsing || isVarFunction || unitChecking && currentHasUnit, unitChecking, isVarFunction) || functionName === 'var';
+                        if (!childHasUnit && functionName === '$') {
+                            const variableType = this.css.variables[newValueComponent.children[0].value]?.type;
+                            childHasUnit = !variableType || variableType === 'string';
+                        }
+                        if (childHasUnit) {
+                            hasUnit = true;
+                            currentHasUnit = true;
+                        }
+                    } else if (char === ')') {
+                        clear('');
+                        if (hasUnit) {
+                            for (const eachUnparsedValueComponent of unparsedValueComponents){
+                                Object.assign(eachUnparsedValueComponent, this.parseValue(eachUnparsedValueComponent.value));
+                            }
+                        }
+                        return hasUnit;
+                    } else if (char === ',') {
+                        clear(char, '', ' ');
+                    } else if (char === ' ') {
+                        clear(char);
+                    } else {
+                        const previousChar = value[i - 1];
+                        switch(char){
+                            case '+':
+                                if (!current && previousChar !== ')') {
+                                    current += char;
+                                } else {
+                                    clear(char, ' ', ' ');
+                                }
+                                break;
+                            case '-':
+                                if (!current && previousChar !== ')') {
+                                    current += char;
+                                } else {
+                                    clear(char, ' ', ' ');
+                                }
+                                break;
+                            case '*':
+                                if (this.definition.unit) {
+                                    unitChecking = true;
+                                }
+                                clear(char, ' ', ' ');
+                                break;
+                            case '/':
+                                if (this.definition.unit) {
+                                    unitChecking = true;
+                                }
+                                clear(char, ' ', ' ');
+                                bypassParsing = true;
+                                break;
+                            default:
+                                current += char;
+                                break;
+                        }
+                    }
+                }
+                clear('');
+                handleUnitChecking();
+            };
+            anaylzeDeeply(valueComponents, false, false, false, false);
+            return 'calc(' + this.resolveValue(valueComponents, functions.calc.unit ?? this.definition.unit, bypassVariableNames, true) + ')';
+        }
+    },
+    translate: {
+        unit: 'rem'
+    },
+    translateX: {
+        unit: 'rem'
+    },
+    translateY: {
+        unit: 'rem'
+    },
+    translateZ: {
+        unit: 'rem'
+    },
+    translate3d: {
+        unit: 'rem'
+    },
+    skew: {
+        unit: 'deg'
+    },
+    skewX: {
+        unit: 'deg'
+    },
+    skewY: {
+        unit: 'deg'
+    },
+    skewZ: {
+        unit: 'deg'
+    },
+    skew3d: {
+        unit: 'deg'
+    },
+    rotate: {
+        unit: 'deg'
+    },
+    rotateX: {
+        unit: 'deg'
+    },
+    rotateY: {
+        unit: 'deg'
+    },
+    rotateZ: {
+        unit: 'deg'
+    },
+    rotate3d: {
+        unit: 'deg'
+    },
+    blur: {
+        unit: 'rem'
+    },
+    'drop-shadow': {
+        unit: 'rem'
+    },
+    'hue-rotate': {
+        unit: 'deg'
+    },
+    rgb: {
+        unit: ''
+    },
+    rgba: {
+        unit: ''
+    },
+    hsl: {
+        unit: ''
+    },
+    hsla: {
+        unit: ''
+    },
+    color: {
+        unit: ''
+    },
+    'color-contrast': {
+        unit: ''
+    },
+    'color-mix': {
+        unit: ''
+    },
+    hwb: {
+        unit: ''
+    },
+    lab: {
+        unit: ''
+    },
+    lch: {
+        unit: ''
+    },
+    oklab: {
+        unit: ''
+    },
+    oklch: {
+        unit: ''
+    },
+    clamp: {
+        unit: ''
+    },
+    repeat: {
+        unit: ''
+    },
+    'linear-gradient': {},
+    'radial-gradient': {},
+    'conic-gradient': {},
+    'repeating-linear-gradient': {},
+    'repeating-radial-gradient': {},
+    'repeating-conic-gradient': {}
+};
+
+export { functions as default };

package/dist/config/index.cjs

@@ -0,0 +1,36 @@
+'use strict';
+
+var at = require('./at.cjs');
+var selectors = require('./selectors.cjs');
+var utilities = require('./utilities.cjs');
+var animations = require('./animations.cjs');
+var variables = require('./variables.cjs');
+var syntaxes = require('./syntaxes.cjs');
+var modes = require('./modes.cjs');
+var functions = require('./functions.cjs');
+
+const config = {
+    at,
+    selectors,
+    utilities,
+    syntaxes,
+    functions,
+    animations,
+    variables,
+    modes,
+    scope: '',
+    rootSize: 16,
+    baseUnit: 4,
+    override: false,
+    important: false
+};
+
+exports.at = at;
+exports.selectors = selectors;
+exports.utilities = utilities;
+exports.animations = animations;
+exports.variables = variables;
+exports.syntaxes = syntaxes;
+exports.modes = modes;
+exports.functions = functions;
+exports.config = config;

package/dist/config/index.d.ts

@@ -1,18 +1,19 @@
-import mediaQueries from './media-queries';
+import at from './at';
 import selectors from './selectors';
-import semantics from './semantics';
+import utilities from './utilities';
 import animations from './animations';
 import variables from './variables';
-import rules from './rules';
+import syntaxes from './syntaxes';
+import modes from './modes';
 import functions from './functions';
 import type { PropertiesHyphen } from 'csstype';
-import type { Rule, RuleDefinition, ValueComponent } from '../rule';
+import type { Rule, SyntaxDefinition, ValueComponent } from '../rule';
 declare const config: Config;
-export { config, mediaQueries, selectors, semantics, rules, functions, animations, variables };
-export type VariableValue = number | string | Array<number | string>;
+export { config, at, selectors, utilities, syntaxes, functions, animations, variables, modes };
+export type VariableValue = number | string | false | Array<number | string>;
 export type VariableDefinition = {
     [key in '' | `@${string}` | string]?: VariableValue | VariableDefinition;
-};
+} | VariableValue;
 export type CSSKeyframes = {
     [key in 'from' | 'to' | string]: PropertiesHyphen;
 };
@@ -20,30 +21,32 @@ export type AnimationDefinitions = {
     [key: string]: CSSKeyframes;
 };
 export type SelectorDefinitions = {
-    [key: string]: string | string[] | SelectorDefinitions;
+    [key: string]: string | string[];
 };
-export type MediaQueryDefinitions = {
-    [key: string]: number | string | MediaQueryDefinitions;
+export type AtDefinitions = {
+    [key: string]: number | string | AtDefinitions;
 };
 export type StyleDefinitions = {
     [key: string]: string | StyleDefinitions;
 };
-export type RuleDefinitions = {
-    [key in keyof typeof rules | string]?: RuleDefinition;
+export type SyntaxDefinitions = {
+    [key in keyof typeof syntaxes | string]?: SyntaxDefinition;
 };
 export type VariableDefinitions = {
-    [key in keyof typeof rules]?: VariableDefinition;
+    [key in keyof typeof syntaxes]?: VariableDefinition;
 } & {
-    [key: string]: VariableDefinition | VariableValue;
+    [key: string]: VariableDefinition;
 };
-export type SemanticDefinitions = {
-    [key in keyof typeof semantics]?: PropertiesHyphen;
+export type UtilityDefinitions = {
+    [key in keyof typeof utilities]?: PropertiesHyphen;
 } & {
     [key: string]: PropertiesHyphen;
 };
+export type ModeDefinitions = {
+    [key: string]: 'class' | 'media' | 'host' | false;
+};
 export interface FunctionDefinition {
     unit?: string;
-    colored?: boolean;
     transform?(this: Rule, value: string, bypassVariableNames: string[]): string | ValueComponent[];
 }
 export type FunctionDefinitions = {
@@ -52,11 +55,11 @@ export type FunctionDefinitions = {
 export interface Config {
     extends?: (Config | any)[];
     styles?: StyleDefinitions;
-    mediaQueries?: MediaQueryDefinitions;
+    at?: AtDefinitions;
     selectors?: SelectorDefinitions;
-    semantics?: SemanticDefinitions;
+    utilities?: UtilityDefinitions;
     variables?: VariableDefinitions;
-    rules?: RuleDefinitions;
+    syntaxes?: SyntaxDefinitions;
     rootSize?: number;
     baseUnit?: number;
     scope?: string;
@@ -64,5 +67,5 @@ export interface Config {
     override?: boolean;
     functions?: FunctionDefinitions;
     animations?: AnimationDefinitions;
-    themeDriver?: 'class' | 'media' | 'host';
+    modes?: ModeDefinitions;
 }

package/dist/config/index.mjs

@@ -0,0 +1,26 @@
+import at from './at.mjs';
+import selectors from './selectors.mjs';
+import utilities from './utilities.mjs';
+import animations from './animations.mjs';
+import variables from './variables.mjs';
+import syntaxes from './syntaxes.mjs';
+import modes from './modes.mjs';
+import functions from './functions.mjs';
+
+const config = {
+    at,
+    selectors,
+    utilities,
+    syntaxes,
+    functions,
+    animations,
+    variables,
+    modes,
+    scope: '',
+    rootSize: 16,
+    baseUnit: 4,
+    override: false,
+    important: false
+};
+
+export { animations, at, config, functions, modes, selectors, syntaxes, utilities, variables };

package/dist/config/modes.cjs

@@ -0,0 +1,8 @@
+'use strict';
+
+const modes = {
+    dark: 'class',
+    light: 'class'
+};
+
+module.exports = modes;

package/dist/config/modes.d.ts

@@ -0,0 +1,3 @@
+import type { ModeDefinitions } from './';
+declare const modes: ModeDefinitions;
+export default modes;

package/dist/config/modes.mjs

@@ -0,0 +1,6 @@
+const modes = {
+    dark: 'class',
+    light: 'class'
+};
+
+export { modes as default };

package/dist/config/selectors.cjs

@@ -0,0 +1,28 @@
+'use strict';
+
+const selectors = {
+    '::scrollbar': '::-webkit-scrollbar',
+    '::scrollbar-button': '::-webkit-scrollbar-button',
+    '::scrollbar-thumb': '::-webkit-scrollbar-thumb',
+    '::scrollbar-track': '::-webkit-scrollbar-track',
+    '::scrollbar-track-piece': '::-webkit-scrollbar-track-piece',
+    '::scrollbar-corner': '::-webkit-scrollbar-corner',
+    '::slider-thumb': [
+        '::-webkit-slider-thumb',
+        '::-moz-range-thumb'
+    ],
+    '::slider-runnable-track': [
+        '::-webkit-slider-runnable-track',
+        '::-moz-range-track'
+    ],
+    '::resizer': '::-webkit-resizer',
+    '::progress': '::-webkit-progress',
+    ':first': ':first-child',
+    ':last': ':last-child',
+    ':even': ':nth-child(2n)',
+    ':odd': ':nth-child(odd)',
+    ':nth(': ':nth-child(',
+    ':only': ':only-child'
+};
+
+module.exports = selectors;

package/dist/config/selectors.d.ts

@@ -7,7 +7,6 @@ declare const selectors: {
     '::scrollbar-corner': string;
     '::slider-thumb': string[];
     '::slider-runnable-track': string[];
-    '::meter': string;
     '::resizer': string;
     '::progress': string;
     ':first': string;

package/dist/config/selectors.mjs

@@ -0,0 +1,26 @@
+const selectors = {
+    '::scrollbar': '::-webkit-scrollbar',
+    '::scrollbar-button': '::-webkit-scrollbar-button',
+    '::scrollbar-thumb': '::-webkit-scrollbar-thumb',
+    '::scrollbar-track': '::-webkit-scrollbar-track',
+    '::scrollbar-track-piece': '::-webkit-scrollbar-track-piece',
+    '::scrollbar-corner': '::-webkit-scrollbar-corner',
+    '::slider-thumb': [
+        '::-webkit-slider-thumb',
+        '::-moz-range-thumb'
+    ],
+    '::slider-runnable-track': [
+        '::-webkit-slider-runnable-track',
+        '::-moz-range-track'
+    ],
+    '::resizer': '::-webkit-resizer',
+    '::progress': '::-webkit-progress',
+    ':first': ':first-child',
+    ':last': ':last-child',
+    ':even': ':nth-child(2n)',
+    ':odd': ':nth-child(odd)',
+    ':nth(': ':nth-child(',
+    ':only': ':only-child'
+};
+
+export { selectors as default };

package/dist/config/styles.cjs

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/config/styles.mjs

@@ -0,0 +1 @@
+