@master/css 2.0.0-rc.3 → 2.0.0-rc.30

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 (109) hide show
  1. package/README.md +4 -43
  2. package/dist/_virtual/_commonjsHelpers.cjs +5 -0
  3. package/dist/_virtual/_commonjsHelpers.mjs +3 -0
  4. package/dist/_virtual/css-escape.cjs +5 -0
  5. package/dist/_virtual/css-escape.mjs +3 -0
  6. package/dist/bin/index.cjs +11 -0
  7. package/dist/bin/index.d.ts +0 -1
  8. package/dist/bin/index.mjs +9 -0
  9. package/dist/common.cjs +145 -0
  10. package/dist/common.d.ts +25 -0
  11. package/dist/common.mjs +124 -0
  12. package/dist/config/animations.cjs +113 -0
  13. package/dist/config/animations.mjs +111 -0
  14. package/dist/config/functions.cjs +351 -0
  15. package/dist/config/functions.mjs +349 -0
  16. package/dist/config/index.cjs +36 -0
  17. package/dist/config/index.d.ts +15 -12
  18. package/dist/config/index.mjs +26 -0
  19. package/dist/config/modes.cjs +8 -0
  20. package/dist/config/modes.d.ts +3 -0
  21. package/dist/config/modes.mjs +6 -0
  22. package/dist/config/queries.cjs +17 -0
  23. package/dist/config/queries.d.ts +22 -0
  24. package/dist/config/queries.mjs +15 -0
  25. package/dist/config/rules.cjs +2303 -0
  26. package/dist/config/rules.d.ts +8 -5
  27. package/dist/config/rules.mjs +2298 -0
  28. package/dist/config/selectors.cjs +28 -0
  29. package/dist/config/selectors.d.ts +0 -1
  30. package/dist/config/selectors.mjs +26 -0
  31. package/dist/config/styles.cjs +2 -0
  32. package/dist/config/styles.mjs +1 -0
  33. package/dist/config/utilities.cjs +191 -0
  34. package/dist/config/{semantics.d.ts → utilities.d.ts} +2 -5
  35. package/dist/config/utilities.mjs +189 -0
  36. package/dist/config/variables.cjs +116 -0
  37. package/dist/config/variables.d.ts +132 -177
  38. package/dist/config/variables.mjs +114 -0
  39. package/dist/core.cjs +1046 -0
  40. package/dist/core.d.ts +35 -31
  41. package/dist/core.mjs +1041 -0
  42. package/dist/index.cjs +72 -0
  43. package/dist/index.d.ts +15 -8
  44. package/dist/index.mjs +22 -0
  45. package/dist/layer.cjs +28 -0
  46. package/dist/layer.d.ts +26 -9
  47. package/dist/layer.mjs +26 -0
  48. package/dist/polyfills/css-escape.cjs +8 -0
  49. package/dist/polyfills/css-escape.mjs +2 -0
  50. package/dist/polyfills/css-escape2.cjs +68 -0
  51. package/dist/polyfills/css-escape2.mjs +64 -0
  52. package/dist/rule.cjs +722 -0
  53. package/dist/rule.d.ts +60 -22
  54. package/dist/rule.mjs +720 -0
  55. package/dist/shared/utils/css-escape.cjs +56 -0
  56. package/dist/shared/utils/css-escape.mjs +54 -0
  57. package/dist/tokens/screen-sizes.cjs +17 -0
  58. package/dist/tokens/screen-sizes.mjs +15 -0
  59. package/dist/types/global.cjs +2 -0
  60. package/dist/types/global.d.ts +3 -3
  61. package/dist/types/global.mjs +1 -0
  62. package/dist/utils/are-rule-modes-equal.cjs +7 -0
  63. package/dist/utils/are-rule-modes-equal.d.ts +2 -0
  64. package/dist/utils/are-rule-modes-equal.mjs +5 -0
  65. package/dist/utils/are-rule-queries-equal.cjs +22 -0
  66. package/dist/utils/are-rule-queries-equal.d.ts +2 -0
  67. package/dist/utils/are-rule-queries-equal.mjs +20 -0
  68. package/dist/utils/are-rule-selectors-equal.cjs +29 -0
  69. package/dist/utils/are-rule-selectors-equal.d.ts +2 -0
  70. package/dist/utils/are-rule-selectors-equal.mjs +27 -0
  71. package/dist/utils/are-rule-states-equal.cjs +11 -0
  72. package/dist/utils/are-rule-states-equal.d.ts +2 -0
  73. package/dist/utils/are-rule-states-equal.mjs +9 -0
  74. package/dist/utils/are-rules-duplicated.cjs +17 -0
  75. package/dist/utils/are-rules-duplicated.d.ts +2 -0
  76. package/dist/utils/are-rules-duplicated.mjs +15 -0
  77. package/dist/utils/extend-config.cjs +72 -0
  78. package/dist/utils/extend-config.d.ts +1 -1
  79. package/dist/utils/extend-config.mjs +70 -0
  80. package/dist/utils/flatten-object.cjs +15 -0
  81. package/dist/utils/flatten-object.mjs +13 -0
  82. package/dist/utils/generate-css.cjs +13 -0
  83. package/dist/utils/generate-css.d.ts +2 -0
  84. package/dist/utils/generate-css.mjs +11 -0
  85. package/dist/utils/hex-to-rgb.cjs +30 -0
  86. package/dist/utils/hex-to-rgb.d.ts +1 -1
  87. package/dist/utils/hex-to-rgb.mjs +28 -0
  88. package/dist/utils/is-core-rule.cjs +9 -0
  89. package/dist/utils/is-core-rule.d.ts +1 -0
  90. package/dist/utils/is-core-rule.mjs +7 -0
  91. package/dist/utils/reorder-for-readable-classes.cjs +62 -0
  92. package/dist/{functions → utils}/reorder-for-readable-classes.d.ts +2 -6
  93. package/dist/utils/reorder-for-readable-classes.mjs +60 -0
  94. package/package.json +1 -1
  95. package/dist/bin/index.bundle.js +0 -36
  96. package/dist/config/media-queries.d.ts +0 -1
  97. package/dist/constants/base-unit-regex.d.ts +0 -1
  98. package/dist/constants/config-esm-text.d.ts +0 -1
  99. package/dist/constants/config-text.d.ts +0 -1
  100. package/dist/constants/config-ts-text.d.ts +0 -1
  101. package/dist/constants/start-symbol.d.ts +0 -6
  102. package/dist/functions/transform-color-with-opacity.d.ts +0 -1
  103. package/dist/index.bundle.js +0 -35
  104. package/dist/index.bundle.mjs +0 -35
  105. package/dist/utils/concat-arrays.d.ts +0 -1
  106. package/dist/utils/get-type.d.ts +0 -7
  107. package/dist/utils/is-plain-object.d.ts +0 -8
  108. package/dist/utils/is-symbol.d.ts +0 -7
  109. package/dist/utils/rgb-to-hex.d.ts +0 -1
@@ -0,0 +1,28 @@
1
+ 'use strict';
2
+
3
+ const selectors = {
4
+ '::scrollbar': '::-webkit-scrollbar',
5
+ '::scrollbar-button': '::-webkit-scrollbar-button',
6
+ '::scrollbar-thumb': '::-webkit-scrollbar-thumb',
7
+ '::scrollbar-track': '::-webkit-scrollbar-track',
8
+ '::scrollbar-track-piece': '::-webkit-scrollbar-track-piece',
9
+ '::scrollbar-corner': '::-webkit-scrollbar-corner',
10
+ '::slider-thumb': [
11
+ '::-webkit-slider-thumb',
12
+ '::-moz-range-thumb'
13
+ ],
14
+ '::slider-runnable-track': [
15
+ '::-webkit-slider-runnable-track',
16
+ '::-moz-range-track'
17
+ ],
18
+ '::resizer': '::-webkit-resizer',
19
+ '::progress': '::-webkit-progress',
20
+ ':first': ':first-child',
21
+ ':last': ':last-child',
22
+ ':even': ':nth-child(2n)',
23
+ ':odd': ':nth-child(odd)',
24
+ ':nth(': ':nth-child(',
25
+ ':only': ':only-child'
26
+ };
27
+
28
+ module.exports = selectors;
@@ -7,7 +7,6 @@ declare const selectors: {
7
7
  '::scrollbar-corner': string;
8
8
  '::slider-thumb': string[];
9
9
  '::slider-runnable-track': string[];
10
- '::meter': string;
11
10
  '::resizer': string;
12
11
  '::progress': string;
13
12
  ':first': string;
@@ -0,0 +1,26 @@
1
+ const selectors = {
2
+ '::scrollbar': '::-webkit-scrollbar',
3
+ '::scrollbar-button': '::-webkit-scrollbar-button',
4
+ '::scrollbar-thumb': '::-webkit-scrollbar-thumb',
5
+ '::scrollbar-track': '::-webkit-scrollbar-track',
6
+ '::scrollbar-track-piece': '::-webkit-scrollbar-track-piece',
7
+ '::scrollbar-corner': '::-webkit-scrollbar-corner',
8
+ '::slider-thumb': [
9
+ '::-webkit-slider-thumb',
10
+ '::-moz-range-thumb'
11
+ ],
12
+ '::slider-runnable-track': [
13
+ '::-webkit-slider-runnable-track',
14
+ '::-moz-range-track'
15
+ ],
16
+ '::resizer': '::-webkit-resizer',
17
+ '::progress': '::-webkit-progress',
18
+ ':first': ':first-child',
19
+ ':last': ':last-child',
20
+ ':even': ':nth-child(2n)',
21
+ ':odd': ':nth-child(odd)',
22
+ ':nth(': ':nth-child(',
23
+ ':only': ':only-child'
24
+ };
25
+
26
+ export { selectors as default };
@@ -0,0 +1,2 @@
1
+ 'use strict';
2
+
@@ -0,0 +1 @@
1
+
@@ -0,0 +1,191 @@
1
+ 'use strict';
2
+
3
+ const utilities = {
4
+ square: {
5
+ 'aspect-ratio': '1/1'
6
+ },
7
+ video: {
8
+ 'aspect-ratio': '16/9'
9
+ },
10
+ rounded: {
11
+ 'border-radius': '1e9em'
12
+ },
13
+ round: {
14
+ 'border-radius': '50%'
15
+ },
16
+ hidden: {
17
+ display: 'none'
18
+ },
19
+ block: {
20
+ display: 'block'
21
+ },
22
+ table: {
23
+ display: 'table'
24
+ },
25
+ flex: {
26
+ display: 'flex'
27
+ },
28
+ grid: {
29
+ display: 'grid'
30
+ },
31
+ contents: {
32
+ display: 'contents'
33
+ },
34
+ inline: {
35
+ display: 'inline'
36
+ },
37
+ 'inline-block': {
38
+ display: 'inline-block'
39
+ },
40
+ 'inline-flex': {
41
+ display: 'inline-flex'
42
+ },
43
+ 'inline-grid': {
44
+ display: 'inline-grid'
45
+ },
46
+ 'inline-table': {
47
+ display: 'inline-table'
48
+ },
49
+ 'table-cell': {
50
+ display: 'table-cell'
51
+ },
52
+ 'table-caption': {
53
+ display: 'table-caption'
54
+ },
55
+ 'flow-root': {
56
+ display: 'flow-root'
57
+ },
58
+ 'list-item': {
59
+ display: 'list-item'
60
+ },
61
+ 'table-row': {
62
+ display: 'table-row'
63
+ },
64
+ 'table-column': {
65
+ display: 'table-column'
66
+ },
67
+ 'table-row-group': {
68
+ display: 'table-row-group'
69
+ },
70
+ 'table-column-group': {
71
+ display: 'table-column-group'
72
+ },
73
+ 'table-header-group': {
74
+ display: 'table-header-group'
75
+ },
76
+ 'table-footer-group': {
77
+ display: 'table-footer-group'
78
+ },
79
+ italic: {
80
+ 'font-style': 'italic'
81
+ },
82
+ oblique: {
83
+ 'font-style': 'oblique'
84
+ },
85
+ isolate: {
86
+ isolation: 'isolate'
87
+ },
88
+ overflowed: {
89
+ overflow: 'visible'
90
+ },
91
+ untouchable: {
92
+ 'pointer-events': 'none'
93
+ },
94
+ static: {
95
+ position: 'static'
96
+ },
97
+ fixed: {
98
+ position: 'fixed'
99
+ },
100
+ abs: {
101
+ position: 'absolute'
102
+ },
103
+ rel: {
104
+ position: 'relative'
105
+ },
106
+ sticky: {
107
+ position: 'sticky'
108
+ },
109
+ uppercase: {
110
+ 'text-transform': 'uppercase'
111
+ },
112
+ lowercase: {
113
+ 'text-transform': 'lowercase'
114
+ },
115
+ capitalize: {
116
+ 'text-transform': 'capitalize'
117
+ },
118
+ visible: {
119
+ visibility: 'visible'
120
+ },
121
+ invisible: {
122
+ visibility: 'hidden'
123
+ },
124
+ vw: {
125
+ width: '100vw'
126
+ },
127
+ vh: {
128
+ height: '100vh'
129
+ },
130
+ 'max-vw': {
131
+ 'max-width': '100vw'
132
+ },
133
+ 'max-vh': {
134
+ 'max-height': '100vh'
135
+ },
136
+ 'min-vw': {
137
+ 'min-width': '100vw'
138
+ },
139
+ 'min-vh': {
140
+ 'min-height': '100vh'
141
+ },
142
+ 'center-content': {
143
+ 'justify-content': 'center',
144
+ 'align-items': 'center'
145
+ },
146
+ 'sr-only': {
147
+ position: 'absolute',
148
+ width: '1px',
149
+ height: '1px',
150
+ padding: '0',
151
+ margin: '-1px',
152
+ overflow: 'hidden',
153
+ clip: 'rect(0,0,0,0)',
154
+ 'white-space': 'nowrap',
155
+ 'border-width': '0'
156
+ },
157
+ full: {
158
+ width: '100%',
159
+ height: '100%'
160
+ },
161
+ center: {
162
+ left: 0,
163
+ right: 0,
164
+ 'margin-left': 'auto',
165
+ 'margin-right': 'auto'
166
+ },
167
+ middle: {
168
+ top: 0,
169
+ bottom: 0,
170
+ 'margin-top': 'auto',
171
+ 'margin-bottom': 'auto'
172
+ },
173
+ 'break-spaces': {
174
+ 'white-space': 'break-spaces'
175
+ },
176
+ 'break-word': {
177
+ 'overflow-wrap': 'break-word',
178
+ overflow: 'hidden'
179
+ },
180
+ 'gradient-text': {
181
+ '-webkit-text-fill-color': 'transparent',
182
+ '-webkit-background-clip': 'text',
183
+ 'background-clip': 'text'
184
+ },
185
+ fit: {
186
+ width: 'fit-content',
187
+ height: 'fit-content'
188
+ }
189
+ };
190
+
191
+ module.exports = utilities;
@@ -1,4 +1,4 @@
1
- declare const semantics: {
1
+ declare const utilities: {
2
2
  readonly square: {
3
3
  readonly 'aspect-ratio': "1/1";
4
4
  };
@@ -14,9 +14,6 @@ declare const semantics: {
14
14
  readonly hidden: {
15
15
  readonly display: "none";
16
16
  };
17
- readonly hide: {
18
- readonly display: "none";
19
- };
20
17
  readonly block: {
21
18
  readonly display: "block";
22
19
  };
@@ -188,4 +185,4 @@ declare const semantics: {
188
185
  readonly height: "fit-content";
189
186
  };
190
187
  };
191
- export default semantics;
188
+ export default utilities;
@@ -0,0 +1,189 @@
1
+ const utilities = {
2
+ square: {
3
+ 'aspect-ratio': '1/1'
4
+ },
5
+ video: {
6
+ 'aspect-ratio': '16/9'
7
+ },
8
+ rounded: {
9
+ 'border-radius': '1e9em'
10
+ },
11
+ round: {
12
+ 'border-radius': '50%'
13
+ },
14
+ hidden: {
15
+ display: 'none'
16
+ },
17
+ block: {
18
+ display: 'block'
19
+ },
20
+ table: {
21
+ display: 'table'
22
+ },
23
+ flex: {
24
+ display: 'flex'
25
+ },
26
+ grid: {
27
+ display: 'grid'
28
+ },
29
+ contents: {
30
+ display: 'contents'
31
+ },
32
+ inline: {
33
+ display: 'inline'
34
+ },
35
+ 'inline-block': {
36
+ display: 'inline-block'
37
+ },
38
+ 'inline-flex': {
39
+ display: 'inline-flex'
40
+ },
41
+ 'inline-grid': {
42
+ display: 'inline-grid'
43
+ },
44
+ 'inline-table': {
45
+ display: 'inline-table'
46
+ },
47
+ 'table-cell': {
48
+ display: 'table-cell'
49
+ },
50
+ 'table-caption': {
51
+ display: 'table-caption'
52
+ },
53
+ 'flow-root': {
54
+ display: 'flow-root'
55
+ },
56
+ 'list-item': {
57
+ display: 'list-item'
58
+ },
59
+ 'table-row': {
60
+ display: 'table-row'
61
+ },
62
+ 'table-column': {
63
+ display: 'table-column'
64
+ },
65
+ 'table-row-group': {
66
+ display: 'table-row-group'
67
+ },
68
+ 'table-column-group': {
69
+ display: 'table-column-group'
70
+ },
71
+ 'table-header-group': {
72
+ display: 'table-header-group'
73
+ },
74
+ 'table-footer-group': {
75
+ display: 'table-footer-group'
76
+ },
77
+ italic: {
78
+ 'font-style': 'italic'
79
+ },
80
+ oblique: {
81
+ 'font-style': 'oblique'
82
+ },
83
+ isolate: {
84
+ isolation: 'isolate'
85
+ },
86
+ overflowed: {
87
+ overflow: 'visible'
88
+ },
89
+ untouchable: {
90
+ 'pointer-events': 'none'
91
+ },
92
+ static: {
93
+ position: 'static'
94
+ },
95
+ fixed: {
96
+ position: 'fixed'
97
+ },
98
+ abs: {
99
+ position: 'absolute'
100
+ },
101
+ rel: {
102
+ position: 'relative'
103
+ },
104
+ sticky: {
105
+ position: 'sticky'
106
+ },
107
+ uppercase: {
108
+ 'text-transform': 'uppercase'
109
+ },
110
+ lowercase: {
111
+ 'text-transform': 'lowercase'
112
+ },
113
+ capitalize: {
114
+ 'text-transform': 'capitalize'
115
+ },
116
+ visible: {
117
+ visibility: 'visible'
118
+ },
119
+ invisible: {
120
+ visibility: 'hidden'
121
+ },
122
+ vw: {
123
+ width: '100vw'
124
+ },
125
+ vh: {
126
+ height: '100vh'
127
+ },
128
+ 'max-vw': {
129
+ 'max-width': '100vw'
130
+ },
131
+ 'max-vh': {
132
+ 'max-height': '100vh'
133
+ },
134
+ 'min-vw': {
135
+ 'min-width': '100vw'
136
+ },
137
+ 'min-vh': {
138
+ 'min-height': '100vh'
139
+ },
140
+ 'center-content': {
141
+ 'justify-content': 'center',
142
+ 'align-items': 'center'
143
+ },
144
+ 'sr-only': {
145
+ position: 'absolute',
146
+ width: '1px',
147
+ height: '1px',
148
+ padding: '0',
149
+ margin: '-1px',
150
+ overflow: 'hidden',
151
+ clip: 'rect(0,0,0,0)',
152
+ 'white-space': 'nowrap',
153
+ 'border-width': '0'
154
+ },
155
+ full: {
156
+ width: '100%',
157
+ height: '100%'
158
+ },
159
+ center: {
160
+ left: 0,
161
+ right: 0,
162
+ 'margin-left': 'auto',
163
+ 'margin-right': 'auto'
164
+ },
165
+ middle: {
166
+ top: 0,
167
+ bottom: 0,
168
+ 'margin-top': 'auto',
169
+ 'margin-bottom': 'auto'
170
+ },
171
+ 'break-spaces': {
172
+ 'white-space': 'break-spaces'
173
+ },
174
+ 'break-word': {
175
+ 'overflow-wrap': 'break-word',
176
+ overflow: 'hidden'
177
+ },
178
+ 'gradient-text': {
179
+ '-webkit-text-fill-color': 'transparent',
180
+ '-webkit-background-clip': 'text',
181
+ 'background-clip': 'text'
182
+ },
183
+ fit: {
184
+ width: 'fit-content',
185
+ height: 'fit-content'
186
+ }
187
+ };
188
+
189
+ export { utilities as default };
@@ -0,0 +1,116 @@
1
+ 'use strict';
2
+
3
+ var colors = require('@master/colors');
4
+ var screenSizes = require('../tokens/screen-sizes.cjs');
5
+
6
+ const variables = {
7
+ full: '100%',
8
+ fit: 'fit-content',
9
+ max: 'max-content',
10
+ min: 'min-content',
11
+ 'font-family': {
12
+ mono: [
13
+ 'ui-monospace',
14
+ 'SFMono-Regular',
15
+ 'Menlo',
16
+ 'Monaco',
17
+ 'Consolas',
18
+ 'Liberation Mono',
19
+ 'Courier New',
20
+ 'monospace'
21
+ ],
22
+ sans: [
23
+ 'ui-sans-serif',
24
+ 'system-ui',
25
+ '-apple-system',
26
+ 'BlinkMacSystemFont',
27
+ 'Segoe UI',
28
+ 'Roboto',
29
+ 'Helvetica Neue',
30
+ 'Arial',
31
+ 'Noto Sans',
32
+ 'sans-serif',
33
+ 'Apple Color Emoji',
34
+ 'Segoe UI Emoji',
35
+ 'Segoe UI Symbol',
36
+ 'Noto Color Emoji'
37
+ ],
38
+ serif: [
39
+ 'ui-serif',
40
+ 'Georgia',
41
+ 'Cambria',
42
+ 'Times New Roman',
43
+ 'Times',
44
+ 'serif'
45
+ ]
46
+ },
47
+ screen: screenSizes,
48
+ 'font-weight': {
49
+ thin: 100,
50
+ extralight: 200,
51
+ light: 300,
52
+ regular: 400,
53
+ medium: 500,
54
+ semibold: 600,
55
+ bold: 700,
56
+ extrabold: 800,
57
+ heavy: 900
58
+ },
59
+ 'flex-direction': {
60
+ col: 'column',
61
+ 'col-reverse': 'column-reverse'
62
+ },
63
+ 'box-sizing': {
64
+ content: 'content-box',
65
+ border: 'border-box'
66
+ },
67
+ position: {
68
+ abs: 'absolute',
69
+ rel: 'relative'
70
+ },
71
+ 'transform-box': {
72
+ content: 'content-box',
73
+ border: 'border-box',
74
+ padding: 'padding-box',
75
+ fill: 'fill-box',
76
+ stroke: 'stroke-box',
77
+ view: 'view-box'
78
+ },
79
+ 'animation-direction': {
80
+ alt: 'alternate',
81
+ 'alt-reverse': 'alternate-reverse'
82
+ },
83
+ 'background-clip': {
84
+ content: 'content-box',
85
+ border: 'border-box',
86
+ padding: 'padding-box'
87
+ },
88
+ 'background-origin': {
89
+ content: 'content-box',
90
+ border: 'border-box',
91
+ padding: 'padding-box'
92
+ },
93
+ order: {
94
+ first: -999999,
95
+ last: 999999
96
+ },
97
+ 'shape-outside': {
98
+ content: 'content-box',
99
+ border: 'border-box',
100
+ padding: 'padding-box',
101
+ margin: 'margin-box'
102
+ },
103
+ 'clip-path': {
104
+ content: 'content-box',
105
+ border: 'border-box',
106
+ padding: 'padding-box',
107
+ margin: 'margin-box',
108
+ fill: 'fill-box',
109
+ stroke: 'stroke-box',
110
+ view: 'view-box'
111
+ },
112
+ current: 'currentColor',
113
+ ...colors
114
+ };
115
+
116
+ module.exports = variables;