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

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 +3 -1
  2. package/dist/index.css +1699 -1157
  3. package/dist/index.d.ts +252 -189
  4. package/dist/index.js +1 -1
  5. package/package.json +2 -2
package/dist/index.d.ts CHANGED
@@ -255,6 +255,10 @@ export interface BoxSprinkle {
255
255
  transitionDuration?: TransitionDurationProperties | BoxConditions<TransitionDurationProperties>;
256
256
  zIndex?: number | BoxConditions<number>;
257
257
  backgroundImage?: string | BoxConditions<string>;
258
+ backgroundPosition?: string | BoxConditions<string>;
259
+ backgroundBlendMode?: string | BoxConditions<string>;
260
+ backgroundRepeat?: string | BoxConditions<string>;
261
+ backgroundSize?: string | BoxConditions<string>;
258
262
  }
259
263
  export declare const box: {
260
264
  sprinkle: import("rainbow-sprinkles/dist/declarations/src/createRuntimeFn").SprinklesFn<[
@@ -264,27 +268,27 @@ export declare const box: {
264
268
  values: {
265
269
  grid: {
266
270
  default: string;
267
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
271
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
268
272
  };
269
273
  none: {
270
274
  default: string;
271
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
275
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
272
276
  };
273
277
  flex: {
274
278
  default: string;
275
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
279
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
276
280
  };
277
281
  block: {
278
282
  default: string;
279
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
283
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
280
284
  };
281
285
  "inline-flex": {
282
286
  default: string;
283
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
287
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
284
288
  };
285
289
  "inline-grid": {
286
290
  default: string;
287
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
291
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
288
292
  };
289
293
  };
290
294
  staticScale: Display[];
@@ -294,19 +298,19 @@ export declare const box: {
294
298
  values: {
295
299
  row: {
296
300
  default: string;
297
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
301
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
298
302
  };
299
303
  column: {
300
304
  default: string;
301
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
305
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
302
306
  };
303
307
  "column-reverse": {
304
308
  default: string;
305
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
309
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
306
310
  };
307
311
  "row-reverse": {
308
312
  default: string;
309
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
313
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
310
314
  };
311
315
  };
312
316
  staticScale: FlexDirection[];
@@ -316,15 +320,15 @@ export declare const box: {
316
320
  values: {
317
321
  nowrap: {
318
322
  default: string;
319
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
323
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
320
324
  };
321
325
  wrap: {
322
326
  default: string;
323
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
327
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
324
328
  };
325
329
  "wrap-reverse": {
326
330
  default: string;
327
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
331
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
328
332
  };
329
333
  };
330
334
  staticScale: FlexWrap[];
@@ -334,27 +338,27 @@ export declare const box: {
334
338
  values: {
335
339
  center: {
336
340
  default: string;
337
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
341
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
338
342
  };
339
343
  "flex-end": {
340
344
  default: string;
341
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
345
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
342
346
  };
343
347
  "flex-start": {
344
348
  default: string;
345
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
349
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
346
350
  };
347
351
  "space-around": {
348
352
  default: string;
349
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
353
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
350
354
  };
351
355
  "space-between": {
352
356
  default: string;
353
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
357
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
354
358
  };
355
359
  "space-evenly": {
356
360
  default: string;
357
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
361
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
358
362
  };
359
363
  };
360
364
  staticScale: JustifyContent[];
@@ -364,23 +368,23 @@ export declare const box: {
364
368
  values: {
365
369
  center: {
366
370
  default: string;
367
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
371
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
368
372
  };
369
373
  "flex-end": {
370
374
  default: string;
371
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
375
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
372
376
  };
373
377
  "flex-start": {
374
378
  default: string;
375
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
379
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
376
380
  };
377
381
  baseline: {
378
382
  default: string;
379
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
383
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
380
384
  };
381
385
  stretch: {
382
386
  default: string;
383
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
387
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
384
388
  };
385
389
  };
386
390
  staticScale: AlignItems[];
@@ -390,47 +394,47 @@ export declare const box: {
390
394
  values: {
391
395
  inherit: {
392
396
  default: string;
393
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
397
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
394
398
  };
395
399
  none: {
396
400
  default: string;
397
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
401
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
398
402
  };
399
403
  all: {
400
404
  default: string;
401
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
405
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
402
406
  };
403
407
  fill: {
404
408
  default: string;
405
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
409
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
406
410
  };
407
411
  stroke: {
408
412
  default: string;
409
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
413
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
410
414
  };
411
415
  auto: {
412
416
  default: string;
413
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
417
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
414
418
  };
415
419
  visible: {
416
420
  default: string;
417
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
421
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
418
422
  };
419
423
  painted: {
420
424
  default: string;
421
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
425
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
422
426
  };
423
427
  visibleFill: {
424
428
  default: string;
425
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
429
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
426
430
  };
427
431
  visiblePainted: {
428
432
  default: string;
429
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
433
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
430
434
  };
431
435
  visibleStroke: {
432
436
  default: string;
433
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
437
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
434
438
  };
435
439
  };
436
440
  staticScale: PointerEvents[];
@@ -440,23 +444,23 @@ export declare const box: {
440
444
  values: {
441
445
  hidden: {
442
446
  default: string;
443
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
447
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
444
448
  };
445
449
  none: {
446
450
  default: string;
447
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
451
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
448
452
  };
449
453
  dashed: {
450
454
  default: string;
451
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
455
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
452
456
  };
453
457
  dotted: {
454
458
  default: string;
455
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
459
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
456
460
  };
457
461
  solid: {
458
462
  default: string;
459
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
463
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
460
464
  };
461
465
  };
462
466
  staticScale: BorderStyle[];
@@ -466,11 +470,11 @@ export declare const box: {
466
470
  values: {
467
471
  "border-box": {
468
472
  default: string;
469
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
473
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
470
474
  };
471
475
  "content-box": {
472
476
  default: string;
473
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
477
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
474
478
  };
475
479
  };
476
480
  staticScale: BoxSizing[];
@@ -480,23 +484,23 @@ export declare const box: {
480
484
  values: {
481
485
  inherit: {
482
486
  default: string;
483
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
487
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
484
488
  };
485
489
  auto: {
486
490
  default: string;
487
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
491
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
488
492
  };
489
493
  grab: {
490
494
  default: string;
491
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
495
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
492
496
  };
493
497
  "not-allowed": {
494
498
  default: string;
495
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
499
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
496
500
  };
497
501
  pointer: {
498
502
  default: string;
499
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
503
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
500
504
  };
501
505
  };
502
506
  staticScale: Cursor[];
@@ -506,23 +510,23 @@ export declare const box: {
506
510
  values: {
507
511
  fixed: {
508
512
  default: string;
509
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
513
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
510
514
  };
511
515
  absolute: {
512
516
  default: string;
513
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
517
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
514
518
  };
515
519
  relative: {
516
520
  default: string;
517
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
521
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
518
522
  };
519
523
  static: {
520
524
  default: string;
521
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
525
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
522
526
  };
523
527
  sticky: {
524
528
  default: string;
525
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
529
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
526
530
  };
527
531
  };
528
532
  staticScale: Position[];
@@ -532,19 +536,19 @@ export declare const box: {
532
536
  values: {
533
537
  hidden: {
534
538
  default: string;
535
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
539
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
536
540
  };
537
541
  auto: {
538
542
  default: string;
539
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
543
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
540
544
  };
541
545
  visible: {
542
546
  default: string;
543
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
547
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
544
548
  };
545
549
  scroll: {
546
550
  default: string;
547
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
551
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
548
552
  };
549
553
  };
550
554
  staticScale: Overflow[];
@@ -554,19 +558,19 @@ export declare const box: {
554
558
  values: {
555
559
  hidden: {
556
560
  default: string;
557
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
561
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
558
562
  };
559
563
  auto: {
560
564
  default: string;
561
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
565
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
562
566
  };
563
567
  visible: {
564
568
  default: string;
565
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
569
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
566
570
  };
567
571
  scroll: {
568
572
  default: string;
569
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
573
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
570
574
  };
571
575
  };
572
576
  staticScale: Overflow[];
@@ -576,19 +580,19 @@ export declare const box: {
576
580
  values: {
577
581
  hidden: {
578
582
  default: string;
579
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
583
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
580
584
  };
581
585
  auto: {
582
586
  default: string;
583
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
587
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
584
588
  };
585
589
  visible: {
586
590
  default: string;
587
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
591
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
588
592
  };
589
593
  scroll: {
590
594
  default: string;
591
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
595
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
592
596
  };
593
597
  };
594
598
  staticScale: Overflow[];
@@ -598,31 +602,31 @@ export declare const box: {
598
602
  values: {
599
603
  ease: {
600
604
  default: string;
601
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
605
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
602
606
  };
603
607
  "ease-in": {
604
608
  default: string;
605
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
609
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
606
610
  };
607
611
  "ease-in-out": {
608
612
  default: string;
609
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
613
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
610
614
  };
611
615
  "ease-out": {
612
616
  default: string;
613
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
617
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
614
618
  };
615
619
  "step-end": {
616
620
  default: string;
617
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
621
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
618
622
  };
619
623
  "step-start": {
620
624
  default: string;
621
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
625
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
622
626
  };
623
627
  linear: {
624
628
  default: string;
625
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
629
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
626
630
  };
627
631
  };
628
632
  staticScale: TransitionTiming[];
@@ -634,271 +638,319 @@ export declare const box: {
634
638
  width: {
635
639
  dynamic: {
636
640
  default: string;
637
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
641
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
638
642
  };
639
643
  dynamicScale: true;
640
644
  name: "width";
641
645
  vars: {
642
646
  default: string;
643
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
647
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
644
648
  };
645
649
  };
646
650
  height: {
647
651
  dynamic: {
648
652
  default: string;
649
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
653
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
650
654
  };
651
655
  dynamicScale: true;
652
656
  name: "height";
653
657
  vars: {
654
658
  default: string;
655
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
659
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
656
660
  };
657
661
  };
658
662
  maxWidth: {
659
663
  dynamic: {
660
664
  default: string;
661
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
665
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
662
666
  };
663
667
  dynamicScale: true;
664
668
  name: "maxWidth";
665
669
  vars: {
666
670
  default: string;
667
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
671
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
668
672
  };
669
673
  };
670
674
  maxHeight: {
671
675
  dynamic: {
672
676
  default: string;
673
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
677
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
674
678
  };
675
679
  dynamicScale: true;
676
680
  name: "maxHeight";
677
681
  vars: {
678
682
  default: string;
679
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
683
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
680
684
  };
681
685
  };
682
686
  minWidth: {
683
687
  dynamic: {
684
688
  default: string;
685
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
689
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
686
690
  };
687
691
  dynamicScale: true;
688
692
  name: "minWidth";
689
693
  vars: {
690
694
  default: string;
691
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
695
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
692
696
  };
693
697
  };
694
698
  minHeight: {
695
699
  dynamic: {
696
700
  default: string;
697
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
701
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
698
702
  };
699
703
  dynamicScale: true;
700
704
  name: "minHeight";
701
705
  vars: {
702
706
  default: string;
703
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
707
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
704
708
  };
705
709
  };
706
710
  bottom: {
707
711
  dynamic: {
708
712
  default: string;
709
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
713
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
710
714
  };
711
715
  dynamicScale: true;
712
716
  name: "bottom";
713
717
  vars: {
714
718
  default: string;
715
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
719
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
716
720
  };
717
721
  };
718
722
  left: {
719
723
  dynamic: {
720
724
  default: string;
721
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
725
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
722
726
  };
723
727
  dynamicScale: true;
724
728
  name: "left";
725
729
  vars: {
726
730
  default: string;
727
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
731
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
728
732
  };
729
733
  };
730
734
  right: {
731
735
  dynamic: {
732
736
  default: string;
733
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
737
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
734
738
  };
735
739
  dynamicScale: true;
736
740
  name: "right";
737
741
  vars: {
738
742
  default: string;
739
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
743
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
740
744
  };
741
745
  };
742
746
  top: {
743
747
  dynamic: {
744
748
  default: string;
745
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
749
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
746
750
  };
747
751
  dynamicScale: true;
748
752
  name: "top";
749
753
  vars: {
750
754
  default: string;
751
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
755
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
752
756
  };
753
757
  };
754
758
  flex: {
755
759
  dynamic: {
756
760
  default: string;
757
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
761
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
758
762
  };
759
763
  dynamicScale: true;
760
764
  name: "flex";
761
765
  vars: {
762
766
  default: string;
763
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
767
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
764
768
  };
765
769
  };
766
770
  gridTemplateAreas: {
767
771
  dynamic: {
768
772
  default: string;
769
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
773
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
770
774
  };
771
775
  dynamicScale: true;
772
776
  name: "gridTemplateAreas";
773
777
  vars: {
774
778
  default: string;
775
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
779
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
776
780
  };
777
781
  };
778
782
  gridTemplateColumns: {
779
783
  dynamic: {
780
784
  default: string;
781
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
785
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
782
786
  };
783
787
  dynamicScale: true;
784
788
  name: "gridTemplateColumns";
785
789
  vars: {
786
790
  default: string;
787
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
791
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
788
792
  };
789
793
  };
790
794
  gridTemplateRows: {
791
795
  dynamic: {
792
796
  default: string;
793
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
797
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
794
798
  };
795
799
  dynamicScale: true;
796
800
  name: "gridTemplateRows";
797
801
  vars: {
798
802
  default: string;
799
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
803
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
800
804
  };
801
805
  };
802
806
  gridArea: {
803
807
  dynamic: {
804
808
  default: string;
805
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
809
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
806
810
  };
807
811
  dynamicScale: true;
808
812
  name: "gridArea";
809
813
  vars: {
810
814
  default: string;
811
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
815
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
812
816
  };
813
817
  };
814
818
  flexShrink: {
815
819
  dynamic: {
816
820
  default: string;
817
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
821
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
818
822
  };
819
823
  dynamicScale: true;
820
824
  name: "flexShrink";
821
825
  vars: {
822
826
  default: string;
823
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
827
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
824
828
  };
825
829
  };
826
830
  borderRadius: {
827
831
  dynamic: {
828
832
  default: string;
829
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
833
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
830
834
  };
831
835
  dynamicScale: true;
832
836
  name: "borderRadius";
833
837
  vars: {
834
838
  default: string;
835
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
839
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
836
840
  };
837
841
  };
838
842
  borderWidth: {
839
843
  dynamic: {
840
844
  default: string;
841
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
845
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
842
846
  };
843
847
  dynamicScale: true;
844
848
  name: "borderWidth";
845
849
  vars: {
846
850
  default: string;
847
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
851
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
848
852
  };
849
853
  };
850
854
  zIndex: {
851
855
  dynamic: {
852
856
  default: string;
853
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
857
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
854
858
  };
855
859
  dynamicScale: true;
856
860
  name: "zIndex";
857
861
  vars: {
858
862
  default: string;
859
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
863
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
860
864
  };
861
865
  };
862
866
  transitionDelay: {
863
867
  dynamic: {
864
868
  default: string;
865
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
869
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
866
870
  };
867
871
  dynamicScale: true;
868
872
  name: "transitionDelay";
869
873
  vars: {
870
874
  default: string;
871
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
875
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
872
876
  };
873
877
  };
874
878
  transitionProperty: {
875
879
  dynamic: {
876
880
  default: string;
877
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
881
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
878
882
  };
879
883
  dynamicScale: true;
880
884
  name: "transitionProperty";
881
885
  vars: {
882
886
  default: string;
883
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
887
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
884
888
  };
885
889
  };
886
890
  backgroundImage: {
887
891
  dynamic: {
888
892
  default: string;
889
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
893
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
890
894
  };
891
895
  dynamicScale: true;
892
896
  name: "backgroundImage";
893
897
  vars: {
894
898
  default: string;
895
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
899
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
900
+ };
901
+ };
902
+ backgroundPosition: {
903
+ dynamic: {
904
+ default: string;
905
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
906
+ };
907
+ dynamicScale: true;
908
+ name: "backgroundPosition";
909
+ vars: {
910
+ default: string;
911
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
912
+ };
913
+ };
914
+ backgroundBlendMode: {
915
+ dynamic: {
916
+ default: string;
917
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
918
+ };
919
+ dynamicScale: true;
920
+ name: "backgroundBlendMode";
921
+ vars: {
922
+ default: string;
923
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
924
+ };
925
+ };
926
+ backgroundRepeat: {
927
+ dynamic: {
928
+ default: string;
929
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
930
+ };
931
+ dynamicScale: true;
932
+ name: "backgroundRepeat";
933
+ vars: {
934
+ default: string;
935
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
936
+ };
937
+ };
938
+ backgroundSize: {
939
+ dynamic: {
940
+ default: string;
941
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
942
+ };
943
+ dynamicScale: true;
944
+ name: "backgroundSize";
945
+ vars: {
946
+ default: string;
947
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
896
948
  };
897
949
  };
898
950
  transitionDuration: {
899
951
  dynamic: {
900
952
  default: string;
901
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
953
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
902
954
  };
903
955
  dynamicScale: {
904
956
  base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -909,13 +961,13 @@ export declare const box: {
909
961
  name: "transitionDuration";
910
962
  vars: {
911
963
  default: string;
912
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
964
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
913
965
  };
914
966
  };
915
967
  backgroundColor: {
916
968
  dynamic: {
917
969
  default: string;
918
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
970
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
919
971
  };
920
972
  dynamicScale: {
921
973
  "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -945,13 +997,13 @@ export declare const box: {
945
997
  name: "backgroundColor";
946
998
  vars: {
947
999
  default: string;
948
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1000
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
949
1001
  };
950
1002
  };
951
1003
  borderColor: {
952
1004
  dynamic: {
953
1005
  default: string;
954
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1006
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
955
1007
  };
956
1008
  dynamicScale: {
957
1009
  "primary.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -974,13 +1026,13 @@ export declare const box: {
974
1026
  name: "borderColor";
975
1027
  vars: {
976
1028
  default: string;
977
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1029
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
978
1030
  };
979
1031
  };
980
1032
  boxShadow: {
981
1033
  dynamic: {
982
1034
  default: string;
983
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1035
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
984
1036
  };
985
1037
  dynamicScale: {
986
1038
  card: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -991,13 +1043,13 @@ export declare const box: {
991
1043
  name: "boxShadow";
992
1044
  vars: {
993
1045
  default: string;
994
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1046
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
995
1047
  };
996
1048
  };
997
1049
  padding: {
998
1050
  dynamic: {
999
1051
  default: string;
1000
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1052
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1001
1053
  };
1002
1054
  dynamicScale: {
1003
1055
  none: string;
@@ -1018,13 +1070,13 @@ export declare const box: {
1018
1070
  name: "padding";
1019
1071
  vars: {
1020
1072
  default: string;
1021
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1073
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1022
1074
  };
1023
1075
  };
1024
1076
  paddingTop: {
1025
1077
  dynamic: {
1026
1078
  default: string;
1027
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1079
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1028
1080
  };
1029
1081
  dynamicScale: {
1030
1082
  none: string;
@@ -1045,13 +1097,13 @@ export declare const box: {
1045
1097
  name: "paddingTop";
1046
1098
  vars: {
1047
1099
  default: string;
1048
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1100
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1049
1101
  };
1050
1102
  };
1051
1103
  paddingBottom: {
1052
1104
  dynamic: {
1053
1105
  default: string;
1054
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1106
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1055
1107
  };
1056
1108
  dynamicScale: {
1057
1109
  none: string;
@@ -1072,13 +1124,13 @@ export declare const box: {
1072
1124
  name: "paddingBottom";
1073
1125
  vars: {
1074
1126
  default: string;
1075
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1127
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1076
1128
  };
1077
1129
  };
1078
1130
  paddingLeft: {
1079
1131
  dynamic: {
1080
1132
  default: string;
1081
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1133
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1082
1134
  };
1083
1135
  dynamicScale: {
1084
1136
  none: string;
@@ -1099,13 +1151,13 @@ export declare const box: {
1099
1151
  name: "paddingLeft";
1100
1152
  vars: {
1101
1153
  default: string;
1102
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1154
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1103
1155
  };
1104
1156
  };
1105
1157
  paddingRight: {
1106
1158
  dynamic: {
1107
1159
  default: string;
1108
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1160
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1109
1161
  };
1110
1162
  dynamicScale: {
1111
1163
  none: string;
@@ -1126,13 +1178,13 @@ export declare const box: {
1126
1178
  name: "paddingRight";
1127
1179
  vars: {
1128
1180
  default: string;
1129
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1181
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1130
1182
  };
1131
1183
  };
1132
1184
  margin: {
1133
1185
  dynamic: {
1134
1186
  default: string;
1135
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1187
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1136
1188
  };
1137
1189
  dynamicScale: {
1138
1190
  none: string;
@@ -1154,13 +1206,13 @@ export declare const box: {
1154
1206
  name: "margin";
1155
1207
  vars: {
1156
1208
  default: string;
1157
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1209
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1158
1210
  };
1159
1211
  };
1160
1212
  marginTop: {
1161
1213
  dynamic: {
1162
1214
  default: string;
1163
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1215
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1164
1216
  };
1165
1217
  dynamicScale: {
1166
1218
  none: string;
@@ -1182,13 +1234,13 @@ export declare const box: {
1182
1234
  name: "marginTop";
1183
1235
  vars: {
1184
1236
  default: string;
1185
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1237
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1186
1238
  };
1187
1239
  };
1188
1240
  marginBottom: {
1189
1241
  dynamic: {
1190
1242
  default: string;
1191
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1243
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1192
1244
  };
1193
1245
  dynamicScale: {
1194
1246
  none: string;
@@ -1210,13 +1262,13 @@ export declare const box: {
1210
1262
  name: "marginBottom";
1211
1263
  vars: {
1212
1264
  default: string;
1213
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1265
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1214
1266
  };
1215
1267
  };
1216
1268
  marginLeft: {
1217
1269
  dynamic: {
1218
1270
  default: string;
1219
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1271
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1220
1272
  };
1221
1273
  dynamicScale: {
1222
1274
  none: string;
@@ -1238,13 +1290,13 @@ export declare const box: {
1238
1290
  name: "marginLeft";
1239
1291
  vars: {
1240
1292
  default: string;
1241
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1293
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1242
1294
  };
1243
1295
  };
1244
1296
  marginRight: {
1245
1297
  dynamic: {
1246
1298
  default: string;
1247
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1299
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1248
1300
  };
1249
1301
  dynamicScale: {
1250
1302
  none: string;
@@ -1266,13 +1318,13 @@ export declare const box: {
1266
1318
  name: "marginRight";
1267
1319
  vars: {
1268
1320
  default: string;
1269
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1321
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1270
1322
  };
1271
1323
  };
1272
1324
  gap: {
1273
1325
  dynamic: {
1274
1326
  default: string;
1275
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1327
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1276
1328
  };
1277
1329
  dynamicScale: {
1278
1330
  none: string;
@@ -1294,13 +1346,13 @@ export declare const box: {
1294
1346
  name: "gap";
1295
1347
  vars: {
1296
1348
  default: string;
1297
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1349
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1298
1350
  };
1299
1351
  };
1300
1352
  gridGap: {
1301
1353
  dynamic: {
1302
1354
  default: string;
1303
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1355
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1304
1356
  };
1305
1357
  dynamicScale: {
1306
1358
  none: string;
@@ -1322,7 +1374,7 @@ export declare const box: {
1322
1374
  name: "gridGap";
1323
1375
  vars: {
1324
1376
  default: string;
1325
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "disabled" | "hover", string>;
1377
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "disabled" | "hover", string>;
1326
1378
  };
1327
1379
  };
1328
1380
  };
@@ -1666,7 +1718,7 @@ export declare const iconButton: {
1666
1718
  backgroundColor: {
1667
1719
  dynamic: {
1668
1720
  default: string;
1669
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1721
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1670
1722
  };
1671
1723
  dynamicScale: {
1672
1724
  transparent: string;
@@ -1677,13 +1729,13 @@ export declare const iconButton: {
1677
1729
  name: "backgroundColor";
1678
1730
  vars: {
1679
1731
  default: string;
1680
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1732
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1681
1733
  };
1682
1734
  };
1683
1735
  borderColor: {
1684
1736
  dynamic: {
1685
1737
  default: string;
1686
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1738
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1687
1739
  };
1688
1740
  dynamicScale: {
1689
1741
  "neutral.interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -1697,31 +1749,31 @@ export declare const iconButton: {
1697
1749
  name: "borderColor";
1698
1750
  vars: {
1699
1751
  default: string;
1700
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1752
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1701
1753
  };
1702
1754
  };
1703
1755
  width: {
1704
1756
  dynamic: {
1705
1757
  default: string;
1706
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1758
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1707
1759
  };
1708
1760
  dynamicScale: true;
1709
1761
  name: "width";
1710
1762
  vars: {
1711
1763
  default: string;
1712
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1764
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1713
1765
  };
1714
1766
  };
1715
1767
  height: {
1716
1768
  dynamic: {
1717
1769
  default: string;
1718
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1770
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1719
1771
  };
1720
1772
  dynamicScale: true;
1721
1773
  name: "height";
1722
1774
  vars: {
1723
1775
  default: string;
1724
- conditions: Record<"xs" | "md" | "lg" | "focus" | "active" | "hover", string>;
1776
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "active" | "hover", string>;
1725
1777
  };
1726
1778
  };
1727
1779
  };
@@ -2111,14 +2163,25 @@ export declare const toggle: {
2111
2163
  export declare const link: {
2112
2164
  sprinkle: ((props: {
2113
2165
  textDecoration?: TextDecoration | undefined;
2166
+ fontSize?: "caption" | "base" | "highlight" | undefined;
2167
+ lineHeight?: "caption" | "base" | "highlight" | undefined;
2114
2168
  }) => string) & {
2115
- properties: Set<"textDecoration">;
2169
+ properties: Set<"fontSize" | "lineHeight" | "textDecoration">;
2116
2170
  };
2117
2171
  properties: {
2118
2172
  textDecoration: TextDecoration[];
2173
+ fontSize: {
2174
+ caption: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2175
+ base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2176
+ highlight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2177
+ };
2178
+ lineHeight: {
2179
+ readonly caption: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2180
+ readonly base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2181
+ readonly highlight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2182
+ };
2119
2183
  };
2120
2184
  classnames: {
2121
- size: Record<"caption" | "base" | "highlight", string>;
2122
2185
  appearance: Record<"primary" | "danger" | "neutral" | "neutral.background", string>;
2123
2186
  };
2124
2187
  };
@@ -2238,19 +2301,19 @@ export declare const modal: {
2238
2301
  maxWidth: {
2239
2302
  dynamic: {
2240
2303
  default: string;
2241
- conditions: Record<"xs" | "md" | "lg", string>;
2304
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2242
2305
  };
2243
2306
  dynamicScale: true;
2244
2307
  name: "maxWidth";
2245
2308
  vars: {
2246
2309
  default: string;
2247
- conditions: Record<"xs" | "md" | "lg", string>;
2310
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2248
2311
  };
2249
2312
  };
2250
2313
  padding: {
2251
2314
  dynamic: {
2252
2315
  default: string;
2253
- conditions: Record<"xs" | "md" | "lg", string>;
2316
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2254
2317
  };
2255
2318
  dynamicScale: {
2256
2319
  base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -2260,7 +2323,7 @@ export declare const modal: {
2260
2323
  name: "padding";
2261
2324
  vars: {
2262
2325
  default: string;
2263
- conditions: Record<"xs" | "md" | "lg", string>;
2326
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2264
2327
  };
2265
2328
  };
2266
2329
  };
@@ -2301,15 +2364,15 @@ declare const sidebarSprinkle: {
2301
2364
  values: {
2302
2365
  base: {
2303
2366
  default: string;
2304
- conditions: Record<"xs" | "md" | "lg", string>;
2367
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2305
2368
  };
2306
2369
  small: {
2307
2370
  default: string;
2308
- conditions: Record<"xs" | "md" | "lg", string>;
2371
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2309
2372
  };
2310
2373
  none: {
2311
2374
  default: string;
2312
- conditions: Record<"xs" | "md" | "lg", string>;
2375
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2313
2376
  };
2314
2377
  };
2315
2378
  staticScale: {
@@ -2325,25 +2388,25 @@ declare const sidebarSprinkle: {
2325
2388
  maxWidth: {
2326
2389
  dynamic: {
2327
2390
  default: string;
2328
- conditions: Record<"xs" | "md" | "lg", string>;
2391
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2329
2392
  };
2330
2393
  dynamicScale: true;
2331
2394
  name: "maxWidth";
2332
2395
  vars: {
2333
2396
  default: string;
2334
- conditions: Record<"xs" | "md" | "lg", string>;
2397
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2335
2398
  };
2336
2399
  };
2337
2400
  zIndex: {
2338
2401
  dynamic: {
2339
2402
  default: string;
2340
- conditions: Record<"xs" | "md" | "lg", string>;
2403
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2341
2404
  };
2342
2405
  dynamicScale: true;
2343
2406
  name: "zIndex";
2344
2407
  vars: {
2345
2408
  default: string;
2346
- conditions: Record<"xs" | "md" | "lg", string>;
2409
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2347
2410
  };
2348
2411
  };
2349
2412
  };
@@ -2377,15 +2440,15 @@ export declare const sidebar: {
2377
2440
  values: {
2378
2441
  base: {
2379
2442
  default: string;
2380
- conditions: Record<"xs" | "md" | "lg", string>;
2443
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2381
2444
  };
2382
2445
  small: {
2383
2446
  default: string;
2384
- conditions: Record<"xs" | "md" | "lg", string>;
2447
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2385
2448
  };
2386
2449
  none: {
2387
2450
  default: string;
2388
- conditions: Record<"xs" | "md" | "lg", string>;
2451
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2389
2452
  };
2390
2453
  };
2391
2454
  staticScale: {
@@ -2401,25 +2464,25 @@ export declare const sidebar: {
2401
2464
  maxWidth: {
2402
2465
  dynamic: {
2403
2466
  default: string;
2404
- conditions: Record<"xs" | "md" | "lg", string>;
2467
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2405
2468
  };
2406
2469
  dynamicScale: true;
2407
2470
  name: "maxWidth";
2408
2471
  vars: {
2409
2472
  default: string;
2410
- conditions: Record<"xs" | "md" | "lg", string>;
2473
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2411
2474
  };
2412
2475
  };
2413
2476
  zIndex: {
2414
2477
  dynamic: {
2415
2478
  default: string;
2416
- conditions: Record<"xs" | "md" | "lg", string>;
2479
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2417
2480
  };
2418
2481
  dynamicScale: true;
2419
2482
  name: "zIndex";
2420
2483
  vars: {
2421
2484
  default: string;
2422
- conditions: Record<"xs" | "md" | "lg", string>;
2485
+ conditions: Record<"xs" | "md" | "lg" | "xl", string>;
2423
2486
  };
2424
2487
  };
2425
2488
  };
@@ -2480,10 +2543,10 @@ export interface TableConditions<T> extends Conditions<T> {
2480
2543
  hover?: T;
2481
2544
  }
2482
2545
  export interface TableSprinkle {
2483
- padding?: TablePaddingProperties;
2484
- width?: string;
2485
- maxWidth?: string;
2486
- minWidth?: string;
2546
+ padding?: TablePaddingProperties | TableConditions<TablePaddingProperties>;
2547
+ width?: string | TableConditions<string>;
2548
+ maxWidth?: string | TableConditions<string>;
2549
+ minWidth?: string | TableConditions<string>;
2487
2550
  backgroundColor?: TableRowBackgroundColorProperties | TableConditions<TableRowBackgroundColorProperties>;
2488
2551
  }
2489
2552
  export declare const table: {
@@ -2495,43 +2558,43 @@ export declare const table: {
2495
2558
  width: {
2496
2559
  dynamic: {
2497
2560
  default: string;
2498
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2561
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2499
2562
  };
2500
2563
  dynamicScale: true;
2501
2564
  name: "width";
2502
2565
  vars: {
2503
2566
  default: string;
2504
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2567
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2505
2568
  };
2506
2569
  };
2507
2570
  maxWidth: {
2508
2571
  dynamic: {
2509
2572
  default: string;
2510
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2573
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2511
2574
  };
2512
2575
  dynamicScale: true;
2513
2576
  name: "maxWidth";
2514
2577
  vars: {
2515
2578
  default: string;
2516
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2579
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2517
2580
  };
2518
2581
  };
2519
2582
  minWidth: {
2520
2583
  dynamic: {
2521
2584
  default: string;
2522
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2585
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2523
2586
  };
2524
2587
  dynamicScale: true;
2525
2588
  name: "minWidth";
2526
2589
  vars: {
2527
2590
  default: string;
2528
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2591
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2529
2592
  };
2530
2593
  };
2531
2594
  backgroundColor: {
2532
2595
  dynamic: {
2533
2596
  default: string;
2534
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2597
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2535
2598
  };
2536
2599
  dynamicScale: {
2537
2600
  transparent: string;
@@ -2544,13 +2607,13 @@ export declare const table: {
2544
2607
  name: "backgroundColor";
2545
2608
  vars: {
2546
2609
  default: string;
2547
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2610
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2548
2611
  };
2549
2612
  };
2550
2613
  padding: {
2551
2614
  dynamic: {
2552
2615
  default: string;
2553
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2616
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2554
2617
  };
2555
2618
  dynamicScale: {
2556
2619
  base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -2560,7 +2623,7 @@ export declare const table: {
2560
2623
  name: "padding";
2561
2624
  vars: {
2562
2625
  default: string;
2563
- conditions: Record<"focus" | "rest" | "active" | "hover", string>;
2626
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "focus" | "rest" | "active" | "hover", string>;
2564
2627
  };
2565
2628
  };
2566
2629
  };