@nimbus-ds/styles 6.7.0-rc.2 → 6.8.0-rc.1

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 (5) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/index.css +1395 -609
  3. package/dist/index.d.ts +565 -605
  4. package/dist/index.js +1 -1
  5. package/package.json +2 -2
package/dist/index.d.ts CHANGED
@@ -33,6 +33,46 @@ 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
35
  declare const propertiesBox: {
36
+ gap: {
37
+ none: string;
38
+ "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
39
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
40
+ "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
41
+ "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
42
+ "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
43
+ "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
44
+ "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
45
+ "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
46
+ "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
47
+ "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
48
+ "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
49
+ "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
50
+ "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
51
+ "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
52
+ };
53
+ gridGap: {
54
+ none: string;
55
+ "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
56
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
57
+ "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
58
+ "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
59
+ "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
60
+ "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
61
+ "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
62
+ "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
63
+ "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
64
+ "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
65
+ "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
66
+ "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
67
+ "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
68
+ "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
69
+ };
70
+ display: Display[];
71
+ flexDirection: FlexDirection[];
72
+ flexWrap: FlexWrap[];
73
+ justifyContent: JustifyContent[];
74
+ alignItems: AlignItems[];
75
+ pointerEvents: PointerEvents[];
36
76
  backgroundColor: {
37
77
  "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
38
78
  "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -118,80 +158,273 @@ export type BoxBorderColorProperties = keyof typeof propertiesBox.borderColor;
118
158
  export type BoxBackgroundColorProperties = keyof typeof propertiesBox.backgroundColor;
119
159
  export type BoxSpaceProperties = keyof typeof propertiesBox.space;
120
160
  export type BoxMarginProperties = keyof typeof propertiesBox.margin;
161
+ export type BoxGapProperties = keyof typeof propertiesBox.gap;
162
+ export type BoxGridGapProperties = keyof typeof propertiesBox.gridGap;
163
+ export interface BoxConditions<T> extends Conditions<T> {
164
+ focus?: T;
165
+ active?: T;
166
+ hover?: T;
167
+ }
121
168
  export interface BoxSprinkle {
122
- width?: string | Conditions<string>;
123
- height?: string | Conditions<string>;
124
- maxWidth?: string | Conditions<string>;
125
- maxHeight?: string | Conditions<string>;
126
- bottom?: string | Conditions<string>;
127
- left?: string | Conditions<string>;
128
- right?: string | Conditions<string>;
129
- top?: string | Conditions<string>;
130
- position?: Position | Conditions<Position>;
131
- overflow?: Overflow | Conditions<Overflow>;
132
- overflowX?: Overflow | Conditions<Overflow>;
133
- overflowY?: Overflow | Conditions<Overflow>;
134
- cursor?: Cursor | Conditions<Cursor>;
135
- backgroundColor?: BoxBackgroundColorProperties | Conditions<BoxBackgroundColorProperties>;
136
- borderRadius?: string | Conditions<string>;
137
- borderWidth?: string | Conditions<string>;
138
- borderColor?: BoxBorderColorProperties | Conditions<BoxBorderColorProperties>;
139
- borderStyle?: BorderStyle | Conditions<BorderStyle>;
140
- boxSizing?: BoxSizing | Conditions<BoxSizing>;
141
- padding?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
142
- paddingTop?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
143
- paddingBottom?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
144
- paddingLeft?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
145
- paddingRight?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
146
- margin?: BoxMarginProperties | Conditions<BoxMarginProperties>;
147
- marginTop?: BoxMarginProperties | Conditions<BoxMarginProperties>;
148
- marginBottom?: BoxMarginProperties | Conditions<BoxMarginProperties>;
149
- marginLeft?: BoxMarginProperties | Conditions<BoxMarginProperties>;
150
- marginRight?: BoxMarginProperties | Conditions<BoxMarginProperties>;
151
- paddingX?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
152
- paddingY?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
153
- p?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
154
- pl?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
155
- pr?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
156
- pt?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
157
- pb?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
158
- px?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
159
- py?: BoxSpaceProperties | Conditions<BoxSpaceProperties>;
160
- marginX?: BoxMarginProperties | Conditions<BoxMarginProperties>;
161
- marginY?: BoxMarginProperties | Conditions<BoxMarginProperties>;
162
- m?: BoxMarginProperties | Conditions<BoxMarginProperties>;
163
- mr?: BoxMarginProperties | Conditions<BoxMarginProperties>;
164
- ml?: BoxMarginProperties | Conditions<BoxMarginProperties>;
165
- mt?: BoxMarginProperties | Conditions<BoxMarginProperties>;
166
- mb?: BoxMarginProperties | Conditions<BoxMarginProperties>;
167
- mx?: BoxMarginProperties | Conditions<BoxMarginProperties>;
168
- my?: BoxMarginProperties | Conditions<BoxMarginProperties>;
169
+ width?: string | BoxConditions<string>;
170
+ height?: string | BoxConditions<string>;
171
+ maxWidth?: string | BoxConditions<string>;
172
+ maxHeight?: string | BoxConditions<string>;
173
+ bottom?: string | BoxConditions<string>;
174
+ left?: string | BoxConditions<string>;
175
+ right?: string | BoxConditions<string>;
176
+ top?: string | BoxConditions<string>;
177
+ flex?: string | BoxConditions<string>;
178
+ flexShrink?: string | BoxConditions<string>;
179
+ gridTemplateColumns?: string | BoxConditions<string>;
180
+ gridTemplateAreas?: string | BoxConditions<string>;
181
+ gridTemplateRows?: string | BoxConditions<string>;
182
+ gridArea?: string | BoxConditions<string>;
183
+ display?: Display | BoxConditions<Display>;
184
+ flexWrap?: FlexWrap | BoxConditions<FlexWrap>;
185
+ justifyContent?: JustifyContent | BoxConditions<JustifyContent>;
186
+ flexDirection?: FlexDirection | BoxConditions<FlexDirection>;
187
+ alignItems?: AlignItems | BoxConditions<AlignItems>;
188
+ gap?: BoxGapProperties | BoxConditions<BoxGapProperties>;
189
+ gridGap?: BoxGridGapProperties | BoxConditions<BoxGridGapProperties>;
190
+ pointerEvents?: PointerEvents | BoxConditions<PointerEvents>;
191
+ position?: Position | BoxConditions<Position>;
192
+ overflow?: Overflow | BoxConditions<Overflow>;
193
+ overflowX?: Overflow | BoxConditions<Overflow>;
194
+ overflowY?: Overflow | BoxConditions<Overflow>;
195
+ cursor?: Cursor | BoxConditions<Cursor>;
196
+ backgroundColor?: BoxBackgroundColorProperties | BoxConditions<BoxBackgroundColorProperties>;
197
+ borderRadius?: string | BoxConditions<string>;
198
+ borderWidth?: string | BoxConditions<string>;
199
+ borderColor?: BoxBorderColorProperties | BoxConditions<BoxBorderColorProperties>;
200
+ borderStyle?: BorderStyle | BoxConditions<BorderStyle>;
201
+ boxSizing?: BoxSizing | BoxConditions<BoxSizing>;
202
+ padding?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
203
+ paddingTop?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
204
+ paddingBottom?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
205
+ paddingLeft?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
206
+ paddingRight?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
207
+ margin?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
208
+ marginTop?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
209
+ marginBottom?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
210
+ marginLeft?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
211
+ marginRight?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
212
+ paddingX?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
213
+ paddingY?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
214
+ p?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
215
+ pl?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
216
+ pr?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
217
+ pt?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
218
+ pb?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
219
+ px?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
220
+ py?: BoxSpaceProperties | BoxConditions<BoxSpaceProperties>;
221
+ marginX?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
222
+ marginY?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
223
+ m?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
224
+ mr?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
225
+ ml?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
226
+ mt?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
227
+ mb?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
228
+ mx?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
229
+ my?: BoxMarginProperties | BoxConditions<BoxMarginProperties>;
169
230
  }
170
231
  export declare const box: {
171
232
  sprinkle: import("rainbow-sprinkles/dist/declarations/src/createRuntimeFn").SprinklesFn<[
172
233
  {
173
234
  config: {
235
+ display: {
236
+ values: {
237
+ grid: {
238
+ default: string;
239
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
240
+ };
241
+ flex: {
242
+ default: string;
243
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
244
+ };
245
+ block: {
246
+ default: string;
247
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
248
+ };
249
+ "inline-flex": {
250
+ default: string;
251
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
252
+ };
253
+ "inline-grid": {
254
+ default: string;
255
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
256
+ };
257
+ };
258
+ staticScale: Display[];
259
+ name: "display";
260
+ };
261
+ flexDirection: {
262
+ values: {
263
+ row: {
264
+ default: string;
265
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
266
+ };
267
+ column: {
268
+ default: string;
269
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
270
+ };
271
+ "column-reverse": {
272
+ default: string;
273
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
274
+ };
275
+ "row-reverse": {
276
+ default: string;
277
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
278
+ };
279
+ };
280
+ staticScale: FlexDirection[];
281
+ name: "flexDirection";
282
+ };
283
+ flexWrap: {
284
+ values: {
285
+ nowrap: {
286
+ default: string;
287
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
288
+ };
289
+ wrap: {
290
+ default: string;
291
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
292
+ };
293
+ "wrap-reverse": {
294
+ default: string;
295
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
296
+ };
297
+ };
298
+ staticScale: FlexWrap[];
299
+ name: "flexWrap";
300
+ };
301
+ justifyContent: {
302
+ values: {
303
+ center: {
304
+ default: string;
305
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
306
+ };
307
+ "flex-end": {
308
+ default: string;
309
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
310
+ };
311
+ "flex-start": {
312
+ default: string;
313
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
314
+ };
315
+ "space-around": {
316
+ default: string;
317
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
318
+ };
319
+ "space-between": {
320
+ default: string;
321
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
322
+ };
323
+ "space-evenly": {
324
+ default: string;
325
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
326
+ };
327
+ };
328
+ staticScale: JustifyContent[];
329
+ name: "justifyContent";
330
+ };
331
+ alignItems: {
332
+ values: {
333
+ center: {
334
+ default: string;
335
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
336
+ };
337
+ "flex-end": {
338
+ default: string;
339
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
340
+ };
341
+ "flex-start": {
342
+ default: string;
343
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
344
+ };
345
+ baseline: {
346
+ default: string;
347
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
348
+ };
349
+ stretch: {
350
+ default: string;
351
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
352
+ };
353
+ };
354
+ staticScale: AlignItems[];
355
+ name: "alignItems";
356
+ };
357
+ pointerEvents: {
358
+ values: {
359
+ inherit: {
360
+ default: string;
361
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
362
+ };
363
+ none: {
364
+ default: string;
365
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
366
+ };
367
+ all: {
368
+ default: string;
369
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
370
+ };
371
+ fill: {
372
+ default: string;
373
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
374
+ };
375
+ stroke: {
376
+ default: string;
377
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
378
+ };
379
+ auto: {
380
+ default: string;
381
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
382
+ };
383
+ visible: {
384
+ default: string;
385
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
386
+ };
387
+ painted: {
388
+ default: string;
389
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
390
+ };
391
+ visibleFill: {
392
+ default: string;
393
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
394
+ };
395
+ visiblePainted: {
396
+ default: string;
397
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
398
+ };
399
+ visibleStroke: {
400
+ default: string;
401
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
402
+ };
403
+ };
404
+ staticScale: PointerEvents[];
405
+ name: "pointerEvents";
406
+ };
174
407
  borderStyle: {
175
408
  values: {
176
409
  hidden: {
177
410
  default: string;
178
- conditions: Record<"xs" | "md" | "lg", string>;
411
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
179
412
  };
180
413
  none: {
181
414
  default: string;
182
- conditions: Record<"xs" | "md" | "lg", string>;
415
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
183
416
  };
184
417
  dashed: {
185
418
  default: string;
186
- conditions: Record<"xs" | "md" | "lg", string>;
419
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
187
420
  };
188
421
  dotted: {
189
422
  default: string;
190
- conditions: Record<"xs" | "md" | "lg", string>;
423
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
191
424
  };
192
425
  solid: {
193
426
  default: string;
194
- conditions: Record<"xs" | "md" | "lg", string>;
427
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
195
428
  };
196
429
  };
197
430
  staticScale: BorderStyle[];
@@ -201,11 +434,11 @@ export declare const box: {
201
434
  values: {
202
435
  "border-box": {
203
436
  default: string;
204
- conditions: Record<"xs" | "md" | "lg", string>;
437
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
205
438
  };
206
439
  "content-box": {
207
440
  default: string;
208
- conditions: Record<"xs" | "md" | "lg", string>;
441
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
209
442
  };
210
443
  };
211
444
  staticScale: BoxSizing[];
@@ -215,11 +448,11 @@ export declare const box: {
215
448
  values: {
216
449
  auto: {
217
450
  default: string;
218
- conditions: Record<"xs" | "md" | "lg", string>;
451
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
219
452
  };
220
453
  pointer: {
221
454
  default: string;
222
- conditions: Record<"xs" | "md" | "lg", string>;
455
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
223
456
  };
224
457
  };
225
458
  staticScale: Cursor[];
@@ -229,23 +462,23 @@ export declare const box: {
229
462
  values: {
230
463
  fixed: {
231
464
  default: string;
232
- conditions: Record<"xs" | "md" | "lg", string>;
465
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
233
466
  };
234
467
  absolute: {
235
468
  default: string;
236
- conditions: Record<"xs" | "md" | "lg", string>;
469
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
237
470
  };
238
471
  relative: {
239
472
  default: string;
240
- conditions: Record<"xs" | "md" | "lg", string>;
473
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
241
474
  };
242
475
  static: {
243
476
  default: string;
244
- conditions: Record<"xs" | "md" | "lg", string>;
477
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
245
478
  };
246
479
  sticky: {
247
480
  default: string;
248
- conditions: Record<"xs" | "md" | "lg", string>;
481
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
249
482
  };
250
483
  };
251
484
  staticScale: Position[];
@@ -255,19 +488,19 @@ export declare const box: {
255
488
  values: {
256
489
  hidden: {
257
490
  default: string;
258
- conditions: Record<"xs" | "md" | "lg", string>;
491
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
259
492
  };
260
493
  auto: {
261
494
  default: string;
262
- conditions: Record<"xs" | "md" | "lg", string>;
495
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
263
496
  };
264
497
  visible: {
265
498
  default: string;
266
- conditions: Record<"xs" | "md" | "lg", string>;
499
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
267
500
  };
268
501
  scroll: {
269
502
  default: string;
270
- conditions: Record<"xs" | "md" | "lg", string>;
503
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
271
504
  };
272
505
  };
273
506
  staticScale: Overflow[];
@@ -277,19 +510,19 @@ export declare const box: {
277
510
  values: {
278
511
  hidden: {
279
512
  default: string;
280
- conditions: Record<"xs" | "md" | "lg", string>;
513
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
281
514
  };
282
515
  auto: {
283
516
  default: string;
284
- conditions: Record<"xs" | "md" | "lg", string>;
517
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
285
518
  };
286
519
  visible: {
287
520
  default: string;
288
- conditions: Record<"xs" | "md" | "lg", string>;
521
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
289
522
  };
290
523
  scroll: {
291
524
  default: string;
292
- conditions: Record<"xs" | "md" | "lg", string>;
525
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
293
526
  };
294
527
  };
295
528
  staticScale: Overflow[];
@@ -299,19 +532,19 @@ export declare const box: {
299
532
  values: {
300
533
  hidden: {
301
534
  default: string;
302
- conditions: Record<"xs" | "md" | "lg", string>;
535
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
303
536
  };
304
537
  auto: {
305
538
  default: string;
306
- conditions: Record<"xs" | "md" | "lg", string>;
539
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
307
540
  };
308
541
  visible: {
309
542
  default: string;
310
- conditions: Record<"xs" | "md" | "lg", string>;
543
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
311
544
  };
312
545
  scroll: {
313
546
  default: string;
314
- conditions: Record<"xs" | "md" | "lg", string>;
547
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
315
548
  };
316
549
  };
317
550
  staticScale: Overflow[];
@@ -323,91 +556,211 @@ export declare const box: {
323
556
  width: {
324
557
  dynamic: {
325
558
  default: string;
326
- conditions: Record<"xs" | "md" | "lg", string>;
559
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
327
560
  };
328
561
  dynamicScale: true;
329
562
  name: "width";
330
563
  vars: {
331
564
  default: string;
332
- conditions: Record<"xs" | "md" | "lg", string>;
565
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
333
566
  };
334
567
  };
335
568
  height: {
336
569
  dynamic: {
337
570
  default: string;
338
- conditions: Record<"xs" | "md" | "lg", string>;
571
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
339
572
  };
340
573
  dynamicScale: true;
341
574
  name: "height";
342
575
  vars: {
343
576
  default: string;
344
- conditions: Record<"xs" | "md" | "lg", string>;
577
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
345
578
  };
346
579
  };
347
580
  maxWidth: {
348
581
  dynamic: {
349
582
  default: string;
350
- conditions: Record<"xs" | "md" | "lg", string>;
583
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
351
584
  };
352
585
  dynamicScale: true;
353
586
  name: "maxWidth";
354
587
  vars: {
355
588
  default: string;
356
- conditions: Record<"xs" | "md" | "lg", string>;
589
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
357
590
  };
358
591
  };
359
592
  maxHeight: {
360
593
  dynamic: {
361
594
  default: string;
362
- conditions: Record<"xs" | "md" | "lg", string>;
595
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
363
596
  };
364
597
  dynamicScale: true;
365
598
  name: "maxHeight";
366
599
  vars: {
367
600
  default: string;
368
- conditions: Record<"xs" | "md" | "lg", string>;
601
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
369
602
  };
370
603
  };
371
- borderRadius: {
604
+ bottom: {
372
605
  dynamic: {
373
606
  default: string;
374
- conditions: Record<"xs" | "md" | "lg", string>;
607
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
375
608
  };
376
609
  dynamicScale: true;
377
- name: "borderRadius";
610
+ name: "bottom";
378
611
  vars: {
379
612
  default: string;
380
- conditions: Record<"xs" | "md" | "lg", string>;
613
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
381
614
  };
382
615
  };
383
- borderWidth: {
616
+ left: {
384
617
  dynamic: {
385
618
  default: string;
386
- conditions: Record<"xs" | "md" | "lg", string>;
619
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
387
620
  };
388
621
  dynamicScale: true;
389
- name: "borderWidth";
622
+ name: "left";
390
623
  vars: {
391
624
  default: string;
392
- conditions: Record<"xs" | "md" | "lg", string>;
625
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
393
626
  };
394
627
  };
395
- backgroundColor: {
628
+ right: {
396
629
  dynamic: {
397
630
  default: string;
398
- conditions: Record<"xs" | "md" | "lg", string>;
631
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
399
632
  };
400
- dynamicScale: {
401
- "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
402
- "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
403
- "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
404
- "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
405
- "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
406
- "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
407
- "success.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
408
- "success.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
409
- "warning.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
410
- "warning.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
633
+ dynamicScale: true;
634
+ name: "right";
635
+ vars: {
636
+ default: string;
637
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
638
+ };
639
+ };
640
+ top: {
641
+ dynamic: {
642
+ default: string;
643
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
644
+ };
645
+ dynamicScale: true;
646
+ name: "top";
647
+ vars: {
648
+ default: string;
649
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
650
+ };
651
+ };
652
+ flex: {
653
+ dynamic: {
654
+ default: string;
655
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
656
+ };
657
+ dynamicScale: true;
658
+ name: "flex";
659
+ vars: {
660
+ default: string;
661
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
662
+ };
663
+ };
664
+ gridTemplateAreas: {
665
+ dynamic: {
666
+ default: string;
667
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
668
+ };
669
+ dynamicScale: true;
670
+ name: "gridTemplateAreas";
671
+ vars: {
672
+ default: string;
673
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
674
+ };
675
+ };
676
+ gridTemplateColumns: {
677
+ dynamic: {
678
+ default: string;
679
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
680
+ };
681
+ dynamicScale: true;
682
+ name: "gridTemplateColumns";
683
+ vars: {
684
+ default: string;
685
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
686
+ };
687
+ };
688
+ gridTemplateRows: {
689
+ dynamic: {
690
+ default: string;
691
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
692
+ };
693
+ dynamicScale: true;
694
+ name: "gridTemplateRows";
695
+ vars: {
696
+ default: string;
697
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
698
+ };
699
+ };
700
+ gridArea: {
701
+ dynamic: {
702
+ default: string;
703
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
704
+ };
705
+ dynamicScale: true;
706
+ name: "gridArea";
707
+ vars: {
708
+ default: string;
709
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
710
+ };
711
+ };
712
+ flexShrink: {
713
+ dynamic: {
714
+ default: string;
715
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
716
+ };
717
+ dynamicScale: true;
718
+ name: "flexShrink";
719
+ vars: {
720
+ default: string;
721
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
722
+ };
723
+ };
724
+ borderRadius: {
725
+ dynamic: {
726
+ default: string;
727
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
728
+ };
729
+ dynamicScale: true;
730
+ name: "borderRadius";
731
+ vars: {
732
+ default: string;
733
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
734
+ };
735
+ };
736
+ borderWidth: {
737
+ dynamic: {
738
+ default: string;
739
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
740
+ };
741
+ dynamicScale: true;
742
+ name: "borderWidth";
743
+ vars: {
744
+ default: string;
745
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
746
+ };
747
+ };
748
+ backgroundColor: {
749
+ dynamic: {
750
+ default: string;
751
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
752
+ };
753
+ dynamicScale: {
754
+ "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
755
+ "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
756
+ "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
757
+ "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
758
+ "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
759
+ "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
760
+ "success.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
761
+ "success.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
762
+ "warning.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
763
+ "warning.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
411
764
  "warning.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
412
765
  "warning.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
413
766
  "danger.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -423,13 +776,13 @@ export declare const box: {
423
776
  name: "backgroundColor";
424
777
  vars: {
425
778
  default: string;
426
- conditions: Record<"xs" | "md" | "lg", string>;
779
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
427
780
  };
428
781
  };
429
782
  borderColor: {
430
783
  dynamic: {
431
784
  default: string;
432
- conditions: Record<"xs" | "md" | "lg", string>;
785
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
433
786
  };
434
787
  dynamicScale: {
435
788
  "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -451,13 +804,13 @@ export declare const box: {
451
804
  name: "borderColor";
452
805
  vars: {
453
806
  default: string;
454
- conditions: Record<"xs" | "md" | "lg", string>;
807
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
455
808
  };
456
809
  };
457
810
  padding: {
458
811
  dynamic: {
459
812
  default: string;
460
- conditions: Record<"xs" | "md" | "lg", string>;
813
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
461
814
  };
462
815
  dynamicScale: {
463
816
  none: string;
@@ -478,13 +831,13 @@ export declare const box: {
478
831
  name: "padding";
479
832
  vars: {
480
833
  default: string;
481
- conditions: Record<"xs" | "md" | "lg", string>;
834
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
482
835
  };
483
836
  };
484
837
  paddingTop: {
485
838
  dynamic: {
486
839
  default: string;
487
- conditions: Record<"xs" | "md" | "lg", string>;
840
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
488
841
  };
489
842
  dynamicScale: {
490
843
  none: string;
@@ -505,13 +858,13 @@ export declare const box: {
505
858
  name: "paddingTop";
506
859
  vars: {
507
860
  default: string;
508
- conditions: Record<"xs" | "md" | "lg", string>;
861
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
509
862
  };
510
863
  };
511
864
  paddingBottom: {
512
865
  dynamic: {
513
866
  default: string;
514
- conditions: Record<"xs" | "md" | "lg", string>;
867
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
515
868
  };
516
869
  dynamicScale: {
517
870
  none: string;
@@ -532,13 +885,13 @@ export declare const box: {
532
885
  name: "paddingBottom";
533
886
  vars: {
534
887
  default: string;
535
- conditions: Record<"xs" | "md" | "lg", string>;
888
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
536
889
  };
537
890
  };
538
891
  paddingLeft: {
539
892
  dynamic: {
540
893
  default: string;
541
- conditions: Record<"xs" | "md" | "lg", string>;
894
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
542
895
  };
543
896
  dynamicScale: {
544
897
  none: string;
@@ -559,13 +912,13 @@ export declare const box: {
559
912
  name: "paddingLeft";
560
913
  vars: {
561
914
  default: string;
562
- conditions: Record<"xs" | "md" | "lg", string>;
915
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
563
916
  };
564
917
  };
565
918
  paddingRight: {
566
919
  dynamic: {
567
920
  default: string;
568
- conditions: Record<"xs" | "md" | "lg", string>;
921
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
569
922
  };
570
923
  dynamicScale: {
571
924
  none: string;
@@ -586,13 +939,13 @@ export declare const box: {
586
939
  name: "paddingRight";
587
940
  vars: {
588
941
  default: string;
589
- conditions: Record<"xs" | "md" | "lg", string>;
942
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
590
943
  };
591
944
  };
592
945
  margin: {
593
946
  dynamic: {
594
947
  default: string;
595
- conditions: Record<"xs" | "md" | "lg", string>;
948
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
596
949
  };
597
950
  dynamicScale: {
598
951
  none: string;
@@ -614,13 +967,13 @@ export declare const box: {
614
967
  name: "margin";
615
968
  vars: {
616
969
  default: string;
617
- conditions: Record<"xs" | "md" | "lg", string>;
970
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
618
971
  };
619
972
  };
620
973
  marginTop: {
621
974
  dynamic: {
622
975
  default: string;
623
- conditions: Record<"xs" | "md" | "lg", string>;
976
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
624
977
  };
625
978
  dynamicScale: {
626
979
  none: string;
@@ -642,13 +995,13 @@ export declare const box: {
642
995
  name: "marginTop";
643
996
  vars: {
644
997
  default: string;
645
- conditions: Record<"xs" | "md" | "lg", string>;
998
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
646
999
  };
647
1000
  };
648
1001
  marginBottom: {
649
1002
  dynamic: {
650
1003
  default: string;
651
- conditions: Record<"xs" | "md" | "lg", string>;
1004
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
652
1005
  };
653
1006
  dynamicScale: {
654
1007
  none: string;
@@ -670,13 +1023,13 @@ export declare const box: {
670
1023
  name: "marginBottom";
671
1024
  vars: {
672
1025
  default: string;
673
- conditions: Record<"xs" | "md" | "lg", string>;
1026
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
674
1027
  };
675
1028
  };
676
1029
  marginLeft: {
677
1030
  dynamic: {
678
1031
  default: string;
679
- conditions: Record<"xs" | "md" | "lg", string>;
1032
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
680
1033
  };
681
1034
  dynamicScale: {
682
1035
  none: string;
@@ -698,13 +1051,13 @@ export declare const box: {
698
1051
  name: "marginLeft";
699
1052
  vars: {
700
1053
  default: string;
701
- conditions: Record<"xs" | "md" | "lg", string>;
1054
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
702
1055
  };
703
1056
  };
704
1057
  marginRight: {
705
1058
  dynamic: {
706
1059
  default: string;
707
- conditions: Record<"xs" | "md" | "lg", string>;
1060
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
708
1061
  };
709
1062
  dynamicScale: {
710
1063
  none: string;
@@ -726,55 +1079,63 @@ export declare const box: {
726
1079
  name: "marginRight";
727
1080
  vars: {
728
1081
  default: string;
729
- conditions: Record<"xs" | "md" | "lg", string>;
1082
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
730
1083
  };
731
1084
  };
732
- bottom: {
1085
+ gap: {
733
1086
  dynamic: {
734
1087
  default: string;
735
- conditions: Record<"xs" | "md" | "lg", string>;
736
- };
737
- dynamicScale: true;
738
- name: "bottom";
739
- vars: {
740
- default: string;
741
- conditions: Record<"xs" | "md" | "lg", string>;
1088
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
742
1089
  };
743
- };
744
- left: {
745
- dynamic: {
746
- default: string;
747
- conditions: Record<"xs" | "md" | "lg", string>;
1090
+ dynamicScale: {
1091
+ none: string;
1092
+ "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1093
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1094
+ "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1095
+ "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1096
+ "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1097
+ "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1098
+ "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1099
+ "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1100
+ "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1101
+ "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1102
+ "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1103
+ "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1104
+ "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1105
+ "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
748
1106
  };
749
- dynamicScale: true;
750
- name: "left";
1107
+ name: "gap";
751
1108
  vars: {
752
1109
  default: string;
753
- conditions: Record<"xs" | "md" | "lg", string>;
1110
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
754
1111
  };
755
1112
  };
756
- right: {
1113
+ gridGap: {
757
1114
  dynamic: {
758
1115
  default: string;
759
- conditions: Record<"xs" | "md" | "lg", string>;
760
- };
761
- dynamicScale: true;
762
- name: "right";
763
- vars: {
764
- default: string;
765
- conditions: Record<"xs" | "md" | "lg", string>;
1116
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
766
1117
  };
767
- };
768
- top: {
769
- dynamic: {
770
- default: string;
771
- conditions: Record<"xs" | "md" | "lg", string>;
1118
+ dynamicScale: {
1119
+ none: string;
1120
+ "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1121
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1122
+ "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1123
+ "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1124
+ "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1125
+ "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1126
+ "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1127
+ "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1128
+ "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1129
+ "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1130
+ "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1131
+ "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1132
+ "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1133
+ "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
772
1134
  };
773
- dynamicScale: true;
774
- name: "top";
1135
+ name: "gridGap";
775
1136
  vars: {
776
1137
  default: string;
777
- conditions: Record<"xs" | "md" | "lg", string>;
1138
+ conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
778
1139
  };
779
1140
  };
780
1141
  };
@@ -844,13 +1205,53 @@ export declare const box: {
844
1205
  }
845
1206
  ]>;
846
1207
  properties: {
847
- backgroundColor: {
848
- "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
849
- "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
850
- "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
851
- "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
852
- "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
853
- "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1208
+ gap: {
1209
+ none: string;
1210
+ "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1211
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1212
+ "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1213
+ "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1214
+ "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1215
+ "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1216
+ "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1217
+ "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1218
+ "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1219
+ "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1220
+ "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1221
+ "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1222
+ "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1223
+ "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1224
+ };
1225
+ gridGap: {
1226
+ none: string;
1227
+ "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1228
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1229
+ "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1230
+ "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1231
+ "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1232
+ "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1233
+ "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1234
+ "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1235
+ "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1236
+ "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1237
+ "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1238
+ "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1239
+ "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1240
+ "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1241
+ };
1242
+ display: Display[];
1243
+ flexDirection: FlexDirection[];
1244
+ flexWrap: FlexWrap[];
1245
+ justifyContent: JustifyContent[];
1246
+ alignItems: AlignItems[];
1247
+ pointerEvents: PointerEvents[];
1248
+ backgroundColor: {
1249
+ "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1250
+ "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1251
+ "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1252
+ "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1253
+ "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1254
+ "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
854
1255
  "success.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
855
1256
  "success.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
856
1257
  "warning.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -1431,447 +1832,6 @@ export declare const spinner: {
1431
1832
  container: string;
1432
1833
  };
1433
1834
  };
1434
- declare const propertiesStack: {
1435
- gap: {
1436
- none: string;
1437
- "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1438
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1439
- "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1440
- "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1441
- "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1442
- "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1443
- "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1444
- "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1445
- "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1446
- "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1447
- "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1448
- "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1449
- "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1450
- "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1451
- };
1452
- gridGap: {
1453
- none: string;
1454
- "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1455
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1456
- "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1457
- "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1458
- "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1459
- "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1460
- "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1461
- "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1462
- "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1463
- "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1464
- "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1465
- "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1466
- "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1467
- "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1468
- };
1469
- display: Display[];
1470
- flexDirection: FlexDirection[];
1471
- flexWrap: FlexWrap[];
1472
- justifyContent: JustifyContent[];
1473
- alignItems: AlignItems[];
1474
- pointerEvents: PointerEvents[];
1475
- };
1476
- export type StackGapProperties = keyof typeof propertiesStack.gap;
1477
- export type StackGridGapProperties = keyof typeof propertiesStack.gridGap;
1478
- export interface StackSprinkle {
1479
- width?: string | Conditions<string>;
1480
- height?: string | Conditions<string>;
1481
- flex?: string | Conditions<string>;
1482
- flexShrink?: string | Conditions<string>;
1483
- gridTemplateColumns?: string | Conditions<string>;
1484
- gridTemplateAreas?: string | Conditions<string>;
1485
- gridTemplateRows?: string | Conditions<string>;
1486
- gridArea?: string | Conditions<string>;
1487
- display?: Display | Conditions<Display>;
1488
- flexWrap?: FlexWrap | Conditions<FlexWrap>;
1489
- justifyContent?: JustifyContent | Conditions<JustifyContent>;
1490
- flexDirection?: FlexDirection | Conditions<FlexDirection>;
1491
- alignItems?: AlignItems | Conditions<AlignItems>;
1492
- gap?: StackGapProperties | Conditions<StackGapProperties>;
1493
- gridGap?: StackGridGapProperties | Conditions<StackGridGapProperties>;
1494
- pointerEvents?: PointerEvents | Conditions<PointerEvents>;
1495
- }
1496
- export declare const stack: {
1497
- sprinkle: import("rainbow-sprinkles/dist/declarations/src/createRuntimeFn").SprinklesFn<[
1498
- {
1499
- config: {
1500
- display: {
1501
- values: {
1502
- grid: {
1503
- default: string;
1504
- conditions: Record<"xs" | "md" | "lg", string>;
1505
- };
1506
- flex: {
1507
- default: string;
1508
- conditions: Record<"xs" | "md" | "lg", string>;
1509
- };
1510
- block: {
1511
- default: string;
1512
- conditions: Record<"xs" | "md" | "lg", string>;
1513
- };
1514
- "inline-flex": {
1515
- default: string;
1516
- conditions: Record<"xs" | "md" | "lg", string>;
1517
- };
1518
- "inline-grid": {
1519
- default: string;
1520
- conditions: Record<"xs" | "md" | "lg", string>;
1521
- };
1522
- };
1523
- staticScale: Display[];
1524
- name: "display";
1525
- };
1526
- flexDirection: {
1527
- values: {
1528
- row: {
1529
- default: string;
1530
- conditions: Record<"xs" | "md" | "lg", string>;
1531
- };
1532
- column: {
1533
- default: string;
1534
- conditions: Record<"xs" | "md" | "lg", string>;
1535
- };
1536
- "column-reverse": {
1537
- default: string;
1538
- conditions: Record<"xs" | "md" | "lg", string>;
1539
- };
1540
- "row-reverse": {
1541
- default: string;
1542
- conditions: Record<"xs" | "md" | "lg", string>;
1543
- };
1544
- };
1545
- staticScale: FlexDirection[];
1546
- name: "flexDirection";
1547
- };
1548
- flexWrap: {
1549
- values: {
1550
- nowrap: {
1551
- default: string;
1552
- conditions: Record<"xs" | "md" | "lg", string>;
1553
- };
1554
- wrap: {
1555
- default: string;
1556
- conditions: Record<"xs" | "md" | "lg", string>;
1557
- };
1558
- "wrap-reverse": {
1559
- default: string;
1560
- conditions: Record<"xs" | "md" | "lg", string>;
1561
- };
1562
- };
1563
- staticScale: FlexWrap[];
1564
- name: "flexWrap";
1565
- };
1566
- justifyContent: {
1567
- values: {
1568
- center: {
1569
- default: string;
1570
- conditions: Record<"xs" | "md" | "lg", string>;
1571
- };
1572
- "flex-end": {
1573
- default: string;
1574
- conditions: Record<"xs" | "md" | "lg", string>;
1575
- };
1576
- "flex-start": {
1577
- default: string;
1578
- conditions: Record<"xs" | "md" | "lg", string>;
1579
- };
1580
- "space-around": {
1581
- default: string;
1582
- conditions: Record<"xs" | "md" | "lg", string>;
1583
- };
1584
- "space-between": {
1585
- default: string;
1586
- conditions: Record<"xs" | "md" | "lg", string>;
1587
- };
1588
- "space-evenly": {
1589
- default: string;
1590
- conditions: Record<"xs" | "md" | "lg", string>;
1591
- };
1592
- };
1593
- staticScale: JustifyContent[];
1594
- name: "justifyContent";
1595
- };
1596
- alignItems: {
1597
- values: {
1598
- center: {
1599
- default: string;
1600
- conditions: Record<"xs" | "md" | "lg", string>;
1601
- };
1602
- "flex-end": {
1603
- default: string;
1604
- conditions: Record<"xs" | "md" | "lg", string>;
1605
- };
1606
- "flex-start": {
1607
- default: string;
1608
- conditions: Record<"xs" | "md" | "lg", string>;
1609
- };
1610
- baseline: {
1611
- default: string;
1612
- conditions: Record<"xs" | "md" | "lg", string>;
1613
- };
1614
- stretch: {
1615
- default: string;
1616
- conditions: Record<"xs" | "md" | "lg", string>;
1617
- };
1618
- };
1619
- staticScale: AlignItems[];
1620
- name: "alignItems";
1621
- };
1622
- pointerEvents: {
1623
- values: {
1624
- inherit: {
1625
- default: string;
1626
- conditions: Record<"xs" | "md" | "lg", string>;
1627
- };
1628
- none: {
1629
- default: string;
1630
- conditions: Record<"xs" | "md" | "lg", string>;
1631
- };
1632
- all: {
1633
- default: string;
1634
- conditions: Record<"xs" | "md" | "lg", string>;
1635
- };
1636
- fill: {
1637
- default: string;
1638
- conditions: Record<"xs" | "md" | "lg", string>;
1639
- };
1640
- stroke: {
1641
- default: string;
1642
- conditions: Record<"xs" | "md" | "lg", string>;
1643
- };
1644
- auto: {
1645
- default: string;
1646
- conditions: Record<"xs" | "md" | "lg", string>;
1647
- };
1648
- visible: {
1649
- default: string;
1650
- conditions: Record<"xs" | "md" | "lg", string>;
1651
- };
1652
- painted: {
1653
- default: string;
1654
- conditions: Record<"xs" | "md" | "lg", string>;
1655
- };
1656
- visibleFill: {
1657
- default: string;
1658
- conditions: Record<"xs" | "md" | "lg", string>;
1659
- };
1660
- visiblePainted: {
1661
- default: string;
1662
- conditions: Record<"xs" | "md" | "lg", string>;
1663
- };
1664
- visibleStroke: {
1665
- default: string;
1666
- conditions: Record<"xs" | "md" | "lg", string>;
1667
- };
1668
- };
1669
- staticScale: PointerEvents[];
1670
- name: "pointerEvents";
1671
- };
1672
- };
1673
- } & {
1674
- config: {
1675
- width: {
1676
- dynamic: {
1677
- default: string;
1678
- conditions: Record<"xs" | "md" | "lg", string>;
1679
- };
1680
- dynamicScale: true;
1681
- name: "width";
1682
- vars: {
1683
- default: string;
1684
- conditions: Record<"xs" | "md" | "lg", string>;
1685
- };
1686
- };
1687
- height: {
1688
- dynamic: {
1689
- default: string;
1690
- conditions: Record<"xs" | "md" | "lg", string>;
1691
- };
1692
- dynamicScale: true;
1693
- name: "height";
1694
- vars: {
1695
- default: string;
1696
- conditions: Record<"xs" | "md" | "lg", string>;
1697
- };
1698
- };
1699
- flex: {
1700
- dynamic: {
1701
- default: string;
1702
- conditions: Record<"xs" | "md" | "lg", string>;
1703
- };
1704
- dynamicScale: true;
1705
- name: "flex";
1706
- vars: {
1707
- default: string;
1708
- conditions: Record<"xs" | "md" | "lg", string>;
1709
- };
1710
- };
1711
- gridTemplateAreas: {
1712
- dynamic: {
1713
- default: string;
1714
- conditions: Record<"xs" | "md" | "lg", string>;
1715
- };
1716
- dynamicScale: true;
1717
- name: "gridTemplateAreas";
1718
- vars: {
1719
- default: string;
1720
- conditions: Record<"xs" | "md" | "lg", string>;
1721
- };
1722
- };
1723
- gridTemplateColumns: {
1724
- dynamic: {
1725
- default: string;
1726
- conditions: Record<"xs" | "md" | "lg", string>;
1727
- };
1728
- dynamicScale: true;
1729
- name: "gridTemplateColumns";
1730
- vars: {
1731
- default: string;
1732
- conditions: Record<"xs" | "md" | "lg", string>;
1733
- };
1734
- };
1735
- gridTemplateRows: {
1736
- dynamic: {
1737
- default: string;
1738
- conditions: Record<"xs" | "md" | "lg", string>;
1739
- };
1740
- dynamicScale: true;
1741
- name: "gridTemplateRows";
1742
- vars: {
1743
- default: string;
1744
- conditions: Record<"xs" | "md" | "lg", string>;
1745
- };
1746
- };
1747
- gridArea: {
1748
- dynamic: {
1749
- default: string;
1750
- conditions: Record<"xs" | "md" | "lg", string>;
1751
- };
1752
- dynamicScale: true;
1753
- name: "gridArea";
1754
- vars: {
1755
- default: string;
1756
- conditions: Record<"xs" | "md" | "lg", string>;
1757
- };
1758
- };
1759
- flexShrink: {
1760
- dynamic: {
1761
- default: string;
1762
- conditions: Record<"xs" | "md" | "lg", string>;
1763
- };
1764
- dynamicScale: true;
1765
- name: "flexShrink";
1766
- vars: {
1767
- default: string;
1768
- conditions: Record<"xs" | "md" | "lg", string>;
1769
- };
1770
- };
1771
- gap: {
1772
- dynamic: {
1773
- default: string;
1774
- conditions: Record<"xs" | "md" | "lg", string>;
1775
- };
1776
- dynamicScale: {
1777
- none: string;
1778
- "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1779
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1780
- "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1781
- "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1782
- "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1783
- "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1784
- "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1785
- "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1786
- "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1787
- "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1788
- "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1789
- "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1790
- "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1791
- "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1792
- };
1793
- name: "gap";
1794
- vars: {
1795
- default: string;
1796
- conditions: Record<"xs" | "md" | "lg", string>;
1797
- };
1798
- };
1799
- gridGap: {
1800
- dynamic: {
1801
- default: string;
1802
- conditions: Record<"xs" | "md" | "lg", string>;
1803
- };
1804
- dynamicScale: {
1805
- none: string;
1806
- "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1807
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1808
- "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1809
- "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1810
- "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1811
- "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1812
- "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1813
- "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1814
- "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1815
- "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1816
- "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1817
- "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1818
- "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1819
- "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1820
- };
1821
- name: "gridGap";
1822
- vars: {
1823
- default: string;
1824
- conditions: Record<"xs" | "md" | "lg", string>;
1825
- };
1826
- };
1827
- };
1828
- } & {
1829
- config: {};
1830
- }
1831
- ]>;
1832
- properties: {
1833
- gap: {
1834
- none: string;
1835
- "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1836
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1837
- "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1838
- "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1839
- "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1840
- "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1841
- "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1842
- "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1843
- "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1844
- "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1845
- "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1846
- "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1847
- "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1848
- "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1849
- };
1850
- gridGap: {
1851
- none: string;
1852
- "0,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1853
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1854
- "1,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1855
- "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1856
- "2,5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1857
- "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1858
- "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1859
- "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1860
- "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1861
- "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1862
- "14": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1863
- "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1864
- "18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1865
- "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1866
- };
1867
- display: Display[];
1868
- flexDirection: FlexDirection[];
1869
- flexWrap: FlexWrap[];
1870
- justifyContent: JustifyContent[];
1871
- alignItems: AlignItems[];
1872
- pointerEvents: PointerEvents[];
1873
- };
1874
- };
1875
1835
  export declare const toggle: {
1876
1836
  classnames: {
1877
1837
  container: string;