@nimbus-ds/styles 6.8.0 → 6.9.0-rc.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.
- package/CHANGELOG.md +9 -0
- package/dist/index.css +1281 -714
- package/dist/index.d.ts +265 -121
- package/dist/index.js +1 -1
- package/package.json +3 -2
package/dist/index.d.ts
CHANGED
|
@@ -21,7 +21,7 @@ export interface Conditions<T> {
|
|
|
21
21
|
export type AspectRatio = "1/1" | "16/9" | "9/16" | "4/3" | "3/4" | "2/1" | "1/2";
|
|
22
22
|
export type BorderStyle = "solid" | "none" | "hidden" | "dashed" | "dotted";
|
|
23
23
|
export type BoxSizing = "border-box" | "content-box";
|
|
24
|
-
export type Cursor = "auto" | "pointer";
|
|
24
|
+
export type Cursor = "auto" | "pointer" | "not-allowed" | "grab";
|
|
25
25
|
export type Display = "block" | "flex" | "inline-flex" | "grid" | "inline-grid";
|
|
26
26
|
export type FlexWrap = "nowrap" | "wrap" | "wrap-reverse";
|
|
27
27
|
export type FlexDirection = "row" | "row-reverse" | "column" | "column-reverse";
|
|
@@ -32,6 +32,7 @@ export type TextDecoration = "none" | "underline";
|
|
|
32
32
|
export type Position = "absolute" | "fixed" | "relative" | "static" | "sticky";
|
|
33
33
|
export type Overflow = "visible" | "hidden" | "scroll" | "auto";
|
|
34
34
|
export type PointerEvents = "auto" | "none" | "visiblePainted" | "visibleFill" | "visibleStroke" | "visible" | "painted" | "fill" | "stroke" | "all" | "inherit";
|
|
35
|
+
export type TransitionTiming = "ease" | "ease-in" | "ease-out" | "ease-in-out" | "linear" | "step-start" | "step-end";
|
|
35
36
|
declare const propertiesBox: {
|
|
36
37
|
gap: {
|
|
37
38
|
none: string;
|
|
@@ -94,7 +95,9 @@ declare const propertiesBox: {
|
|
|
94
95
|
"neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
95
96
|
"neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
96
97
|
"neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
98
|
+
"neutral.surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
97
99
|
"neutral.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
100
|
+
transparent: string;
|
|
98
101
|
};
|
|
99
102
|
borderColor: {
|
|
100
103
|
"primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
@@ -112,6 +115,7 @@ declare const propertiesBox: {
|
|
|
112
115
|
"neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
113
116
|
"neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
114
117
|
"neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
118
|
+
transparent: string;
|
|
115
119
|
};
|
|
116
120
|
borderStyle: BorderStyle[];
|
|
117
121
|
boxSizing: BoxSizing[];
|
|
@@ -153,17 +157,33 @@ declare const propertiesBox: {
|
|
|
153
157
|
overflow: Overflow[];
|
|
154
158
|
overflowX: Overflow[];
|
|
155
159
|
overflowY: Overflow[];
|
|
160
|
+
boxShadow: {
|
|
161
|
+
card: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
162
|
+
popover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
163
|
+
modal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
164
|
+
focusRing: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
165
|
+
};
|
|
166
|
+
transitionDuration: {
|
|
167
|
+
base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
168
|
+
fast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
169
|
+
slow: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
170
|
+
slower: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
171
|
+
};
|
|
172
|
+
transitionTimingFunction: TransitionTiming[];
|
|
156
173
|
};
|
|
157
174
|
export type BoxBorderColorProperties = keyof typeof propertiesBox.borderColor;
|
|
158
175
|
export type BoxBackgroundColorProperties = keyof typeof propertiesBox.backgroundColor;
|
|
176
|
+
export type BoxShadowProperties = keyof typeof propertiesBox.boxShadow;
|
|
159
177
|
export type BoxSpaceProperties = keyof typeof propertiesBox.space;
|
|
160
178
|
export type BoxMarginProperties = keyof typeof propertiesBox.margin;
|
|
161
179
|
export type BoxGapProperties = keyof typeof propertiesBox.gap;
|
|
162
180
|
export type BoxGridGapProperties = keyof typeof propertiesBox.gridGap;
|
|
181
|
+
export type TransitionDurationProperties = keyof typeof propertiesBox.transitionDuration;
|
|
163
182
|
export interface BoxConditions<T> extends Conditions<T> {
|
|
164
183
|
focus?: T;
|
|
165
184
|
active?: T;
|
|
166
185
|
hover?: T;
|
|
186
|
+
disabled?: T;
|
|
167
187
|
}
|
|
168
188
|
export interface BoxSprinkle {
|
|
169
189
|
width?: string | BoxConditions<string>;
|
|
@@ -199,6 +219,7 @@ export interface BoxSprinkle {
|
|
|
199
219
|
borderColor?: BoxBorderColorProperties | BoxConditions<BoxBorderColorProperties>;
|
|
200
220
|
borderStyle?: BorderStyle | BoxConditions<BorderStyle>;
|
|
201
221
|
boxSizing?: BoxSizing | BoxConditions<BoxSizing>;
|
|
222
|
+
boxShadow?: BoxShadowProperties | BoxConditions<BoxShadowProperties>;
|
|
202
223
|
padding?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
|
|
203
224
|
paddingTop?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
|
|
204
225
|
paddingBottom?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
|
|
@@ -227,6 +248,10 @@ export interface BoxSprinkle {
|
|
|
227
248
|
mb?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
|
|
228
249
|
mx?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
|
|
229
250
|
my?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
|
|
251
|
+
transitionTiming?: TransitionTiming | BoxConditions<TransitionTiming>;
|
|
252
|
+
transitionProperty?: string | BoxConditions<string>;
|
|
253
|
+
transitionDelay?: string | BoxConditions<string>;
|
|
254
|
+
transitionDuration?: TransitionDurationProperties | BoxConditions<TransitionDurationProperties>;
|
|
230
255
|
}
|
|
231
256
|
export declare const box: {
|
|
232
257
|
sprinkle: import("rainbow-sprinkles/dist/declarations/src/createRuntimeFn").SprinklesFn<[
|
|
@@ -236,23 +261,23 @@ export declare const box: {
|
|
|
236
261
|
values: {
|
|
237
262
|
grid: {
|
|
238
263
|
default: string;
|
|
239
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
264
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
240
265
|
};
|
|
241
266
|
flex: {
|
|
242
267
|
default: string;
|
|
243
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
268
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
244
269
|
};
|
|
245
270
|
block: {
|
|
246
271
|
default: string;
|
|
247
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
272
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
248
273
|
};
|
|
249
274
|
"inline-flex": {
|
|
250
275
|
default: string;
|
|
251
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
276
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
252
277
|
};
|
|
253
278
|
"inline-grid": {
|
|
254
279
|
default: string;
|
|
255
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
280
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
256
281
|
};
|
|
257
282
|
};
|
|
258
283
|
staticScale: Display[];
|
|
@@ -262,19 +287,19 @@ export declare const box: {
|
|
|
262
287
|
values: {
|
|
263
288
|
row: {
|
|
264
289
|
default: string;
|
|
265
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
290
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
266
291
|
};
|
|
267
292
|
column: {
|
|
268
293
|
default: string;
|
|
269
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
294
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
270
295
|
};
|
|
271
296
|
"column-reverse": {
|
|
272
297
|
default: string;
|
|
273
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
298
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
274
299
|
};
|
|
275
300
|
"row-reverse": {
|
|
276
301
|
default: string;
|
|
277
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
302
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
278
303
|
};
|
|
279
304
|
};
|
|
280
305
|
staticScale: FlexDirection[];
|
|
@@ -284,15 +309,15 @@ export declare const box: {
|
|
|
284
309
|
values: {
|
|
285
310
|
nowrap: {
|
|
286
311
|
default: string;
|
|
287
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
312
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
288
313
|
};
|
|
289
314
|
wrap: {
|
|
290
315
|
default: string;
|
|
291
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
316
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
292
317
|
};
|
|
293
318
|
"wrap-reverse": {
|
|
294
319
|
default: string;
|
|
295
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
320
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
296
321
|
};
|
|
297
322
|
};
|
|
298
323
|
staticScale: FlexWrap[];
|
|
@@ -302,27 +327,27 @@ export declare const box: {
|
|
|
302
327
|
values: {
|
|
303
328
|
center: {
|
|
304
329
|
default: string;
|
|
305
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
330
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
306
331
|
};
|
|
307
332
|
"flex-end": {
|
|
308
333
|
default: string;
|
|
309
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
334
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
310
335
|
};
|
|
311
336
|
"flex-start": {
|
|
312
337
|
default: string;
|
|
313
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
338
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
314
339
|
};
|
|
315
340
|
"space-around": {
|
|
316
341
|
default: string;
|
|
317
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
342
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
318
343
|
};
|
|
319
344
|
"space-between": {
|
|
320
345
|
default: string;
|
|
321
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
346
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
322
347
|
};
|
|
323
348
|
"space-evenly": {
|
|
324
349
|
default: string;
|
|
325
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
350
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
326
351
|
};
|
|
327
352
|
};
|
|
328
353
|
staticScale: JustifyContent[];
|
|
@@ -332,23 +357,23 @@ export declare const box: {
|
|
|
332
357
|
values: {
|
|
333
358
|
center: {
|
|
334
359
|
default: string;
|
|
335
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
360
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
336
361
|
};
|
|
337
362
|
"flex-end": {
|
|
338
363
|
default: string;
|
|
339
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
364
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
340
365
|
};
|
|
341
366
|
"flex-start": {
|
|
342
367
|
default: string;
|
|
343
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
368
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
344
369
|
};
|
|
345
370
|
baseline: {
|
|
346
371
|
default: string;
|
|
347
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
372
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
348
373
|
};
|
|
349
374
|
stretch: {
|
|
350
375
|
default: string;
|
|
351
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
376
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
352
377
|
};
|
|
353
378
|
};
|
|
354
379
|
staticScale: AlignItems[];
|
|
@@ -358,47 +383,47 @@ export declare const box: {
|
|
|
358
383
|
values: {
|
|
359
384
|
inherit: {
|
|
360
385
|
default: string;
|
|
361
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
386
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
362
387
|
};
|
|
363
388
|
none: {
|
|
364
389
|
default: string;
|
|
365
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
390
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
366
391
|
};
|
|
367
392
|
all: {
|
|
368
393
|
default: string;
|
|
369
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
394
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
370
395
|
};
|
|
371
396
|
fill: {
|
|
372
397
|
default: string;
|
|
373
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
398
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
374
399
|
};
|
|
375
400
|
stroke: {
|
|
376
401
|
default: string;
|
|
377
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
402
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
378
403
|
};
|
|
379
404
|
auto: {
|
|
380
405
|
default: string;
|
|
381
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
406
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
382
407
|
};
|
|
383
408
|
visible: {
|
|
384
409
|
default: string;
|
|
385
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
410
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
386
411
|
};
|
|
387
412
|
painted: {
|
|
388
413
|
default: string;
|
|
389
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
414
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
390
415
|
};
|
|
391
416
|
visibleFill: {
|
|
392
417
|
default: string;
|
|
393
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
418
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
394
419
|
};
|
|
395
420
|
visiblePainted: {
|
|
396
421
|
default: string;
|
|
397
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
422
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
398
423
|
};
|
|
399
424
|
visibleStroke: {
|
|
400
425
|
default: string;
|
|
401
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
426
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
402
427
|
};
|
|
403
428
|
};
|
|
404
429
|
staticScale: PointerEvents[];
|
|
@@ -408,23 +433,23 @@ export declare const box: {
|
|
|
408
433
|
values: {
|
|
409
434
|
hidden: {
|
|
410
435
|
default: string;
|
|
411
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
436
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
412
437
|
};
|
|
413
438
|
none: {
|
|
414
439
|
default: string;
|
|
415
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
440
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
416
441
|
};
|
|
417
442
|
dashed: {
|
|
418
443
|
default: string;
|
|
419
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
444
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
420
445
|
};
|
|
421
446
|
dotted: {
|
|
422
447
|
default: string;
|
|
423
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
448
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
424
449
|
};
|
|
425
450
|
solid: {
|
|
426
451
|
default: string;
|
|
427
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
452
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
428
453
|
};
|
|
429
454
|
};
|
|
430
455
|
staticScale: BorderStyle[];
|
|
@@ -434,11 +459,11 @@ export declare const box: {
|
|
|
434
459
|
values: {
|
|
435
460
|
"border-box": {
|
|
436
461
|
default: string;
|
|
437
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
462
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
438
463
|
};
|
|
439
464
|
"content-box": {
|
|
440
465
|
default: string;
|
|
441
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
466
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
442
467
|
};
|
|
443
468
|
};
|
|
444
469
|
staticScale: BoxSizing[];
|
|
@@ -448,11 +473,19 @@ export declare const box: {
|
|
|
448
473
|
values: {
|
|
449
474
|
auto: {
|
|
450
475
|
default: string;
|
|
451
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
476
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
477
|
+
};
|
|
478
|
+
grab: {
|
|
479
|
+
default: string;
|
|
480
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
481
|
+
};
|
|
482
|
+
"not-allowed": {
|
|
483
|
+
default: string;
|
|
484
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
452
485
|
};
|
|
453
486
|
pointer: {
|
|
454
487
|
default: string;
|
|
455
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
488
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
456
489
|
};
|
|
457
490
|
};
|
|
458
491
|
staticScale: Cursor[];
|
|
@@ -462,23 +495,23 @@ export declare const box: {
|
|
|
462
495
|
values: {
|
|
463
496
|
fixed: {
|
|
464
497
|
default: string;
|
|
465
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
498
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
466
499
|
};
|
|
467
500
|
absolute: {
|
|
468
501
|
default: string;
|
|
469
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
502
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
470
503
|
};
|
|
471
504
|
relative: {
|
|
472
505
|
default: string;
|
|
473
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
506
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
474
507
|
};
|
|
475
508
|
static: {
|
|
476
509
|
default: string;
|
|
477
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
510
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
478
511
|
};
|
|
479
512
|
sticky: {
|
|
480
513
|
default: string;
|
|
481
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
514
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
482
515
|
};
|
|
483
516
|
};
|
|
484
517
|
staticScale: Position[];
|
|
@@ -488,19 +521,19 @@ export declare const box: {
|
|
|
488
521
|
values: {
|
|
489
522
|
hidden: {
|
|
490
523
|
default: string;
|
|
491
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
524
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
492
525
|
};
|
|
493
526
|
auto: {
|
|
494
527
|
default: string;
|
|
495
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
528
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
496
529
|
};
|
|
497
530
|
visible: {
|
|
498
531
|
default: string;
|
|
499
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
532
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
500
533
|
};
|
|
501
534
|
scroll: {
|
|
502
535
|
default: string;
|
|
503
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
536
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
504
537
|
};
|
|
505
538
|
};
|
|
506
539
|
staticScale: Overflow[];
|
|
@@ -510,19 +543,19 @@ export declare const box: {
|
|
|
510
543
|
values: {
|
|
511
544
|
hidden: {
|
|
512
545
|
default: string;
|
|
513
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
546
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
514
547
|
};
|
|
515
548
|
auto: {
|
|
516
549
|
default: string;
|
|
517
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
550
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
518
551
|
};
|
|
519
552
|
visible: {
|
|
520
553
|
default: string;
|
|
521
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
554
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
522
555
|
};
|
|
523
556
|
scroll: {
|
|
524
557
|
default: string;
|
|
525
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
558
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
526
559
|
};
|
|
527
560
|
};
|
|
528
561
|
staticScale: Overflow[];
|
|
@@ -532,223 +565,298 @@ export declare const box: {
|
|
|
532
565
|
values: {
|
|
533
566
|
hidden: {
|
|
534
567
|
default: string;
|
|
535
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
568
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
536
569
|
};
|
|
537
570
|
auto: {
|
|
538
571
|
default: string;
|
|
539
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
572
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
540
573
|
};
|
|
541
574
|
visible: {
|
|
542
575
|
default: string;
|
|
543
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
576
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
544
577
|
};
|
|
545
578
|
scroll: {
|
|
546
579
|
default: string;
|
|
547
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
580
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
548
581
|
};
|
|
549
582
|
};
|
|
550
583
|
staticScale: Overflow[];
|
|
551
584
|
name: "overflowY";
|
|
552
585
|
};
|
|
586
|
+
transitionTimingFunction: {
|
|
587
|
+
values: {
|
|
588
|
+
ease: {
|
|
589
|
+
default: string;
|
|
590
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
591
|
+
};
|
|
592
|
+
"ease-in": {
|
|
593
|
+
default: string;
|
|
594
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
595
|
+
};
|
|
596
|
+
"ease-in-out": {
|
|
597
|
+
default: string;
|
|
598
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
599
|
+
};
|
|
600
|
+
"ease-out": {
|
|
601
|
+
default: string;
|
|
602
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
603
|
+
};
|
|
604
|
+
"step-end": {
|
|
605
|
+
default: string;
|
|
606
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
607
|
+
};
|
|
608
|
+
"step-start": {
|
|
609
|
+
default: string;
|
|
610
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
611
|
+
};
|
|
612
|
+
linear: {
|
|
613
|
+
default: string;
|
|
614
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
615
|
+
};
|
|
616
|
+
};
|
|
617
|
+
staticScale: TransitionTiming[];
|
|
618
|
+
name: "transitionTimingFunction";
|
|
619
|
+
};
|
|
553
620
|
};
|
|
554
621
|
} & {
|
|
555
622
|
config: {
|
|
556
623
|
width: {
|
|
557
624
|
dynamic: {
|
|
558
625
|
default: string;
|
|
559
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
626
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
560
627
|
};
|
|
561
628
|
dynamicScale: true;
|
|
562
629
|
name: "width";
|
|
563
630
|
vars: {
|
|
564
631
|
default: string;
|
|
565
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
632
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
566
633
|
};
|
|
567
634
|
};
|
|
568
635
|
height: {
|
|
569
636
|
dynamic: {
|
|
570
637
|
default: string;
|
|
571
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
638
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
572
639
|
};
|
|
573
640
|
dynamicScale: true;
|
|
574
641
|
name: "height";
|
|
575
642
|
vars: {
|
|
576
643
|
default: string;
|
|
577
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
644
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
578
645
|
};
|
|
579
646
|
};
|
|
580
647
|
maxWidth: {
|
|
581
648
|
dynamic: {
|
|
582
649
|
default: string;
|
|
583
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
650
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
584
651
|
};
|
|
585
652
|
dynamicScale: true;
|
|
586
653
|
name: "maxWidth";
|
|
587
654
|
vars: {
|
|
588
655
|
default: string;
|
|
589
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
656
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
590
657
|
};
|
|
591
658
|
};
|
|
592
659
|
maxHeight: {
|
|
593
660
|
dynamic: {
|
|
594
661
|
default: string;
|
|
595
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
662
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
596
663
|
};
|
|
597
664
|
dynamicScale: true;
|
|
598
665
|
name: "maxHeight";
|
|
599
666
|
vars: {
|
|
600
667
|
default: string;
|
|
601
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
668
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
602
669
|
};
|
|
603
670
|
};
|
|
604
671
|
bottom: {
|
|
605
672
|
dynamic: {
|
|
606
673
|
default: string;
|
|
607
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
674
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
608
675
|
};
|
|
609
676
|
dynamicScale: true;
|
|
610
677
|
name: "bottom";
|
|
611
678
|
vars: {
|
|
612
679
|
default: string;
|
|
613
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
680
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
614
681
|
};
|
|
615
682
|
};
|
|
616
683
|
left: {
|
|
617
684
|
dynamic: {
|
|
618
685
|
default: string;
|
|
619
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
686
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
620
687
|
};
|
|
621
688
|
dynamicScale: true;
|
|
622
689
|
name: "left";
|
|
623
690
|
vars: {
|
|
624
691
|
default: string;
|
|
625
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
692
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
626
693
|
};
|
|
627
694
|
};
|
|
628
695
|
right: {
|
|
629
696
|
dynamic: {
|
|
630
697
|
default: string;
|
|
631
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
698
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
632
699
|
};
|
|
633
700
|
dynamicScale: true;
|
|
634
701
|
name: "right";
|
|
635
702
|
vars: {
|
|
636
703
|
default: string;
|
|
637
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
704
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
638
705
|
};
|
|
639
706
|
};
|
|
640
707
|
top: {
|
|
641
708
|
dynamic: {
|
|
642
709
|
default: string;
|
|
643
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
710
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
644
711
|
};
|
|
645
712
|
dynamicScale: true;
|
|
646
713
|
name: "top";
|
|
647
714
|
vars: {
|
|
648
715
|
default: string;
|
|
649
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
716
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
650
717
|
};
|
|
651
718
|
};
|
|
652
719
|
flex: {
|
|
653
720
|
dynamic: {
|
|
654
721
|
default: string;
|
|
655
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
722
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
656
723
|
};
|
|
657
724
|
dynamicScale: true;
|
|
658
725
|
name: "flex";
|
|
659
726
|
vars: {
|
|
660
727
|
default: string;
|
|
661
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
728
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
662
729
|
};
|
|
663
730
|
};
|
|
664
731
|
gridTemplateAreas: {
|
|
665
732
|
dynamic: {
|
|
666
733
|
default: string;
|
|
667
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
734
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
668
735
|
};
|
|
669
736
|
dynamicScale: true;
|
|
670
737
|
name: "gridTemplateAreas";
|
|
671
738
|
vars: {
|
|
672
739
|
default: string;
|
|
673
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
740
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
674
741
|
};
|
|
675
742
|
};
|
|
676
743
|
gridTemplateColumns: {
|
|
677
744
|
dynamic: {
|
|
678
745
|
default: string;
|
|
679
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
746
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
680
747
|
};
|
|
681
748
|
dynamicScale: true;
|
|
682
749
|
name: "gridTemplateColumns";
|
|
683
750
|
vars: {
|
|
684
751
|
default: string;
|
|
685
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
752
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
686
753
|
};
|
|
687
754
|
};
|
|
688
755
|
gridTemplateRows: {
|
|
689
756
|
dynamic: {
|
|
690
757
|
default: string;
|
|
691
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
758
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
692
759
|
};
|
|
693
760
|
dynamicScale: true;
|
|
694
761
|
name: "gridTemplateRows";
|
|
695
762
|
vars: {
|
|
696
763
|
default: string;
|
|
697
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
764
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
698
765
|
};
|
|
699
766
|
};
|
|
700
767
|
gridArea: {
|
|
701
768
|
dynamic: {
|
|
702
769
|
default: string;
|
|
703
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
770
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
704
771
|
};
|
|
705
772
|
dynamicScale: true;
|
|
706
773
|
name: "gridArea";
|
|
707
774
|
vars: {
|
|
708
775
|
default: string;
|
|
709
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
776
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
710
777
|
};
|
|
711
778
|
};
|
|
712
779
|
flexShrink: {
|
|
713
780
|
dynamic: {
|
|
714
781
|
default: string;
|
|
715
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
782
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
716
783
|
};
|
|
717
784
|
dynamicScale: true;
|
|
718
785
|
name: "flexShrink";
|
|
719
786
|
vars: {
|
|
720
787
|
default: string;
|
|
721
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
788
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
722
789
|
};
|
|
723
790
|
};
|
|
724
791
|
borderRadius: {
|
|
725
792
|
dynamic: {
|
|
726
793
|
default: string;
|
|
727
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
794
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
728
795
|
};
|
|
729
796
|
dynamicScale: true;
|
|
730
797
|
name: "borderRadius";
|
|
731
798
|
vars: {
|
|
732
799
|
default: string;
|
|
733
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
800
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
734
801
|
};
|
|
735
802
|
};
|
|
736
803
|
borderWidth: {
|
|
737
804
|
dynamic: {
|
|
738
805
|
default: string;
|
|
739
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
806
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
740
807
|
};
|
|
741
808
|
dynamicScale: true;
|
|
742
809
|
name: "borderWidth";
|
|
743
810
|
vars: {
|
|
744
811
|
default: string;
|
|
745
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
812
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
813
|
+
};
|
|
814
|
+
};
|
|
815
|
+
transitionDelay: {
|
|
816
|
+
dynamic: {
|
|
817
|
+
default: string;
|
|
818
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
819
|
+
};
|
|
820
|
+
dynamicScale: true;
|
|
821
|
+
name: "transitionDelay";
|
|
822
|
+
vars: {
|
|
823
|
+
default: string;
|
|
824
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
825
|
+
};
|
|
826
|
+
};
|
|
827
|
+
transitionProperty: {
|
|
828
|
+
dynamic: {
|
|
829
|
+
default: string;
|
|
830
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
831
|
+
};
|
|
832
|
+
dynamicScale: true;
|
|
833
|
+
name: "transitionProperty";
|
|
834
|
+
vars: {
|
|
835
|
+
default: string;
|
|
836
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
837
|
+
};
|
|
838
|
+
};
|
|
839
|
+
transitionDuration: {
|
|
840
|
+
dynamic: {
|
|
841
|
+
default: string;
|
|
842
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
843
|
+
};
|
|
844
|
+
dynamicScale: {
|
|
845
|
+
base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
846
|
+
fast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
847
|
+
slow: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
848
|
+
slower: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
849
|
+
};
|
|
850
|
+
name: "transitionDuration";
|
|
851
|
+
vars: {
|
|
852
|
+
default: string;
|
|
853
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
746
854
|
};
|
|
747
855
|
};
|
|
748
856
|
backgroundColor: {
|
|
749
857
|
dynamic: {
|
|
750
858
|
default: string;
|
|
751
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
859
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
752
860
|
};
|
|
753
861
|
dynamicScale: {
|
|
754
862
|
"primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
@@ -771,18 +879,20 @@ export declare const box: {
|
|
|
771
879
|
"neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
772
880
|
"neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
773
881
|
"neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
882
|
+
"neutral.surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
774
883
|
"neutral.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
884
|
+
transparent: string;
|
|
775
885
|
};
|
|
776
886
|
name: "backgroundColor";
|
|
777
887
|
vars: {
|
|
778
888
|
default: string;
|
|
779
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
889
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
780
890
|
};
|
|
781
891
|
};
|
|
782
892
|
borderColor: {
|
|
783
893
|
dynamic: {
|
|
784
894
|
default: string;
|
|
785
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
895
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
786
896
|
};
|
|
787
897
|
dynamicScale: {
|
|
788
898
|
"primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
@@ -800,17 +910,35 @@ export declare const box: {
|
|
|
800
910
|
"neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
801
911
|
"neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
802
912
|
"neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
913
|
+
transparent: string;
|
|
803
914
|
};
|
|
804
915
|
name: "borderColor";
|
|
805
916
|
vars: {
|
|
806
917
|
default: string;
|
|
807
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
918
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
919
|
+
};
|
|
920
|
+
};
|
|
921
|
+
boxShadow: {
|
|
922
|
+
dynamic: {
|
|
923
|
+
default: string;
|
|
924
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
925
|
+
};
|
|
926
|
+
dynamicScale: {
|
|
927
|
+
card: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
928
|
+
popover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
929
|
+
modal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
930
|
+
focusRing: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
931
|
+
};
|
|
932
|
+
name: "boxShadow";
|
|
933
|
+
vars: {
|
|
934
|
+
default: string;
|
|
935
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
808
936
|
};
|
|
809
937
|
};
|
|
810
938
|
padding: {
|
|
811
939
|
dynamic: {
|
|
812
940
|
default: string;
|
|
813
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
941
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
814
942
|
};
|
|
815
943
|
dynamicScale: {
|
|
816
944
|
none: string;
|
|
@@ -831,13 +959,13 @@ export declare const box: {
|
|
|
831
959
|
name: "padding";
|
|
832
960
|
vars: {
|
|
833
961
|
default: string;
|
|
834
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
962
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
835
963
|
};
|
|
836
964
|
};
|
|
837
965
|
paddingTop: {
|
|
838
966
|
dynamic: {
|
|
839
967
|
default: string;
|
|
840
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
968
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
841
969
|
};
|
|
842
970
|
dynamicScale: {
|
|
843
971
|
none: string;
|
|
@@ -858,13 +986,13 @@ export declare const box: {
|
|
|
858
986
|
name: "paddingTop";
|
|
859
987
|
vars: {
|
|
860
988
|
default: string;
|
|
861
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
989
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
862
990
|
};
|
|
863
991
|
};
|
|
864
992
|
paddingBottom: {
|
|
865
993
|
dynamic: {
|
|
866
994
|
default: string;
|
|
867
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
995
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
868
996
|
};
|
|
869
997
|
dynamicScale: {
|
|
870
998
|
none: string;
|
|
@@ -885,13 +1013,13 @@ export declare const box: {
|
|
|
885
1013
|
name: "paddingBottom";
|
|
886
1014
|
vars: {
|
|
887
1015
|
default: string;
|
|
888
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1016
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
889
1017
|
};
|
|
890
1018
|
};
|
|
891
1019
|
paddingLeft: {
|
|
892
1020
|
dynamic: {
|
|
893
1021
|
default: string;
|
|
894
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1022
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
895
1023
|
};
|
|
896
1024
|
dynamicScale: {
|
|
897
1025
|
none: string;
|
|
@@ -912,13 +1040,13 @@ export declare const box: {
|
|
|
912
1040
|
name: "paddingLeft";
|
|
913
1041
|
vars: {
|
|
914
1042
|
default: string;
|
|
915
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1043
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
916
1044
|
};
|
|
917
1045
|
};
|
|
918
1046
|
paddingRight: {
|
|
919
1047
|
dynamic: {
|
|
920
1048
|
default: string;
|
|
921
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1049
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
922
1050
|
};
|
|
923
1051
|
dynamicScale: {
|
|
924
1052
|
none: string;
|
|
@@ -939,13 +1067,13 @@ export declare const box: {
|
|
|
939
1067
|
name: "paddingRight";
|
|
940
1068
|
vars: {
|
|
941
1069
|
default: string;
|
|
942
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1070
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
943
1071
|
};
|
|
944
1072
|
};
|
|
945
1073
|
margin: {
|
|
946
1074
|
dynamic: {
|
|
947
1075
|
default: string;
|
|
948
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1076
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
949
1077
|
};
|
|
950
1078
|
dynamicScale: {
|
|
951
1079
|
none: string;
|
|
@@ -967,13 +1095,13 @@ export declare const box: {
|
|
|
967
1095
|
name: "margin";
|
|
968
1096
|
vars: {
|
|
969
1097
|
default: string;
|
|
970
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1098
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
971
1099
|
};
|
|
972
1100
|
};
|
|
973
1101
|
marginTop: {
|
|
974
1102
|
dynamic: {
|
|
975
1103
|
default: string;
|
|
976
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1104
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
977
1105
|
};
|
|
978
1106
|
dynamicScale: {
|
|
979
1107
|
none: string;
|
|
@@ -995,13 +1123,13 @@ export declare const box: {
|
|
|
995
1123
|
name: "marginTop";
|
|
996
1124
|
vars: {
|
|
997
1125
|
default: string;
|
|
998
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1126
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
999
1127
|
};
|
|
1000
1128
|
};
|
|
1001
1129
|
marginBottom: {
|
|
1002
1130
|
dynamic: {
|
|
1003
1131
|
default: string;
|
|
1004
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1132
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1005
1133
|
};
|
|
1006
1134
|
dynamicScale: {
|
|
1007
1135
|
none: string;
|
|
@@ -1023,13 +1151,13 @@ export declare const box: {
|
|
|
1023
1151
|
name: "marginBottom";
|
|
1024
1152
|
vars: {
|
|
1025
1153
|
default: string;
|
|
1026
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1154
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1027
1155
|
};
|
|
1028
1156
|
};
|
|
1029
1157
|
marginLeft: {
|
|
1030
1158
|
dynamic: {
|
|
1031
1159
|
default: string;
|
|
1032
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1160
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1033
1161
|
};
|
|
1034
1162
|
dynamicScale: {
|
|
1035
1163
|
none: string;
|
|
@@ -1051,13 +1179,13 @@ export declare const box: {
|
|
|
1051
1179
|
name: "marginLeft";
|
|
1052
1180
|
vars: {
|
|
1053
1181
|
default: string;
|
|
1054
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1182
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1055
1183
|
};
|
|
1056
1184
|
};
|
|
1057
1185
|
marginRight: {
|
|
1058
1186
|
dynamic: {
|
|
1059
1187
|
default: string;
|
|
1060
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1188
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1061
1189
|
};
|
|
1062
1190
|
dynamicScale: {
|
|
1063
1191
|
none: string;
|
|
@@ -1079,13 +1207,13 @@ export declare const box: {
|
|
|
1079
1207
|
name: "marginRight";
|
|
1080
1208
|
vars: {
|
|
1081
1209
|
default: string;
|
|
1082
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1210
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1083
1211
|
};
|
|
1084
1212
|
};
|
|
1085
1213
|
gap: {
|
|
1086
1214
|
dynamic: {
|
|
1087
1215
|
default: string;
|
|
1088
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1216
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1089
1217
|
};
|
|
1090
1218
|
dynamicScale: {
|
|
1091
1219
|
none: string;
|
|
@@ -1107,13 +1235,13 @@ export declare const box: {
|
|
|
1107
1235
|
name: "gap";
|
|
1108
1236
|
vars: {
|
|
1109
1237
|
default: string;
|
|
1110
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1238
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1111
1239
|
};
|
|
1112
1240
|
};
|
|
1113
1241
|
gridGap: {
|
|
1114
1242
|
dynamic: {
|
|
1115
1243
|
default: string;
|
|
1116
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1244
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1117
1245
|
};
|
|
1118
1246
|
dynamicScale: {
|
|
1119
1247
|
none: string;
|
|
@@ -1135,7 +1263,7 @@ export declare const box: {
|
|
|
1135
1263
|
name: "gridGap";
|
|
1136
1264
|
vars: {
|
|
1137
1265
|
default: string;
|
|
1138
|
-
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
|
|
1266
|
+
conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
|
|
1139
1267
|
};
|
|
1140
1268
|
};
|
|
1141
1269
|
};
|
|
@@ -1266,7 +1394,9 @@ export declare const box: {
|
|
|
1266
1394
|
"neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1267
1395
|
"neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1268
1396
|
"neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1397
|
+
"neutral.surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1269
1398
|
"neutral.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1399
|
+
transparent: string;
|
|
1270
1400
|
};
|
|
1271
1401
|
borderColor: {
|
|
1272
1402
|
"primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
@@ -1284,6 +1414,7 @@ export declare const box: {
|
|
|
1284
1414
|
"neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1285
1415
|
"neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1286
1416
|
"neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1417
|
+
transparent: string;
|
|
1287
1418
|
};
|
|
1288
1419
|
borderStyle: BorderStyle[];
|
|
1289
1420
|
boxSizing: BoxSizing[];
|
|
@@ -1325,6 +1456,19 @@ export declare const box: {
|
|
|
1325
1456
|
overflow: Overflow[];
|
|
1326
1457
|
overflowX: Overflow[];
|
|
1327
1458
|
overflowY: Overflow[];
|
|
1459
|
+
boxShadow: {
|
|
1460
|
+
card: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1461
|
+
popover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1462
|
+
modal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1463
|
+
focusRing: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1464
|
+
};
|
|
1465
|
+
transitionDuration: {
|
|
1466
|
+
base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1467
|
+
fast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1468
|
+
slow: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1469
|
+
slower: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
1470
|
+
};
|
|
1471
|
+
transitionTimingFunction: TransitionTiming[];
|
|
1328
1472
|
};
|
|
1329
1473
|
};
|
|
1330
1474
|
export declare const button: {
|