@master/css 2.0.0-beta.20 → 2.0.0-beta.200

package/dist/rule.d.ts

@@ -1,65 +1,120 @@
-import MasterCSS from './css';
-import type { MasterCSSConfig } from './config';
-export default class MasterCSSRule {
+import type { MasterCSS, Variable } from './core';
+import { CSSDeclarations } from './types/css-declarations';
+import { Layer } from './layer';
+export declare class Rule {
     readonly className: string;
-    readonly matching: MasterCSSRuleMatching;
+    readonly definition: RuleDefinition;
     css: MasterCSS;
-    readonly prefix: string;
-    readonly symbol: string;
-    readonly token: string;
-    readonly prefixSelectors: string[];
-    readonly vendorSuffixSelectors: Record<string, string[]>;
-    readonly important: boolean;
-    readonly media: MasterCSSMedia;
     readonly at: Record<string, string>;
-    readonly direction: string;
-    readonly themeName: string;
-    readonly unitToken: string;
-    readonly hasWhere: boolean;
-    readonly prioritySelectorIndex: number;
-    readonly natives: {
-        unit: string;
-        value: string | Record<string, string | number>;
-        text: string;
-        themeName: string;
-        cssRule?: CSSRule;
-    }[];
-    static id: string;
-    static propName: string;
-    static matches: RegExp;
-    static colorStarts: string;
-    static symbol: string;
-    static unit: string;
-    static colorful: boolean;
-    static match(name: string, colorNames: string[]): MasterCSSRuleMatching;
-    constructor(className: string, matching: MasterCSSRuleMatching, css: MasterCSS);
+    readonly priority: number;
+    readonly natives: NativeRule[];
+    readonly order: number;
+    readonly layer: Layer;
+    readonly stateToken: string;
+    readonly declarations: CSSDeclarations;
+    readonly colored: boolean;
+    animationNames: string[];
+    variableNames: string[];
+    constructor(className: string, definition: RuleDefinition, css: MasterCSS);
+    resolveValue: (valueComponents: ValueComponent[], unit: string, bypassVariableNames: string[]) => string;
+    get text(): string;
+    parseValue: (currentValueComponents: ValueComponent[], i: number, value: string, unit: string, endSymbol?: string, parentFunctionName?: any, bypassVariableNames?: string[]) => number;
+    parseValueComponent(token: string | number, unit?: any): StringValueComponent | NumericValueComponent;
 }
-export default interface MasterCSSRule {
-    readonly order?: number;
-    parseValue(value: string, config: MasterCSSConfig): string;
-    get(declaration: MasterCSSDeclaration): Record<string, any>;
-    getThemeProps(declaration: MasterCSSDeclaration, css: MasterCSS): Record<string, Record<string, string>>;
+export type ValueComponent = StringValueComponent | NumericValueComponent | FunctionValueComponent | VariableValueComponent | SeparatorValueComponent;
+export interface StringValueComponent {
+    text?: string;
+    token?: string;
+    type: 'string';
+    value: string;
 }
-export interface MasterCSSMediaFeatureRule {
-    token: string;
-    tokenType?: string;
-    operator?: string;
-    value?: number;
+export interface NumericValueComponent {
+    text?: string;
+    token?: string;
+    type: 'number';
+    value: number;
     unit?: string;
 }
-export interface MasterCSSMedia {
+export interface FunctionValueComponent {
+    text?: string;
+    token?: string;
+    type: 'function';
+    name: string;
+    symbol: string;
+    children: ValueComponent[];
+}
+export interface VariableValueComponent {
+    text?: string;
+    token?: string;
+    type: 'variable';
+    name: string;
+    alpha?: string;
+    fallback?: string;
+    variable?: Variable;
+}
+export interface SeparatorValueComponent {
+    text?: string;
+    type: 'separator';
+    value: string;
+}
+export interface Rule {
+    prefix?: string;
+    token?: string;
+    vendorPrefixSelectors?: Record<string, string[]>;
+    vendorSuffixSelectors?: Record<string, string[]>;
+    important?: boolean;
+    media?: MediaQuery;
+    direction?: string;
+    theme?: string;
+    unitToken?: string;
+    hasWhere?: boolean;
+    valueComponents?: Array<ValueComponent>;
+    constructor: {
+        match?(name: string, matches: RegExp, colors: Record<string, Record<string, string>>, colorNames: string[]): RuleMeta;
+    };
+}
+export interface RuleDefinition {
+    id?: string;
+    match?: RegExp | [string, string[]?];
+    resolvedMatch?: RegExp;
+    resolvedVariables?: any;
+    variables?: string[];
+    order?: number;
+    separators?: string[];
+    shorthand?: string;
+    colored?: boolean;
+    numeric?: boolean;
+    unit?: any;
+    native?: boolean;
+    declarations?: CSSDeclarations;
+    layer?: Layer;
+    analyze?: (this: Rule, className: string) => [valueToken: string, prefixToken?: string];
+    transformValue?(this: Rule, value: string): string;
+    transformValueComponents?(this: Rule, valueComponents: ValueComponent[]): ValueComponent[];
+    declare?(this: Rule, value: string, unit: string): CSSDeclarations;
+    delete?(this: Rule, className: string): void;
+    create?(this: Rule, className: string): void;
+    insert?(this: Rule): void;
+}
+export interface NativeRule {
+    text: string;
+    cssRule?: CSSRule;
+}
+export type MediaFeatureComponent = {
+    type: string;
+    tokenType?: string;
+    operator?: string;
+    value: number;
+    unit: string;
+};
+export interface MediaQuery {
     token: string;
     features?: {
-        [key: string]: MasterCSSMediaFeatureRule;
+        [key: string]: MediaFeatureComponent;
     };
     type?: string;
 }
-export interface MasterCSSDeclaration {
-    value: any;
-    unit: string;
-    important: boolean;
-}
-export interface MasterCSSRuleMatching {
-    origin: 'matches' | 'semantics' | 'symbol';
-    value?: string;
+export interface RuleMeta {
+    value?: [string, string | Record<string, string>];
+    config?: RuleDefinition;
 }

package/dist/types/css-declarations.d.ts

@@ -0,0 +1,4 @@
+import { PropertiesHyphen } from 'csstype';
+export type CSSDeclarations = {
+    [key in keyof PropertiesHyphen]?: PropertiesHyphen[key];
+};

package/dist/utils/flatten-obj.d.ts

@@ -0,0 +1,4 @@
+export declare function flattenObj(obj: any, options?: {
+    joiner?: string;
+    parentKey?: string;
+}): {};

package/dist/utils/hex-to-rgb.d.ts

@@ -1 +1 @@
-export declare function hexToRgb(hex: any): number[];
+export declare function hexToRgb(hex: string): number[];

package/dist/utils/is-plain-object.d.ts

@@ -1,4 +1,4 @@
-export declare type PlainObject = Record<string | number | symbol, any>;
+export type PlainObject = Record<string | number | symbol, any>;
 /**
  * Returns whether the payload is a plain JavaScript object (excluding special classes or objects with other prototypes)
  *

package/package.json

@@ -1,162 +1 @@
-{
-    "name": "@master/css",
-    "license": "MIT",
-    "description": "A Virtual CSS language with enhanced syntax. ( ~13KB )",
-    "author": "Aoyue Design LLC.",
-    "funding": "https://docs.master.co/css/donate",
-    "homepage": "https://css.master.co",
-    "repository": {
-        "type": "git",
-        "url": "https://github.com/master-co/css.git"
-    },
-    "keywords": [
-        "style",
-        "styles",
-        "html",
-        "variants",
-        "virtual",
-        "virtual-css",
-        "utility",
-        "css",
-        "ui",
-        "lightweight",
-        "class",
-        "webpack",
-        "plugin",
-        "integration",
-        "vite",
-        "parcel",
-        "build-tools",
-        "mastercss"
-    ],
-    "sideEffects": [
-        "./src/polyfills/css-escape.ts"
-    ],
-    "scripts": {
-        "build:iife": "esbuild src/index.browser.ts --bundle --outfile=dist/index.browser.js --format=iife",
-        "build:cjs": "esbuild src/index.ts --bundle --outfile=dist/index.cjs --format=cjs --platform=node",
-        "build:esm": "esbuild src/index.ts --bundle --outfile=dist/index.mjs --format=esm --platform=node",
-        "build:css": "esbuild src/index.css --bundle --outfile=dist/index.css",
-        "dev:iife": "npm run build:iife -- --watch",
-        "dev:cjs": "npm run build:cjs -- --watch",
-        "dev:esm": "npm run build:esm -- --watch",
-        "prod": "rm -rf dist && npm run build:cjs -- --minify --sourcemap && npm run build:iife -- --minify --sourcemap && npm run build:esm -- --minify --sourcemap && tsc --emitDeclarationOnly",
-        "test": "jest",
-        "lint": "eslint ./src"
-    },
-    "main": "./dist/index.cjs",
-    "jsnext:main": "./dist/index.mjs",
-    "browser": "./dist/index.browser.js",
-    "esnext": "./dist/index.mjs",
-    "module": "./dist/index.mjs",
-    "types": "./dist/index.d.ts",
-    "exports": {
-        ".": {
-            "require": "./dist/index.cjs",
-            "import": "./dist/index.mjs",
-            "types": "./dist/index.d.ts"
-        }
-    },
-    "jest": {
-        "testEnvironment": "node",
-        "transform": {
-            "^.+\\.(t|j)sx?$": "@swc/jest"
-        },
-        "testMatch": [
-            "<rootDir>/tests/*.ts",
-            "<rootDir>/src/**/*.test.ts"
-        ]
-    },
-    "private": false,
-    "publishConfig": {
-        "access": "public"
-    },
-    "engines": {
-        "node": ">=14"
-    },
-    "release": {
-        "plugins": [
-            [
-                "@semantic-release/commit-analyzer",
-                {
-                    "preset": "angular",
-                    "releaseRules": [
-                        {
-                            "type": "docs",
-                            "scope": "README",
-                            "release": "patch"
-                        },
-                        {
-                            "type": "refactor",
-                            "release": "patch"
-                        },
-                        {
-                            "type": "style",
-                            "release": "patch"
-                        }
-                    ],
-                    "parserOpts": {
-                        "noteKeywords": [
-                            "BREAKING CHANGE",
-                            "BREAKING CHANGES"
-                        ]
-                    }
-                }
-            ],
-            "@semantic-release/release-notes-generator",
-            [
-                "@semantic-release/exec",
-                {
-                    "prepareCmd": "npm run prod"
-                }
-            ],
-            [
-                "@semantic-release/github",
-                {
-                    "assets": [
-                        {
-                            "path": "dist/index.browser.js",
-                            "label": "master-css.min.js"
-                        }
-                    ]
-                }
-            ],
-            [
-                "@semantic-release/npm"
-            ]
-        ],
-        "branches": [
-            "+([0-9])?(.{+([0-9]),x}).x",
-            "main",
-            "next",
-            "next-major",
-            {
-                "name": "beta",
-                "prerelease": true
-            },
-            {
-                "name": "alpha",
-                "prerelease": true
-            }
-        ]
-    },
-    "files": [
-        "dist"
-    ],
-    "devDependencies": {
-        "@semantic-release/exec": "^6.0.3",
-        "@swc/core": "^1.3.9",
-        "@swc/jest": "^0.2.23",
-        "@types/jest": "^29.2.0",
-        "@types/node": "^18.11.0",
-        "@typescript-eslint/eslint-plugin": "^5.40.1",
-        "@typescript-eslint/parser": "^5.40.1",
-        "esbuild": "^0.15.10",
-        "eslint": "^8.25.0",
-        "jest": "^29.2.2",
-        "semantic-release": "^19.0.5",
-        "typescript": "^4.8.4",
-        "dedent": "^0.7.0"
-    },
-    "version": "2.0.0-beta.20"
-}
+{"name":"@master/css","scripts":{"build":"techor pack --external @master/css-renderer @master/css-extractor","dev":"pnpm run build --watch --no-declare","test":"jest","type-check":"tsc --noEmit","lint":"eslint src"},"license":"MIT","description":"A markup-driven CSS language with enhanced syntax","author":"Aoyue Design LLC.","funding":"https://css.master.co/docs/donate","homepage":"https://css.master.co","bugs":{"url":"https://github.com/master-co/css/issues"},"repository":{"type":"git","url":"https://github.com/master-co/css.git","directory":"packages/css"},"keywords":["style","styles","html","variants","virtual","virtual-css","utility","css","ui","lightweight","class","webpack","plugin","integration","vite","parcel","build-tools","mastercss"],"sideEffects":false,"main":"./dist/index.bundle.js","jsnext:main":"./dist/index.bundle.mjs","esnext":"./dist/index.bundle.mjs","module":"./dist/index.bundle.mjs","browser":"./dist/index.browser.bundle.js","types":"./dist/index.d.ts","exports":{".":{"browser":{"import":"./dist/index.bundle.mjs","types":"./dist/index.browser.d.ts"},"require":"./dist/index.bundle.js","import":"./dist/index.bundle.mjs","types":"./dist/index.d.ts"}},"files":["dist"],"bin":{"mcss":"./dist/bin/index.bundle.js","mastercss":"./dist/bin/index.bundle.js"},"publishConfig":{"access":"public"},"dependencies":{"@master/normal.css":"^2.0.0-beta.200","@techor/fs":"^2.5.4","@techor/log":"^2.5.4","commander":"^11.0.0"},"devDependencies":{"@techor/extend":"^2.5.4","@techor/pack":"^2.5.4","css-shared":"^2.0.0-beta.200","csstype":"^3.1.2","puppeteer":"^21.0.1","vite":"^4.2.1"},"version":"2.0.0-beta.200"}

package/LICENSE

@@ -1,21 +0,0 @@
-The MIT License
-
-Copyright (c) Aoyue Design LLC.
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.

package/dist/apis/extend.d.ts

@@ -1,5 +0,0 @@
-declare type ExpandDeep<T> = T extends Record<string | number | symbol, unknown> ? {
-    [K in keyof T]: ExpandDeep<T[K]>;
-} : T extends Array<infer E> ? Array<ExpandDeep<E>> : T;
-export default function extend<T extends Record<string, any>>(object: T, ...otherObjects: any[]): ExpandDeep<any>;
-export {};

package/dist/apis/render-from-html.d.ts

@@ -1,3 +0,0 @@
-import MasterCSS from '../css';
-import '../polyfills/css-escape';
-export default function renderFromHTML(html: string, css?: MasterCSS): string;

package/dist/apis/render-into-html.d.ts

@@ -1,3 +0,0 @@
-import MasterCSS from '../css';
-import '../polyfills/css-escape';
-export default function renderIntoHTML(html: string, css?: MasterCSS): string;

package/dist/apis/render.d.ts

@@ -1,3 +0,0 @@
-import MasterCSS from '../css';
-import '../polyfills/css-escape';
-export default function render(classes: string[], css?: MasterCSS): string;

package/dist/config/colors.d.ts

@@ -1,25 +0,0 @@
-declare const defaultColors: {
-    slate: any;
-    gray: any;
-    brown: any;
-    orange: any;
-    gold: any;
-    yellow: any;
-    grass: any;
-    green: any;
-    beryl: any;
-    teal: any;
-    cyan: any;
-    sky: any;
-    blue: any;
-    indigo: any;
-    violet: any;
-    purple: any;
-    fuchsia: any;
-    pink: any;
-    crimson: any;
-    red: any;
-    black: string;
-    white: string;
-};
-export default defaultColors;

package/dist/config/root-size.d.ts

@@ -1,2 +0,0 @@
-declare const defaultRootSize = 16;
-export default defaultRootSize;

package/dist/config/scheme.d.ts

@@ -1,7 +0,0 @@
-declare const defaultScheme: {
-    storage: {
-        sync: boolean;
-        key: string;
-    };
-};
-export default defaultScheme;

package/dist/config/themes.d.ts

@@ -1,2 +0,0 @@
-declare const defaultThemes: string[];
-export default defaultThemes;

package/dist/config/values.d.ts

@@ -1,126 +0,0 @@
-declare const defaultValues: {
-    BackgroundClip: {
-        content: string;
-        border: string;
-        padding: string;
-    };
-    BackgroundOrigin: {
-        content: string;
-        border: string;
-        padding: string;
-    };
-    BoxSizing: {
-        content: string;
-        border: string;
-    };
-    ClipPath: {
-        margin: string;
-        fill: string;
-        stroke: string;
-        view: string;
-        content: string;
-        border: string;
-        padding: string;
-    };
-    FlexDirection: {
-        col: string;
-        'col-reverse': string;
-    };
-    FontFamily: {
-        mono: string;
-        sans: string;
-        serif: string;
-    };
-    FontWeight: {
-        thin: number;
-        extralight: number;
-        light: number;
-        regular: number;
-        medium: number;
-        semibold: number;
-        bold: number;
-        extrabold: number;
-        heavy: number;
-    };
-    GridAutoColumns: {
-        min: string;
-        max: string;
-    };
-    GridAutoRows: {
-        min: string;
-        max: string;
-    };
-    GridTemplateColumns: {
-        min: string;
-        max: string;
-    };
-    GridTemplateRows: {
-        min: string;
-        max: string;
-    };
-    Order: {
-        first: number;
-        last: number;
-    };
-    Position: {
-        abs: string;
-        rel: string;
-    };
-    ShapeOutside: {
-        margin: string;
-        content: string;
-        border: string;
-        padding: string;
-    };
-    TransformBox: {
-        fill: string;
-        stroke: string;
-        view: string;
-        content: string;
-        border: string;
-        padding: string;
-    };
-    Width: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-    MinWidth: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-    MinHeight: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-    MaxWidth: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-    MaxHeight: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-    Height: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-    FlexBasis: {
-        full: string;
-        fit: string;
-        max: string;
-        min: string;
-    };
-};
-export default defaultValues;

package/dist/css.d.ts

@@ -1,80 +0,0 @@
-import type { MasterCSSConfig } from './config';
-import MasterCSSRule from './rule';
-declare const MutationObserver: ObjectConstructor | {
-    new (callback: MutationCallback): MutationObserver;
-    prototype: MutationObserver;
-};
-export declare type MasterCSSOptions = {
-    config?: MasterCSSConfig;
-    override?: boolean;
-    observe?: boolean;
-};
-export default class MasterCSS extends MutationObserver {
-    #private;
-    options?: MasterCSSOptions;
-    static instances: MasterCSS[];
-    static root: MasterCSS;
-    /**
-     * 全部 sheet 根據目前蒐集到的所有 DOM class 重新 findAndNew
-     */
-    static refresh(config: MasterCSSConfig): void;
-    readonly style: HTMLStyleElement;
-    readonly rules: MasterCSSRule[];
-    readonly ruleOfClass: Record<string, MasterCSSRule>;
-    readonly countOfClass: {};
-    readonly host: Element;
-    readonly root: Document | ShadowRoot;
-    readonly ready: boolean;
-    readonly config: MasterCSSConfig;
-    semantics: [RegExp, string][];
-    classes: Record<string, string[]>;
-    colorsThemesMap: Record<string, Record<string, Record<string, string>>>;
-    colorNames: string[];
-    themeNames: string[];
-    relationThemesMap: Record<string, Record<string, string[]>>;
-    relations: Record<string, string[]>;
-    selectors: Record<string, [RegExp, string[]][]>;
-    private schemeMQL;
-    constructor(options?: MasterCSSOptions);
-    get storageScheme(): string;
-    set scheme(scheme: string);
-    get scheme(): string;
-    set theme(theme: string);
-    get theme(): string;
-    private removeSchemeListener;
-    private onThemeChange;
-    private cache;
-    observe(root: Document | ShadowRoot, options?: MutationObserverInit): this;
-    disconnect(): void;
-    /**
-     * 尋找匹配的 MasterCSSRule 生成實例
-     */
-    findAndNew(name: string): MasterCSSRule | MasterCSSRule[];
-    /**
-     * 根據目前蒐集到的所有 DOM class 重新 findAndNew
-     */
-    refresh(config: MasterCSSConfig): void;
-    destroy(): void;
-    /**
-     * 1. where
-     * 2. normal
-     * 3. where selectors
-     * 4. normal selectors
-     * 5. media where
-     * 6. media normal
-     * 7. media selectors
-     * 8. media width where
-     * 9. media width
-     * 10. media width selectors
-     */
-    insert(rule: MasterCSSRule): void;
-    delete(className: string): void;
-    findAndInsert(className: string): void;
-    get text(): string;
-}
-declare global {
-    interface Window {
-        MasterCSS: typeof MasterCSS;
-    }
-}
-export {};