@master/css 2.0.0-rc.61 → 2.0.0-rc.62

package/dist/utils/generate-selector.mjs

@@ -0,0 +1,47 @@
+import { SELECTOR_COMBINATORS } from '../common.mjs';
+
+const prefixMap = {
+    'class': '.',
+    'pseudo-class': ':',
+    'pseudo-element': '::',
+    'attribute': '',
+    'combinator': ''
+};
+function generateSelector(nodes, body = '') {
+    const generate = (node)=>{
+        if (node.type === 'attribute') return `[${node.value}]`;
+        if (node.type === 'combinator') return node.value;
+        const prefix = node.type && prefixMap[node.type] || '';
+        const base = node.value ? prefix + node.value : '';
+        if ('children' in node && node.children?.length) {
+            const childrenText = node.children.map(generate).join('');
+            return node.value ? base + `(${childrenText})` : base + childrenText;
+        }
+        return base;
+    };
+    let pre = '';
+    let current = '';
+    const groups = [];
+    const flatNodes = nodes.flatMap((node)=>!('value' in node) && 'children' in node && node.children?.length ? node.children : node);
+    flatNodes.forEach((node)=>{
+        if (node.value === ',') {
+            groups.push(current);
+            current = '';
+        } else if (node.value === 'of' && 'children' in node) {
+            pre += node.children.map(generate).join('');
+        } else {
+            current += generate(node);
+        }
+    });
+    if (current) groups.push(current);
+    if (pre) {
+        const lastChar = pre.charAt(pre.length - 1);
+        if (!SELECTOR_COMBINATORS.includes(lastChar) && lastChar !== ' ') {
+            pre += ' ';
+        }
+    }
+    const result = groups.length ? groups.map((text)=>pre + body + text).join(',') : pre + body;
+    return result;
+}
+
+export { generateSelector as default };

package/dist/utils/get-single-at-number-rule-node.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+function getSingleAtNumberRuleNode(nodes) {
+    if (nodes.length !== 1) return;
+    let atNumberRuleNode = nodes[0];
+    if (atNumberRuleNode.type === 'number') return atNumberRuleNode;
+}
+
+module.exports = getSingleAtNumberRuleNode;

package/dist/utils/get-single-at-number-rule-node.d.ts

@@ -0,0 +1,2 @@
+import { AtRuleNode } from './parse-at';
+export default function getSingleAtNumberRuleNode(nodes: AtRuleNode[]): import("./parse-at").AtRuleNumberNode | undefined;

package/dist/utils/get-single-at-number-rule-node.mjs

@@ -0,0 +1,7 @@
+function getSingleAtNumberRuleNode(nodes) {
+    if (nodes.length !== 1) return;
+    let atNumberRuleNode = nodes[0];
+    if (atNumberRuleNode.type === 'number') return atNumberRuleNode;
+}
+
+export { getSingleAtNumberRuleNode as default };

package/dist/utils/parse-at.cjs

@@ -0,0 +1,157 @@
+'use strict';
+
+var common = require('../common.cjs');
+var core = require('../core.cjs');
+var parsePair = require('./parse-pair.cjs');
+var parseValue = require('./parse-value.cjs');
+var replaceCharOutsideQuotes = require('./replace-char-outside-quotes.cjs');
+var splitCharOutsideQuotes = require('./split-char-outside-quotes.cjs');
+
+function parseAt(token, css = new core(), isRaw = true) {
+    let id;
+    let firstToken;
+    const resolve = (token)=>{
+        const regex = /([a-zA-Z0-9-:%|]+|[&|!|,|>|<|=][=]?)/g;
+        const raws = [
+            ...token.matchAll(regex)
+        ].map((match)=>match[0]);
+        let nodes = [];
+        const addNode = (node)=>{
+            let prev = nodes[nodes.length - 1];
+            if (node.type === 'number' && !node.name) {
+                if (prev?.type === 'comparison') {
+                    node.operator = prev.value;
+                    if (node.raw && prev.raw) {
+                        node.raw = prev.raw + node.raw;
+                    }
+                    nodes.pop();
+                    prev = nodes[nodes.length - 1];
+                    if (prev?.type === 'string') {
+                        node.name = prev.value;
+                        if (node.raw && prev.raw) {
+                            node.raw = prev.raw + node.raw;
+                        }
+                        nodes.pop();
+                    } else {
+                        node.name = 'width';
+                    }
+                } else {
+                    node.name = 'width';
+                    node.operator = '>=';
+                }
+            }
+            nodes.push(node);
+        };
+        raws.forEach((raw)=>{
+            if (common.AT_COMPARISON_OPERATORS.includes(raw)) {
+                const newNode = {
+                    type: 'comparison',
+                    value: raw
+                };
+                if (isRaw) newNode.raw = raw;
+                nodes.push(newNode);
+                return;
+            } else if (raw in common.AT_LOGICAL_OPERATORS) {
+                const newNode = {
+                    type: 'logical',
+                    value: common.AT_LOGICAL_OPERATORS[raw]
+                };
+                if (isRaw) newNode.raw = raw;
+                nodes.push(newNode);
+                return;
+            }
+            const definedAtRule = css.atRules.get(raw);
+            if (!id && !firstToken) {
+                firstToken = raw;
+                if (common.AT_IDENTIFIERS.includes(firstToken)) {
+                    id = firstToken;
+                    return;
+                } else if (definedAtRule) {
+                    id = definedAtRule.id;
+                } else if (common.AT_COMPARABLE_FEATURES.includes(firstToken)) {
+                    id = 'media';
+                } else if (firstToken.charAt(0).match(/[a-zA-Z-]/)) {
+                    id = 'container';
+                } else {
+                    id = 'media';
+                }
+            }
+            let node = {
+                type: 'string'
+            };
+            if (isRaw) node.raw = raw;
+            if (definedAtRule) {
+                if (definedAtRule.nodes.length === 1) {
+                    addNode({
+                        ...definedAtRule.nodes[0],
+                        raw
+                    });
+                } else if (definedAtRule.nodes.length) {
+                    addNode({
+                        raw,
+                        children: definedAtRule.nodes
+                    });
+                }
+                return;
+            } else {
+                const [splitedNameOrValue, splitedValue] = splitCharOutsideQuotes(raw, ':');
+                if (splitedValue) {
+                    node.name = splitedNameOrValue;
+                    node.value = splitedValue;
+                } else {
+                    node.value = splitedNameOrValue;
+                }
+                if (id === 'container' || id === 'media') {
+                    const { token, ...newNode } = parseValue(node.value, 'rem', css.config.rootSize);
+                    Object.assign(node, newNode);
+                }
+                addNode(node);
+            }
+        });
+        return nodes;
+    };
+    const pair = (token)=>{
+        const pairedAtNodes = [];
+        const paired = parsePair(token);
+        if (paired) {
+            if (paired.pre) {
+                pairedAtNodes.push(...pair(paired.pre));
+            }
+            if (paired.body) {
+                if (id === 'supports') {
+                    pairedAtNodes.push({
+                        type: 'group',
+                        children: [
+                            {
+                                type: 'string',
+                                value: replaceCharOutsideQuotes(paired.body, '|', ' ')
+                            }
+                        ]
+                    });
+                } else {
+                    const children = pair(paired.body);
+                    if (children.length > 1) {
+                        pairedAtNodes.push({
+                            type: 'group',
+                            children: pair(paired.body)
+                        });
+                    } else {
+                        pairedAtNodes.push(...children);
+                    }
+                }
+            }
+            if (paired.post) {
+                pairedAtNodes.push(...pair(paired.post));
+            }
+        } else {
+            pairedAtNodes.push(...resolve(token));
+        }
+        return pairedAtNodes;
+    };
+    return {
+        nodes: pair(token),
+        id: id || 'media' // should be assigned to here
+    };
+}
+
+module.exports = parseAt;

package/dist/utils/parse-at.d.ts

@@ -0,0 +1,39 @@
+import MasterCSS from '../core';
+import { AtIdentifier } from '../types/config';
+export type AtRule = {
+    id: AtIdentifier;
+    nodes: AtRuleNode[];
+};
+export declare type AtRuleNumberNode = {
+    raw?: string;
+    name: string;
+    type: 'number';
+    value: number;
+    unit?: string;
+    operator?: string;
+};
+export declare type AtRuleStringNode = {
+    raw?: string;
+    name: string;
+    type: 'string';
+    value: string;
+};
+export declare type AtRuleValueNode = AtRuleNumberNode | AtRuleStringNode;
+export interface AtRuleComparisonOperatorNode {
+    type: 'comparison';
+    raw?: string;
+    value: string;
+}
+export interface AtRuleLogicalOperatorNode {
+    type: 'logical';
+    raw?: string;
+    value: string;
+}
+export type AtRuleOperatorNode = AtRuleComparisonOperatorNode | AtRuleLogicalOperatorNode;
+export interface AtRuleGroupNode {
+    type?: 'group';
+    raw?: string;
+    children: AtRuleNode[];
+}
+export type AtRuleNode = AtRuleValueNode | AtRuleComparisonOperatorNode | AtRuleLogicalOperatorNode | AtRuleGroupNode;
+export default function parseAt(token: string, css?: MasterCSS, isRaw?: boolean): AtRule;

package/dist/utils/parse-at.mjs

@@ -0,0 +1,155 @@
+import { AT_COMPARISON_OPERATORS, AT_LOGICAL_OPERATORS, AT_IDENTIFIERS, AT_COMPARABLE_FEATURES } from '../common.mjs';
+import MasterCSS from '../core.mjs';
+import parsePair from './parse-pair.mjs';
+import parseValue from './parse-value.mjs';
+import replaceCharOutsideQuotes from './replace-char-outside-quotes.mjs';
+import splitCharOutsideQuotes from './split-char-outside-quotes.mjs';
+
+function parseAt(token, css = new MasterCSS(), isRaw = true) {
+    let id;
+    let firstToken;
+    const resolve = (token)=>{
+        const regex = /([a-zA-Z0-9-:%|]+|[&|!|,|>|<|=][=]?)/g;
+        const raws = [
+            ...token.matchAll(regex)
+        ].map((match)=>match[0]);
+        let nodes = [];
+        const addNode = (node)=>{
+            let prev = nodes[nodes.length - 1];
+            if (node.type === 'number' && !node.name) {
+                if (prev?.type === 'comparison') {
+                    node.operator = prev.value;
+                    if (node.raw && prev.raw) {
+                        node.raw = prev.raw + node.raw;
+                    }
+                    nodes.pop();
+                    prev = nodes[nodes.length - 1];
+                    if (prev?.type === 'string') {
+                        node.name = prev.value;
+                        if (node.raw && prev.raw) {
+                            node.raw = prev.raw + node.raw;
+                        }
+                        nodes.pop();
+                    } else {
+                        node.name = 'width';
+                    }
+                } else {
+                    node.name = 'width';
+                    node.operator = '>=';
+                }
+            }
+            nodes.push(node);
+        };
+        raws.forEach((raw)=>{
+            if (AT_COMPARISON_OPERATORS.includes(raw)) {
+                const newNode = {
+                    type: 'comparison',
+                    value: raw
+                };
+                if (isRaw) newNode.raw = raw;
+                nodes.push(newNode);
+                return;
+            } else if (raw in AT_LOGICAL_OPERATORS) {
+                const newNode = {
+                    type: 'logical',
+                    value: AT_LOGICAL_OPERATORS[raw]
+                };
+                if (isRaw) newNode.raw = raw;
+                nodes.push(newNode);
+                return;
+            }
+            const definedAtRule = css.atRules.get(raw);
+            if (!id && !firstToken) {
+                firstToken = raw;
+                if (AT_IDENTIFIERS.includes(firstToken)) {
+                    id = firstToken;
+                    return;
+                } else if (definedAtRule) {
+                    id = definedAtRule.id;
+                } else if (AT_COMPARABLE_FEATURES.includes(firstToken)) {
+                    id = 'media';
+                } else if (firstToken.charAt(0).match(/[a-zA-Z-]/)) {
+                    id = 'container';
+                } else {
+                    id = 'media';
+                }
+            }
+            let node = {
+                type: 'string'
+            };
+            if (isRaw) node.raw = raw;
+            if (definedAtRule) {
+                if (definedAtRule.nodes.length === 1) {
+                    addNode({
+                        ...definedAtRule.nodes[0],
+                        raw
+                    });
+                } else if (definedAtRule.nodes.length) {
+                    addNode({
+                        raw,
+                        children: definedAtRule.nodes
+                    });
+                }
+                return;
+            } else {
+                const [splitedNameOrValue, splitedValue] = splitCharOutsideQuotes(raw, ':');
+                if (splitedValue) {
+                    node.name = splitedNameOrValue;
+                    node.value = splitedValue;
+                } else {
+                    node.value = splitedNameOrValue;
+                }
+                if (id === 'container' || id === 'media') {
+                    const { token, ...newNode } = parseValue(node.value, 'rem', css.config.rootSize);
+                    Object.assign(node, newNode);
+                }
+                addNode(node);
+            }
+        });
+        return nodes;
+    };
+    const pair = (token)=>{
+        const pairedAtNodes = [];
+        const paired = parsePair(token);
+        if (paired) {
+            if (paired.pre) {
+                pairedAtNodes.push(...pair(paired.pre));
+            }
+            if (paired.body) {
+                if (id === 'supports') {
+                    pairedAtNodes.push({
+                        type: 'group',
+                        children: [
+                            {
+                                type: 'string',
+                                value: replaceCharOutsideQuotes(paired.body, '|', ' ')
+                            }
+                        ]
+                    });
+                } else {
+                    const children = pair(paired.body);
+                    if (children.length > 1) {
+                        pairedAtNodes.push({
+                            type: 'group',
+                            children: pair(paired.body)
+                        });
+                    } else {
+                        pairedAtNodes.push(...children);
+                    }
+                }
+            }
+            if (paired.post) {
+                pairedAtNodes.push(...pair(paired.post));
+            }
+        } else {
+            pairedAtNodes.push(...resolve(token));
+        }
+        return pairedAtNodes;
+    };
+    return {
+        nodes: pair(token),
+        id: id || 'media' // should be assigned to here
+    };
+}
+
+export { parseAt as default };

package/dist/utils/parse-pair.cjs

@@ -0,0 +1,51 @@
+'use strict';
+
+function parsePair(str, a = '(', b = ')') {
+    const stack = [];
+    let result = null;
+    let inString = null;
+    for(let i = 0; i < str.length; i++){
+        const char = str[i];
+        const prevChar = str[i - 1];
+        // 處理 escape 字元，例如 \"
+        if (char === '\\') {
+            i++ // skip next character
+            ;
+            continue;
+        }
+        // 處理字串區段進入與離開
+        if ((char === '"' || char === '\'') && prevChar !== '\\') {
+            if (inString === char) {
+                inString = null // 離開字串
+                ;
+            } else if (!inString) {
+                inString = char // 進入字串
+                ;
+            }
+            continue;
+        }
+        if (inString) continue; // 若在字串中就忽略括號處理
+        // 開始符號
+        if (str.startsWith(a, i)) {
+            stack.push({
+                start: i
+            });
+            i += a.length - 1;
+        } else if (str.startsWith(b, i)) {
+            const last = stack.pop();
+            if (last) {
+                result = {
+                    start: last.start,
+                    end: i,
+                    pre: str.slice(stack.length > 0 ? stack[stack.length - 1].start + a.length : 0, last.start),
+                    body: str.slice(last.start + a.length, i),
+                    post: str.slice(i + b.length)
+                };
+            }
+            i += b.length - 1;
+        }
+    }
+    return result;
+}
+
+module.exports = parsePair;

package/dist/utils/parse-pair.d.ts

@@ -0,0 +1,8 @@
+export interface ParsedPair {
+    start: number;
+    end: number;
+    pre: string;
+    body: string;
+    post: string;
+}
+export default function parsePair(str: string, a?: string, b?: string): ParsedPair | null;

package/dist/utils/parse-pair.mjs

@@ -0,0 +1,49 @@
+function parsePair(str, a = '(', b = ')') {
+    const stack = [];
+    let result = null;
+    let inString = null;
+    for(let i = 0; i < str.length; i++){
+        const char = str[i];
+        const prevChar = str[i - 1];
+        // 處理 escape 字元，例如 \"
+        if (char === '\\') {
+            i++ // skip next character
+            ;
+            continue;
+        }
+        // 處理字串區段進入與離開
+        if ((char === '"' || char === '\'') && prevChar !== '\\') {
+            if (inString === char) {
+                inString = null // 離開字串
+                ;
+            } else if (!inString) {
+                inString = char // 進入字串
+                ;
+            }
+            continue;
+        }
+        if (inString) continue; // 若在字串中就忽略括號處理
+        // 開始符號
+        if (str.startsWith(a, i)) {
+            stack.push({
+                start: i
+            });
+            i += a.length - 1;
+        } else if (str.startsWith(b, i)) {
+            const last = stack.pop();
+            if (last) {
+                result = {
+                    start: last.start,
+                    end: i,
+                    pre: str.slice(stack.length > 0 ? stack[stack.length - 1].start + a.length : 0, last.start),
+                    body: str.slice(last.start + a.length, i),
+                    post: str.slice(i + b.length)
+                };
+            }
+            i += b.length - 1;
+        }
+    }
+    return result;
+}
+
+export { parsePair as default };

package/dist/utils/parse-selector.cjs

@@ -0,0 +1,112 @@
+'use strict';
+
+var common = require('../common.cjs');
+var core = require('../core.cjs');
+var parsePair = require('./parse-pair.cjs');
+
+const SELECTOR_REGEX = new RegExp(`(?:[a-zA-Z0-9-]+)|([${common.SELECTOR_COMBINATORS.join('')}.:,])|(a-zA-Z0-9-)`, 'g');
+function parseSelector(token, css = new core(), isRaw = true) {
+    const resolve = (eachToken)=>{
+        const nodes = [];
+        let currentPrefix = '';
+        let tokenIndex = 0;
+        for (const match of eachToken.matchAll(SELECTOR_REGEX)){
+            const raw = match[0];
+            tokenIndex += raw.length;
+            if (raw === ':' || raw === '.') {
+                currentPrefix += raw;
+                continue;
+            }
+            let type;
+            let value = raw;
+            const definedNodes = css.selectors.get(currentPrefix + raw);
+            if (definedNodes) {
+                const firstNode = definedNodes[definedNodes.length - 1];
+                nodes.push(definedNodes.length === 1 && firstNode.type ? {
+                    ...firstNode,
+                    raw: currentPrefix + raw
+                } : {
+                    children: definedNodes,
+                    raw: currentPrefix + raw
+                });
+                currentPrefix = '';
+                continue;
+            }
+            if (common.SELECTOR_COMBINATORS.includes(raw)) {
+                type = 'combinator';
+                if (raw === '_') {
+                    const nextRawValue = eachToken[tokenIndex];
+                    const prevRawValue = eachToken[tokenIndex - raw.length - 1];
+                    if (prevRawValue !== '_' && nextRawValue !== '_') {
+                        value = ' ' // support BEM __
+                        ;
+                    }
+                }
+            } else if (raw === ',') {
+                type = 'separator';
+            } else if (currentPrefix === ':') {
+                type = 'pseudo-class';
+            } else if (currentPrefix === '::') {
+                type = 'pseudo-element';
+            } else if (currentPrefix === '.') {
+                type = 'class';
+            }
+            nodes.push({
+                value,
+                ...isRaw && {
+                    raw: currentPrefix + raw
+                },
+                ...type && {
+                    type
+                }
+            });
+            currentPrefix = '';
+        }
+        return nodes;
+    };
+    const pair = (eachToken, nodes = [])=>{
+        const paired = parsePair(eachToken);
+        if (paired) {
+            let { pre, body, post } = paired;
+            let name;
+            if (body) {
+                const lastColonIndex = pre.lastIndexOf(':');
+                if (lastColonIndex !== -1) {
+                    name = pre.slice(lastColonIndex);
+                    pre = pre.slice(0, lastColonIndex);
+                }
+            }
+            if (pre) nodes.push(...pair(pre));
+            if (body) {
+                const children = pair(body);
+                if (name) {
+                    const node = resolve(name)[0];
+                    if (children.length) node.children = children;
+                    nodes.push(node);
+                } else {
+                    nodes.push(...children);
+                }
+            }
+            if (post) nodes.push(...pair(post));
+            return nodes;
+        }
+        const attrPaired = parsePair(eachToken, '[', ']');
+        if (attrPaired) {
+            const { pre, body, post } = attrPaired;
+            if (pre) nodes.push(...pair(pre));
+            nodes.push({
+                value: body,
+                type: 'attribute',
+                ...isRaw && {
+                    raw: `[${body}]`
+                }
+            });
+            if (post) nodes.push(...pair(post));
+            return nodes;
+        }
+        return resolve(eachToken);
+    };
+    return pair(token);
+}
+
+module.exports = parseSelector;

package/dist/utils/parse-selector.d.ts

@@ -0,0 +1,19 @@
+import MasterCSS from '../core';
+export declare type SelectorLiteralNode = {
+    type?: 'attribute' | 'pseudo-class' | 'pseudo-element' | 'class';
+    raw?: string;
+    value?: string;
+    children?: SelectorNode[];
+};
+export declare type SelectorSeparatorNode = {
+    type: 'separator';
+    raw?: string;
+    value: string;
+};
+export declare type SelectorCombinatorNode = {
+    type: 'combinator';
+    raw?: string;
+    value: string;
+};
+export declare type SelectorNode = SelectorLiteralNode | SelectorCombinatorNode | SelectorSeparatorNode;
+export default function parseSelector(token: string, css?: MasterCSS, isRaw?: boolean): SelectorNode[];