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

package/dist/config/index.cjs

@@ -6,6 +6,7 @@ var utilities = require('./utilities.cjs');
 var animations = require('./animations.cjs');
 var variables = require('./variables.cjs');
 var rules = require('./rules.cjs');
+var modes = require('./modes.cjs');
 var functions = require('./functions.cjs');
 
 const config = {
@@ -16,12 +17,12 @@ const config = {
     functions,
     animations,
     variables,
+    modes,
     scope: '',
     rootSize: 16,
     baseUnit: 4,
     override: false,
-    important: false,
-    modeDriver: 'class'
+    important: false
 };
 
 exports.queries = queries;

package/dist/config/index.d.ts

@@ -41,6 +41,9 @@ export type UtilityDefinitions = {
 } & {
     [key: string]: PropertiesHyphen;
 };
+export type ModeDefinitions = {
+    [key: string]: 'class' | 'media' | 'host';
+};
 export interface FunctionDefinition {
     unit?: string;
     transform?(this: Rule, value: string, bypassVariableNames: string[]): string | ValueComponent[];
@@ -63,5 +66,5 @@ export interface Config {
     override?: boolean;
     functions?: FunctionDefinitions;
     animations?: AnimationDefinitions;
-    modeDriver?: 'class' | 'media' | 'host';
+    modes?: Record<string, 'class' | 'media' | 'host' | false>;
 }

package/dist/config/index.mjs

@@ -4,6 +4,7 @@ import utilities from './utilities.mjs';
 import animations from './animations.mjs';
 import variables from './variables.mjs';
 import rules from './rules.mjs';
+import modes from './modes.mjs';
 import functions from './functions.mjs';
 
 const config = {
@@ -14,12 +15,12 @@ const config = {
     functions,
     animations,
     variables,
+    modes,
     scope: '',
     rootSize: 16,
     baseUnit: 4,
     override: false,
-    important: false,
-    modeDriver: 'class'
+    important: false
 };
 
 export { animations, config, functions, queries, rules, selectors, 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/core.cjs

@@ -922,7 +922,7 @@ class MasterCSS {
                             let mediaConditionText;
                             let selectorText;
                             if (mode) {
-                                switch(this.config.modeDriver){
+                                switch(this.config.modes?.[mode]){
                                     case 'media':
                                         mediaConditionText = `@media(prefers-color-scheme:${mode})`;
                                         selectorText = ':root';

package/dist/core.mjs

@@ -918,7 +918,7 @@ class MasterCSS {
                             let mediaConditionText;
                             let selectorText;
                             if (mode) {
-                                switch(this.config.modeDriver){
+                                switch(this.config.modes?.[mode]){
                                     case 'media':
                                         mediaConditionText = `@media(prefers-color-scheme:${mode})`;
                                         selectorText = ':root';

package/dist/rule.cjs

@@ -266,7 +266,7 @@ class Rule {
         if (!definition.separators) definition.separators = [
             ','
         ];
-        const { scope, important, modeDriver } = css.config;
+        const { scope, important, modes } = css.config;
         const { selectors, queries, stylesBy, animations } = css;
         const classNames = stylesBy[className];
         if (create) create.call(this, className);
@@ -624,7 +624,7 @@ class Rule {
                     const prefixSelectors = this.vendorPrefixSelectors[prefixSelectorVendor];
                     const suffixSelectors = this.vendorSuffixSelectors[eachSuffixSelectorVendor];
                     const prefixTexts = prefixSelectors.map((eachPrefixSelector)=>eachPrefixSelector + prefixText);
-                    const getCssText = (name)=>prefixTexts.map((eachPrefixText)=>(this.mode && modeDriver !== 'media' ? modeDriver === 'host' ? `:host(.${this.mode}) ` : `.${this.mode} ` : '') + (scope ? scope + ' ' : '') + eachPrefixText).reduce((arr, eachPrefixText)=>{
+                    const getCssText = (name)=>prefixTexts.map((eachPrefixText)=>(this.mode && modes?.[this.mode] !== 'media' ? modes?.[this.mode] === 'host' ? `:host(.${this.mode}) ` : `.${this.mode} ` : '') + (scope ? scope + ' ' : '') + eachPrefixText).reduce((arr, eachPrefixText)=>{
                             arr.push(suffixSelectors.reduce((_arr, eachSuffixSelector)=>{
                                 _arr.push(eachPrefixText + '.' + cssEscape(name) + eachSuffixSelector);
                                 return _arr;
@@ -635,7 +635,7 @@ class Rule {
                     for (const key of Object.keys(this.at).sort((_a, b)=>b === 'supports' ? -1 : 1)){
                         cssText = '@' + key + (key.includes(' ') ? '' : ' ') + this.at[key].map((eachAtComponent)=>this.resolveAtComponent(eachAtComponent)).join(' ') + '{' + cssText + '}';
                     }
-                    if (this.mode && modeDriver === 'media') {
+                    if (this.mode && modes?.[this.mode] === 'media') {
                         cssText = `@media(prefers-color-scheme:${this.mode}){` + cssText + '}';
                     }
                     this.natives.push({

package/dist/rule.mjs

@@ -264,7 +264,7 @@ class Rule {
         if (!definition.separators) definition.separators = [
             ','
         ];
-        const { scope, important, modeDriver } = css.config;
+        const { scope, important, modes } = css.config;
         const { selectors, queries, stylesBy, animations } = css;
         const classNames = stylesBy[className];
         if (create) create.call(this, className);
@@ -622,7 +622,7 @@ class Rule {
                     const prefixSelectors = this.vendorPrefixSelectors[prefixSelectorVendor];
                     const suffixSelectors = this.vendorSuffixSelectors[eachSuffixSelectorVendor];
                     const prefixTexts = prefixSelectors.map((eachPrefixSelector)=>eachPrefixSelector + prefixText);
-                    const getCssText = (name)=>prefixTexts.map((eachPrefixText)=>(this.mode && modeDriver !== 'media' ? modeDriver === 'host' ? `:host(.${this.mode}) ` : `.${this.mode} ` : '') + (scope ? scope + ' ' : '') + eachPrefixText).reduce((arr, eachPrefixText)=>{
+                    const getCssText = (name)=>prefixTexts.map((eachPrefixText)=>(this.mode && modes?.[this.mode] !== 'media' ? modes?.[this.mode] === 'host' ? `:host(.${this.mode}) ` : `.${this.mode} ` : '') + (scope ? scope + ' ' : '') + eachPrefixText).reduce((arr, eachPrefixText)=>{
                             arr.push(suffixSelectors.reduce((_arr, eachSuffixSelector)=>{
                                 _arr.push(eachPrefixText + '.' + cssEscape(name) + eachSuffixSelector);
                                 return _arr;
@@ -633,7 +633,7 @@ class Rule {
                     for (const key of Object.keys(this.at).sort((_a, b)=>b === 'supports' ? -1 : 1)){
                         cssText = '@' + key + (key.includes(' ') ? '' : ' ') + this.at[key].map((eachAtComponent)=>this.resolveAtComponent(eachAtComponent)).join(' ') + '{' + cssText + '}';
                     }
-                    if (this.mode && modeDriver === 'media') {
+                    if (this.mode && modes?.[this.mode] === 'media') {
                         cssText = `@media(prefers-color-scheme:${this.mode}){` + cssText + '}';
                     }
                     this.natives.push({

package/package.json

@@ -1 +1 @@
-{"name":"@master/css","type":"module","scripts":{"build":"techor build \"src/**/*.ts\"","dev":"pnpm build --watch","test":"jest","type-check":"tsc --noEmit","lint":"eslint src"},"license":"MIT","description":"The CSS language and framework for rapidly building modern and high-performance websites","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.cjs","jsnext:main":"./dist/index.mjs","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"}},"bin":"./dist/bin/index.mjs","files":["dist"],"publishConfig":{"access":"public","provenance":true},"dependencies":{"@master/colors":"^2.0.0","@master/normal.css":"^2.1.0","@techor/extend":"^3.0.18"},"devDependencies":{"@master/css-shared":"^2.0.0-rc.27","csstype":"^3.1.3"},"version":"2.0.0-rc.27"}
+{"name":"@master/css","type":"module","scripts":{"build":"techor build \"src/**/*.ts\"","dev":"pnpm build --watch","test":"jest","type-check":"tsc --noEmit","lint":"eslint src"},"license":"MIT","description":"The CSS language and framework for rapidly building modern and high-performance websites","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.cjs","jsnext:main":"./dist/index.mjs","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"}},"bin":"./dist/bin/index.mjs","files":["dist"],"publishConfig":{"access":"public","provenance":true},"dependencies":{"@master/colors":"^2.0.0","@master/normal.css":"^2.1.0","@techor/extend":"^3.0.18"},"devDependencies":{"@master/css-shared":"^2.0.0-rc.28","csstype":"^3.1.3"},"version":"2.0.0-rc.28"}