@nimbus-ds/styles 6.13.0-rc.2 → 6.13.0-rc.4

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/dist/index.d.ts CHANGED
@@ -171,6 +171,32 @@ declare const propertiesBox: {
171
171
  slower: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
172
172
  };
173
173
  transitionTimingFunction: TransitionTiming[];
174
+ color: {
175
+ currentColor: string;
176
+ "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
177
+ "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
178
+ "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
179
+ "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
180
+ "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
181
+ "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
182
+ "success.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
183
+ "success.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
184
+ "warning.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
185
+ "warning.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
186
+ "warning.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
187
+ "warning.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
188
+ "danger.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
189
+ "danger.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
190
+ "danger.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
191
+ "danger.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
192
+ "neutral.background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
193
+ "neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
194
+ "neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
195
+ "neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
196
+ "neutral.surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
197
+ "neutral.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
198
+ transparent: string;
199
+ };
174
200
  };
175
201
  export type BoxBorderColorProperties = keyof typeof propertiesBox.borderColor;
176
202
  export type BoxBackgroundColorProperties = keyof typeof propertiesBox.backgroundColor;
@@ -180,6 +206,7 @@ export type BoxMarginProperties = keyof typeof propertiesBox.margin;
180
206
  export type BoxGapProperties = keyof typeof propertiesBox.gap;
181
207
  export type BoxGridGapProperties = keyof typeof propertiesBox.gridGap;
182
208
  export type TransitionDurationProperties = keyof typeof propertiesBox.transitionDuration;
209
+ export type BoxColorProperties = keyof typeof propertiesBox.color;
183
210
  export interface BoxConditions<T> extends Conditions<T> {
184
211
  focus?: T;
185
212
  active?: T;
@@ -255,6 +282,11 @@ export interface BoxSprinkle {
255
282
  transitionDuration?: TransitionDurationProperties | BoxConditions<TransitionDurationProperties>;
256
283
  zIndex?: number | BoxConditions<number>;
257
284
  backgroundImage?: string | BoxConditions<string>;
285
+ backgroundPosition?: string | BoxConditions<string>;
286
+ backgroundBlendMode?: string | BoxConditions<string>;
287
+ backgroundRepeat?: string | BoxConditions<string>;
288
+ backgroundSize?: string | BoxConditions<string>;
289
+ color?: BoxColorProperties | BoxConditions<BoxColorProperties>;
258
290
  }
259
291
  export declare const box: {
260
292
  sprinkle: import("rainbow-sprinkles/dist/declarations/src/createRuntimeFn").SprinklesFn<[
@@ -264,27 +296,27 @@ export declare const box: {
264
296
  values: {
265
297
  grid: {
266
298
  default: string;
267
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
299
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
268
300
  };
269
301
  none: {
270
302
  default: string;
271
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
303
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
272
304
  };
273
305
  flex: {
274
306
  default: string;
275
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
307
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
276
308
  };
277
309
  block: {
278
310
  default: string;
279
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
311
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
280
312
  };
281
313
  "inline-flex": {
282
314
  default: string;
283
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
315
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
284
316
  };
285
317
  "inline-grid": {
286
318
  default: string;
287
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
319
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
288
320
  };
289
321
  };
290
322
  staticScale: Display[];
@@ -294,19 +326,19 @@ export declare const box: {
294
326
  values: {
295
327
  row: {
296
328
  default: string;
297
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
329
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
298
330
  };
299
331
  column: {
300
332
  default: string;
301
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
333
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
302
334
  };
303
335
  "column-reverse": {
304
336
  default: string;
305
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
337
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
306
338
  };
307
339
  "row-reverse": {
308
340
  default: string;
309
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
341
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
310
342
  };
311
343
  };
312
344
  staticScale: FlexDirection[];
@@ -316,15 +348,15 @@ export declare const box: {
316
348
  values: {
317
349
  nowrap: {
318
350
  default: string;
319
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
351
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
320
352
  };
321
353
  wrap: {
322
354
  default: string;
323
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
355
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
324
356
  };
325
357
  "wrap-reverse": {
326
358
  default: string;
327
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
359
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
328
360
  };
329
361
  };
330
362
  staticScale: FlexWrap[];
@@ -334,27 +366,27 @@ export declare const box: {
334
366
  values: {
335
367
  center: {
336
368
  default: string;
337
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
369
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
338
370
  };
339
371
  "flex-end": {
340
372
  default: string;
341
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
373
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
342
374
  };
343
375
  "flex-start": {
344
376
  default: string;
345
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
377
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
346
378
  };
347
379
  "space-around": {
348
380
  default: string;
349
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
381
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
350
382
  };
351
383
  "space-between": {
352
384
  default: string;
353
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
385
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
354
386
  };
355
387
  "space-evenly": {
356
388
  default: string;
357
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
389
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
358
390
  };
359
391
  };
360
392
  staticScale: JustifyContent[];
@@ -364,23 +396,23 @@ export declare const box: {
364
396
  values: {
365
397
  center: {
366
398
  default: string;
367
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
399
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
368
400
  };
369
401
  "flex-end": {
370
402
  default: string;
371
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
403
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
372
404
  };
373
405
  "flex-start": {
374
406
  default: string;
375
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
407
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
376
408
  };
377
409
  baseline: {
378
410
  default: string;
379
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
411
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
380
412
  };
381
413
  stretch: {
382
414
  default: string;
383
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
415
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
384
416
  };
385
417
  };
386
418
  staticScale: AlignItems[];
@@ -390,47 +422,47 @@ export declare const box: {
390
422
  values: {
391
423
  inherit: {
392
424
  default: string;
393
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
425
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
394
426
  };
395
427
  none: {
396
428
  default: string;
397
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
429
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
398
430
  };
399
431
  all: {
400
432
  default: string;
401
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
433
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
402
434
  };
403
435
  fill: {
404
436
  default: string;
405
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
437
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
406
438
  };
407
439
  stroke: {
408
440
  default: string;
409
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
441
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
410
442
  };
411
443
  auto: {
412
444
  default: string;
413
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
445
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
414
446
  };
415
447
  visible: {
416
448
  default: string;
417
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
449
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
418
450
  };
419
451
  painted: {
420
452
  default: string;
421
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
453
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
422
454
  };
423
455
  visibleFill: {
424
456
  default: string;
425
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
457
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
426
458
  };
427
459
  visiblePainted: {
428
460
  default: string;
429
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
461
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
430
462
  };
431
463
  visibleStroke: {
432
464
  default: string;
433
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
465
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
434
466
  };
435
467
  };
436
468
  staticScale: PointerEvents[];
@@ -440,23 +472,23 @@ export declare const box: {
440
472
  values: {
441
473
  hidden: {
442
474
  default: string;
443
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
475
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
444
476
  };
445
477
  none: {
446
478
  default: string;
447
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
479
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
448
480
  };
449
481
  dashed: {
450
482
  default: string;
451
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
483
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
452
484
  };
453
485
  dotted: {
454
486
  default: string;
455
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
487
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
456
488
  };
457
489
  solid: {
458
490
  default: string;
459
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
491
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
460
492
  };
461
493
  };
462
494
  staticScale: BorderStyle[];
@@ -466,11 +498,11 @@ export declare const box: {
466
498
  values: {
467
499
  "border-box": {
468
500
  default: string;
469
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
501
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
470
502
  };
471
503
  "content-box": {
472
504
  default: string;
473
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
505
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
474
506
  };
475
507
  };
476
508
  staticScale: BoxSizing[];
@@ -480,23 +512,23 @@ export declare const box: {
480
512
  values: {
481
513
  inherit: {
482
514
  default: string;
483
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
515
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
484
516
  };
485
517
  auto: {
486
518
  default: string;
487
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
519
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
488
520
  };
489
521
  grab: {
490
522
  default: string;
491
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
523
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
492
524
  };
493
525
  "not-allowed": {
494
526
  default: string;
495
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
527
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
496
528
  };
497
529
  pointer: {
498
530
  default: string;
499
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
531
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
500
532
  };
501
533
  };
502
534
  staticScale: Cursor[];
@@ -506,23 +538,23 @@ export declare const box: {
506
538
  values: {
507
539
  fixed: {
508
540
  default: string;
509
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
541
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
510
542
  };
511
543
  absolute: {
512
544
  default: string;
513
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
545
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
514
546
  };
515
547
  relative: {
516
548
  default: string;
517
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
549
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
518
550
  };
519
551
  static: {
520
552
  default: string;
521
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
553
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
522
554
  };
523
555
  sticky: {
524
556
  default: string;
525
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
557
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
526
558
  };
527
559
  };
528
560
  staticScale: Position[];
@@ -532,19 +564,19 @@ export declare const box: {
532
564
  values: {
533
565
  hidden: {
534
566
  default: string;
535
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
567
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
536
568
  };
537
569
  auto: {
538
570
  default: string;
539
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
571
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
540
572
  };
541
573
  visible: {
542
574
  default: string;
543
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
575
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
544
576
  };
545
577
  scroll: {
546
578
  default: string;
547
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
579
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
548
580
  };
549
581
  };
550
582
  staticScale: Overflow[];
@@ -554,19 +586,19 @@ export declare const box: {
554
586
  values: {
555
587
  hidden: {
556
588
  default: string;
557
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
589
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
558
590
  };
559
591
  auto: {
560
592
  default: string;
561
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
593
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
562
594
  };
563
595
  visible: {
564
596
  default: string;
565
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
597
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
566
598
  };
567
599
  scroll: {
568
600
  default: string;
569
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
601
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
570
602
  };
571
603
  };
572
604
  staticScale: Overflow[];
@@ -576,19 +608,19 @@ export declare const box: {
576
608
  values: {
577
609
  hidden: {
578
610
  default: string;
579
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
611
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
580
612
  };
581
613
  auto: {
582
614
  default: string;
583
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
615
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
584
616
  };
585
617
  visible: {
586
618
  default: string;
587
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
619
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
588
620
  };
589
621
  scroll: {
590
622
  default: string;
591
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
623
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
592
624
  };
593
625
  };
594
626
  staticScale: Overflow[];
@@ -598,31 +630,31 @@ export declare const box: {
598
630
  values: {
599
631
  ease: {
600
632
  default: string;
601
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
633
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
602
634
  };
603
635
  "ease-in": {
604
636
  default: string;
605
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
637
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
606
638
  };
607
639
  "ease-in-out": {
608
640
  default: string;
609
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
641
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
610
642
  };
611
643
  "ease-out": {
612
644
  default: string;
613
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
645
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
614
646
  };
615
647
  "step-end": {
616
648
  default: string;
617
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
649
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
618
650
  };
619
651
  "step-start": {
620
652
  default: string;
621
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
653
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
622
654
  };
623
655
  linear: {
624
656
  default: string;
625
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
657
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
626
658
  };
627
659
  };
628
660
  staticScale: TransitionTiming[];
@@ -634,271 +666,319 @@ export declare const box: {
634
666
  width: {
635
667
  dynamic: {
636
668
  default: string;
637
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
669
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
638
670
  };
639
671
  dynamicScale: true;
640
672
  name: "width";
641
673
  vars: {
642
674
  default: string;
643
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
675
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
644
676
  };
645
677
  };
646
678
  height: {
647
679
  dynamic: {
648
680
  default: string;
649
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
681
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
650
682
  };
651
683
  dynamicScale: true;
652
684
  name: "height";
653
685
  vars: {
654
686
  default: string;
655
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
687
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
656
688
  };
657
689
  };
658
690
  maxWidth: {
659
691
  dynamic: {
660
692
  default: string;
661
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
693
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
662
694
  };
663
695
  dynamicScale: true;
664
696
  name: "maxWidth";
665
697
  vars: {
666
698
  default: string;
667
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
699
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
668
700
  };
669
701
  };
670
702
  maxHeight: {
671
703
  dynamic: {
672
704
  default: string;
673
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
705
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
674
706
  };
675
707
  dynamicScale: true;
676
708
  name: "maxHeight";
677
709
  vars: {
678
710
  default: string;
679
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
711
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
680
712
  };
681
713
  };
682
714
  minWidth: {
683
715
  dynamic: {
684
716
  default: string;
685
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
717
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
686
718
  };
687
719
  dynamicScale: true;
688
720
  name: "minWidth";
689
721
  vars: {
690
722
  default: string;
691
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
723
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
692
724
  };
693
725
  };
694
726
  minHeight: {
695
727
  dynamic: {
696
728
  default: string;
697
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
729
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
698
730
  };
699
731
  dynamicScale: true;
700
732
  name: "minHeight";
701
733
  vars: {
702
734
  default: string;
703
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
735
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
704
736
  };
705
737
  };
706
738
  bottom: {
707
739
  dynamic: {
708
740
  default: string;
709
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
741
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
710
742
  };
711
743
  dynamicScale: true;
712
744
  name: "bottom";
713
745
  vars: {
714
746
  default: string;
715
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
747
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
716
748
  };
717
749
  };
718
750
  left: {
719
751
  dynamic: {
720
752
  default: string;
721
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
753
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
722
754
  };
723
755
  dynamicScale: true;
724
756
  name: "left";
725
757
  vars: {
726
758
  default: string;
727
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
759
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
728
760
  };
729
761
  };
730
762
  right: {
731
763
  dynamic: {
732
764
  default: string;
733
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
765
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
734
766
  };
735
767
  dynamicScale: true;
736
768
  name: "right";
737
769
  vars: {
738
770
  default: string;
739
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
771
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
740
772
  };
741
773
  };
742
774
  top: {
743
775
  dynamic: {
744
776
  default: string;
745
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
777
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
746
778
  };
747
779
  dynamicScale: true;
748
780
  name: "top";
749
781
  vars: {
750
782
  default: string;
751
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
783
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
752
784
  };
753
785
  };
754
786
  flex: {
755
787
  dynamic: {
756
788
  default: string;
757
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
789
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
758
790
  };
759
791
  dynamicScale: true;
760
792
  name: "flex";
761
793
  vars: {
762
794
  default: string;
763
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
795
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
764
796
  };
765
797
  };
766
798
  gridTemplateAreas: {
767
799
  dynamic: {
768
800
  default: string;
769
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
801
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
770
802
  };
771
803
  dynamicScale: true;
772
804
  name: "gridTemplateAreas";
773
805
  vars: {
774
806
  default: string;
775
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
807
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
776
808
  };
777
809
  };
778
810
  gridTemplateColumns: {
779
811
  dynamic: {
780
812
  default: string;
781
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
813
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
782
814
  };
783
815
  dynamicScale: true;
784
816
  name: "gridTemplateColumns";
785
817
  vars: {
786
818
  default: string;
787
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
819
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
788
820
  };
789
821
  };
790
822
  gridTemplateRows: {
791
823
  dynamic: {
792
824
  default: string;
793
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
825
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
794
826
  };
795
827
  dynamicScale: true;
796
828
  name: "gridTemplateRows";
797
829
  vars: {
798
830
  default: string;
799
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
831
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
800
832
  };
801
833
  };
802
834
  gridArea: {
803
835
  dynamic: {
804
836
  default: string;
805
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
837
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
806
838
  };
807
839
  dynamicScale: true;
808
840
  name: "gridArea";
809
841
  vars: {
810
842
  default: string;
811
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
843
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
812
844
  };
813
845
  };
814
846
  flexShrink: {
815
847
  dynamic: {
816
848
  default: string;
817
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
849
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
818
850
  };
819
851
  dynamicScale: true;
820
852
  name: "flexShrink";
821
853
  vars: {
822
854
  default: string;
823
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
855
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
824
856
  };
825
857
  };
826
858
  borderRadius: {
827
859
  dynamic: {
828
860
  default: string;
829
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
861
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
830
862
  };
831
863
  dynamicScale: true;
832
864
  name: "borderRadius";
833
865
  vars: {
834
866
  default: string;
835
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
867
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
836
868
  };
837
869
  };
838
870
  borderWidth: {
839
871
  dynamic: {
840
872
  default: string;
841
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
873
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
842
874
  };
843
875
  dynamicScale: true;
844
876
  name: "borderWidth";
845
877
  vars: {
846
878
  default: string;
847
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
879
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
848
880
  };
849
881
  };
850
882
  zIndex: {
851
883
  dynamic: {
852
884
  default: string;
853
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
885
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
854
886
  };
855
887
  dynamicScale: true;
856
888
  name: "zIndex";
857
889
  vars: {
858
890
  default: string;
859
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
891
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
860
892
  };
861
893
  };
862
894
  transitionDelay: {
863
895
  dynamic: {
864
896
  default: string;
865
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
897
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
866
898
  };
867
899
  dynamicScale: true;
868
900
  name: "transitionDelay";
869
901
  vars: {
870
902
  default: string;
871
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
903
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
872
904
  };
873
905
  };
874
906
  transitionProperty: {
875
907
  dynamic: {
876
908
  default: string;
877
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
909
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
878
910
  };
879
911
  dynamicScale: true;
880
912
  name: "transitionProperty";
881
913
  vars: {
882
914
  default: string;
883
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
915
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
884
916
  };
885
917
  };
886
918
  backgroundImage: {
887
919
  dynamic: {
888
920
  default: string;
889
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
921
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
890
922
  };
891
923
  dynamicScale: true;
892
924
  name: "backgroundImage";
893
925
  vars: {
894
926
  default: string;
895
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
927
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
928
+ };
929
+ };
930
+ backgroundPosition: {
931
+ dynamic: {
932
+ default: string;
933
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
934
+ };
935
+ dynamicScale: true;
936
+ name: "backgroundPosition";
937
+ vars: {
938
+ default: string;
939
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
940
+ };
941
+ };
942
+ backgroundBlendMode: {
943
+ dynamic: {
944
+ default: string;
945
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
946
+ };
947
+ dynamicScale: true;
948
+ name: "backgroundBlendMode";
949
+ vars: {
950
+ default: string;
951
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
952
+ };
953
+ };
954
+ backgroundRepeat: {
955
+ dynamic: {
956
+ default: string;
957
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
958
+ };
959
+ dynamicScale: true;
960
+ name: "backgroundRepeat";
961
+ vars: {
962
+ default: string;
963
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
964
+ };
965
+ };
966
+ backgroundSize: {
967
+ dynamic: {
968
+ default: string;
969
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
970
+ };
971
+ dynamicScale: true;
972
+ name: "backgroundSize";
973
+ vars: {
974
+ default: string;
975
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
896
976
  };
897
977
  };
898
978
  transitionDuration: {
899
979
  dynamic: {
900
980
  default: string;
901
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
981
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
902
982
  };
903
983
  dynamicScale: {
904
984
  base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -909,13 +989,13 @@ export declare const box: {
909
989
  name: "transitionDuration";
910
990
  vars: {
911
991
  default: string;
912
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
992
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
913
993
  };
914
994
  };
915
995
  backgroundColor: {
916
996
  dynamic: {
917
997
  default: string;
918
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
998
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
919
999
  };
920
1000
  dynamicScale: {
921
1001
  "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -945,13 +1025,13 @@ export declare const box: {
945
1025
  name: "backgroundColor";
946
1026
  vars: {
947
1027
  default: string;
948
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1028
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
949
1029
  };
950
1030
  };
951
1031
  borderColor: {
952
1032
  dynamic: {
953
1033
  default: string;
954
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1034
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
955
1035
  };
956
1036
  dynamicScale: {
957
1037
  "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -974,13 +1054,13 @@ export declare const box: {
974
1054
  name: "borderColor";
975
1055
  vars: {
976
1056
  default: string;
977
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1057
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
978
1058
  };
979
1059
  };
980
1060
  boxShadow: {
981
1061
  dynamic: {
982
1062
  default: string;
983
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1063
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
984
1064
  };
985
1065
  dynamicScale: {
986
1066
  card: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -991,13 +1071,13 @@ export declare const box: {
991
1071
  name: "boxShadow";
992
1072
  vars: {
993
1073
  default: string;
994
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1074
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
995
1075
  };
996
1076
  };
997
1077
  padding: {
998
1078
  dynamic: {
999
1079
  default: string;
1000
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1080
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1001
1081
  };
1002
1082
  dynamicScale: {
1003
1083
  none: string;
@@ -1018,13 +1098,13 @@ export declare const box: {
1018
1098
  name: "padding";
1019
1099
  vars: {
1020
1100
  default: string;
1021
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1101
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1022
1102
  };
1023
1103
  };
1024
1104
  paddingTop: {
1025
1105
  dynamic: {
1026
1106
  default: string;
1027
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1107
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1028
1108
  };
1029
1109
  dynamicScale: {
1030
1110
  none: string;
@@ -1045,13 +1125,13 @@ export declare const box: {
1045
1125
  name: "paddingTop";
1046
1126
  vars: {
1047
1127
  default: string;
1048
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1128
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1049
1129
  };
1050
1130
  };
1051
1131
  paddingBottom: {
1052
1132
  dynamic: {
1053
1133
  default: string;
1054
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1134
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1055
1135
  };
1056
1136
  dynamicScale: {
1057
1137
  none: string;
@@ -1072,13 +1152,13 @@ export declare const box: {
1072
1152
  name: "paddingBottom";
1073
1153
  vars: {
1074
1154
  default: string;
1075
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1155
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1076
1156
  };
1077
1157
  };
1078
1158
  paddingLeft: {
1079
1159
  dynamic: {
1080
1160
  default: string;
1081
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1161
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1082
1162
  };
1083
1163
  dynamicScale: {
1084
1164
  none: string;
@@ -1099,13 +1179,13 @@ export declare const box: {
1099
1179
  name: "paddingLeft";
1100
1180
  vars: {
1101
1181
  default: string;
1102
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1182
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1103
1183
  };
1104
1184
  };
1105
1185
  paddingRight: {
1106
1186
  dynamic: {
1107
1187
  default: string;
1108
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1188
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1109
1189
  };
1110
1190
  dynamicScale: {
1111
1191
  none: string;
@@ -1126,13 +1206,13 @@ export declare const box: {
1126
1206
  name: "paddingRight";
1127
1207
  vars: {
1128
1208
  default: string;
1129
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1209
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1130
1210
  };
1131
1211
  };
1132
1212
  margin: {
1133
1213
  dynamic: {
1134
1214
  default: string;
1135
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1215
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1136
1216
  };
1137
1217
  dynamicScale: {
1138
1218
  none: string;
@@ -1154,13 +1234,13 @@ export declare const box: {
1154
1234
  name: "margin";
1155
1235
  vars: {
1156
1236
  default: string;
1157
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1237
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1158
1238
  };
1159
1239
  };
1160
1240
  marginTop: {
1161
1241
  dynamic: {
1162
1242
  default: string;
1163
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1243
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1164
1244
  };
1165
1245
  dynamicScale: {
1166
1246
  none: string;
@@ -1182,13 +1262,13 @@ export declare const box: {
1182
1262
  name: "marginTop";
1183
1263
  vars: {
1184
1264
  default: string;
1185
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1265
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1186
1266
  };
1187
1267
  };
1188
1268
  marginBottom: {
1189
1269
  dynamic: {
1190
1270
  default: string;
1191
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1271
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1192
1272
  };
1193
1273
  dynamicScale: {
1194
1274
  none: string;
@@ -1210,13 +1290,13 @@ export declare const box: {
1210
1290
  name: "marginBottom";
1211
1291
  vars: {
1212
1292
  default: string;
1213
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1293
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1214
1294
  };
1215
1295
  };
1216
1296
  marginLeft: {
1217
1297
  dynamic: {
1218
1298
  default: string;
1219
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1299
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1220
1300
  };
1221
1301
  dynamicScale: {
1222
1302
  none: string;
@@ -1238,13 +1318,13 @@ export declare const box: {
1238
1318
  name: "marginLeft";
1239
1319
  vars: {
1240
1320
  default: string;
1241
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1321
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1242
1322
  };
1243
1323
  };
1244
1324
  marginRight: {
1245
1325
  dynamic: {
1246
1326
  default: string;
1247
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1327
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1248
1328
  };
1249
1329
  dynamicScale: {
1250
1330
  none: string;
@@ -1266,13 +1346,13 @@ export declare const box: {
1266
1346
  name: "marginRight";
1267
1347
  vars: {
1268
1348
  default: string;
1269
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1349
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1270
1350
  };
1271
1351
  };
1272
1352
  gap: {
1273
1353
  dynamic: {
1274
1354
  default: string;
1275
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1355
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1276
1356
  };
1277
1357
  dynamicScale: {
1278
1358
  none: string;
@@ -1294,13 +1374,13 @@ export declare const box: {
1294
1374
  name: "gap";
1295
1375
  vars: {
1296
1376
  default: string;
1297
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1377
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1298
1378
  };
1299
1379
  };
1300
1380
  gridGap: {
1301
1381
  dynamic: {
1302
1382
  default: string;
1303
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1383
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1304
1384
  };
1305
1385
  dynamicScale: {
1306
1386
  none: string;
@@ -1322,7 +1402,44 @@ export declare const box: {
1322
1402
  name: "gridGap";
1323
1403
  vars: {
1324
1404
  default: string;
1325
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1405
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1406
+ };
1407
+ };
1408
+ color: {
1409
+ dynamic: {
1410
+ default: string;
1411
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1412
+ };
1413
+ dynamicScale: {
1414
+ currentColor: string;
1415
+ "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1416
+ "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1417
+ "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1418
+ "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1419
+ "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1420
+ "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1421
+ "success.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1422
+ "success.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1423
+ "warning.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1424
+ "warning.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1425
+ "warning.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1426
+ "warning.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1427
+ "danger.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1428
+ "danger.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1429
+ "danger.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1430
+ "danger.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1431
+ "neutral.background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1432
+ "neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1433
+ "neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1434
+ "neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1435
+ "neutral.surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1436
+ "neutral.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1437
+ transparent: string;
1438
+ };
1439
+ name: "color";
1440
+ vars: {
1441
+ default: string;
1442
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1326
1443
  };
1327
1444
  };
1328
1445
  };
@@ -1528,6 +1645,32 @@ export declare const box: {
1528
1645
  slower: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1529
1646
  };
1530
1647
  transitionTimingFunction: TransitionTiming[];
1648
+ color: {
1649
+ currentColor: string;
1650
+ "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1651
+ "primary.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1652
+ "primary.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1653
+ "primary.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1654
+ "success.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1655
+ "success.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1656
+ "success.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1657
+ "success.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1658
+ "warning.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1659
+ "warning.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1660
+ "warning.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1661
+ "warning.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1662
+ "danger.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1663
+ "danger.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1664
+ "danger.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1665
+ "danger.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1666
+ "neutral.background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1667
+ "neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1668
+ "neutral.surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1669
+ "neutral.surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1670
+ "neutral.surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1671
+ "neutral.textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
1672
+ transparent: string;
1673
+ };
1531
1674
  };
1532
1675
  };
1533
1676
  export declare const button: {
@@ -1666,7 +1809,7 @@ export declare const iconButton: {
1666
1809
  backgroundColor: {
1667
1810
  dynamic: {
1668
1811
  default: string;
1669
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1812
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1670
1813
  };
1671
1814
  dynamicScale: {
1672
1815
  transparent: string;
@@ -1677,13 +1820,13 @@ export declare const iconButton: {
1677
1820
  name: "backgroundColor";
1678
1821
  vars: {
1679
1822
  default: string;
1680
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1823
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1681
1824
  };
1682
1825
  };
1683
1826
  borderColor: {
1684
1827
  dynamic: {
1685
1828
  default: string;
1686
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1829
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1687
1830
  };
1688
1831
  dynamicScale: {
1689
1832
  "neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -1697,31 +1840,31 @@ export declare const iconButton: {
1697
1840
  name: "borderColor";
1698
1841
  vars: {
1699
1842
  default: string;
1700
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1843
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1701
1844
  };
1702
1845
  };
1703
1846
  width: {
1704
1847
  dynamic: {
1705
1848
  default: string;
1706
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1849
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1707
1850
  };
1708
1851
  dynamicScale: true;
1709
1852
  name: "width";
1710
1853
  vars: {
1711
1854
  default: string;
1712
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1855
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1713
1856
  };
1714
1857
  };
1715
1858
  height: {
1716
1859
  dynamic: {
1717
1860
  default: string;
1718
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1861
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1719
1862
  };
1720
1863
  dynamicScale: true;
1721
1864
  name: "height";
1722
1865
  vars: {
1723
1866
  default: string;
1724
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1867
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1725
1868
  };
1726
1869
  };
1727
1870
  };
@@ -2111,14 +2254,25 @@ export declare const toggle: {
2111
2254
  export declare const link: {
2112
2255
  sprinkle: ((props: {
2113
2256
  textDecoration?: TextDecoration | undefined;
2257
+ fontSize?: "caption" | "base" | "highlight" | undefined;
2258
+ lineHeight?: "caption" | "base" | "highlight" | undefined;
2114
2259
  }) => string) & {
2115
- properties: Set<"textDecoration">;
2260
+ properties: Set<"fontSize" | "lineHeight" | "textDecoration">;
2116
2261
  };
2117
2262
  properties: {
2118
2263
  textDecoration: TextDecoration[];
2264
+ fontSize: {
2265
+ caption: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2266
+ base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2267
+ highlight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2268
+ };
2269
+ lineHeight: {
2270
+ readonly caption: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2271
+ readonly base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2272
+ readonly highlight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2273
+ };
2119
2274
  };
2120
2275
  classnames: {
2121
- size: Record<"caption" | "base" | "highlight", string>;
2122
2276
  appearance: Record<"primary" | "danger" | "neutral" | "neutral.background", string>;
2123
2277
  };
2124
2278
  };
@@ -2238,19 +2392,19 @@ export declare const modal: {
2238
2392
  maxWidth: {
2239
2393
  dynamic: {
2240
2394
  default: string;
2241
- conditions: Record<"xs" | "md" | "lg", string>;
2395
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2242
2396
  };
2243
2397
  dynamicScale: true;
2244
2398
  name: "maxWidth";
2245
2399
  vars: {
2246
2400
  default: string;
2247
- conditions: Record<"xs" | "md" | "lg", string>;
2401
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2248
2402
  };
2249
2403
  };
2250
2404
  padding: {
2251
2405
  dynamic: {
2252
2406
  default: string;
2253
- conditions: Record<"xs" | "md" | "lg", string>;
2407
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2254
2408
  };
2255
2409
  dynamicScale: {
2256
2410
  base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -2260,7 +2414,7 @@ export declare const modal: {
2260
2414
  name: "padding";
2261
2415
  vars: {
2262
2416
  default: string;
2263
- conditions: Record<"xs" | "md" | "lg", string>;
2417
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2264
2418
  };
2265
2419
  };
2266
2420
  };
@@ -2301,15 +2455,15 @@ declare const sidebarSprinkle: {
2301
2455
  values: {
2302
2456
  base: {
2303
2457
  default: string;
2304
- conditions: Record<"xs" | "md" | "lg", string>;
2458
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2305
2459
  };
2306
2460
  small: {
2307
2461
  default: string;
2308
- conditions: Record<"xs" | "md" | "lg", string>;
2462
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2309
2463
  };
2310
2464
  none: {
2311
2465
  default: string;
2312
- conditions: Record<"xs" | "md" | "lg", string>;
2466
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2313
2467
  };
2314
2468
  };
2315
2469
  staticScale: {
@@ -2325,25 +2479,25 @@ declare const sidebarSprinkle: {
2325
2479
  maxWidth: {
2326
2480
  dynamic: {
2327
2481
  default: string;
2328
- conditions: Record<"xs" | "md" | "lg", string>;
2482
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2329
2483
  };
2330
2484
  dynamicScale: true;
2331
2485
  name: "maxWidth";
2332
2486
  vars: {
2333
2487
  default: string;
2334
- conditions: Record<"xs" | "md" | "lg", string>;
2488
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2335
2489
  };
2336
2490
  };
2337
2491
  zIndex: {
2338
2492
  dynamic: {
2339
2493
  default: string;
2340
- conditions: Record<"xs" | "md" | "lg", string>;
2494
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2341
2495
  };
2342
2496
  dynamicScale: true;
2343
2497
  name: "zIndex";
2344
2498
  vars: {
2345
2499
  default: string;
2346
- conditions: Record<"xs" | "md" | "lg", string>;
2500
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2347
2501
  };
2348
2502
  };
2349
2503
  };
@@ -2377,15 +2531,15 @@ export declare const sidebar: {
2377
2531
  values: {
2378
2532
  base: {
2379
2533
  default: string;
2380
- conditions: Record<"xs" | "md" | "lg", string>;
2534
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2381
2535
  };
2382
2536
  small: {
2383
2537
  default: string;
2384
- conditions: Record<"xs" | "md" | "lg", string>;
2538
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2385
2539
  };
2386
2540
  none: {
2387
2541
  default: string;
2388
- conditions: Record<"xs" | "md" | "lg", string>;
2542
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2389
2543
  };
2390
2544
  };
2391
2545
  staticScale: {
@@ -2401,25 +2555,25 @@ export declare const sidebar: {
2401
2555
  maxWidth: {
2402
2556
  dynamic: {
2403
2557
  default: string;
2404
- conditions: Record<"xs" | "md" | "lg", string>;
2558
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2405
2559
  };
2406
2560
  dynamicScale: true;
2407
2561
  name: "maxWidth";
2408
2562
  vars: {
2409
2563
  default: string;
2410
- conditions: Record<"xs" | "md" | "lg", string>;
2564
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2411
2565
  };
2412
2566
  };
2413
2567
  zIndex: {
2414
2568
  dynamic: {
2415
2569
  default: string;
2416
- conditions: Record<"xs" | "md" | "lg", string>;
2570
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2417
2571
  };
2418
2572
  dynamicScale: true;
2419
2573
  name: "zIndex";
2420
2574
  vars: {
2421
2575
  default: string;
2422
- conditions: Record<"xs" | "md" | "lg", string>;
2576
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2423
2577
  };
2424
2578
  };
2425
2579
  };
@@ -2480,10 +2634,10 @@ export interface TableConditions<T> extends Conditions<T> {
2480
2634
  hover?: T;
2481
2635
  }
2482
2636
  export interface TableSprinkle {
2483
- padding?: TablePaddingProperties;
2484
- width?: string;
2485
- maxWidth?: string;
2486
- minWidth?: string;
2637
+ padding?: TablePaddingProperties | TableConditions<TablePaddingProperties>;
2638
+ width?: string | TableConditions<string>;
2639
+ maxWidth?: string | TableConditions<string>;
2640
+ minWidth?: string | TableConditions<string>;
2487
2641
  backgroundColor?: TableRowBackgroundColorProperties | TableConditions<TableRowBackgroundColorProperties>;
2488
2642
  }
2489
2643
  export declare const table: {
@@ -2495,43 +2649,43 @@ export declare const table: {
2495
2649
  width: {
2496
2650
  dynamic: {
2497
2651
  default: string;
2498
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2652
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2499
2653
  };
2500
2654
  dynamicScale: true;
2501
2655
  name: "width";
2502
2656
  vars: {
2503
2657
  default: string;
2504
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2658
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2505
2659
  };
2506
2660
  };
2507
2661
  maxWidth: {
2508
2662
  dynamic: {
2509
2663
  default: string;
2510
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2664
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2511
2665
  };
2512
2666
  dynamicScale: true;
2513
2667
  name: "maxWidth";
2514
2668
  vars: {
2515
2669
  default: string;
2516
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2670
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2517
2671
  };
2518
2672
  };
2519
2673
  minWidth: {
2520
2674
  dynamic: {
2521
2675
  default: string;
2522
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2676
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2523
2677
  };
2524
2678
  dynamicScale: true;
2525
2679
  name: "minWidth";
2526
2680
  vars: {
2527
2681
  default: string;
2528
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2682
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2529
2683
  };
2530
2684
  };
2531
2685
  backgroundColor: {
2532
2686
  dynamic: {
2533
2687
  default: string;
2534
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2688
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2535
2689
  };
2536
2690
  dynamicScale: {
2537
2691
  transparent: string;
@@ -2544,13 +2698,13 @@ export declare const table: {
2544
2698
  name: "backgroundColor";
2545
2699
  vars: {
2546
2700
  default: string;
2547
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2701
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2548
2702
  };
2549
2703
  };
2550
2704
  padding: {
2551
2705
  dynamic: {
2552
2706
  default: string;
2553
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2707
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2554
2708
  };
2555
2709
  dynamicScale: {
2556
2710
  base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -2560,7 +2714,7 @@ export declare const table: {
2560
2714
  name: "padding";
2561
2715
  vars: {
2562
2716
  default: string;
2563
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2717
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2564
2718
  };
2565
2719
  };
2566
2720
  };