@master/css - npm Package Compare versions

Comparing version 2.0.0-beta.191 to 2.0.0-beta.192

dist/bin/index.bundle.js

 #!/usr/bin/env node
-var h=Object.create;var d=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var O=(e,o,t,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of _(o))!E.call(e,s)&&s!==t&&d(e,s,{get:()=>o[s],enumerable:!(i=C(o,s))||i.enumerable});return e};var p=(e,o,t)=>(t=e!=null?h(x(e)):{},O(o||!e||!e.__esModule?d(t,"default",{value:e,enumerable:!0}):t,e));var T=require("commander"),m=p(require("path")),a=p(require("fs"));var S=`/** @type {import('@master/css').Config} */
+var h=Object.create;var d=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var O=(e,o,t,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of _(o))!E.call(e,s)&&s!==t&&d(e,s,{get:()=>o[s],enumerable:!(r=C(o,s))||r.enumerable});return e};var p=(e,o,t)=>(t=e!=null?h(x(e)):{},O(o||!e||!e.__esModule?d(t,"default",{value:e,enumerable:!0}):t,e));var T=require("commander"),m=p(require("path")),a=p(require("fs"));var S=`/** @type {import('@master/css').Config} */
 export default {
     styles: {},
-    colors: {},
     rules: {},
@@ -17,3 +16,2 @@ variables: {},
     styles: {},
-    colors: {},
     rules: {},
@@ -31,3 +29,2 @@ variables: {},
     styles: {},
-    colors: {},
     rules: {},
@@ -41,2 +38,2 @@ variables: {},
 } as Config
-`;var n=p(require("@techor/log")),l=require("@techor/fs"),{version:v,name:j,description:F}=(0,l.readJSONFileSync)(m.default.resolve(__dirname,"../../package.json")),c=new T.Command;c.name(j).description(F).version(v||"0.0.0");c.command("init").description("Initialize definition files for Master CSS").option("-o, --override","Override existing definition file").option("--esm","ES Module .mjs").option("--ts","TypeScript .ts").option("--cjs","CommonJS .js").action(async function(e){let{esm:o,ts:t,cjs:i}=e;if(!o&&!t&&!i)if(a.default.existsSync("tsconfig.json"))t=!0;else{let{type:r}=(0,l.readJSONFileSync)("./package.json")||{};r==="module"?o=!0:i=!0}let s=(r,f)=>{let u=a.default.existsSync(m.default.join(process.cwd(),r));u?u&&e.override?(a.default.writeFileSync(r,f),n.default.ok`**${r}** file is overridden`):n.default.x`**${r}** file already exists`:(a.default.writeFileSync(r,f),n.default.ok`**${r}** file is created`)};o&&s("master.css.mjs",S),t&&s("master.css.ts",y),i&&s("master.css.js",g)});c.command("render").description("Scans HTML and injects generated CSS rules").argument("<source paths>","The path in glob patterns of the source of the HTML file").option("-c --config <path>","The source path of the Master CSS configuration","master.css.*").option("-a --analyze","Analyze injected CSS and HTML size ( brotli ) without writing to file").action(async function(e,o){try{await require("@master/css-renderer/actions/main")(e,o)}catch(t){t.code==="ERR_MODULE_NOT_FOUND"?n.default.i`Please run **npm** **install** **@master/css-renderer** first`:console.error(t)}});c.command("extract").argument("[source paths]","The glob pattern path to extract sources").option("-w, --watch","Watch file changed and generate CSS rules.").option("-o, --output <path>","Specify your CSS file output path").option("-v, --verbose","Verbose logging 0~N","1").option("--options <path>","Specify your extractor options sources","master.css-extractor.*").action(async function(e,o){try{await require("@master/css-extractor/actions/main")(e,o)}catch(t){t.code==="ERR_MODULE_NOT_FOUND"?n.default.i`Please run **npm** **install** **@master/css-extractor** first`:console.error(t)}});c.parse();
+`;var n=p(require("@techor/log")),l=require("@techor/fs"),{version:v,name:j,description:F}=(0,l.readJSONFileSync)(m.default.resolve(__dirname,"../../package.json")),c=new T.Command;c.name(j).description(F).version(v||"0.0.0");c.command("init").description("Initialize definition files for Master CSS").option("-o, --override","Override existing definition file").option("--esm","ES Module .mjs").option("--ts","TypeScript .ts").option("--cjs","CommonJS .js").action(async function(e){let{esm:o,ts:t,cjs:r}=e;if(!o&&!t&&!r)if(a.default.existsSync("tsconfig.json"))t=!0;else{let{type:i}=(0,l.readJSONFileSync)("./package.json")||{};i==="module"?o=!0:r=!0}let s=(i,f)=>{let u=a.default.existsSync(m.default.join(process.cwd(),i));u?u&&e.override?(a.default.writeFileSync(i,f),n.default.ok`**${i}** file is overridden`):n.default.x`**${i}** file already exists`:(a.default.writeFileSync(i,f),n.default.ok`**${i}** file is created`)};o&&s("master.css.mjs",S),t&&s("master.css.ts",y),r&&s("master.css.js",g)});c.command("render").description("Scans HTML and injects generated CSS rules").argument("<source paths>","The path in glob patterns of the source of the HTML file").option("-c --config <path>","The source path of the Master CSS configuration","master.css.*").option("-a --analyze","Analyze injected CSS and HTML size ( brotli ) without writing to file").action(async function(e,o){try{await require("@master/css-renderer/actions/main")(e,o)}catch(t){t.code==="ERR_MODULE_NOT_FOUND"?n.default.i`Please run **npm** **install** **@master/css-renderer** first`:console.error(t)}});c.command("extract").argument("[source paths]","The glob pattern path to extract sources").option("-w, --watch","Watch file changed and generate CSS rules.").option("-o, --output <path>","Specify your CSS file output path").option("-v, --verbose","Verbose logging 0~N","1").option("--options <path>","Specify your extractor options sources","master.css-extractor.*").action(async function(e,o){try{await require("@master/css-extractor/actions/main")(e,o)}catch(t){t.code==="ERR_MODULE_NOT_FOUND"?n.default.i`Please run **npm** **install** **@master/css-extractor** first`:console.error(t)}});c.parse();

dist/config/functions.d.ts

@@ -6,3 +6,26 @@ declare const functions: {
     calc: {
-        transform(opening: any, value: any, closing: any): string;
+        transform(opening: any, value: any, closing: any): (string | number | {
+            type: "function";
+            name: string;
+            symbol: string;
+            childrens: (string | number | any | {
+                type: "variable";
+                name: string;
+                alpha?: string;
+            } | {
+                type: "separator";
+                value: string;
+                prefixWhite?: boolean;
+                suffixWhite?: boolean;
+            })[];
+        } | {
+            type: "variable";
+            name: string;
+            alpha?: string;
+        } | {
+            type: "separator";
+            value: string;
+            prefixWhite?: boolean;
+            suffixWhite?: boolean;
+        })[];
     };
@@ -9,0 +32,0 @@ translate: {

dist/config/index.d.ts

 import mediaQueries from './media-queries';
-import colors from './colors';
 import selectors from './selectors';
@@ -12,6 +11,8 @@ import semantics from './semantics';
 declare const config: Config;
-export { config, mediaQueries, colors, selectors, semantics, rules, functions, animations, variables };
-type Variable = number | string | (number | string)[];
-type VariableGroup = {
-    [key: string]: Variable;
+export { config, mediaQueries, selectors, semantics, rules, functions, animations, variables };
+export type ConfigVariable = number | string | Array<number | string>;
+export type ConfigVariableGroup = {
+    [key in '' | `@${string}`]?: ConfigVariable;
+} & {
+    [key: string]: ConfigVariable | ConfigVariableGroup;
 };
@@ -25,5 +26,2 @@ export interface Config {
     };
-    colors?: {
-        [key: string]: string | Config['colors'];
-    };
     mediaQueries?: {
@@ -41,5 +39,5 @@ [key: string]: number | string | Config['mediaQueries'];
     variables?: {
-        [key in keyof typeof rules]: VariableGroup;
-    } | {
-        [key in string]: VariableGroup | Variable;
+        [key in keyof typeof rules]?: ConfigVariableGroup;
+    } & {
+        [key: string]: ConfigVariableGroup | ConfigVariable;
     };
@@ -56,3 +54,3 @@ rules?: {
         colored?: boolean;
-        transform?(this: Rule, opening: string, value: string, closing: string): string;
+        transform?(this: Rule, opening: string, value: string, closing: string): string | Rule['valueNodes'];
     }>;
@@ -59,0 +57,0 @@ animations?: Record<string, {

dist/config/variables.d.ts

@@ -31,3 +31,127 @@ declare const variables: {
     };
+    flexBasis: {
+        full: string;
+        fit: string;
+        max: string;
+        min: string;
+    };
+    flexDirection: {
+        col: string;
+        'col-reverse': string;
+    };
+    width: {
+        full: string;
+        fit: string;
+        max: string;
+        min: string;
+    };
+    height: {
+        full: string;
+        fit: string;
+        max: string;
+        min: string;
+    };
+    minWidth: {
+        full: string;
+        fit: string;
+        max: string;
+        min: string;
+    };
+    boxSizing: {
+        content: string;
+        border: string;
+    };
+    maxHeight: {
+        full: string;
+        fit: string;
+        max: string;
+        min: string;
+    };
+    position: {
+        abs: string;
+        rel: string;
+    };
+    transformBox: {
+        content: string;
+        border: string;
+        padding: string;
+        fill: string;
+        stroke: string;
+        view: string;
+    };
+    animationDirection: {
+        alt: string;
+        'alt-reverse': string;
+    };
+    backgroundClip: {
+        content: string;
+        border: string;
+        padding: string;
+    };
+    backgroundOrigin: {
+        content: string;
+        border: string;
+        padding: string;
+    };
+    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;
+    };
+    shapeOutside: {
+        content: string;
+        border: string;
+        padding: string;
+        margin: string;
+    };
+    clipPath: {
+        content: string;
+        border: string;
+        padding: string;
+        margin: string;
+        fill: string;
+        stroke: string;
+        view: string;
+        black: string;
+    };
+    black: string;
+    white: string;
+    current: string;
+    transparent: string;
+    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;
 };
 export default variables;

dist/constants/config-esm-text.d.ts

@@ -1,1 +0,1 @@
-export declare const CONFIG_ESM_TEXT = "/** @type {import('@master/css').Config} */\nexport default {\n    styles: {},\n    colors: {},\n    rules: {},\n    variables: {},\n    semantics: {},\n    mediaQueries: {},\n    animations: {},\n    selectors: {},\n    functions: {}\n}\n";
+export declare const CONFIG_ESM_TEXT = "/** @type {import('@master/css').Config} */\nexport default {\n    styles: {},\n    rules: {},\n    variables: {},\n    semantics: {},\n    mediaQueries: {},\n    animations: {},\n    selectors: {},\n    functions: {}\n}\n";

dist/constants/config-text.d.ts

@@ -1,1 +0,1 @@
-export declare const CONFIG_TEXT = "/** @type {import('@master/css').Config} */\nmodule.exports = {\n    styles: {},\n    colors: {},\n    rules: {},\n    variables: {},\n    semantics: {},\n    mediaQueries: {},\n    animations: {},\n    selectors: {},\n    functions: {}\n}\n";
+export declare const CONFIG_TEXT = "/** @type {import('@master/css').Config} */\nmodule.exports = {\n    styles: {},\n    rules: {},\n    variables: {},\n    semantics: {},\n    mediaQueries: {},\n    animations: {},\n    selectors: {},\n    functions: {}\n}\n";

dist/constants/config-ts-text.d.ts

@@ -1,1 +0,1 @@
-export declare const CONFIG_TS_TEXT = "import type { Config } from '@master/css'\n\nexport default {\n    styles: {},\n    colors: {},\n    rules: {},\n    variables: {},\n    semantics: {},\n    mediaQueries: {},\n    animations: {},\n    selectors: {},\n    functions: {}\n} as Config\n";
+export declare const CONFIG_TS_TEXT = "import type { Config } from '@master/css'\n\nexport default {\n    styles: {},\n    rules: {},\n    variables: {},\n    semantics: {},\n    mediaQueries: {},\n    animations: {},\n    selectors: {},\n    functions: {}\n} as Config\n";

dist/core.d.ts

@@ -1,3 +0,19 @@
-import { Rule, RuleNative } from './rule';
+import { Rule, NativeRule } from './rule';
 import type { Config } from './config';
+type VariableValue = {
+    type: 'string';
+    value: string;
+} | {
+    type: 'number';
+    value: number;
+} | {
+    type: 'color';
+    value: string;
+    space: 'rgb' | 'hsl';
+};
+type VariableValues = {
+    [key: string]: VariableValue | {
+        [theme in '' | `@${string}`]?: VariableValue;
+    };
+};
 export interface MasterCSS {
@@ -8,14 +24,15 @@ readonly style: HTMLStyleElement;
     styles: Record<string, string[]>;
-    colors: Record<string, Record<string, string>>;
-    colorNames: string[];
-    themeNames: string[];
     stylesBy: Record<string, string[]>;
     selectors: Record<string, [RegExp, string[]][]>;
-    fonts: Record<string, string>;
-    variables: Record<string, string | number>;
+    generalVariables: VariableValues;
+    colorVariables: VariableValues;
     mediaQueries: Record<string, string>;
     keyframesMap: Record<string, {
-        native: RuleNative;
+        nativeRule: NativeRule;
         count: number;
     }>;
+    variablesMap: Record<string, {
+        nativeRules: NativeRule[];
+        count: number;
+    }>;
     animations: Config['animations'];
@@ -36,5 +53,3 @@ }
     private readonly ruleOptions;
-    colorTokenRegExp: RegExp;
     observer: MutationObserver;
-    private colorByThemeByColorName;
     constructor(customConfig?: Config);
@@ -94,2 +109,3 @@ resolve(): void;
     private handleRuleWithAnimationNames;
+    private handleRuleWithVariableNames;
 }
@@ -101,1 +117,2 @@ declare global {
 }
+export {};

dist/index.d.ts

 export { MasterCSS, MasterCSS as default } from './core';
-export { Rule, RuleNative, MediaFeatureRule, MediaQuery } from './rule';
+export { Rule, NativeRule, MediaFeatureRule, MediaQuery } from './rule';
 export { CONFIG_TEXT } from './constants/config-text';
@@ -4,0 +4,0 @@ export { CONFIG_ESM_TEXT } from './constants/config-esm-text';

dist/rule.d.ts

@@ -10,4 +10,5 @@ import type { MasterCSS } from './core';
         resolvedMatch?: RegExp;
-        resolvedVariables?: any;
-        variables?: Record<string, string | number> | Array<string | number | Record<string, string | number>>;
+        resolvedNormalVariables?: any;
+        resolvedColorVariables?: any;
+        variableGroups?: string[];
         order?: number;
@@ -33,7 +34,9 @@ separators?: string[];
     readonly priority: number;
-    readonly natives: RuleNative[];
+    readonly natives: NativeRule[];
     readonly order: number;
     readonly stateToken: string;
     readonly declarations: CSSDeclarations;
+    readonly colored: boolean;
     animationNames: string[];
+    variableNames: string[];
     constructor(className: string, options: {
@@ -43,4 +46,5 @@ id?: string;
         resolvedMatch?: RegExp;
-        resolvedVariables?: any;
-        variables?: Record<string, string | number> | Array<string | number | Record<string, string | number>>;
+        resolvedNormalVariables?: any;
+        resolvedColorVariables?: any;
+        variableGroups?: string[];
         order?: number;
@@ -81,2 +85,17 @@ separators?: string[];
     hasWhere?: boolean;
+    valueNodes?: Array<string | number | {
+        type: 'function';
+        name: string;
+        symbol: string;
+        childrens: Rule['valueNodes'];
+    } | {
+        type: 'variable';
+        name: string;
+        alpha?: string;
+    } | {
+        type: 'separator';
+        value: string;
+        prefixWhite?: boolean;
+        suffixWhite?: boolean;
+    }>;
     constructor: {
@@ -86,5 +105,4 @@ match?(name: string, matches: RegExp, colors: Record<string, Record<string, string>>, colorNames: string[]): RuleMeta;
 }
-export interface RuleNative {
+export interface NativeRule {
     text: string;
-    theme: string;
     cssRule?: CSSRule;
@@ -91,0 +109,0 @@ }

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

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

package.json

@@ -1,1 +0,1 @@
-{"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.191","@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","csstype":"^3.1.2","css-shared":"^2.0.0-beta.191","vite":"^4.2.1","puppeteer":"^21.0.1"},"version":"2.0.0-beta.191"}
+{"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.192","@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.192","csstype":"^3.1.2","puppeteer":"^21.0.1","vite":"^4.2.1"},"version":"2.0.0-beta.192"}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

487080

increased by0.54%

Lines of code

8370

increased by5.59%

Worsened metrics

Number of package files

39

decreased by-2.5%

Dependency changes

• Updated@master/normal.css@^2.0.0-beta.192