@cronocode/react-box 2.0.7 → 3.0.0-alpha.2

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 (53) hide show
  1. package/box.cjs +1 -1
  2. package/box.d.ts +13 -7
  3. package/box.mjs +15 -9
  4. package/components/baseSvg.d.ts +3 -4
  5. package/components/button.cjs +1 -1
  6. package/components/button.d.ts +0 -1
  7. package/components/button.mjs +1 -1
  8. package/components/checkbox.cjs +1 -1
  9. package/components/checkbox.d.ts +2 -5
  10. package/components/checkbox.mjs +10 -10
  11. package/components/dataGrid/dataGridContract.d.ts +19 -11
  12. package/components/dataGrid/useGridData.d.ts +7 -0
  13. package/components/dataGrid.cjs +1 -1
  14. package/components/dataGrid.d.ts +5 -3
  15. package/components/dataGrid.mjs +17 -28
  16. package/components/flex.d.ts +3 -5
  17. package/components/form.cjs +1 -1
  18. package/components/form.d.ts +0 -1
  19. package/components/form.mjs +1 -1
  20. package/components/grid.d.ts +3 -5
  21. package/components/label.d.ts +0 -1
  22. package/components/radioButton.cjs +1 -1
  23. package/components/radioButton.d.ts +1 -3
  24. package/components/radioButton.mjs +9 -9
  25. package/components/textarea.cjs +1 -1
  26. package/components/textarea.d.ts +1 -2
  27. package/components/textarea.mjs +8 -9
  28. package/components/textbox.cjs +1 -1
  29. package/components/textbox.d.ts +0 -2
  30. package/components/textbox.mjs +1 -1
  31. package/components/tooltip.cjs +1 -1
  32. package/components/tooltip.d.ts +1 -2
  33. package/components/tooltip.mjs +34 -40
  34. package/core/boxExtends.d.ts +6 -0
  35. package/core/boxStyles.d.ts +701 -1217
  36. package/core/boxStylesFormatters.d.ts +2 -2
  37. package/core/coreTypes.d.ts +31 -0
  38. package/core/theme.d.ts +13 -32
  39. package/core/useStyles.d.ts +12 -3
  40. package/core/useTheme.d.ts +7 -10
  41. package/core.cjs +4 -34
  42. package/core.mjs +1397 -1158
  43. package/package.json +20 -25
  44. package/ssg.d.ts +0 -1
  45. package/types.d.ts +26 -0
  46. package/utils/object/objectUtils.d.ts +2 -0
  47. package/components/dataGrid/useGrid.d.ts +0 -3
  48. package/core/stylesContext.d.ts +0 -13
  49. package/core/theme.cjs +0 -1
  50. package/core/theme.mjs +0 -4
  51. package/core/types.d.ts +0 -60
  52. package/utils.cjs +0 -1
  53. package/utils.mjs +0 -63
package/core/boxStyles.d.ts CHANGED
@@ -1,1254 +1,738 @@
1
1
  import { BoxStylesFormatters } from './boxStylesFormatters';
2
-
3
- export interface StyleValues {
4
- values: Readonly<Array<unknown>>;
5
- formatSelector?: (selector: string) => string[];
6
- formatValue?: (key: string, value: any) => string;
7
- }
8
- export interface ThemeItem {
9
- cssNames: string[];
10
- formatSelector?: (selector: string) => string[];
11
- formatValue?: (key: string, value: any) => string;
12
- }
13
- export interface StyleItem {
14
- cssNames: string[];
15
- values1: StyleValues;
16
- values2: StyleValues;
17
- values3: StyleValues;
18
- pseudoSuffix?: PseudoClassSuffix;
19
- customPseudoSuffix?: string;
20
- breakpoint?: BoxBreakpointsType;
21
- isThemeStyle?: boolean;
22
- }
23
- export declare const simpleBoxStyles: {
24
- /** The `display` CSS property sets whether an element is treated as a block or inline box and the layout used for its children, such as flow layout, grid or flex. */
25
- display: {
26
- cssNames: string[];
27
- values1: {
28
- values: readonly ["none", "block", "inline-block", "flex", "inline-flex", "grid", "inline-grid", "contents"];
29
- };
30
- values2: {
31
- values: readonly [];
32
- };
33
- values3: {
34
- values: readonly [];
35
- };
36
- };
37
- /** The `inline` property is a shortcut to transform `block`, `flex` and `grid` value to `inline-block`, `inline-flex` and `inline-grid` respectively. */
38
- inline: {
39
- cssNames: string[];
40
- values1: {
41
- values: readonly [true];
42
- formatValue: () => string;
43
- };
44
- values2: {
45
- values: readonly [];
46
- };
47
- values3: {
48
- values: readonly [];
49
- };
50
- };
51
- /** The `box-sizing` CSS property sets how the total width and height of an element is calculated. */
52
- boxSizing: {
53
- cssNames: string[];
54
- values1: {
55
- values: readonly ["border-box", "content-box"];
56
- };
57
- values2: {
58
- values: readonly [];
59
- };
60
- values3: {
61
- values: readonly [];
62
- };
63
- };
64
- width: {
65
- cssNames: string[];
66
- values1: {
67
- values: readonly ["fit", "fit-screen", "auto", "fit-content", "max-content", "min-content"];
68
- formatValue: typeof BoxStylesFormatters.Value.widthHeight;
69
- };
70
- values2: {
71
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
72
- formatValue: typeof BoxStylesFormatters.Value.rem;
73
- };
74
- values3: {
75
- values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
76
- formatValue: typeof BoxStylesFormatters.Value.fraction;
77
- };
78
- };
79
- minWidth: {
80
- cssNames: string[];
81
- values1: {
82
- values: readonly ["fit", "fit-screen", "auto", "fit-content", "max-content", "min-content"];
83
- formatValue: typeof BoxStylesFormatters.Value.widthHeight;
84
- };
85
- values2: {
86
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
87
- formatValue: typeof BoxStylesFormatters.Value.rem;
88
- };
89
- values3: {
90
- values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
91
- formatValue: typeof BoxStylesFormatters.Value.fraction;
92
- };
93
- };
94
- maxWidth: {
95
- cssNames: string[];
96
- values1: {
97
- values: readonly ["fit", "fit-screen", "auto", "fit-content", "max-content", "min-content"];
98
- formatValue: typeof BoxStylesFormatters.Value.widthHeight;
99
- };
100
- values2: {
101
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
102
- formatValue: typeof BoxStylesFormatters.Value.rem;
103
- };
104
- values3: {
105
- values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
106
- formatValue: typeof BoxStylesFormatters.Value.fraction;
107
- };
108
- };
109
- height: {
110
- cssNames: string[];
111
- values1: {
112
- values: readonly ["fit", "fit-screen", "auto", "fit-content", "max-content", "min-content"];
113
- formatValue: typeof BoxStylesFormatters.Value.widthHeight;
114
- };
115
- values2: {
116
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
117
- formatValue: typeof BoxStylesFormatters.Value.rem;
118
- };
119
- values3: {
120
- values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
121
- formatValue: typeof BoxStylesFormatters.Value.fraction;
122
- };
123
- };
124
- minHeight: {
125
- cssNames: string[];
126
- values1: {
127
- values: readonly ["fit", "fit-screen", "auto", "fit-content", "max-content", "min-content"];
128
- formatValue: typeof BoxStylesFormatters.Value.widthHeight;
129
- };
130
- values2: {
131
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
132
- formatValue: typeof BoxStylesFormatters.Value.rem;
133
- };
134
- values3: {
135
- values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
136
- formatValue: typeof BoxStylesFormatters.Value.fraction;
137
- };
138
- };
139
- maxHeight: {
140
- cssNames: string[];
141
- values1: {
142
- values: readonly ["fit", "fit-screen", "auto", "fit-content", "max-content", "min-content"];
143
- formatValue: typeof BoxStylesFormatters.Value.widthHeight;
144
- };
145
- values2: {
146
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
147
- formatValue: typeof BoxStylesFormatters.Value.rem;
148
- };
149
- values3: {
150
- values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
151
- formatValue: typeof BoxStylesFormatters.Value.fraction;
152
- };
153
- };
154
- position: {
155
- cssNames: string[];
156
- values1: {
157
- values: readonly ["static", "relative", "absolute", "fixed", "sticky"];
158
- };
159
- values2: {
160
- values: readonly [];
161
- };
162
- values3: {
163
- values: readonly [];
164
- };
165
- };
166
- top: {
167
- cssNames: string[];
168
- values1: {
169
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
170
- formatValue: typeof BoxStylesFormatters.Value.rem;
171
- };
172
- values2: {
173
- values: readonly [];
174
- };
175
- values3: {
176
- values: readonly [];
177
- };
178
- };
179
- right: {
180
- cssNames: string[];
181
- values1: {
182
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
183
- formatValue: typeof BoxStylesFormatters.Value.rem;
184
- };
185
- values2: {
186
- values: readonly [];
187
- };
188
- values3: {
189
- values: readonly [];
190
- };
191
- };
192
- bottom: {
193
- cssNames: string[];
194
- values1: {
195
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
196
- formatValue: typeof BoxStylesFormatters.Value.rem;
197
- };
198
- values2: {
199
- values: readonly [];
200
- };
201
- values3: {
202
- values: readonly [];
203
- };
204
- };
205
- left: {
206
- cssNames: string[];
207
- values1: {
208
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
209
- formatValue: typeof BoxStylesFormatters.Value.rem;
210
- };
211
- values2: {
212
- values: readonly [];
213
- };
214
- values3: {
215
- values: readonly [];
216
- };
217
- };
218
- inset: {
219
- cssNames: string[];
220
- values1: {
221
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
222
- formatValue: typeof BoxStylesFormatters.Value.rem;
223
- };
224
- values2: {
225
- values: readonly [];
226
- };
227
- values3: {
228
- values: readonly [];
229
- };
230
- };
231
- m: {
232
- cssNames: string[];
233
- values1: {
234
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
235
- formatValue: typeof BoxStylesFormatters.Value.rem;
236
- };
237
- values2: {
238
- values: readonly ["auto"];
239
- };
240
- values3: {
241
- values: readonly [];
242
- };
243
- };
244
- mx: {
245
- cssNames: string[];
246
- values1: {
247
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
248
- formatValue: typeof BoxStylesFormatters.Value.rem;
249
- };
250
- values2: {
251
- values: readonly ["auto"];
252
- };
253
- values3: {
254
- values: readonly [];
255
- };
256
- };
257
- my: {
258
- cssNames: string[];
259
- values1: {
260
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
261
- formatValue: typeof BoxStylesFormatters.Value.rem;
262
- };
263
- values2: {
264
- values: readonly ["auto"];
265
- };
266
- values3: {
267
- values: readonly [];
268
- };
269
- };
270
- mt: {
271
- cssNames: string[];
272
- values1: {
273
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
274
- formatValue: typeof BoxStylesFormatters.Value.rem;
275
- };
276
- values2: {
277
- values: readonly ["auto"];
278
- };
279
- values3: {
280
- values: readonly [];
281
- };
282
- };
283
- mr: {
284
- cssNames: string[];
285
- values1: {
286
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
287
- formatValue: typeof BoxStylesFormatters.Value.rem;
288
- };
289
- values2: {
290
- values: readonly ["auto"];
291
- };
292
- values3: {
293
- values: readonly [];
294
- };
295
- };
296
- mb: {
297
- cssNames: string[];
298
- values1: {
299
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
300
- formatValue: typeof BoxStylesFormatters.Value.rem;
301
- };
302
- values2: {
303
- values: readonly ["auto"];
304
- };
305
- values3: {
306
- values: readonly [];
307
- };
308
- };
309
- ml: {
310
- cssNames: string[];
311
- values1: {
312
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
313
- formatValue: typeof BoxStylesFormatters.Value.rem;
314
- };
315
- values2: {
316
- values: readonly ["auto"];
317
- };
318
- values3: {
319
- values: readonly [];
320
- };
321
- };
322
- p: {
323
- cssNames: string[];
324
- values1: {
325
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
326
- formatValue: typeof BoxStylesFormatters.Value.rem;
327
- };
328
- values2: {
329
- values: readonly [];
330
- };
331
- values3: {
332
- values: readonly [];
333
- };
334
- };
335
- px: {
336
- cssNames: string[];
337
- values1: {
338
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
339
- formatValue: typeof BoxStylesFormatters.Value.rem;
340
- };
341
- values2: {
342
- values: readonly [];
343
- };
344
- values3: {
345
- values: readonly [];
346
- };
347
- };
348
- py: {
349
- cssNames: string[];
350
- values1: {
351
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
352
- formatValue: typeof BoxStylesFormatters.Value.rem;
353
- };
354
- values2: {
355
- values: readonly [];
356
- };
357
- values3: {
358
- values: readonly [];
359
- };
360
- };
361
- pt: {
362
- cssNames: string[];
363
- values1: {
364
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
365
- formatValue: typeof BoxStylesFormatters.Value.rem;
366
- };
367
- values2: {
368
- values: readonly [];
369
- };
370
- values3: {
371
- values: readonly [];
372
- };
373
- };
374
- pr: {
375
- cssNames: string[];
376
- values1: {
377
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
378
- formatValue: typeof BoxStylesFormatters.Value.rem;
379
- };
380
- values2: {
381
- values: readonly [];
382
- };
383
- values3: {
384
- values: readonly [];
385
- };
386
- };
387
- pb: {
388
- cssNames: string[];
389
- values1: {
390
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
391
- formatValue: typeof BoxStylesFormatters.Value.rem;
392
- };
393
- values2: {
394
- values: readonly [];
395
- };
396
- values3: {
397
- values: readonly [];
398
- };
399
- };
400
- pl: {
401
- cssNames: string[];
402
- values1: {
403
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
404
- formatValue: typeof BoxStylesFormatters.Value.rem;
405
- };
406
- values2: {
407
- values: readonly [];
408
- };
409
- values3: {
410
- values: readonly [];
411
- };
412
- };
2
+ export declare const cssStyles: {
3
+ /** The appearance CSS property is used to display UI elements with platform-specific styling, based on the operating system's theme. */
4
+ appearance: {
5
+ values: readonly ["none", "auto", "menulist-button", "textfield", "button", "checkbox"];
6
+ }[];
7
+ /** The border-width shorthand CSS property sets the width of an element's border. */
413
8
  b: {
414
- cssNames: string[];
415
- values1: {
416
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
417
- formatValue: typeof BoxStylesFormatters.Value.px;
418
- };
419
- values2: {
420
- values: readonly [];
421
- };
422
- values3: {
423
- values: readonly [];
424
- };
425
- };
9
+ values: number;
10
+ styleName: string;
11
+ valueFormat: typeof BoxStylesFormatters.Value.px;
12
+ }[];
13
+ /** The border-width shorthand CSS property sets the width of an element's left and right border. */
426
14
  bx: {
427
- cssNames: string[];
428
- values1: {
429
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
430
- formatValue: typeof BoxStylesFormatters.Value.px;
431
- };
432
- values2: {
433
- values: readonly [];
434
- };
435
- values3: {
436
- values: readonly [];
437
- };
438
- };
15
+ values: number;
16
+ styleName: string;
17
+ valueFormat: typeof BoxStylesFormatters.Value.px;
18
+ }[];
19
+ /** The border-width shorthand CSS property sets the width of an element's top and bottom border. */
439
20
  by: {
440
- cssNames: string[];
441
- values1: {
442
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
443
- formatValue: typeof BoxStylesFormatters.Value.px;
444
- };
445
- values2: {
446
- values: readonly [];
447
- };
448
- values3: {
449
- values: readonly [];
450
- };
451
- };
21
+ values: number;
22
+ styleName: string;
23
+ valueFormat: typeof BoxStylesFormatters.Value.px;
24
+ }[];
25
+ /** The border-top-width CSS property sets the width of the top border of an element. */
452
26
  bt: {
453
- cssNames: string[];
454
- values1: {
455
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
456
- formatValue: typeof BoxStylesFormatters.Value.px;
457
- };
458
- values2: {
459
- values: readonly [];
460
- };
461
- values3: {
462
- values: readonly [];
463
- };
464
- };
27
+ values: number;
28
+ styleName: string;
29
+ valueFormat: typeof BoxStylesFormatters.Value.px;
30
+ }[];
31
+ /** The border-right-width CSS property sets the width of the right border of an element. */
465
32
  br: {
466
- cssNames: string[];
467
- values1: {
468
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
469
- formatValue: typeof BoxStylesFormatters.Value.px;
470
- };
471
- values2: {
472
- values: readonly [];
473
- };
474
- values3: {
475
- values: readonly [];
476
- };
477
- };
33
+ values: number;
34
+ styleName: string;
35
+ valueFormat: typeof BoxStylesFormatters.Value.px;
36
+ }[];
37
+ /** The border-bottom-width CSS property sets the width of the bottom border of an element. */
478
38
  bb: {
479
- cssNames: string[];
480
- values1: {
481
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
482
- formatValue: typeof BoxStylesFormatters.Value.px;
483
- };
484
- values2: {
485
- values: readonly [];
486
- };
487
- values3: {
488
- values: readonly [];
489
- };
490
- };
39
+ values: number;
40
+ styleName: string;
41
+ valueFormat: typeof BoxStylesFormatters.Value.px;
42
+ }[];
43
+ /** The border-left-width CSS property sets the width of the left border of an element. */
491
44
  bl: {
492
- cssNames: string[];
493
- values1: {
494
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400, -1, -2, -3, -4, -5, -6, -7, -8, -9, -10, -11, -12, -13, -14, -15, -16, -17, -18, -19, -20, -22, -24, -26, -28, -30, -32, -34, -36, -38, -40, -44, -48, -52, -56, -60, -64, -68, -72, -76, -80, -84, -88, -92, -96, -100];
495
- formatValue: typeof BoxStylesFormatters.Value.px;
496
- };
497
- values2: {
498
- values: readonly [];
499
- };
500
- values3: {
501
- values: readonly [];
502
- };
503
- };
45
+ values: number;
46
+ styleName: string;
47
+ valueFormat: typeof BoxStylesFormatters.Value.px;
48
+ }[];
49
+ /** The border-style shorthand CSS property sets the line style for all four sides of an element's border. */
504
50
  borderStyle: {
505
- cssNames: string[];
506
- values1: {
507
- values: readonly ["solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", "hidden"];
508
- };
509
- values2: {
510
- values: readonly [];
511
- };
512
- values3: {
513
- values: readonly [];
514
- };
515
- };
51
+ styleName: string;
52
+ values: readonly ["solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", "hidden"];
53
+ }[];
54
+ /** The border-radius CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners. */
516
55
  borderRadius: {
517
- cssNames: string[];
518
- values1: {
519
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
520
- formatValue: typeof BoxStylesFormatters.Value.rem;
521
- };
522
- values2: {
523
- values: readonly [];
524
- };
525
- values3: {
526
- values: readonly [];
527
- };
528
- };
56
+ styleName: string;
57
+ values: number;
58
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
59
+ }[];
60
+ /** The border-top-radius CSS property rounds the top corners of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
529
61
  borderRadiusTop: {
530
- cssNames: string[];
531
- values1: {
532
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
533
- formatValue: typeof BoxStylesFormatters.Value.rem;
534
- };
535
- values2: {
536
- values: readonly [];
537
- };
538
- values3: {
539
- values: readonly [];
540
- };
541
- };
62
+ values: number;
63
+ styleName: string;
64
+ valueFormat: (value: number) => string;
65
+ }[];
66
+ /** The border-right-radius CSS property rounds the right corners of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
542
67
  borderRadiusRight: {
543
- cssNames: string[];
544
- values1: {
545
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
546
- formatValue: typeof BoxStylesFormatters.Value.rem;
547
- };
548
- values2: {
549
- values: readonly [];
550
- };
551
- values3: {
552
- values: readonly [];
553
- };
554
- };
68
+ values: number;
69
+ styleName: string;
70
+ valueFormat: (value: number) => string;
71
+ }[];
72
+ /** The border-bottom-radius CSS property rounds the bottom corners of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
555
73
  borderRadiusBottom: {
556
- cssNames: string[];
557
- values1: {
558
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
559
- formatValue: typeof BoxStylesFormatters.Value.rem;
560
- };
561
- values2: {
562
- values: readonly [];
563
- };
564
- values3: {
565
- values: readonly [];
566
- };
567
- };
74
+ values: number;
75
+ styleName: string;
76
+ valueFormat: (value: number) => string;
77
+ }[];
78
+ /** The border-left-radius CSS property rounds the left corners of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
568
79
  borderRadiusLeft: {
569
- cssNames: string[];
570
- values1: {
571
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
572
- formatValue: typeof BoxStylesFormatters.Value.rem;
573
- };
574
- values2: {
575
- values: readonly [];
576
- };
577
- values3: {
578
- values: readonly [];
579
- };
580
- };
80
+ values: number;
81
+ styleName: string;
82
+ valueFormat: (value: number) => string;
83
+ }[];
84
+ /** The border-top-left-radius CSS property rounds the top-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
581
85
  borderRadiusTopLeft: {
582
- cssNames: string[];
583
- values1: {
584
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
585
- formatValue: typeof BoxStylesFormatters.Value.rem;
586
- };
587
- values2: {
588
- values: readonly [];
589
- };
590
- values3: {
591
- values: readonly [];
592
- };
593
- };
86
+ values: number;
87
+ styleName: string;
88
+ valueFormat: (value: number) => string;
89
+ }[];
90
+ /** The border-top-right-radius CSS property rounds the top-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
594
91
  borderRadiusTopRight: {
595
- cssNames: string[];
596
- values1: {
597
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
598
- formatValue: typeof BoxStylesFormatters.Value.rem;
599
- };
600
- values2: {
601
- values: readonly [];
602
- };
603
- values3: {
604
- values: readonly [];
605
- };
606
- };
607
- borderRadiusBottomLeft: {
608
- cssNames: string[];
609
- values1: {
610
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
611
- formatValue: typeof BoxStylesFormatters.Value.rem;
612
- };
613
- values2: {
614
- values: readonly [];
615
- };
616
- values3: {
617
- values: readonly [];
618
- };
619
- };
92
+ values: number;
93
+ styleName: string;
94
+ valueFormat: (value: number) => string;
95
+ }[];
96
+ /** The border-bottom-right-radius CSS property rounds the bottom-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
620
97
  borderRadiusBottomRight: {
621
- cssNames: string[];
622
- values1: {
623
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
624
- formatValue: typeof BoxStylesFormatters.Value.rem;
625
- };
626
- values2: {
627
- values: readonly [];
628
- };
629
- values3: {
630
- values: readonly [];
631
- };
632
- };
98
+ values: number;
99
+ styleName: string;
100
+ valueFormat: (value: number) => string;
101
+ }[];
102
+ /** The border-bottom-left-radius CSS property rounds the bottom-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner. */
103
+ borderRadiusBottomLeft: {
104
+ values: number;
105
+ styleName: string;
106
+ valueFormat: (value: number) => string;
107
+ }[];
108
+ /** The position CSS property sets how an element is positioned in a document. The top, right, bottom, and left properties determine the final location of positioned elements. */
109
+ position: {
110
+ values: readonly ["static", "relative", "absolute", "fixed", "sticky"];
111
+ }[];
112
+ /** The top CSS property sets the vertical position of a positioned element. This inset property has no effect on non-positioned elements. */
113
+ top: {
114
+ values: number;
115
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
116
+ }[];
117
+ /** The right CSS property participates in specifying the horizontal position of a positioned element. This inset property has no effect on non-positioned elements. */
118
+ right: {
119
+ values: number;
120
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
121
+ }[];
122
+ /** The bottom CSS property participates in setting the vertical position of a positioned element. This inset property has no effect on non-positioned elements. */
123
+ bottom: {
124
+ values: number;
125
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
126
+ }[];
127
+ /** The left CSS property participates in specifying the horizontal position of a positioned element. This inset property has no effect on non-positioned elements. */
128
+ left: {
129
+ values: number;
130
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
131
+ }[];
132
+ /** The inset CSS property is a shorthand that corresponds to the top, right, bottom, and/or left properties. It has the same multi-value syntax of the margin shorthand. */
133
+ inset: {
134
+ values: number;
135
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
136
+ }[];
137
+ /** The `box-sizing` CSS property sets how the total width and height of an element is calculated. */
138
+ boxSizing: {
139
+ values: readonly ["border-box", "content-box"];
140
+ styleName: string;
141
+ }[];
142
+ /** The content-visibility CSS property controls whether or not an element renders its contents at all, along with forcing a strong set of containments, allowing user agents to potentially omit large swathes of layout and rendering work until it becomes needed. It enables the user agent to skip an element's rendering work (including layout and painting) until it is needed — which makes the initial page load much faster. */
143
+ contentVisibility: {
144
+ values: readonly ["visible", "hidden"];
145
+ styleName: string;
146
+ }[];
147
+ /** The cursor CSS property sets the mouse cursor, if any, to show when the mouse pointer is over an element. */
633
148
  cursor: {
634
- cssNames: string[];
635
- values1: {
636
- values: readonly ["auto", "default", "none", "context-menu", "help", "pointer", "progress", "wait", "cell", "crosshair", "text", "vertical-text", "alias", "copy", "move", "no-drop", "not-allowed", "e-resize", "n-resize", "ne-resize", "nw-resize", "s-resize", "se-resize", "sw-resize", "w-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "col-resize", "row-resize", "all-scroll", "zoom-in", "zoom-out", "grab", "grabbing"];
637
- };
638
- values2: {
639
- values: readonly [];
640
- };
641
- values3: {
642
- values: readonly [];
643
- };
644
- };
645
- zIndex: {
646
- cssNames: string[];
647
- values1: {
648
- values: readonly [1, 2, 3, 4, 5, 10, 11, 12, 13, 14, 15, 100, 101, 102, 103, 104, 105, 1000, 1001, 1002, 1003, 1004, 1005];
649
- };
650
- values2: {
651
- values: readonly [];
652
- };
653
- values3: {
654
- values: readonly [];
655
- };
656
- };
657
- overflow: {
658
- cssNames: string[];
659
- values1: {
660
- values: readonly ["auto", "hidden", "scroll", "visible"];
661
- };
662
- values2: {
663
- values: readonly [];
664
- };
665
- values3: {
666
- values: readonly [];
667
- };
668
- };
669
- overflowX: {
670
- cssNames: string[];
671
- values1: {
672
- values: readonly ["auto", "hidden", "scroll", "visible"];
673
- };
674
- values2: {
675
- values: readonly [];
676
- };
677
- values3: {
678
- values: readonly [];
679
- };
680
- };
681
- overflowY: {
682
- cssNames: string[];
683
- values1: {
684
- values: readonly ["auto", "hidden", "scroll", "visible"];
685
- };
686
- values2: {
687
- values: readonly [];
688
- };
689
- values3: {
690
- values: readonly [];
691
- };
692
- };
693
- opacity: {
694
- cssNames: string[];
695
- values1: {
696
- values: readonly [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1];
697
- };
698
- values2: {
699
- values: readonly [];
700
- };
701
- values3: {
702
- values: readonly [];
703
- };
704
- };
705
- fontSize: {
706
- cssNames: string[];
707
- values1: {
708
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
709
- formatValue: typeof BoxStylesFormatters.Value.px;
710
- };
711
- values2: {
712
- values: readonly ["inherit"];
713
- };
714
- values3: {
715
- values: readonly [];
716
- };
717
- };
718
- fontStyle: {
719
- cssNames: string[];
720
- values1: {
721
- values: readonly ["italic", "normal", "oblique"];
722
- };
723
- values2: {
724
- values: readonly [];
725
- };
726
- values3: {
727
- values: readonly [];
728
- };
729
- };
730
- fontWeight: {
731
- cssNames: string[];
732
- values1: {
733
- values: readonly [100, 200, 300, 400, 500, 600, 700, 800, 900];
734
- };
735
- values2: {
736
- values: readonly [];
737
- };
738
- values3: {
739
- values: readonly [];
740
- };
741
- };
742
- letterSpacing: {
743
- cssNames: string[];
744
- values1: {
745
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
746
- formatValue: typeof BoxStylesFormatters.Value.px;
747
- };
748
- values2: {
749
- values: readonly [];
750
- };
751
- values3: {
752
- values: readonly [];
753
- };
754
- };
755
- lineHeight: {
756
- cssNames: string[];
757
- values1: {
758
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
759
- formatValue: typeof BoxStylesFormatters.Value.px;
760
- };
761
- values2: {
762
- values: readonly ["font-size"];
763
- formatValue: () => string;
764
- };
765
- values3: {
766
- values: readonly [];
767
- };
768
- };
769
- textDecoration: {
770
- cssNames: string[];
771
- values1: {
772
- values: readonly ["none", "underline", "overline", "line-through"];
773
- };
774
- values2: {
775
- values: readonly [];
776
- };
777
- values3: {
778
- values: readonly [];
779
- };
780
- };
781
- textTransform: {
782
- cssNames: string[];
783
- values1: {
784
- values: readonly ["none", "capitalize", "lowercase", "uppercase"];
785
- };
786
- values2: {
787
- values: readonly [];
788
- };
789
- values3: {
790
- values: readonly [];
791
- };
792
- };
793
- textAlign: {
794
- cssNames: string[];
795
- values1: {
796
- values: readonly ["left", "right", "center", "justify"];
797
- };
798
- values2: {
799
- values: readonly [];
800
- };
801
- values3: {
802
- values: readonly [];
803
- };
804
- };
805
- flexWrap: {
806
- cssNames: string[];
807
- values1: {
808
- values: readonly ["nowrap", "wrap", "wrap-reverse"];
809
- };
810
- values2: {
811
- values: readonly [];
812
- };
813
- values3: {
814
- values: readonly [];
815
- };
816
- };
149
+ values: readonly ["auto", "default", "none", "context-menu", "help", "pointer", "progress", "wait", "cell", "crosshair", "text", "vertical-text", "alias", "copy", "move", "no-drop", "not-allowed", "e-resize", "n-resize", "ne-resize", "nw-resize", "s-resize", "se-resize", "sw-resize", "w-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "col-resize", "row-resize", "all-scroll", "zoom-in", "zoom-out", "grab", "grabbing"];
150
+ }[];
151
+ /** The `display` CSS property sets whether an element is treated as a block or inline box and the layout used for its children, such as flow layout, grid or flex. */
152
+ display: {
153
+ values: readonly ["none", "block", "inline-block", "flex", "inline-flex", "grid", "inline-grid", "contents"];
154
+ }[];
155
+ /** The `inline` property is a shortcut to transform `block`, `flex` and `grid` value to `inline-block`, `inline-flex` and `inline-grid` respectively. */
156
+ inline: {
157
+ values: readonly [true];
158
+ styleName: string;
159
+ valueFormat: () => string;
160
+ }[];
161
+ /** The CSS justify-content property defines how the browser distributes space between and around content items along the main axis of a flex container and the inline axis of grid and multicol containers. */
817
162
  jc: {
818
- cssNames: string[];
819
- values1: {
820
- values: readonly ["start", "end", "flex-start", "flex-end", "center", "left", "right", "space-between", "space-around", "space-evenly", "stretch"];
821
- };
822
- values2: {
823
- values: readonly [];
824
- };
825
- values3: {
826
- values: readonly [];
827
- };
828
- };
163
+ styleName: string;
164
+ values: readonly ["start", "end", "flex-start", "flex-end", "center", "left", "right", "space-between", "space-around", "space-evenly", "stretch"];
165
+ }[];
166
+ /** The CSS align-items property sets the align-self value on all direct children as a group. In flexbox, it controls the alignment of items on the cross axis. In grid layout, it controls the alignment of items on the block axis within their grid areas. */
829
167
  ai: {
830
- cssNames: string[];
831
- values1: {
832
- values: readonly ["stretch", "flex-start", "flex-end", "center", "baseline", "start", "end", "self-start", "self-end"];
833
- };
834
- values2: {
835
- values: readonly [];
836
- };
837
- values3: {
838
- values: readonly [];
839
- };
840
- };
168
+ styleName: string;
169
+ values: readonly ["stretch", "flex-start", "flex-end", "center", "baseline", "start", "end", "self-start", "self-end"];
170
+ }[];
171
+ /** The CSS align-content property sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis. */
841
172
  alignContent: {
842
- cssNames: string[];
843
- values1: {
844
- values: readonly ["flex-start", "flex-end", "center", "space-between", "space-around", "space-evenly", "stretch", "start", "end", "baseline"];
845
- };
846
- values2: {
847
- values: readonly [];
848
- };
849
- values3: {
850
- values: readonly [];
851
- };
852
- };
173
+ styleName: string;
174
+ values: readonly ["flex-start", "flex-end", "center", "space-between", "space-around", "space-evenly", "stretch", "start", "end", "baseline"];
175
+ }[];
176
+ /** The flex CSS shorthand property sets flex to fit the space available in its flex container. */
853
177
  flex1: {
854
- cssNames: string[];
855
- values1: {
856
- values: readonly [true];
857
- formatValue: () => string;
858
- };
859
- values2: {
860
- values: readonly [];
861
- };
862
- values3: {
863
- values: readonly [];
864
- };
865
- };
178
+ styleName: string;
179
+ values: readonly [true];
180
+ valueFormat: () => string;
181
+ }[];
182
+ /** The flex-direction CSS property sets how flex items are placed in the flex container defining the main axis and the direction (normal or reversed). */
866
183
  d: {
867
- cssNames: string[];
868
- values1: {
869
- values: readonly ["row", "row-reverse", "column", "column-reverse"];
870
- };
871
- values2: {
872
- values: readonly [];
873
- };
874
- values3: {
875
- values: readonly [];
876
- };
877
- };
878
- gap: {
879
- cssNames: string[];
880
- values1: {
881
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
882
- formatValue: typeof BoxStylesFormatters.Value.rem;
883
- };
884
- values2: {
885
- values: readonly [];
886
- };
887
- values3: {
888
- values: readonly [];
889
- };
890
- };
891
- rowGap: {
892
- cssNames: string[];
893
- values1: {
894
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
895
- formatValue: typeof BoxStylesFormatters.Value.rem;
896
- };
897
- values2: {
898
- values: readonly [];
899
- };
900
- values3: {
901
- values: readonly [];
902
- };
903
- };
904
- columnGap: {
905
- cssNames: string[];
906
- values1: {
907
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
908
- formatValue: typeof BoxStylesFormatters.Value.rem;
909
- };
910
- values2: {
911
- values: readonly [];
912
- };
913
- values3: {
914
- values: readonly [];
915
- };
916
- };
917
- order: {
918
- cssNames: string[];
919
- values1: {
920
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
921
- };
922
- values2: {
923
- values: readonly [];
924
- };
925
- values3: {
926
- values: readonly [];
927
- };
928
- };
184
+ styleName: string;
185
+ values: readonly ["row", "row-reverse", "column", "column-reverse"];
186
+ }[];
187
+ /** The flex-wrap CSS property sets whether flex items are forced onto one line or can wrap onto multiple lines. If wrapping is allowed, it sets the direction that lines are stacked. */
188
+ flexWrap: {
189
+ styleName: string;
190
+ values: readonly ["nowrap", "wrap", "wrap-reverse"];
191
+ }[];
192
+ /** The flex-grow CSS property sets the flex grow factor, which specifies how much of the flex container's positive free space, if any, should be assigned to the flex item's main size. */
929
193
  flexGrow: {
930
- cssNames: string[];
931
- values1: {
932
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
933
- };
934
- values2: {
935
- values: readonly [];
936
- };
937
- values3: {
938
- values: readonly [];
939
- };
940
- };
194
+ styleName: string;
195
+ values: number;
196
+ }[];
197
+ /** The flex-shrink CSS property sets the flex shrink factor of a flex item. If the size of all flex items is larger than the flex container, the flex items can shrink to fit according to their flex-shrink value. Each flex line's negative free space is distributed between the line's flex items that have a flex-shrink value greater than 0. */
941
198
  flexShrink: {
942
- cssNames: string[];
943
- values1: {
944
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
945
- };
946
- values2: {
947
- values: readonly [];
948
- };
949
- values3: {
950
- values: readonly [];
951
- };
952
- };
199
+ styleName: string;
200
+ values: number;
201
+ }[];
202
+ /** The align-self CSS property overrides a grid or flex item's align-items value. In grid, it aligns the item inside the grid area. In flexbox, it aligns the item on the cross axis. */
953
203
  alignSelf: {
954
- cssNames: string[];
955
- values1: {
956
- values: readonly ["auto", "flex-start", "flex-end", "center", "baseline", "stretch"];
957
- };
958
- values2: {
959
- values: readonly [];
960
- };
961
- values3: {
962
- values: readonly [];
963
- };
964
- };
204
+ styleName: string;
205
+ values: readonly ["auto", "flex-start", "flex-end", "center", "baseline", "stretch"];
206
+ }[];
207
+ /** The CSS justify-self property sets the way a box is justified inside its alignment container along the appropriate axis. */
965
208
  justifySelf: {
966
- cssNames: string[];
967
- values1: {
968
- values: readonly ["auto", "flex-start", "flex-end", "center", "baseline", "stretch"];
969
- };
970
- values2: {
971
- values: readonly [];
972
- };
973
- values3: {
974
- values: readonly [];
975
- };
976
- };
977
- gridColumns: {
978
- cssNames: string[];
979
- values1: {
980
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
981
- formatValue: typeof BoxStylesFormatters.Value.gridColumns;
982
- };
983
- values2: {
984
- values: readonly [];
985
- };
986
- values3: {
987
- values: readonly [];
988
- };
989
- };
990
- colSpan: {
991
- cssNames: string[];
992
- values1: {
993
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
994
- formatValue: typeof BoxStylesFormatters.Value.gridColumn;
995
- };
996
- values2: {
997
- values: readonly ["full-row"];
998
- formatValue: typeof BoxStylesFormatters.Value.gridColumn;
999
- };
1000
- values3: {
1001
- values: readonly [];
1002
- };
1003
- };
1004
- colStart: {
1005
- cssNames: string[];
1006
- values1: {
1007
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
1008
- };
1009
- values2: {
1010
- values: readonly [];
1011
- };
1012
- values3: {
1013
- values: readonly [];
1014
- };
1015
- };
1016
- colEnd: {
1017
- cssNames: string[];
1018
- values1: {
1019
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
1020
- };
1021
- values2: {
1022
- values: readonly [];
1023
- };
1024
- values3: {
1025
- values: readonly [];
1026
- };
1027
- };
209
+ styleName: string;
210
+ values: readonly ["auto", "flex-start", "flex-end", "center", "baseline", "stretch"];
211
+ }[];
212
+ /** The font-size CSS property sets the size of the font. Changing the font size also updates the sizes of the font size-relative <length> units, such as em, ex, and so forth. */
213
+ fontSize: ({
214
+ styleName: string;
215
+ values: number;
216
+ valueFormat: typeof BoxStylesFormatters.Value.px;
217
+ } | {
218
+ styleName: string;
219
+ values: readonly ["inherit"];
220
+ valueFormat?: undefined;
221
+ })[];
222
+ /** The font-style CSS property sets whether a font should be styled with a normal, italic, or oblique face from its font-family. */
223
+ fontStyle: {
224
+ styleName: string;
225
+ values: readonly ["italic", "normal", "oblique"];
226
+ }[];
227
+ /** The font-weight CSS property sets the weight (or boldness) of the font. The weights available depend on the font-family that is currently set. */
228
+ fontWeight: {
229
+ styleName: string;
230
+ values: readonly [100, 200, 300, 400, 500, 600, 700, 800, 900];
231
+ }[];
232
+ /** The gap CSS shorthand property sets the gaps (also called gutters) between rows and columns. This property applies to multi-column, flex, and grid containers. */
233
+ gap: {
234
+ values: number;
235
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
236
+ }[];
237
+ /** The row-gap CSS property sets the size of the gap (gutter) between an element's rows. */
238
+ rowGap: {
239
+ styleName: string;
240
+ values: number;
241
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
242
+ }[];
243
+ /** The column-gap CSS property sets the size of the gap (gutter) between an element's columns. */
244
+ columnGap: {
245
+ styleName: string;
246
+ values: number;
247
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
248
+ }[];
249
+ /** The order CSS property sets the order to lay out an item in a flex or grid container. Items in a container are sorted by ascending order value and then by their source code order. Items not given an explicit order value are assigned the default value of 0. */
250
+ order: {
251
+ styleName: string;
252
+ values: number;
253
+ }[];
254
+ /** The height CSS property specifies the height of an element. By default, the property defines the height of the content area. If box-sizing is set to border-box, however, it instead determines the height of the border area. */
255
+ height: ({
256
+ values: number;
257
+ valueFormat: (value: number) => string;
258
+ } | {
259
+ values: readonly ["fit"];
260
+ valueFormat: () => string;
261
+ } | {
262
+ values: readonly ["fit-screen"];
263
+ valueFormat: () => string;
264
+ } | {
265
+ values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
266
+ valueFormat: (value: string) => string;
267
+ } | {
268
+ values: readonly ["auto", "fit-content", "max-content", "min-content"];
269
+ valueFormat?: undefined;
270
+ })[];
271
+ /** The min-height CSS property sets the minimum height of an element. It prevents the used value of the height property from becoming smaller than the value specified for min-height. */
272
+ minHeight: ({
273
+ styleName: string;
274
+ values: number;
275
+ valueFormat: (value: number) => string;
276
+ } | {
277
+ styleName: string;
278
+ values: readonly ["fit"];
279
+ valueFormat: () => string;
280
+ } | {
281
+ styleName: string;
282
+ values: readonly ["fit-screen"];
283
+ valueFormat: () => string;
284
+ } | {
285
+ styleName: string;
286
+ values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
287
+ valueFormat: (value: string) => string;
288
+ } | {
289
+ styleName: string;
290
+ values: readonly ["auto", "fit-content", "max-content", "min-content"];
291
+ valueFormat?: undefined;
292
+ })[];
293
+ /** The max-height CSS property sets the maximum height of an element. It prevents the used value of the height property from becoming larger than the value specified for max-height. */
294
+ maxHeight: ({
295
+ styleName: string;
296
+ values: number;
297
+ valueFormat: (value: number) => string;
298
+ } | {
299
+ styleName: string;
300
+ values: readonly ["fit"];
301
+ valueFormat: () => string;
302
+ } | {
303
+ styleName: string;
304
+ values: readonly ["fit-screen"];
305
+ valueFormat: () => string;
306
+ } | {
307
+ styleName: string;
308
+ values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
309
+ valueFormat: (value: string) => string;
310
+ } | {
311
+ styleName: string;
312
+ values: readonly ["auto", "fit-content", "max-content", "min-content"];
313
+ valueFormat?: undefined;
314
+ })[];
315
+ /** The width CSS property sets an element's width. By default, it sets the width of the content area, but if box-sizing is set to border-box, it sets the width of the border area. */
316
+ width: ({
317
+ values: number;
318
+ valueFormat: (value: number) => string;
319
+ } | {
320
+ values: readonly ["fit"];
321
+ valueFormat: () => string;
322
+ } | {
323
+ values: readonly ["fit-screen"];
324
+ valueFormat: () => string;
325
+ } | {
326
+ values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
327
+ valueFormat: (value: string) => string;
328
+ } | {
329
+ values: readonly ["auto", "fit-content", "max-content", "min-content"];
330
+ valueFormat?: undefined;
331
+ })[];
332
+ /** The min-width CSS property sets the minimum width of an element. It prevents the used value of the width property from becoming smaller than the value specified for min-width. */
333
+ minWidth: ({
334
+ styleName: string;
335
+ values: number;
336
+ valueFormat: (value: number) => string;
337
+ } | {
338
+ styleName: string;
339
+ values: readonly ["fit"];
340
+ valueFormat: () => string;
341
+ } | {
342
+ styleName: string;
343
+ values: readonly ["fit-screen"];
344
+ valueFormat: () => string;
345
+ } | {
346
+ styleName: string;
347
+ values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
348
+ valueFormat: (value: string) => string;
349
+ } | {
350
+ styleName: string;
351
+ values: readonly ["auto", "fit-content", "max-content", "min-content"];
352
+ valueFormat?: undefined;
353
+ })[];
354
+ /** The max-width CSS property sets the maximum width of an element. It prevents the used value of the width property from becoming larger than the value specified by max-width. */
355
+ maxWidth: ({
356
+ styleName: string;
357
+ values: number;
358
+ valueFormat: (value: number) => string;
359
+ } | {
360
+ styleName: string;
361
+ values: readonly ["fit"];
362
+ valueFormat: () => string;
363
+ } | {
364
+ styleName: string;
365
+ values: readonly ["fit-screen"];
366
+ valueFormat: () => string;
367
+ } | {
368
+ styleName: string;
369
+ values: readonly ["1/2", "1/3", "2/3", "1/4", "2/4", "3/4", "1/5", "2/5", "3/5", "4/5", "1/6", "2/6", "3/6", "4/6", "5/6", "1/12", "2/12", "3/12", "4/12", "5/12", "6/12", "7/12", "8/12", "9/12", "10/12", "11/12"];
370
+ valueFormat: (value: string) => string;
371
+ } | {
372
+ styleName: string;
373
+ values: readonly ["auto", "fit-content", "max-content", "min-content"];
374
+ valueFormat?: undefined;
375
+ })[];
376
+ /** The letter-spacing CSS property sets the horizontal spacing behavior between text characters. This value is added to the natural spacing between characters while rendering the text. Positive values of letter-spacing causes characters to spread farther apart, while negative values of letter-spacing bring characters closer together. */
377
+ letterSpacing: {
378
+ styleName: string;
379
+ values: number;
380
+ valueFormat: typeof BoxStylesFormatters.Value.px;
381
+ }[];
382
+ /** The line-height CSS property sets the height of a line box in horizontal writing modes. In vertical writing modes, it sets the width of a line box. It's commonly used to set the distance between lines of text. On block-level elements in horizontal writing modes, it specifies the preferred height of line boxes within the element, and on non-replaced inline elements, it specifies the height that is used to calculate line box height. */
383
+ lineHeight: ({
384
+ styleName: string;
385
+ values: number;
386
+ valueFormat: typeof BoxStylesFormatters.Value.px;
387
+ } | {
388
+ styleName: string;
389
+ values: readonly ["font-size"];
390
+ valueFormat: (value: string) => string;
391
+ })[];
392
+ /** The list-style CSS shorthand property allows you to set all the list style properties at once. */
393
+ listStyle: {
394
+ styleName: string;
395
+ values: readonly ["square", "inside", "outside", "none"];
396
+ }[];
397
+ /** The margin CSS shorthand property sets the margin area on all four sides of an element. */
398
+ m: ({
399
+ values: number;
400
+ styleName: string;
401
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
402
+ } | {
403
+ values: readonly ["auto"];
404
+ styleName: string;
405
+ valueFormat?: undefined;
406
+ })[];
407
+ /** The margin-inline CSS shorthand property is a shorthand property that defines both the logical inline start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation. */
408
+ mx: ({
409
+ values: number;
410
+ styleName: string;
411
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
412
+ } | {
413
+ values: readonly ["auto"];
414
+ styleName: string;
415
+ valueFormat?: undefined;
416
+ })[];
417
+ /** The margin-block CSS shorthand property defines the logical block start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation. */
418
+ my: ({
419
+ values: number;
420
+ styleName: string;
421
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
422
+ } | {
423
+ values: readonly ["auto"];
424
+ styleName: string;
425
+ valueFormat?: undefined;
426
+ })[];
427
+ /** The margin-top CSS property sets the margin area on the top of an element. A positive value places it farther from its neighbors, while a negative value places it closer. */
428
+ mt: ({
429
+ values: number;
430
+ styleName: string;
431
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
432
+ } | {
433
+ values: readonly ["auto"];
434
+ styleName: string;
435
+ valueFormat?: undefined;
436
+ })[];
437
+ /** The margin-right CSS property sets the margin area on the right side of an element. A positive value places it farther from its neighbors, while a negative value places it closer. */
438
+ mr: ({
439
+ values: number;
440
+ styleName: string;
441
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
442
+ } | {
443
+ values: readonly ["auto"];
444
+ styleName: string;
445
+ valueFormat?: undefined;
446
+ })[];
447
+ /** The margin-bottom CSS property sets the margin area on the bottom of an element. A positive value places it farther from its neighbors, while a negative value places it closer. */
448
+ mb: ({
449
+ values: number;
450
+ styleName: string;
451
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
452
+ } | {
453
+ values: readonly ["auto"];
454
+ styleName: string;
455
+ valueFormat?: undefined;
456
+ })[];
457
+ /** The margin-left CSS property sets the margin area on the left side of an element. A positive value places it farther from its neighbors, while a negative value places it closer. */
458
+ ml: ({
459
+ values: number;
460
+ styleName: string;
461
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
462
+ } | {
463
+ values: readonly ["auto"];
464
+ styleName: string;
465
+ valueFormat?: undefined;
466
+ })[];
467
+ /** The padding CSS shorthand property sets the padding area on all four sides of an element at once. */
468
+ p: {
469
+ values: number;
470
+ styleName: string;
471
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
472
+ }[];
473
+ /** The padding-inline CSS shorthand property defines the logical inline start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation. */
474
+ px: {
475
+ values: number;
476
+ styleName: string;
477
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
478
+ }[];
479
+ /** The padding-block CSS shorthand property defines the logical block start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation. */
480
+ py: {
481
+ values: number;
482
+ styleName: string;
483
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
484
+ }[];
485
+ /** The padding-top CSS property sets the height of the padding area on the top of an element. */
486
+ pt: {
487
+ values: number;
488
+ styleName: string;
489
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
490
+ }[];
491
+ /** The padding-right CSS property sets the width of the padding area on the right of an element. */
492
+ pr: {
493
+ values: number;
494
+ styleName: string;
495
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
496
+ }[];
497
+ /** The padding-bottom CSS property sets the height of the padding area on the bottom of an element. */
498
+ pb: {
499
+ values: number;
500
+ styleName: string;
501
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
502
+ }[];
503
+ /** The padding-left CSS property sets the width of the padding area to the left of an element. */
504
+ pl: {
505
+ values: number;
506
+ styleName: string;
507
+ valueFormat: typeof BoxStylesFormatters.Value.rem;
508
+ }[];
509
+ /** The object-fit CSS property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container. */
510
+ objectFit: {
511
+ styleName: string;
512
+ values: readonly ["fill", "contain", "cover", "scale-down", "none"];
513
+ }[];
514
+ /** The opacity CSS property sets the opacity of an element. Opacity is the degree to which content behind an element is hidden, and is the opposite of transparency. */
515
+ opacity: {
516
+ values: readonly [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1];
517
+ }[];
518
+ /** The CSS outline-width property sets the thickness of an element's outline. An outline is a line that is drawn around an element, outside the border. */
1028
519
  outline: {
1029
- cssNames: string[];
1030
- values1: {
1031
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
1032
- formatValue: typeof BoxStylesFormatters.Value.px;
1033
- };
1034
- values2: {
1035
- values: readonly [];
1036
- };
1037
- values3: {
1038
- values: readonly [];
1039
- };
1040
- };
520
+ styleName: string;
521
+ values: number;
522
+ valueFormat: typeof BoxStylesFormatters.Value.px;
523
+ }[];
524
+ /** The outline-style CSS property sets the style of an element's outline. An outline is a line that is drawn around an element, outside the border. */
1041
525
  outlineStyle: {
1042
- cssNames: string[];
1043
- values1: {
1044
- values: readonly ["solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", "hidden"];
1045
- };
1046
- values2: {
1047
- values: readonly [];
1048
- };
1049
- values3: {
1050
- values: readonly [];
1051
- };
1052
- };
526
+ styleName: string;
527
+ values: readonly ["solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", "hidden"];
528
+ }[];
529
+ /** The outline-offset CSS property sets the amount of space between an outline and the edge or border of an element. */
1053
530
  outlineOffset: {
1054
- cssNames: string[];
1055
- values1: {
1056
- values: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60, 64, 68, 72, 76, 80, 84, 88, 92, 96, 100, 110, 120, 128, 130, 140, 150, 160, 170, 180, 190, 192, 200, 225, 250, 256, 275, 300, 320, 350, 384, 400];
1057
- formatValue: typeof BoxStylesFormatters.Value.px;
1058
- };
1059
- values2: {
1060
- values: readonly [];
1061
- };
1062
- values3: {
1063
- values: readonly [];
1064
- };
1065
- };
1066
- transition: {
1067
- cssNames: string[];
1068
- values1: {
1069
- values: readonly ["none", "all"];
1070
- };
1071
- values2: {
1072
- values: readonly [];
1073
- };
1074
- values3: {
1075
- values: readonly [];
1076
- };
1077
- };
1078
- transitionDuration: {
1079
- cssNames: string[];
1080
- values1: {
1081
- values: readonly [50, 100, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800, 850, 900, 950, 1000];
1082
- formatValue: typeof BoxStylesFormatters.Value.ms;
1083
- };
1084
- values2: {
1085
- values: readonly [];
1086
- };
1087
- values3: {
1088
- values: readonly [];
1089
- };
1090
- };
1091
- userSelect: {
1092
- cssNames: string[];
1093
- values1: {
1094
- values: readonly ["none", "auto", "text", "all"];
1095
- };
1096
- values2: {
1097
- values: readonly [];
1098
- };
1099
- values3: {
1100
- values: readonly [];
1101
- };
1102
- };
1103
- appearance: {
1104
- cssNames: string[];
1105
- values1: {
1106
- values: readonly ["none", "auto", "menulist-button", "textfield", "button", "checkbox"];
1107
- };
1108
- values2: {
1109
- values: readonly [];
1110
- };
1111
- values3: {
1112
- values: readonly [];
1113
- };
1114
- };
531
+ styleName: string;
532
+ values: number;
533
+ valueFormat: typeof BoxStylesFormatters.Value.px;
534
+ }[];
535
+ /** The overflow CSS shorthand property sets the desired behavior when content does not fit in the element's padding box (overflows) in the horizontal and/or vertical direction. */
536
+ overflow: {
537
+ values: readonly ["auto", "hidden", "scroll", "visible"];
538
+ }[];
539
+ /** The overflow-x CSS property sets what shows when content overflows a block-level element's left and right edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property. */
540
+ overflowX: {
541
+ styleName: string;
542
+ values: readonly ["auto", "hidden", "scroll", "visible"];
543
+ }[];
544
+ /** The overflow-y CSS property sets what shows when content overflows a block-level element's top and bottom edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property. */
545
+ overflowY: {
546
+ styleName: string;
547
+ values: readonly ["auto", "hidden", "scroll", "visible"];
548
+ }[];
549
+ /** The pointer-events CSS property sets under what circumstances (if any) a particular graphic element can become the target of pointer events. */
1115
550
  pointerEvents: {
1116
- cssNames: string[];
1117
- values1: {
1118
- values: readonly ["none", "auto", "all"];
1119
- };
1120
- values2: {
1121
- values: readonly [];
1122
- };
1123
- values3: {
1124
- values: readonly [];
1125
- };
1126
- };
1127
- whiteSpace: {
1128
- cssNames: string[];
1129
- values1: {
1130
- values: readonly ["break-spaces", "normal", "nowrap", "pre", "pre-line", "pre-wrap"];
1131
- };
1132
- values2: {
1133
- values: readonly [];
1134
- };
1135
- values3: {
1136
- values: readonly [];
1137
- };
1138
- };
1139
- textOverflow: {
1140
- cssNames: string[];
1141
- values1: {
1142
- values: readonly ["clip", "ellipsis"];
1143
- };
1144
- values2: {
1145
- values: readonly [];
1146
- };
1147
- values3: {
1148
- values: readonly [];
1149
- };
1150
- };
551
+ styleName: string;
552
+ values: readonly ["none", "auto", "all"];
553
+ }[];
554
+ /** The resize CSS property sets whether an element is resizable, and if so, in which directions. */
555
+ resize: {
556
+ values: readonly ["none", "both", "horizontal", "vertical", "block", "inline"];
557
+ }[];
558
+ /** The rotate CSS property allows you to specify rotation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform property. */
1151
559
  rotate: {
1152
- cssNames: string[];
1153
- values1: {
1154
- values: readonly [0, 90, 180, 270, -90, -180, -270];
1155
- formatValue: typeof BoxStylesFormatters.Value.rotate;
1156
- };
1157
- values2: {
1158
- values: readonly [];
1159
- };
1160
- values3: {
1161
- values: readonly [];
1162
- };
1163
- };
560
+ values: readonly [0, 90, 180, 270, -90, -180, -270];
561
+ valueFormat: (value: number) => string;
562
+ }[];
1164
563
  flip: {
1165
- cssNames: string[];
1166
- values1: {
1167
- values: readonly ["xAxis", "yAxis"];
1168
- formatValue: typeof BoxStylesFormatters.Value.flip;
1169
- };
1170
- values2: {
1171
- values: readonly [];
1172
- };
1173
- values3: {
1174
- values: readonly [];
1175
- };
1176
- };
564
+ styleName: string;
565
+ values: readonly ["xAxis", "yAxis"];
566
+ valueFormat: (value: string) => "-1 1" | "1 -1";
567
+ }[];
568
+ /** The text-align CSS property sets the horizontal alignment of the inline-level content inside a block element or table-cell box. This means it works like vertical-align but in the horizontal direction. */
569
+ textAlign: {
570
+ styleName: string;
571
+ values: readonly ["left", "right", "center", "justify"];
572
+ }[];
573
+ /** The text-decoration shorthand CSS property sets the appearance of decorative lines on text. It is a shorthand for text-decoration-line, text-decoration-color, text-decoration-style, and the newer text-decoration-thickness property. */
574
+ textDecoration: {
575
+ styleName: string;
576
+ values: readonly ["none", "underline", "overline", "line-through"];
577
+ }[];
578
+ /** The text-overflow CSS property sets how hidden overflow content is signaled to users. It can be clipped, display an ellipsis ('…'), or display a custom string. */
579
+ textOverflow: {
580
+ styleName: string;
581
+ values: readonly ["clip", "ellipsis"];
582
+ }[];
583
+ /** The text-transform CSS property specifies how to capitalize an element's text. It can be used to make text appear in all-uppercase or all-lowercase, or with each word capitalized. It also can help improve legibility for ruby. */
584
+ textTransform: {
585
+ styleName: string;
586
+ values: readonly ["none", "capitalize", "lowercase", "uppercase"];
587
+ }[];
588
+ /** The text-wrap CSS shorthand property controls how text inside an element is wrapped. The different values provide: */
589
+ textWrap: {
590
+ styleName: string;
591
+ values: readonly ["wrap", "nowrap", "balance", "pretty"];
592
+ }[];
593
+ /** The transition-property CSS property sets the CSS properties to which a transition effect should be applied. */
594
+ transition: {
595
+ styleName: string;
596
+ values: readonly ["none", "all"];
597
+ }[];
598
+ /** The transition-duration CSS property sets the length of time a transition animation should take to complete. By default, the value is 0s, meaning that no animation will occur. */
599
+ transitionDuration: {
600
+ styleName: string;
601
+ values: readonly [50, 100, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800, 850, 900, 950, 1000];
602
+ valueFormat: (value: number) => string;
603
+ }[];
604
+ /** The user-select CSS property controls whether the user can select text. This doesn't have any effect on content loaded as part of a browser's user interface (its chrome), except in textboxes. */
605
+ userSelect: {
606
+ styleName: string;
607
+ values: readonly ["none", "auto", "text", "all"];
608
+ }[];
609
+ /** The visibility CSS property shows or hides an element without changing the layout of a document. The property can also hide rows or columns in a <table>. */
1177
610
  visibility: {
1178
- cssNames: string[];
1179
- values1: {
1180
- values: readonly ["visible", "hidden", "collapse"];
1181
- };
1182
- values2: {
1183
- values: readonly [];
1184
- };
1185
- values3: {
1186
- values: readonly [];
1187
- };
1188
- };
1189
- resize: {
1190
- cssNames: string[];
1191
- values1: {
1192
- values: readonly ["none", "both", "horizontal", "vertical", "block", "inline"];
1193
- };
1194
- values2: {
1195
- values: readonly [];
1196
- };
1197
- values3: {
1198
- values: readonly [];
1199
- };
1200
- };
611
+ styleName: string;
612
+ values: readonly ["visible", "hidden", "collapse"];
613
+ }[];
614
+ /** The white-space CSS property sets how white space inside an element is handled. */
615
+ whiteSpace: {
616
+ styleName: string;
617
+ values: readonly ["break-spaces", "normal", "nowrap", "pre", "pre-line", "pre-wrap"];
618
+ }[];
619
+ /** The z-index CSS property sets the z-order of a positioned element and its descendants or flex and grid items. Overlapping elements with a larger z-index cover those with a smaller one. */
620
+ zIndex: {
621
+ styleName: string;
622
+ values: readonly [1, 2, 3, 4, 5, 10, 11, 12, 13, 14, 15, 100, 101, 102, 103, 104, 105, 1000, 1001, 1002, 1003, 1004, 1005];
623
+ }[];
624
+ /** The grid-template-columns CSS property defines the line names and track sizing functions of the grid columns. */
625
+ gridTemplateColumns: ({
626
+ styleName: string;
627
+ values: number;
628
+ valueFormat: (value: number) => string;
629
+ } | {
630
+ styleName: string;
631
+ values: readonly ["subgrid"];
632
+ valueFormat?: undefined;
633
+ })[];
634
+ /** The grid-template-rows CSS property defines the line names and track sizing functions of the grid rows. */
635
+ gridTemplateRows: ({
636
+ styleName: string;
637
+ values: number;
638
+ valueFormat: (value: number) => string;
639
+ } | {
640
+ styleName: string;
641
+ values: readonly ["subgrid"];
642
+ valueFormat?: undefined;
643
+ })[];
644
+ /** The grid-column CSS shorthand property specifies a grid item's size and location within a grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area. */
645
+ gridColumn: ({
646
+ styleName: string;
647
+ values: number;
648
+ valueFormat: (value: number) => string;
649
+ } | {
650
+ styleName: string;
651
+ values: readonly ["full-row"];
652
+ valueFormat: () => string;
653
+ })[];
654
+ /** The grid-column-start CSS property specifies a grid item's start position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement. This start position defines the block-start edge of the grid area. */
655
+ gridColumnStart: {
656
+ styleName: string;
657
+ values: number;
658
+ }[];
659
+ /** The grid-column-end CSS property specifies a grid item's end position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the block-end edge of its grid area. */
660
+ gridColumnEnd: {
661
+ styleName: string;
662
+ values: number;
663
+ }[];
664
+ /** The grid-row CSS shorthand property specifies a grid item's size and location within a grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area. */
665
+ gridRow: ({
666
+ styleName: string;
667
+ values: number;
668
+ valueFormat: (value: number) => string;
669
+ } | {
670
+ styleName: string;
671
+ values: readonly ["full-column"];
672
+ valueFormat: () => string;
673
+ })[];
674
+ /** The grid-row-start CSS property specifies a grid item's start position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start edge of its grid area. */
675
+ gridRowStart: {
676
+ styleName: string;
677
+ values: number;
678
+ }[];
679
+ /** The grid-row-end CSS property specifies a grid item's end position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-end edge of its grid area. */
680
+ gridRowEnd: {
681
+ styleName: string;
682
+ values: number;
683
+ }[];
684
+ };
685
+ export declare const pseudo1: {
686
+ hover: string;
687
+ focus: string;
688
+ hasFocus: string;
689
+ active: string;
690
+ valid: string;
691
+ hasValid: string;
692
+ invalid: string;
693
+ hasInvalid: string;
694
+ optional: string;
695
+ hasChecked: string;
696
+ hasRequired: string;
697
+ hasDisabled: string;
698
+ };
699
+ export declare const pseudo2: {
700
+ indeterminate: string;
701
+ checked: string;
702
+ required: string;
703
+ disabled: string;
704
+ };
705
+ export declare const pseudoClasses: {
706
+ indeterminate: string;
707
+ checked: string;
708
+ required: string;
709
+ disabled: string;
710
+ hover: string;
711
+ focus: string;
712
+ hasFocus: string;
713
+ active: string;
714
+ valid: string;
715
+ hasValid: string;
716
+ invalid: string;
717
+ hasInvalid: string;
718
+ optional: string;
719
+ hasChecked: string;
720
+ hasRequired: string;
721
+ hasDisabled: string;
722
+ };
723
+ export declare const pseudoClassesWeight: Record<"indeterminate" | "checked" | "required" | "disabled" | "hover" | "focus" | "hasFocus" | "active" | "valid" | "hasValid" | "invalid" | "hasInvalid" | "optional" | "hasChecked" | "hasRequired" | "hasDisabled", number>;
724
+ export declare const pseudoClassesByWeight: {
725
+ [key: number]: ("indeterminate" | "checked" | "required" | "disabled" | "hover" | "focus" | "hasFocus" | "active" | "valid" | "hasValid" | "invalid" | "hasInvalid" | "optional" | "hasChecked" | "hasRequired" | "hasDisabled")[];
1201
726
  };
1202
- export type StyleKey = keyof typeof simpleBoxStyles;
1203
- export declare const boxThemeStyles: {
1204
- shadow: {
1205
- cssNames: string[];
1206
- formatValue: (key: string, value: string) => string;
1207
- };
1208
- background: {
1209
- cssNames: string[];
1210
- formatValue: (key: string, value: string) => string;
1211
- };
1212
- backgroundImage: {
1213
- cssNames: string[];
1214
- formatValue: (key: string, value: string) => string;
1215
- };
1216
- color: {
1217
- cssNames: string[];
1218
- formatValue: (key: string, value: string) => string;
1219
- };
1220
- bgColor: {
1221
- cssNames: string[];
1222
- formatValue: (key: string, value: string) => string;
1223
- };
1224
- borderColor: {
1225
- cssNames: string[];
1226
- formatValue: (key: string, value: string) => string;
1227
- };
1228
- outlineColor: {
1229
- cssNames: string[];
1230
- formatValue: (key: string, value: string) => string;
1231
- };
727
+ export declare const pseudoGroupClasses: {
728
+ hoverGroup: "hover";
729
+ focusGroup: "focus";
730
+ activeGroup: "active";
1232
731
  };
1233
- export declare const svgThemeStyles: {
1234
- fill: {
1235
- cssNames: string[];
1236
- formatValue: (key: string, value: string) => string;
1237
- formatSelector: typeof BoxStylesFormatters.ClassName.svg;
1238
- };
1239
- stroke: {
1240
- cssNames: string[];
1241
- formatValue: (key: string, value: string) => string;
1242
- formatSelector: typeof BoxStylesFormatters.ClassName.svg;
1243
- };
732
+ export declare const breakpoints: {
733
+ sm: number;
734
+ md: number;
735
+ lg: number;
736
+ xl: number;
737
+ xxl: number;
1244
738
  };
1245
- export declare const pseudoGroupClass: string[];
1246
- export type PseudoGroupClass = (typeof pseudoGroupClass)[number];
1247
- export declare const pseudoClassSuffixes: readonly ["hover", "focus", "hasFocus", "active", "checked", "hasChecked", "indeterminate", "valid", "hasValid", "invalid", "hasInvalid", "required", "optional", "disabled", "hasDisabled"];
1248
- export type PseudoClassSuffix = (typeof pseudoClassSuffixes)[number];
1249
- export declare const boxBreakpoints: readonly ["sm", "md", "lg", "xl", "xxl"];
1250
- export type BoxBreakpointsType = (typeof boxBreakpoints)[number];
1251
- export declare const boxBreakpointsMinWidth: Record<BoxBreakpointsType, number>;
1252
- export declare let boxStyles: Record<string, StyleItem>;
1253
- export declare function rebuildBoxStyles(): void;
1254
- export declare function addCustomPseudoClassProps(suffix: PseudoClassSuffix, customName: string, parentKey: string): string[];