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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/dist/common.cjs +124 -0
  2. package/dist/common.d.ts +22 -0
  3. package/dist/common.mjs +106 -0
  4. package/dist/config/functions.cjs +40 -41
  5. package/dist/config/functions.mjs +39 -40
  6. package/dist/config/index.cjs +7 -7
  7. package/dist/config/index.d.ts +12 -13
  8. package/dist/config/index.mjs +6 -6
  9. package/dist/config/queries.cjs +17 -0
  10. package/dist/config/queries.d.ts +22 -0
  11. package/dist/config/queries.mjs +15 -0
  12. package/dist/config/rules.cjs +964 -851
  13. package/dist/config/rules.d.ts +8 -5
  14. package/dist/config/rules.mjs +966 -852
  15. package/dist/config/selectors.cjs +0 -1
  16. package/dist/config/selectors.d.ts +0 -1
  17. package/dist/config/selectors.mjs +0 -1
  18. package/dist/config/{semantics.cjs → utilities.cjs} +2 -5
  19. package/dist/config/{semantics.d.ts → utilities.d.ts} +2 -5
  20. package/dist/config/{semantics.mjs → utilities.mjs} +2 -5
  21. package/dist/config/variables.mjs +2 -2
  22. package/dist/core.cjs +260 -195
  23. package/dist/core.d.ts +20 -16
  24. package/dist/core.mjs +258 -193
  25. package/dist/index.cjs +45 -15
  26. package/dist/index.d.ts +13 -3
  27. package/dist/index.mjs +15 -7
  28. package/dist/layer.cjs +25 -20
  29. package/dist/layer.d.ts +26 -9
  30. package/dist/layer.mjs +22 -19
  31. package/dist/rule.cjs +147 -125
  32. package/dist/rule.d.ts +58 -20
  33. package/dist/rule.mjs +147 -125
  34. package/dist/tokens/screen-sizes.cjs +2 -2
  35. package/dist/tokens/screen-sizes.mjs +2 -2
  36. package/dist/utils/are-rule-modes-equal.cjs +7 -0
  37. package/dist/utils/are-rule-modes-equal.d.ts +2 -0
  38. package/dist/utils/are-rule-modes-equal.mjs +5 -0
  39. package/dist/utils/are-rule-queries-equal.cjs +22 -0
  40. package/dist/utils/are-rule-queries-equal.d.ts +2 -0
  41. package/dist/utils/are-rule-queries-equal.mjs +20 -0
  42. package/dist/utils/are-rule-selectors-equal.cjs +29 -0
  43. package/dist/utils/are-rule-selectors-equal.d.ts +2 -0
  44. package/dist/utils/are-rule-selectors-equal.mjs +27 -0
  45. package/dist/utils/are-rule-states-equal.cjs +11 -0
  46. package/dist/utils/are-rule-states-equal.d.ts +2 -0
  47. package/dist/utils/are-rule-states-equal.mjs +9 -0
  48. package/dist/utils/are-rules-duplicated.cjs +17 -0
  49. package/dist/utils/are-rules-duplicated.d.ts +2 -0
  50. package/dist/utils/are-rules-duplicated.mjs +15 -0
  51. package/dist/utils/extend-config.cjs +27 -14
  52. package/dist/utils/extend-config.d.ts +1 -1
  53. package/dist/utils/extend-config.mjs +27 -14
  54. package/dist/utils/generate-css.cjs +13 -0
  55. package/dist/utils/generate-css.d.ts +2 -0
  56. package/dist/utils/generate-css.mjs +11 -0
  57. package/dist/utils/hex-to-rgb.cjs +1 -1
  58. package/dist/utils/hex-to-rgb.d.ts +1 -1
  59. package/dist/utils/hex-to-rgb.mjs +1 -1
  60. package/dist/utils/is-core-rule.cjs +9 -0
  61. package/dist/utils/is-core-rule.d.ts +1 -0
  62. package/dist/utils/is-core-rule.mjs +7 -0
  63. package/dist/{functions → utils}/reorder-for-readable-classes.cjs +12 -18
  64. package/dist/{functions → utils}/reorder-for-readable-classes.d.ts +1 -5
  65. package/dist/{functions → utils}/reorder-for-readable-classes.mjs +13 -19
  66. package/package.json +1 -1
  67. package/dist/config/media-queries.cjs +0 -7
  68. package/dist/config/media-queries.d.ts +0 -1
  69. package/dist/config/media-queries.mjs +0 -1
  70. package/dist/constants/base-unit-regex.cjs +0 -5
  71. package/dist/constants/base-unit-regex.d.ts +0 -1
  72. package/dist/constants/base-unit-regex.mjs +0 -3
  73. package/dist/constants/start-symbol.cjs +0 -10
  74. package/dist/constants/start-symbol.d.ts +0 -6
  75. package/dist/constants/start-symbol.mjs +0 -8
  76. package/dist/functions/transform-color-with-opacity.cjs +0 -9
  77. package/dist/functions/transform-color-with-opacity.d.ts +0 -1
  78. package/dist/functions/transform-color-with-opacity.mjs +0 -7
  79. package/dist/utils/concat-arrays.cjs +0 -12
  80. package/dist/utils/concat-arrays.d.ts +0 -1
  81. package/dist/utils/concat-arrays.mjs +0 -10
  82. package/dist/utils/get-type.cjs +0 -12
  83. package/dist/utils/get-type.d.ts +0 -7
  84. package/dist/utils/get-type.mjs +0 -10
  85. package/dist/utils/is-plain-object.cjs +0 -15
  86. package/dist/utils/is-plain-object.d.ts +0 -8
  87. package/dist/utils/is-plain-object.mjs +0 -13
  88. package/dist/utils/is-symbol.cjs +0 -14
  89. package/dist/utils/is-symbol.d.ts +0 -7
  90. package/dist/utils/is-symbol.mjs +0 -12
  91. package/dist/utils/rgb-to-hex.cjs +0 -7
  92. package/dist/utils/rgb-to-hex.d.ts +0 -1
  93. package/dist/utils/rgb-to-hex.mjs +0 -5
@@ -0,0 +1,27 @@
1
+ function areRuleSelectorsEqual(aRule, bRule) {
2
+ // suffix
3
+ const aVendorSuffixSelectorKeys = Object.keys(aRule.vendorSuffixSelectors);
4
+ const bVendorSuffixSelectorKeys = Object.keys(bRule.vendorSuffixSelectors);
5
+ if (aVendorSuffixSelectorKeys.length !== bVendorSuffixSelectorKeys.length) return false;
6
+ const isSameVendorSuffixSelectors = aVendorSuffixSelectorKeys.every((eachAKey)=>{
7
+ if (!Object.prototype.hasOwnProperty.call(bRule.vendorSuffixSelectors, eachAKey)) return false;
8
+ const aValues = aRule.vendorSuffixSelectors[eachAKey];
9
+ const bValues = bRule.vendorSuffixSelectors[eachAKey];
10
+ return aValues.length === bValues.length && aValues.every((eachAValue)=>bValues.includes(eachAValue));
11
+ });
12
+ if (!isSameVendorSuffixSelectors) return false;
13
+ // prefix
14
+ const aVendorPrefixSelectorKeys = Object.keys(aRule.vendorPrefixSelectors);
15
+ const bVendorPrefixSelectorKeys = Object.keys(bRule.vendorPrefixSelectors);
16
+ if (aVendorPrefixSelectorKeys.length !== bVendorPrefixSelectorKeys.length) return false;
17
+ const isSameVendorPrefixSelectors = aVendorPrefixSelectorKeys.every((eachAKey)=>{
18
+ if (!Object.prototype.hasOwnProperty.call(bRule.vendorPrefixSelectors, eachAKey)) return false;
19
+ const aValues = aRule.vendorPrefixSelectors[eachAKey];
20
+ const bValues = bRule.vendorPrefixSelectors[eachAKey];
21
+ return aValues.length === bValues.length && aValues.every((eachAValue)=>bValues.includes(eachAValue));
22
+ });
23
+ if (!isSameVendorPrefixSelectors) return false;
24
+ return true;
25
+ }
26
+
27
+ export { areRuleSelectorsEqual as default };
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ var areRuleSelectorsEqual = require('./are-rule-selectors-equal.cjs');
4
+ var areRuleModesEqual = require('./are-rule-modes-equal.cjs');
5
+ var areRuleQueriesEqual = require('./are-rule-queries-equal.cjs');
6
+
7
+ function areRuleStatesEqual(aRule, bRule) {
8
+ return areRuleSelectorsEqual(aRule, bRule) && areRuleModesEqual(aRule, bRule) && areRuleQueriesEqual(aRule, bRule);
9
+ }
10
+
11
+ module.exports = areRuleStatesEqual;
@@ -0,0 +1,2 @@
1
+ import type { Rule } from '../rule';
2
+ export default function areRuleStatesEqual(aRule: Rule, bRule: Rule): boolean;
@@ -0,0 +1,9 @@
1
+ import areRuleSelectorsEqual from './are-rule-selectors-equal.mjs';
2
+ import areRuleModesEqual from './are-rule-modes-equal.mjs';
3
+ import areRuleQueriesEqual from './are-rule-queries-equal.mjs';
4
+
5
+ function areRuleStatesEqual(aRule, bRule) {
6
+ return areRuleSelectorsEqual(aRule, bRule) && areRuleModesEqual(aRule, bRule) && areRuleQueriesEqual(aRule, bRule);
7
+ }
8
+
9
+ export { areRuleStatesEqual as default };
@@ -0,0 +1,17 @@
1
+ 'use strict';
2
+
3
+ function areRulesDuplicated(aRule, bRule) {
4
+ const aKeys = Object.keys(aRule.declarations || {});
5
+ const bKeys = Object.keys(bRule.declarations || {});
6
+ if (aKeys.length !== bKeys.length) {
7
+ return false;
8
+ }
9
+ for (const key of aKeys){
10
+ if (!Object.prototype.hasOwnProperty.call(bRule.declarations, key)) {
11
+ return false;
12
+ }
13
+ }
14
+ return true;
15
+ }
16
+
17
+ module.exports = areRulesDuplicated;
@@ -0,0 +1,2 @@
1
+ import type { Rule } from '../rule';
2
+ export default function areRulesDuplicated(aRule: Rule, bRule: Rule): boolean;
@@ -0,0 +1,15 @@
1
+ function areRulesDuplicated(aRule, bRule) {
2
+ const aKeys = Object.keys(aRule.declarations || {});
3
+ const bKeys = Object.keys(bRule.declarations || {});
4
+ if (aKeys.length !== bKeys.length) {
5
+ return false;
6
+ }
7
+ for (const key of aKeys){
8
+ if (!Object.prototype.hasOwnProperty.call(bRule.declarations, key)) {
9
+ return false;
10
+ }
11
+ }
12
+ return true;
13
+ }
14
+
15
+ export { areRulesDuplicated as default };
@@ -19,18 +19,12 @@ function extendConfig(...configs) {
19
19
  };
20
20
  if (clonedConfig.styles) {
21
21
  formatDeeply(clonedConfig.styles);
22
- } else {
23
- clonedConfig.styles = {};
24
22
  }
25
- if (clonedConfig.mediaQueries) {
26
- formatDeeply(clonedConfig.mediaQueries);
27
- } else {
28
- clonedConfig.mediaQueries = {};
23
+ if (clonedConfig.queries) {
24
+ formatDeeply(clonedConfig.queries);
29
25
  }
30
26
  if (clonedConfig.variables) {
31
27
  formatDeeply(clonedConfig.variables);
32
- } else {
33
- clonedConfig.variables = {};
34
28
  }
35
29
  return clonedConfig;
36
30
  };
@@ -45,15 +39,34 @@ function extendConfig(...configs) {
45
39
  formattedConfigs.push(formatConfig(config));
46
40
  })(eachConfig);
47
41
  }
48
- let extendedConfig = formattedConfigs[0];
49
- for(let i = 1; i < formattedConfigs.length; i++){
42
+ let extendedConfig = {
43
+ animations: {},
44
+ styles: {},
45
+ queries: {},
46
+ variables: {}
47
+ };
48
+ for(let i = 0; i < formattedConfigs.length; i++){
50
49
  const currentFormattedConfig = formattedConfigs[i];
51
- extendedConfig = extend(extendedConfig, currentFormattedConfig);
52
- if (Object.prototype.hasOwnProperty.call(currentFormattedConfig, 'animations') && extendedConfig.animations) {
53
- Object.assign(extendedConfig.animations, currentFormattedConfig.animations);
50
+ for(const key in currentFormattedConfig){
51
+ switch(key){
52
+ case 'animations':
53
+ if (currentFormattedConfig.animations) {
54
+ Object.assign(extendedConfig.animations, currentFormattedConfig.animations);
55
+ }
56
+ break;
57
+ default:
58
+ if (currentFormattedConfig[key]) {
59
+ extendedConfig = extend(extendedConfig, {
60
+ [key]: currentFormattedConfig[key]
61
+ });
62
+ }
63
+ }
64
+ // if (Object.prototype.hasOwnProperty.call(currentFormattedConfig.styles, key)) {
65
+ // Object.assign(extendedConfig.styles[key], currentFormattedConfig.styles[key])
66
+ // }
54
67
  }
55
68
  }
56
69
  return extendedConfig;
57
70
  }
58
71
 
59
- exports.extendConfig = extendConfig;
72
+ module.exports = extendConfig;
@@ -1,2 +1,2 @@
1
1
  import type { Config } from '../config';
2
- export declare function extendConfig(...configs: Config[]): Config;
2
+ export default function extendConfig(...configs: Config[]): Config;
@@ -17,18 +17,12 @@ function extendConfig(...configs) {
17
17
  };
18
18
  if (clonedConfig.styles) {
19
19
  formatDeeply(clonedConfig.styles);
20
- } else {
21
- clonedConfig.styles = {};
22
20
  }
23
- if (clonedConfig.mediaQueries) {
24
- formatDeeply(clonedConfig.mediaQueries);
25
- } else {
26
- clonedConfig.mediaQueries = {};
21
+ if (clonedConfig.queries) {
22
+ formatDeeply(clonedConfig.queries);
27
23
  }
28
24
  if (clonedConfig.variables) {
29
25
  formatDeeply(clonedConfig.variables);
30
- } else {
31
- clonedConfig.variables = {};
32
26
  }
33
27
  return clonedConfig;
34
28
  };
@@ -43,15 +37,34 @@ function extendConfig(...configs) {
43
37
  formattedConfigs.push(formatConfig(config));
44
38
  })(eachConfig);
45
39
  }
46
- let extendedConfig = formattedConfigs[0];
47
- for(let i = 1; i < formattedConfigs.length; i++){
40
+ let extendedConfig = {
41
+ animations: {},
42
+ styles: {},
43
+ queries: {},
44
+ variables: {}
45
+ };
46
+ for(let i = 0; i < formattedConfigs.length; i++){
48
47
  const currentFormattedConfig = formattedConfigs[i];
49
- extendedConfig = extend(extendedConfig, currentFormattedConfig);
50
- if (Object.prototype.hasOwnProperty.call(currentFormattedConfig, 'animations') && extendedConfig.animations) {
51
- Object.assign(extendedConfig.animations, currentFormattedConfig.animations);
48
+ for(const key in currentFormattedConfig){
49
+ switch(key){
50
+ case 'animations':
51
+ if (currentFormattedConfig.animations) {
52
+ Object.assign(extendedConfig.animations, currentFormattedConfig.animations);
53
+ }
54
+ break;
55
+ default:
56
+ if (currentFormattedConfig[key]) {
57
+ extendedConfig = extend(extendedConfig, {
58
+ [key]: currentFormattedConfig[key]
59
+ });
60
+ }
61
+ }
62
+ // if (Object.prototype.hasOwnProperty.call(currentFormattedConfig.styles, key)) {
63
+ // Object.assign(extendedConfig.styles[key], currentFormattedConfig.styles[key])
64
+ // }
52
65
  }
53
66
  }
54
67
  return extendedConfig;
55
68
  }
56
69
 
57
- export { extendConfig };
70
+ export { extendConfig as default };
@@ -0,0 +1,13 @@
1
+ 'use strict';
2
+
3
+ var core = require('../core.cjs');
4
+
5
+ function generateCSS(classes, css = new core.default()) {
6
+ let text = '';
7
+ css.add(...classes);
8
+ text = css.text;
9
+ css.delete(...classes);
10
+ return text;
11
+ }
12
+
13
+ module.exports = generateCSS;
@@ -0,0 +1,2 @@
1
+ import MasterCSS from '../core';
2
+ export default function generateCSS(classes: string[], css?: MasterCSS): string;
@@ -0,0 +1,11 @@
1
+ import MasterCSS from '../core.mjs';
2
+
3
+ function generateCSS(classes, css = new MasterCSS()) {
4
+ let text = '';
5
+ css.add(...classes);
6
+ text = css.text;
7
+ css.delete(...classes);
8
+ return text;
9
+ }
10
+
11
+ export { generateCSS as default };
@@ -27,4 +27,4 @@ function hexToRgb(hex) {
27
27
  ];
28
28
  }
29
29
 
30
- exports.hexToRgb = hexToRgb;
30
+ module.exports = hexToRgb;
@@ -1 +1 @@
1
- export declare function hexToRgb(hex: string): (number | undefined)[];
1
+ export default function hexToRgb(hex: string): (number | undefined)[];
@@ -25,4 +25,4 @@ function hexToRgb(hex) {
25
25
  ];
26
26
  }
27
27
 
28
- export { hexToRgb };
28
+ export { hexToRgb as default };
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var rules = require('../config/rules.cjs');
4
+
5
+ function isCoreRule(id) {
6
+ return Object.hasOwnProperty.call(rules.default, id);
7
+ }
8
+
9
+ module.exports = isCoreRule;
@@ -0,0 +1 @@
1
+ export default function isCoreRule(id: string): boolean;
@@ -0,0 +1,7 @@
1
+ import rules from '../config/rules.mjs';
2
+
3
+ function isCoreRule(id) {
4
+ return Object.hasOwnProperty.call(rules, id);
5
+ }
6
+
7
+ export { isCoreRule as default };
@@ -8,23 +8,17 @@ var core = require('../core.cjs');
8
8
  * @param classes
9
9
  * @param options
10
10
  * @returns consistent classes
11
- */ function reorderForReadableClasses(classes, options) {
12
- let css;
13
- if (options?.css) {
14
- css = options?.css;
15
- } else {
16
- css = new core.default(options?.config);
17
- }
11
+ */ function reorderForReadableClasses(classes, css = new core.default()) {
18
12
  for (const eachClass of classes){
19
13
  css.add(eachClass);
20
14
  }
21
15
  return css.rules// 只保留樣式語法相關的 rules, 排除 keyframes 與 variables 在外
22
16
  .filter((eachRule)=>eachRule.layer).sort((a, b)=>{
23
- if (a.layer === layer.Layer.Semantic && b.layer !== layer.Layer.Semantic) {
24
- // 如果 a 是 Layer.Semantic 而 b 不是,则 a 应该排在 b 前面
17
+ if (a.layer === layer.Utility && b.layer !== layer.Utility) {
18
+ // 如果 a 是 Layer.Utility 而 b 不是,则 a 应该排在 b 前面
25
19
  return -1;
26
- } else if (a.layer !== layer.Layer.Semantic && b.layer === layer.Layer.Semantic) {
27
- // 如果 b 是 Layer.Semantic 而 a 不是,则 b 应该排在 a 前面
20
+ } else if (a.layer !== layer.Utility && b.layer === layer.Utility) {
21
+ // 如果 b 是 Layer.Utility 而 a 不是,则 b 应该排在 a 前面
28
22
  return 1;
29
23
  } else if (a.id !== b.id) {
30
24
  return a.className.localeCompare(b.className);
@@ -32,26 +26,26 @@ var core = require('../core.cjs');
32
26
  // 檢查 vendorSuffixSelectors 是否存在
33
27
  const aHasVendorSuffix = a.vendorSuffixSelectors?.['']?.[0];
34
28
  const bHasVendorSuffix = b.vendorSuffixSelectors?.['']?.[0];
35
- // 檢查 media.token 是否存在
36
- const aHasMediaToken = a.media?.token;
37
- const bHasMediaToken = b.media?.token;
38
29
  if (a.priority === -1 && b.priority === -1) {
39
30
  // 如果 a 和 b 都有 vendorSuffixSelectors 或 media.token,則按照以下規則排序
40
31
  if (aHasVendorSuffix && bHasVendorSuffix) {
41
32
  return aHasVendorSuffix.localeCompare(bHasVendorSuffix);
42
33
  }
34
+ // 檢查 media.token 是否存在
35
+ const aAtToke = a.atToken;
36
+ const bAtToken = b.atToken;
43
37
  // 如果 a 和 b 都有 media.token 且不包含內建已處理過排序的,則按照以下規則排序
44
- if (aHasMediaToken && bHasMediaToken && !Object.keys(a.media.features || {}).length && !Object.keys(b.media.features || {}).length) {
45
- return aHasMediaToken.localeCompare(bHasMediaToken);
38
+ if (aAtToke && bAtToken && !a.at.media?.find(({ name })=>name === 'min-width' || name === 'max-width') && !b.at.media?.find(({ name })=>name === 'min-width' || name === 'max-width')) {
39
+ return aAtToke.localeCompare(bAtToken);
46
40
  }
47
41
  if (aHasVendorSuffix && !bHasVendorSuffix) {
48
42
  return 1;
49
43
  } else if (!aHasVendorSuffix && bHasVendorSuffix) {
50
44
  return -1;
51
45
  }
52
- if (aHasMediaToken && !bHasMediaToken) {
46
+ if (aAtToke && !bAtToken) {
53
47
  return 1;
54
- } else if (!aHasMediaToken && bHasMediaToken) {
48
+ } else if (!aAtToke && bAtToken) {
55
49
  return -1;
56
50
  }
57
51
  }
@@ -1,4 +1,3 @@
1
- import type { Config } from '../config';
2
1
  import MasterCSS from '../core';
3
2
  /**
4
3
  * Sorts classes in a consistent order
@@ -6,7 +5,4 @@ import MasterCSS from '../core';
6
5
  * @param options
7
6
  * @returns consistent classes
8
7
  */
9
- export default function reorderForReadableClasses(classes: string[], options?: {
10
- css?: MasterCSS;
11
- config?: Config;
12
- }): string[];
8
+ export default function reorderForReadableClasses(classes: string[], css?: MasterCSS): string[];
@@ -1,4 +1,4 @@
1
- import { Layer } from '../layer.mjs';
1
+ import Layer from '../layer.mjs';
2
2
  import MasterCSS from '../core.mjs';
3
3
 
4
4
  /**
@@ -6,23 +6,17 @@ import MasterCSS from '../core.mjs';
6
6
  * @param classes
7
7
  * @param options
8
8
  * @returns consistent classes
9
- */ function reorderForReadableClasses(classes, options) {
10
- let css;
11
- if (options?.css) {
12
- css = options?.css;
13
- } else {
14
- css = new MasterCSS(options?.config);
15
- }
9
+ */ function reorderForReadableClasses(classes, css = new MasterCSS()) {
16
10
  for (const eachClass of classes){
17
11
  css.add(eachClass);
18
12
  }
19
13
  return css.rules// 只保留樣式語法相關的 rules, 排除 keyframes 與 variables 在外
20
14
  .filter((eachRule)=>eachRule.layer).sort((a, b)=>{
21
- if (a.layer === Layer.Semantic && b.layer !== Layer.Semantic) {
22
- // 如果 a 是 Layer.Semantic 而 b 不是,则 a 应该排在 b 前面
15
+ if (a.layer === Layer.Utility && b.layer !== Layer.Utility) {
16
+ // 如果 a 是 Layer.Utility 而 b 不是,则 a 应该排在 b 前面
23
17
  return -1;
24
- } else if (a.layer !== Layer.Semantic && b.layer === Layer.Semantic) {
25
- // 如果 b 是 Layer.Semantic 而 a 不是,则 b 应该排在 a 前面
18
+ } else if (a.layer !== Layer.Utility && b.layer === Layer.Utility) {
19
+ // 如果 b 是 Layer.Utility 而 a 不是,则 b 应该排在 a 前面
26
20
  return 1;
27
21
  } else if (a.id !== b.id) {
28
22
  return a.className.localeCompare(b.className);
@@ -30,26 +24,26 @@ import MasterCSS from '../core.mjs';
30
24
  // 檢查 vendorSuffixSelectors 是否存在
31
25
  const aHasVendorSuffix = a.vendorSuffixSelectors?.['']?.[0];
32
26
  const bHasVendorSuffix = b.vendorSuffixSelectors?.['']?.[0];
33
- // 檢查 media.token 是否存在
34
- const aHasMediaToken = a.media?.token;
35
- const bHasMediaToken = b.media?.token;
36
27
  if (a.priority === -1 && b.priority === -1) {
37
28
  // 如果 a 和 b 都有 vendorSuffixSelectors 或 media.token,則按照以下規則排序
38
29
  if (aHasVendorSuffix && bHasVendorSuffix) {
39
30
  return aHasVendorSuffix.localeCompare(bHasVendorSuffix);
40
31
  }
32
+ // 檢查 media.token 是否存在
33
+ const aAtToke = a.atToken;
34
+ const bAtToken = b.atToken;
41
35
  // 如果 a 和 b 都有 media.token 且不包含內建已處理過排序的,則按照以下規則排序
42
- if (aHasMediaToken && bHasMediaToken && !Object.keys(a.media.features || {}).length && !Object.keys(b.media.features || {}).length) {
43
- return aHasMediaToken.localeCompare(bHasMediaToken);
36
+ if (aAtToke && bAtToken && !a.at.media?.find(({ name })=>name === 'min-width' || name === 'max-width') && !b.at.media?.find(({ name })=>name === 'min-width' || name === 'max-width')) {
37
+ return aAtToke.localeCompare(bAtToken);
44
38
  }
45
39
  if (aHasVendorSuffix && !bHasVendorSuffix) {
46
40
  return 1;
47
41
  } else if (!aHasVendorSuffix && bHasVendorSuffix) {
48
42
  return -1;
49
43
  }
50
- if (aHasMediaToken && !bHasMediaToken) {
44
+ if (aAtToke && !bAtToken) {
51
45
  return 1;
52
- } else if (!aHasMediaToken && bHasMediaToken) {
46
+ } else if (!aAtToke && bAtToken) {
53
47
  return -1;
54
48
  }
55
49
  }
package/package.json CHANGED
@@ -1 +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.0.0","@techor/extend":"^3.0.18"},"devDependencies":{"css-shared":"^2.0.0-rc.25","csstype":"^3.1.3"},"version":"2.0.0-rc.25"}
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"}
@@ -1,7 +0,0 @@
1
- 'use strict';
2
-
3
- var screenSizes = require('../tokens/screen-sizes.cjs');
4
-
5
-
6
-
7
- module.exports = screenSizes;
@@ -1 +0,0 @@
1
- export { default } from '../tokens/screen-sizes';
@@ -1 +0,0 @@
1
- export { default } from '../tokens/screen-sizes.mjs';
@@ -1,5 +0,0 @@
1
- 'use strict';
2
-
3
- const BASE_UNIT_REGEX = /^([+-]?(?:\d+(?:\.?\d+)?|\.\d+))x$/m;
4
-
5
- exports.BASE_UNIT_REGEX = BASE_UNIT_REGEX;
@@ -1 +0,0 @@
1
- export declare const BASE_UNIT_REGEX: RegExp;
@@ -1,3 +0,0 @@
1
- const BASE_UNIT_REGEX = /^([+-]?(?:\d+(?:\.?\d+)?|\.\d+))x$/m;
2
-
3
- export { BASE_UNIT_REGEX };
@@ -1,10 +0,0 @@
1
- 'use strict';
2
-
3
- const START_SYMBOLS = {
4
- '(': ')',
5
- '\'': '\'',
6
- '"': '"',
7
- '{': '}'
8
- };
9
-
10
- exports.START_SYMBOLS = START_SYMBOLS;
@@ -1,6 +0,0 @@
1
- export declare const START_SYMBOLS: {
2
- '(': string;
3
- '\'': string;
4
- '"': string;
5
- '{': string;
6
- };
@@ -1,8 +0,0 @@
1
- const START_SYMBOLS = {
2
- '(': ')',
3
- '\'': '\'',
4
- '"': '"',
5
- '{': '}'
6
- };
7
-
8
- export { START_SYMBOLS };
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- function transformColorWithOpacity(color, opacityStr) {
4
- let opacity = opacityStr.endsWith('%') ? parseFloat(opacityStr) / 100.0 : +opacityStr;
5
- opacity = isNaN(opacity) ? 1 : Math.min(Math.max(opacity, 0), 1);
6
- return color + Math.round(opacity * 255).toString(16).toUpperCase().padStart(2, '0');
7
- }
8
-
9
- exports.transformColorWithOpacity = transformColorWithOpacity;
@@ -1 +0,0 @@
1
- export declare function transformColorWithOpacity(color: string, opacityStr: string): string;
@@ -1,7 +0,0 @@
1
- function transformColorWithOpacity(color, opacityStr) {
2
- let opacity = opacityStr.endsWith('%') ? parseFloat(opacityStr) / 100.0 : +opacityStr;
3
- opacity = isNaN(opacity) ? 1 : Math.min(Math.max(opacity, 0), 1);
4
- return color + Math.round(opacity * 255).toString(16).toUpperCase().padStart(2, '0');
5
- }
6
-
7
- export { transformColorWithOpacity };
@@ -1,12 +0,0 @@
1
- 'use strict';
2
-
3
- function concatArrays(originVal, newVal) {
4
- if (Array.isArray(originVal) && Array.isArray(newVal)) {
5
- // concat logic
6
- return originVal.concat(newVal);
7
- }
8
- return newVal // always return newVal as fallback!!
9
- ;
10
- }
11
-
12
- exports.concatArrays = concatArrays;
@@ -1 +0,0 @@
1
- export declare function concatArrays(originVal: any, newVal: any): any | any[];
@@ -1,10 +0,0 @@
1
- function concatArrays(originVal, newVal) {
2
- if (Array.isArray(originVal) && Array.isArray(newVal)) {
3
- // concat logic
4
- return originVal.concat(newVal);
5
- }
6
- return newVal // always return newVal as fallback!!
7
- ;
8
- }
9
-
10
- export { concatArrays };
@@ -1,12 +0,0 @@
1
- 'use strict';
2
-
3
- /**
4
- * Returns the object type of the given payload
5
- *
6
- * @param {*} payload
7
- * @returns {string}
8
- */ function getType(payload) {
9
- return Object.prototype.toString.call(payload).slice(8, -1);
10
- }
11
-
12
- exports.getType = getType;
@@ -1,7 +0,0 @@
1
- /**
2
- * Returns the object type of the given payload
3
- *
4
- * @param {*} payload
5
- * @returns {string}
6
- */
7
- export declare function getType(payload: any): string;
@@ -1,10 +0,0 @@
1
- /**
2
- * Returns the object type of the given payload
3
- *
4
- * @param {*} payload
5
- * @returns {string}
6
- */ function getType(payload) {
7
- return Object.prototype.toString.call(payload).slice(8, -1);
8
- }
9
-
10
- export { getType };
@@ -1,15 +0,0 @@
1
- 'use strict';
2
-
3
- var getType = require('./get-type.cjs');
4
-
5
- /**
6
- * Returns whether the payload is a plain JavaScript object (excluding special classes or objects with other prototypes)
7
- *
8
- * @param {*} payload
9
- * @returns {payload is PlainObject}
10
- */ function isPlainObject(payload) {
11
- if (getType.getType(payload) !== 'Object') return false;
12
- return payload.constructor === Object && Object.getPrototypeOf(payload) === Object.prototype;
13
- }
14
-
15
- exports.isPlainObject = isPlainObject;
@@ -1,8 +0,0 @@
1
- export type PlainObject = Record<string | number | symbol, any>;
2
- /**
3
- * Returns whether the payload is a plain JavaScript object (excluding special classes or objects with other prototypes)
4
- *
5
- * @param {*} payload
6
- * @returns {payload is PlainObject}
7
- */
8
- export declare function isPlainObject(payload: any): payload is PlainObject;