@master/css 2.0.0-rc.24 → 2.0.0-rc.26

package/dist/core.mjs

@@ -3,7 +3,7 @@ import { config } from './config/index.mjs';
 import { Layer } from './layer.mjs';
 import { hexToRgb } from './utils/hex-to-rgb.mjs';
 import { flattenObject } from './utils/flatten-object.mjs';
-import { extendConfig } from './utils/extend-config.mjs';
+import extendConfig from './functions/extend-config.mjs';
 
 class MasterCSS {
     customConfig;
@@ -36,7 +36,7 @@ class MasterCSS {
         this.stylesBy = {};
         this.selectors = {};
         this.variables = {};
-        this.mediaQueries = {};
+        this.queries = {};
         this.animations = {};
         this.RegisteredRules.length = 0;
         this.RegisteredSemanticRules.length = 0;
@@ -47,7 +47,7 @@ class MasterCSS {
             currentColor: undefined,
             transparent: undefined
         };
-        const { styles, selectors, variables, semantics, mediaQueries, rules, animations } = this.config;
+        const { styles, selectors, variables, semantics, queries, rules, animations } = this.config;
         function escapeString(str) {
             return str.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
         }
@@ -78,9 +78,9 @@ class MasterCSS {
         }
         if (variables) {
             const unexecutedAliasVariable = {};
-            const parseVariable = (variable, name, theme)=>{
+            const parseVariable = (variable, name, mode)=>{
                 if (!variable) return;
-                const addVariable = (name, variableValue, replacedTheme, alpha)=>{
+                const addVariable = (name, variableValue, replacedMode, alpha)=>{
                     if (variableValue === undefined) return;
                     if (variableValue.type === 'color') {
                         if (alpha) {
@@ -92,15 +92,15 @@ class MasterCSS {
                         }
                         colorVariableNames[name] = undefined;
                     }
-                    const currentTheme = replacedTheme ?? theme;
-                    if (currentTheme !== undefined) {
+                    const currentMode = replacedMode ?? mode;
+                    if (currentMode !== undefined) {
                         if (Object.prototype.hasOwnProperty.call(this.variables, name)) {
                             const variable = this.variables[name];
-                            if (currentTheme) {
-                                if (!variable.themes) {
-                                    variable.themes = {};
+                            if (currentMode) {
+                                if (!variable.modes) {
+                                    variable.modes = {};
                                 }
-                                variable.themes[currentTheme] = variableValue;
+                                variable.modes[currentMode] = variableValue;
                             } else {
                                 variable.value = variableValue.value;
                                 if (variableValue.type === 'color') {
@@ -108,11 +108,11 @@ class MasterCSS {
                                 }
                             }
                         } else {
-                            if (currentTheme) {
+                            if (currentMode) {
                                 const newVariable = {
                                     type: variableValue.type,
-                                    themes: {
-                                        [currentTheme]: variableValue
+                                    modes: {
+                                        [currentMode]: variableValue
                                     }
                                 };
                                 if (variableValue.type === 'color') {
@@ -159,28 +159,28 @@ class MasterCSS {
                         if (!Object.prototype.hasOwnProperty.call(unexecutedAliasVariable, name)) {
                             unexecutedAliasVariable[name] = {};
                         }
-                        unexecutedAliasVariable[name][theme] = ()=>{
-                            delete unexecutedAliasVariable[name][theme];
-                            const [alias, aliasTheme] = aliasResult[1].split('@');
+                        unexecutedAliasVariable[name][mode] = ()=>{
+                            delete unexecutedAliasVariable[name][mode];
+                            const [alias, aliasMode] = aliasResult[1].split('@');
                             if (alias) {
                                 if (Object.prototype.hasOwnProperty.call(unexecutedAliasVariable, alias)) {
-                                    for (const theme of Object.keys(unexecutedAliasVariable[alias])){
-                                        unexecutedAliasVariable[alias][theme]?.();
+                                    for (const mode of Object.keys(unexecutedAliasVariable[alias])){
+                                        unexecutedAliasVariable[alias][mode]?.();
                                     }
                                 }
                                 const aliasVariable = this.variables[alias];
                                 if (aliasVariable) {
-                                    if (aliasTheme === undefined && aliasVariable.themes) {
+                                    if (aliasMode === undefined && aliasVariable.modes) {
                                         addVariable(name, {
                                             type: aliasVariable.type,
                                             value: aliasVariable.value,
                                             space: aliasVariable.space
                                         }, '', aliasResult[2]);
-                                        for(const theme in aliasVariable.themes){
-                                            addVariable(name, aliasVariable.themes[theme], theme, aliasResult[2]);
+                                        for(const mode in aliasVariable.modes){
+                                            addVariable(name, aliasVariable.modes[mode], mode, aliasResult[2]);
                                         }
                                     } else {
-                                        const variable = aliasTheme !== undefined ? aliasVariable.themes?.[aliasTheme] : aliasVariable;
+                                        const variable = aliasMode !== undefined ? aliasVariable.modes?.[aliasMode] : aliasVariable;
                                         if (variable) {
                                             const newVariable = {
                                                 type: variable.type,
@@ -235,13 +235,13 @@ class MasterCSS {
                 parseVariable(variables[parnetKey], parnetKey);
             }
             for (const name of Object.keys(unexecutedAliasVariable)){
-                for (const theme of Object.keys(unexecutedAliasVariable[name])){
-                    unexecutedAliasVariable[name][theme]?.();
+                for (const mode of Object.keys(unexecutedAliasVariable[name])){
+                    unexecutedAliasVariable[name][mode]?.();
                 }
             }
         }
-        if (mediaQueries) {
-            this.mediaQueries = flattenObject(mediaQueries);
+        if (queries) {
+            this.queries = flattenObject(queries);
         }
         if (animations) {
             for(const animationName in animations){
@@ -491,15 +491,15 @@ class MasterCSS {
                     const variable = this.variables[eachVariableName];
                     if (!variable.usage) variable.usage = 0;
                     if (!--variable.usage) {
-                        const removeProperty = (theme)=>{
-                            const nativeRule = this.variablesNativeRules[theme];
+                        const removeProperty = (mode)=>{
+                            const nativeRule = this.variablesNativeRules[mode];
                             nativeRule.cssRule.style.removeProperty('--' + eachVariableName);
                             if (!nativeRule.cssRule.style.length) {
                                 const variablesRule = this.rules[0];
                                 const index = variablesRule.natives.indexOf(nativeRule);
                                 sheet?.deleteRule(index);
                                 variablesRule.natives.splice(index, 1);
-                                delete this.variablesNativeRules[theme];
+                                delete this.variablesNativeRules[mode];
                                 if (!variablesRule.natives.length) {
                                     this.rules.splice(0, 1);
                                     this.variablesNativeRules = {};
@@ -509,9 +509,9 @@ class MasterCSS {
                         if (variable.value) {
                             removeProperty('');
                         }
-                        if (variable.themes) {
-                            for(const theme in variable.themes){
-                                removeProperty(theme);
+                        if (variable.modes) {
+                            for(const mode in variable.modes){
+                                removeProperty(mode);
                             }
                         }
                     }
@@ -574,7 +574,7 @@ class MasterCSS {
          * @example <1  <2  <3  ALL  >=1 >=2 >=3
          * @description
          */ const endIndex = this.rules.length - 1;
-        const { media, order, priority, hasWhere, className } = rule;
+        const { at, atToken, order, priority, hasWhere, className } = rule;
         const findIndex = (startIndex, stopCheck, matchCheck)=>{
             let i = startIndex;
             for(; i <= endIndex; i++){
@@ -586,14 +586,15 @@ class MasterCSS {
         };
         let matchStartIndex;
         let matchEndIndex;
-        if (media) {
-            const mediaStartIndex = this.rules.findIndex((eachRule)=>eachRule.media);
+        if (atToken) {
+            const mediaStartIndex = this.rules.findIndex((eachRule)=>eachRule.at?.media);
             if (mediaStartIndex === -1) {
                 index = endIndex + 1;
             } else {
-                const { 'max-width': maxWidthFeature, 'min-width': minWidthFeature } = media.features;
+                const maxWidthFeature = at.media?.find(({ name })=>name === 'max-width');
+                const minWidthFeature = at.media?.find(({ name })=>name === 'min-width');
                 if (maxWidthFeature || minWidthFeature) {
-                    const mediaWidthStartIndex = this.rules.findIndex((eachRule)=>eachRule.media?.features['max-width'] || eachRule.media?.features['min-width']);
+                    const mediaWidthStartIndex = this.rules.findIndex((eachRule)=>eachRule.at?.media?.find(({ name })=>name === 'max-width' || name === 'min-width'));
                     if (mediaWidthStartIndex === -1) {
                         index = endIndex + 1;
                     } else {
@@ -604,10 +605,10 @@ class MasterCSS {
                              * find 第一個所遇到同樣 feature 且範圍值比自己大的 rule，
                              * 並插入在該 rule 之後，讓自己優先被套用
                              */ if (priority === -1) {
-                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.priority !== -1, (eachRule)=>eachRule.media.features['max-width'] && eachRule.media.features['min-width']);
+                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.priority !== -1, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width'));
                                 matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.priority !== -1);
                             } else {
-                                matchStartIndex = findIndex(mediaWidthStartIndex, undefined, (eachRule)=>eachRule.media.features['max-width'] && eachRule.media.features['min-width'] && eachRule.priority !== -1);
+                                matchStartIndex = findIndex(mediaWidthStartIndex, undefined, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width') && eachRule.priority !== -1);
                                 matchEndIndex = endIndex;
                             }
                             if (matchStartIndex !== -1) {
@@ -616,7 +617,9 @@ class MasterCSS {
                                 const endI = matchStartIndex;
                                 matchStartIndex = undefined;
                                 for(; i >= endI; i--){
-                                    const { 'max-width': eachMaxWidthFeature, 'min-width': eachMinWidthFeature } = this.rules[i].media.features;
+                                    const eachRule = this.rules[i];
+                                    const eachMaxWidthFeature = eachRule.at.media?.find(({ name })=>name === 'max-width');
+                                    const eachMinWidthFeature = eachRule.at.media?.find(({ name })=>name === 'min-width');
                                     const eachRange = eachMaxWidthFeature.value - eachMinWidthFeature.value;
                                     if (eachRange < range) {
                                         matchEndIndex = i - 1;
@@ -630,7 +633,9 @@ class MasterCSS {
                             if (matchStartIndex !== -1 && matchStartIndex !== undefined) {
                                 const range = maxWidthFeature.value - minWidthFeature.value;
                                 for(let i = matchEndIndex; i >= matchStartIndex; i--){
-                                    const { 'max-width': eachMaxWidthFeature, 'min-width': eachMinWidthFeature } = this.rules[i].media.features;
+                                    const eachRule = this.rules[i];
+                                    const eachMaxWidthFeature = eachRule.at.media?.find(({ name })=>name === 'max-width');
+                                    const eachMinWidthFeature = eachRule.at.media?.find(({ name })=>name === 'min-width');
                                     const eachRange = eachMaxWidthFeature.value - eachMinWidthFeature.value;
                                     if (eachRange < range) {
                                         matchEndIndex = i - 1;
@@ -645,15 +650,15 @@ class MasterCSS {
                              * find 第一個所遇到同樣 feature 且值比自己大的 rule，
                              * 並插入在該 rule 之後，讓自己優先被套用
                              */ if (priority === -1) {
-                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['max-width'] && eachRule.media.features['min-width'] || eachRule.priority !== -1, (eachRule)=>!eachRule.media.features['max-width'] && eachRule.media.features['min-width']);
-                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['max-width'] && eachRule.media.features['min-width'] || eachRule.priority !== -1);
+                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width') || eachRule.priority !== -1, (eachRule)=>!eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width'));
+                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width') || eachRule.priority !== -1);
                             } else {
-                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['max-width'] && eachRule.media.features['min-width'] && eachRule.priority !== -1, (eachRule)=>!eachRule.media.features['max-width'] && eachRule.media.features['min-width'] && eachRule.priority !== -1);
-                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['max-width'] && eachRule.media.features['min-width'] && eachRule.priority !== -1);
+                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width') && eachRule.priority !== -1, (eachRule)=>!eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width') && eachRule.priority !== -1);
+                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.at.media?.find(({ name })=>name === 'min-width') && eachRule.priority !== -1);
                             }
                             if (matchStartIndex !== -1) {
                                 for(let i = matchEndIndex; i >= matchStartIndex; i--){
-                                    const value = this.rules[i].media.features['min-width'].value;
+                                    const value = (this.rules[i].at.media?.find(({ name })=>name === 'min-width')).value;
                                     if (value > minWidthFeature.value) {
                                         matchEndIndex = i - 1;
                                     } else if (value < minWidthFeature.value) {
@@ -667,15 +672,15 @@ class MasterCSS {
                              * find 第一個所遇到同樣 feature 且值比自己大的 rule，
                              * 並插入在該 rule 之後，讓自己優先被套用
                              */ if (priority === -1) {
-                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['min-width'] || eachRule.priority !== -1, (eachRule)=>eachRule.media.features['max-width']);
-                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['min-width'] || eachRule.priority !== -1);
+                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'min-width') || eachRule.priority !== -1, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width'));
+                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'min-width') || eachRule.priority !== -1);
                             } else {
-                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['min-width'] && eachRule.priority !== -1, (eachRule)=>eachRule.media.features['max-width'] && eachRule.priority !== -1);
-                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.media.features['min-width'] && eachRule.priority !== -1);
+                                matchStartIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'min-width') && eachRule.priority !== -1, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width') && eachRule.priority !== -1);
+                                matchEndIndex = findIndex(mediaWidthStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'min-width') && eachRule.priority !== -1);
                             }
                             if (matchStartIndex !== -1) {
                                 for(let i = matchEndIndex; i >= matchStartIndex; i--){
-                                    const value = this.rules[i].media.features['max-width'].value;
+                                    const value = (this.rules[i].at.media?.find(({ name })=>name === 'max-width')).value;
                                     if (value < maxWidthFeature.value) {
                                         matchEndIndex = i - 1;
                                     } else if (value > maxWidthFeature.value) {
@@ -689,10 +694,10 @@ class MasterCSS {
                 } else {
                     if (priority === -1) {
                         matchStartIndex = mediaStartIndex;
-                        matchEndIndex = findIndex(mediaStartIndex, (eachRule)=>eachRule.media?.features['max-width'] || eachRule.media?.features['min-width'] || eachRule.priority !== -1);
+                        matchEndIndex = findIndex(mediaStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width' || name === 'min-width') || eachRule.priority !== -1);
                     } else {
-                        matchStartIndex = findIndex(mediaStartIndex, (eachRule)=>eachRule.media?.features['max-width'] || eachRule.media?.features['min-width'], (eachRule)=>eachRule.priority !== -1);
-                        matchEndIndex = findIndex(mediaStartIndex, (eachRule)=>eachRule.media?.features['max-width'] || eachRule.media?.features['min-width']);
+                        matchStartIndex = findIndex(mediaStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width' || name === 'min-width'), (eachRule)=>eachRule.priority !== -1);
+                        matchEndIndex = findIndex(mediaStartIndex, (eachRule)=>eachRule.at.media?.find(({ name })=>name === 'max-width' || name === 'min-width'));
                     }
                 }
             }
@@ -700,10 +705,10 @@ class MasterCSS {
             const findStartIndex = Object.keys(this.variablesNativeRules).length ? this.hasKeyframesRule ? 2 : 1 : this.hasKeyframesRule ? 1 : 0;
             if (priority === -1) {
                 matchStartIndex = findStartIndex;
-                matchEndIndex = findIndex(findStartIndex, (eachRule)=>eachRule.media || eachRule.priority !== -1);
+                matchEndIndex = findIndex(findStartIndex, (eachRule)=>eachRule.atToken || eachRule.priority !== -1);
             } else {
-                matchStartIndex = findIndex(findStartIndex, (eachRule)=>eachRule.media, (eachRule)=>eachRule.priority !== -1);
-                matchEndIndex = findIndex(findStartIndex, (eachRule)=>eachRule.media);
+                matchStartIndex = findIndex(findStartIndex, (eachRule)=>eachRule.atToken, (eachRule)=>eachRule.priority !== -1);
+                matchEndIndex = findIndex(findStartIndex, (eachRule)=>eachRule.atToken);
             }
         }
         if (index === undefined && matchEndIndex !== undefined && matchStartIndex !== undefined) {
@@ -846,23 +851,23 @@ class MasterCSS {
                 if (variable.usage) {
                     variable.usage++;
                 } else {
-                    const addProperty = (theme, variableValue)=>{
-                        let nativeRule = this.variablesNativeRules[theme];
+                    const addProperty = (mode, variableValue)=>{
+                        let nativeRule = this.variablesNativeRules[mode];
                         if (!nativeRule) {
                             let cssRule;
                             let mediaConditionText;
                             let selectorText;
-                            if (theme) {
-                                switch(this.config.themeDriver){
+                            if (mode) {
+                                switch(this.config.modeDriver){
                                     case 'media':
-                                        mediaConditionText = `@media(prefers-color-scheme:${theme})`;
+                                        mediaConditionText = `@media(prefers-color-scheme:${mode})`;
                                         selectorText = ':root';
                                         break;
                                     case 'host':
-                                        selectorText = `:host(.${theme})`;
+                                        selectorText = `:host(.${mode})`;
                                         break;
                                     default:
-                                        selectorText = `.${theme}`;
+                                        selectorText = `.${mode}`;
                                         break;
                                 }
                             } else {
@@ -912,7 +917,7 @@ class MasterCSS {
                                     };
                                 }
                             }
-                            nativeRule = this.pushVariableNativeRule(theme, cssRule);
+                            nativeRule = this.pushVariableNativeRule(mode, cssRule);
                         }
                         const propertyName = '--' + eachVariableName;
                         if (!initializing || !nativeRule.cssRule.style.getPropertyValue(propertyName)) {
@@ -922,9 +927,9 @@ class MasterCSS {
                     if (variable.value) {
                         addProperty('', variable);
                     }
-                    if (variable.themes) {
-                        for(const theme in variable.themes){
-                            addProperty(theme, variable.themes[theme]);
+                    if (variable.modes) {
+                        for(const mode in variable.modes){
+                            addProperty(mode, variable.modes[mode]);
                         }
                     }
                     variable.usage = 1;
@@ -932,7 +937,7 @@ class MasterCSS {
             }
         }
     }
-    pushVariableNativeRule(theme, variableCSSRule) {
+    pushVariableNativeRule(mode, variableCSSRule) {
         if (!Object.keys(this.variablesNativeRules).length) {
             this.variablesNativeRules = {};
             const newRule = {
@@ -961,7 +966,7 @@ class MasterCSS {
                 return prefix + properties.join(';') + suffix;
             }
         };
-        this.rules[0].natives.push(this.variablesNativeRules[theme] = nativeRule);
+        this.rules[0].natives.push(this.variablesNativeRules[mode] = nativeRule);
         return nativeRule;
     }
 }

package/dist/functions/are-rule-modes-equal.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+function areRuleModesEqual(aRule, bRule) {
+    return aRule.mode === bRule.mode;
+}
+
+module.exports = areRuleModesEqual;

package/dist/functions/are-rule-modes-equal.d.ts

@@ -0,0 +1,2 @@
+import type { Rule } from '../rule';
+export default function areRuleModesEqual(aRule: Rule, bRule: Rule): boolean;

package/dist/functions/are-rule-modes-equal.mjs

@@ -0,0 +1,5 @@
+function areRuleModesEqual(aRule, bRule) {
+    return aRule.mode === bRule.mode;
+}
+
+export { areRuleModesEqual as default };

package/dist/functions/are-rule-queries-equal.cjs

@@ -0,0 +1,22 @@
+'use strict';
+
+function areRuleQueriesEqual(aRule, bRule) {
+    const aQueryTypes = Object.keys(aRule.at);
+    const bQueryTypes = Object.keys(bRule.at);
+    if (aQueryTypes.length !== bQueryTypes.length) {
+        return false;
+    }
+    for (const aQueryType of aQueryTypes){
+        const aAtComponents = aRule.at[aQueryType];
+        const bAtComponents = bRule.at[aQueryType];
+        for (const aAtComponent of aAtComponents){
+            const aAtComponentToken = aRule.resolveAtComponent(aAtComponent);
+            if (!bAtComponents.find((bAtComponent)=>bRule.resolveAtComponent(bAtComponent) === aAtComponentToken)) {
+                return false;
+            }
+        }
+    }
+    return true;
+}
+
+module.exports = areRuleQueriesEqual;

package/dist/functions/are-rule-queries-equal.d.ts

@@ -0,0 +1,2 @@
+import type { Rule } from '../rule';
+export default function areRuleQueriesEqual(aRule: Rule, bRule: Rule): boolean;

package/dist/functions/are-rule-queries-equal.mjs

@@ -0,0 +1,20 @@
+function areRuleQueriesEqual(aRule, bRule) {
+    const aQueryTypes = Object.keys(aRule.at);
+    const bQueryTypes = Object.keys(bRule.at);
+    if (aQueryTypes.length !== bQueryTypes.length) {
+        return false;
+    }
+    for (const aQueryType of aQueryTypes){
+        const aAtComponents = aRule.at[aQueryType];
+        const bAtComponents = bRule.at[aQueryType];
+        for (const aAtComponent of aAtComponents){
+            const aAtComponentToken = aRule.resolveAtComponent(aAtComponent);
+            if (!bAtComponents.find((bAtComponent)=>bRule.resolveAtComponent(bAtComponent) === aAtComponentToken)) {
+                return false;
+            }
+        }
+    }
+    return true;
+}
+
+export { areRuleQueriesEqual as default };

package/dist/functions/are-rule-selectors-equal.cjs

@@ -0,0 +1,29 @@
+'use strict';
+
+function areRuleSelectorsEqual(aRule, bRule) {
+    // suffix
+    const aVendorSuffixSelectorKeys = Object.keys(aRule.vendorSuffixSelectors);
+    const bVendorSuffixSelectorKeys = Object.keys(bRule.vendorSuffixSelectors);
+    if (aVendorSuffixSelectorKeys.length !== bVendorSuffixSelectorKeys.length) return false;
+    const isSameVendorSuffixSelectors = aVendorSuffixSelectorKeys.every((eachAKey)=>{
+        if (!Object.prototype.hasOwnProperty.call(bRule.vendorSuffixSelectors, eachAKey)) return false;
+        const aValues = aRule.vendorSuffixSelectors[eachAKey];
+        const bValues = bRule.vendorSuffixSelectors[eachAKey];
+        return aValues.length === bValues.length && aValues.every((eachAValue)=>bValues.includes(eachAValue));
+    });
+    if (!isSameVendorSuffixSelectors) return false;
+    // prefix
+    const aVendorPrefixSelectorKeys = Object.keys(aRule.vendorPrefixSelectors);
+    const bVendorPrefixSelectorKeys = Object.keys(bRule.vendorPrefixSelectors);
+    if (aVendorPrefixSelectorKeys.length !== bVendorPrefixSelectorKeys.length) return false;
+    const isSameVendorPrefixSelectors = aVendorPrefixSelectorKeys.every((eachAKey)=>{
+        if (!Object.prototype.hasOwnProperty.call(bRule.vendorPrefixSelectors, eachAKey)) return false;
+        const aValues = aRule.vendorPrefixSelectors[eachAKey];
+        const bValues = bRule.vendorPrefixSelectors[eachAKey];
+        return aValues.length === bValues.length && aValues.every((eachAValue)=>bValues.includes(eachAValue));
+    });
+    if (!isSameVendorPrefixSelectors) return false;
+    return true;
+}
+
+module.exports = areRuleSelectorsEqual;

package/dist/functions/are-rule-selectors-equal.d.ts

@@ -0,0 +1,2 @@
+import type { Rule } from '../rule';
+export default function areRuleSelectorsEqual(aRule: Rule, bRule: Rule): boolean;

package/dist/functions/are-rule-selectors-equal.mjs

@@ -0,0 +1,27 @@
+function areRuleSelectorsEqual(aRule, bRule) {
+    // suffix
+    const aVendorSuffixSelectorKeys = Object.keys(aRule.vendorSuffixSelectors);
+    const bVendorSuffixSelectorKeys = Object.keys(bRule.vendorSuffixSelectors);
+    if (aVendorSuffixSelectorKeys.length !== bVendorSuffixSelectorKeys.length) return false;
+    const isSameVendorSuffixSelectors = aVendorSuffixSelectorKeys.every((eachAKey)=>{
+        if (!Object.prototype.hasOwnProperty.call(bRule.vendorSuffixSelectors, eachAKey)) return false;
+        const aValues = aRule.vendorSuffixSelectors[eachAKey];
+        const bValues = bRule.vendorSuffixSelectors[eachAKey];
+        return aValues.length === bValues.length && aValues.every((eachAValue)=>bValues.includes(eachAValue));
+    });
+    if (!isSameVendorSuffixSelectors) return false;
+    // prefix
+    const aVendorPrefixSelectorKeys = Object.keys(aRule.vendorPrefixSelectors);
+    const bVendorPrefixSelectorKeys = Object.keys(bRule.vendorPrefixSelectors);
+    if (aVendorPrefixSelectorKeys.length !== bVendorPrefixSelectorKeys.length) return false;
+    const isSameVendorPrefixSelectors = aVendorPrefixSelectorKeys.every((eachAKey)=>{
+        if (!Object.prototype.hasOwnProperty.call(bRule.vendorPrefixSelectors, eachAKey)) return false;
+        const aValues = aRule.vendorPrefixSelectors[eachAKey];
+        const bValues = bRule.vendorPrefixSelectors[eachAKey];
+        return aValues.length === bValues.length && aValues.every((eachAValue)=>bValues.includes(eachAValue));
+    });
+    if (!isSameVendorPrefixSelectors) return false;
+    return true;
+}
+
+export { areRuleSelectorsEqual as default };

package/dist/functions/are-rule-states-equal.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+var areRuleSelectorsEqual = require('./are-rule-selectors-equal.cjs');
+var areRuleModesEqual = require('./are-rule-modes-equal.cjs');
+var areRuleQueriesEqual = require('./are-rule-queries-equal.cjs');
+
+function areRuleStatesEqual(aRule, bRule) {
+    return areRuleSelectorsEqual(aRule, bRule) && areRuleModesEqual(aRule, bRule) && areRuleQueriesEqual(aRule, bRule);
+}
+
+module.exports = areRuleStatesEqual;

package/dist/functions/are-rule-states-equal.d.ts

@@ -0,0 +1,2 @@
+import type { Rule } from '../rule';
+export default function areRuleStatesEqual(aRule: Rule, bRule: Rule): boolean;

package/dist/functions/are-rule-states-equal.mjs

@@ -0,0 +1,9 @@
+import areRuleSelectorsEqual from './are-rule-selectors-equal.mjs';
+import areRuleModesEqual from './are-rule-modes-equal.mjs';
+import areRuleQueriesEqual from './are-rule-queries-equal.mjs';
+
+function areRuleStatesEqual(aRule, bRule) {
+    return areRuleSelectorsEqual(aRule, bRule) && areRuleModesEqual(aRule, bRule) && areRuleQueriesEqual(aRule, bRule);
+}
+
+export { areRuleStatesEqual as default };

package/dist/functions/are-rules-duplicated.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+function areRulesDuplicated(aRule, bRule) {
+    const aKeys = Object.keys(aRule.declarations || {});
+    const bKeys = Object.keys(bRule.declarations || {});
+    if (aKeys.length !== bKeys.length) {
+        return false;
+    }
+    for (const key of aKeys){
+        if (!Object.prototype.hasOwnProperty.call(bRule.declarations, key)) {
+            return false;
+        }
+    }
+    return true;
+}
+
+module.exports = areRulesDuplicated;

package/dist/functions/are-rules-duplicated.d.ts

@@ -0,0 +1,2 @@
+import type { Rule } from '../rule';
+export default function areRulesDuplicated(aRule: Rule, bRule: Rule): boolean;

package/dist/functions/are-rules-duplicated.mjs

@@ -0,0 +1,15 @@
+function areRulesDuplicated(aRule, bRule) {
+    const aKeys = Object.keys(aRule.declarations || {});
+    const bKeys = Object.keys(bRule.declarations || {});
+    if (aKeys.length !== bKeys.length) {
+        return false;
+    }
+    for (const key of aKeys){
+        if (!Object.prototype.hasOwnProperty.call(bRule.declarations, key)) {
+            return false;
+        }
+    }
+    return true;
+}
+
+export { areRulesDuplicated as default };

package/dist/{utils → functions}/extend-config.cjs

@@ -19,18 +19,12 @@ function extendConfig(...configs) {
         };
         if (clonedConfig.styles) {
             formatDeeply(clonedConfig.styles);
-        } else {
-            clonedConfig.styles = {};
         }
-        if (clonedConfig.mediaQueries) {
-            formatDeeply(clonedConfig.mediaQueries);
-        } else {
-            clonedConfig.mediaQueries = {};
+        if (clonedConfig.queries) {
+            formatDeeply(clonedConfig.queries);
         }
         if (clonedConfig.variables) {
             formatDeeply(clonedConfig.variables);
-        } else {
-            clonedConfig.variables = {};
         }
         return clonedConfig;
     };
@@ -45,15 +39,34 @@ function extendConfig(...configs) {
             formattedConfigs.push(formatConfig(config));
         })(eachConfig);
     }
-    let extendedConfig = formattedConfigs[0];
-    for(let i = 1; i < formattedConfigs.length; i++){
+    let extendedConfig = {
+        animations: {},
+        styles: {},
+        queries: {},
+        variables: {}
+    };
+    for(let i = 0; i < formattedConfigs.length; i++){
         const currentFormattedConfig = formattedConfigs[i];
-        extendedConfig = extend(extendedConfig, currentFormattedConfig);
-        if (Object.prototype.hasOwnProperty.call(currentFormattedConfig, 'animations') && extendedConfig.animations) {
-            Object.assign(extendedConfig.animations, currentFormattedConfig.animations);
+        for(const key in currentFormattedConfig){
+            switch(key){
+                case 'animations':
+                    if (currentFormattedConfig.animations) {
+                        Object.assign(extendedConfig.animations, currentFormattedConfig.animations);
+                    }
+                    break;
+                default:
+                    if (currentFormattedConfig[key]) {
+                        extendedConfig = extend(extendedConfig, {
+                            [key]: currentFormattedConfig[key]
+                        });
+                    }
+            }
+        // if (Object.prototype.hasOwnProperty.call(currentFormattedConfig.styles, key)) {
+        //     Object.assign(extendedConfig.styles[key], currentFormattedConfig.styles[key])
+        // }
         }
     }
     return extendedConfig;
 }
 
-exports.extendConfig = extendConfig;
+module.exports = extendConfig;

package/dist/functions/extend-config.d.ts

@@ -0,0 +1,2 @@
+import type { Config } from '../config';
+export default function extendConfig(...configs: Config[]): Config;