@nova-design-system/nova-base 3.0.0-beta.34 → 3.0.0-beta.36

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 (37) hide show
  1. package/dist/{lib/cjs → cjs}/generated/nova-tailwind-tokens.js +69 -0
  2. package/dist/css/mccs.css +136 -42
  3. package/dist/css/nova-utils.css +100 -0
  4. package/dist/css/ocean.css +150 -56
  5. package/dist/css/spark.css +148 -54
  6. package/dist/{lib/generated → generated}/nova-tailwind-tokens.d.ts +69 -0
  7. package/dist/{lib/generated → generated}/nova-tailwind-tokens.js +69 -0
  8. package/dist/js/mccs_dark.d.ts +63 -22
  9. package/dist/js/mccs_dark.js +63 -22
  10. package/dist/js/mccs_light.d.ts +63 -22
  11. package/dist/js/mccs_light.js +64 -23
  12. package/dist/js/ocean_dark.d.ts +69 -28
  13. package/dist/js/ocean_dark.js +69 -28
  14. package/dist/js/ocean_light.d.ts +69 -28
  15. package/dist/js/ocean_light.js +69 -28
  16. package/dist/js/spacings.d.ts +12 -0
  17. package/dist/js/spacings.js +12 -0
  18. package/dist/js/spark_dark.d.ts +67 -26
  19. package/dist/js/spark_dark.js +69 -28
  20. package/dist/js/spark_light.d.ts +67 -26
  21. package/dist/js/spark_light.js +69 -28
  22. package/package.json +6 -6
  23. /package/dist/{lib/cjs → cjs}/generated/nova-tailwind-components.js +0 -0
  24. /package/dist/{lib/cjs/lib → cjs/plugin}/index.js +0 -0
  25. /package/dist/{lib/cjs/lib → cjs/plugin}/nova-plugin.js +0 -0
  26. /package/dist/{lib/cjs/lib → cjs/plugin}/nova-safelist.js +0 -0
  27. /package/dist/{lib/cjs/lib → cjs/plugin}/nova-theme.js +0 -0
  28. /package/dist/{lib/generated → generated}/nova-tailwind-components.d.ts +0 -0
  29. /package/dist/{lib/generated → generated}/nova-tailwind-components.js +0 -0
  30. /package/dist/{lib/lib → plugin}/index.d.ts +0 -0
  31. /package/dist/{lib/lib → plugin}/index.js +0 -0
  32. /package/dist/{lib/lib → plugin}/nova-plugin.d.ts +0 -0
  33. /package/dist/{lib/lib → plugin}/nova-plugin.js +0 -0
  34. /package/dist/{lib/lib → plugin}/nova-safelist.d.ts +0 -0
  35. /package/dist/{lib/lib → plugin}/nova-safelist.js +0 -0
  36. /package/dist/{lib/lib → plugin}/nova-theme.d.ts +0 -0
  37. /package/dist/{lib/lib → plugin}/nova-theme.js +0 -0
package/dist/css/spark.css CHANGED
@@ -3,6 +3,7 @@
3
3
  */
4
4
 
5
5
  .dark:root {
6
+ --components-overlay-opacity: 75px;
6
7
  --components-button-destructive-low-border-hover: rgba(255, 255, 255, 0);
7
8
  --components-button-destructive-low-border: rgba(255, 255, 255, 0);
8
9
  --components-button-destructive-low-background: rgba(255, 255, 255, 0);
@@ -24,12 +25,13 @@
24
25
  --components-button-lower-border-hover-2: rgba(255, 255, 255, 0);
25
26
  --components-button-lower-border-2: rgba(255, 255, 255, 0);
26
27
  --components-button-lower-border-hover: rgba(255, 255, 255, 0);
28
+ --components-button-lower-border-active: rgba(255, 255, 255, 0);
27
29
  --components-button-lower-border: rgba(255, 255, 255, 0);
28
- --components-button-lower-background-hover: rgba(255, 255, 255, 0.1);
29
- --components-button-lower-background: rgba(255, 255, 255, 0);
30
30
  --components-button-low-border-hover: rgba(255, 255, 255, 0);
31
+ --components-button-low-border-active: rgba(255, 255, 255, 0);
31
32
  --components-button-low-border: rgba(255, 255, 255, 0);
32
33
  --components-button-low-background: rgba(255, 255, 255, 0);
34
+ --components-button-high-border-active: rgba(255, 255, 255, 0);
33
35
  --components-button-high-border-hover: rgba(255, 255, 255, 0);
34
36
  --components-button-high-border: rgba(255, 255, 255, 0);
35
37
  --components-wpf-components-2: #ffffff;
@@ -63,11 +65,15 @@
63
65
  --color-interaction-container-neutral-background-hover: rgba(255, 255, 255, 0.1);
64
66
  --color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
65
67
  --color-interaction-container-branded-low-background: rgba(255, 255, 255, 0);
68
+ --color-interaction-container-branded-high-border-hover: rgba(255, 255, 255, 0);
69
+ --color-interaction-container-branded-high-border-active: rgba(255, 255, 255, 0);
70
+ --color-interaction-container-branded-high-border: rgba(255, 255, 255, 0);
66
71
  --components-menu-contextual-item-background-hover: var(--color-interaction-container-neutral-background-hover);
67
72
  --components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
68
73
  --components-tooltip-border: var(--color-gray-spark-50);
69
74
  --components-tooltip-background: var(--color-gray-spark-50);
70
75
  --components-popover-background: var(--color-gray-spark-900);
76
+ --components-overlay-background: var(--color-gray-spark-650);
71
77
  --components-button-destructive-high-icon-hover: var(--color-base-black);
72
78
  --components-button-destructive-high-icon: var(--color-base-black);
73
79
  --components-button-destructive-high-text-hover: var(--color-base-black);
@@ -108,6 +114,8 @@
108
114
  --components-button-gr-as-complementary-text: var(--color-base-white);
109
115
  --components-button-gr-as-complementary-background-hover: var(--color-gray-spark-400);
110
116
  --components-button-gr-as-complementary-background: var(--color-gray-spark-450);
117
+ --components-button-lower-background-hover: var(--color-interaction-container-neutral-background-hover);
118
+ --components-button-lower-background: var(--color-interaction-container-neutral-background);
111
119
  --color-dont-use-background: var(--color-gray-spark-900);
112
120
  --color-dont-use-content: var(--color-gray-spark-750);
113
121
  --color-dont-use-border: var(--color-gray-spark-750);
@@ -228,33 +236,51 @@
228
236
  --color-content-high-icon: var(--color-gray-spark-50);
229
237
  --color-content-high-text: var(--color-gray-spark-50);
230
238
  --color-content-high-border: var(--color-gray-spark-300);
239
+ --color-level-inverted-05-background: var(--color-gray-spark-25);
240
+ --color-level-inverted-00-background: var(--color-gray-spark-00);
241
+ --color-level-inverted-40-background: var(--color-gray-spark-00);
242
+ --color-level-inverted-30-background: var(--color-gray-spark-50);
243
+ --color-level-inverted-20-background: var(--color-gray-spark-00);
244
+ --color-level-inverted-15-background: var(--color-gray-spark-75);
245
+ --color-level-inverted-10-background: var(--color-gray-spark-50);
231
246
  --color-level-05-background: var(--color-gray-spark-850);
232
247
  --color-level-00-background: var(--color-gray-spark-900);
233
248
  --color-level-40-background: var(--color-gray-spark-500);
234
249
  --color-level-30-background: var(--color-gray-spark-600);
235
250
  --color-level-20-background: var(--color-gray-spark-700);
251
+ --color-level-15-background: var(--color-gray-spark-750);
236
252
  --color-level-10-background: var(--color-gray-spark-800);
253
+ --color-interaction-link-inverted-icon-hover: var(--color-orange-500);
254
+ --color-interaction-link-inverted-text-hover: var(--color-orange-500);
237
255
  --color-interaction-link-low-icon-hover: var(--color-orange-500);
238
256
  --color-interaction-link-low-text-hover: var(--color-orange-500);
239
257
  --color-interaction-link-high-icon-hover: var(--color-orange-400);
240
258
  --color-interaction-link-high-icon: var(--color-orange-500);
241
259
  --color-interaction-link-high-text-hover: var(--color-orange-400);
242
260
  --color-interaction-link-high-text: var(--color-orange-500);
243
- --color-interaction-container-branded-high-border-hover: var(--color-orange-400);
244
- --color-interaction-container-branded-high-border: var(--color-orange-500);
245
- --color-interaction-container-branded-high-icon-hover: var(--color-base-black);
246
- --color-interaction-container-branded-high-icon: var(--color-base-black);
261
+ --color-interaction-container-neutral-text-active: var(--color-orange-400);
262
+ --color-interaction-container-neutral-icon-active: var(--color-orange-400);
263
+ --color-interaction-container-neutral-background-active: var(--color-orange-900);
264
+ --color-interaction-container-branded-low-text-hover: var(--color-orange-400);
265
+ --color-interaction-container-branded-low-text-active: var(--color-orange-400);
266
+ --color-interaction-container-branded-low-text: var(--color-orange-500);
267
+ --color-interaction-container-branded-low-icon-hover: var(--color-orange-400);
268
+ --color-interaction-container-branded-low-icon-active: var(--color-orange-400);
269
+ --color-interaction-container-branded-low-icon: var(--color-orange-500);
270
+ --color-interaction-container-branded-low-border-hover: var(--color-orange-400);
271
+ --color-interaction-container-branded-low-border-active: var(--color-orange-400);
272
+ --color-interaction-container-branded-low-border: var(--color-orange-500);
273
+ --color-interaction-container-branded-low-background-hover: var(--color-orange-900);
274
+ --color-interaction-container-branded-low-background-active: var(--color-orange-900);
247
275
  --color-interaction-container-branded-high-text-hover: var(--color-base-black);
276
+ --color-interaction-container-branded-high-text-active: var(--color-base-black);
248
277
  --color-interaction-container-branded-high-text: var(--color-base-black);
278
+ --color-interaction-container-branded-high-icon-hover: var(--color-base-black);
279
+ --color-interaction-container-branded-high-icon-active: var(--color-base-black);
280
+ --color-interaction-container-branded-high-icon: var(--color-base-black);
249
281
  --color-interaction-container-branded-high-background-hover: var(--color-orange-400);
282
+ --color-interaction-container-branded-high-background-active: var(--color-orange-400);
250
283
  --color-interaction-container-branded-high-background: var(--color-orange-500);
251
- --color-interaction-container-branded-low-border-hover: var(--color-orange-400);
252
- --color-interaction-container-branded-low-border: var(--color-orange-500);
253
- --color-interaction-container-branded-low-icon-hover: var(--color-orange-400);
254
- --color-interaction-container-branded-low-icon: var(--color-orange-500);
255
- --color-interaction-container-branded-low-text-hover: var(--color-orange-400);
256
- --color-interaction-container-branded-low-text: var(--color-orange-500);
257
- --color-interaction-container-branded-low-background-hover: var(--color-orange-900);
258
284
  --components-menu-contextual-item-content-disabled: var(--color-content-lower-text);
259
285
  --components-menu-contextual-item-shortcut: var(--color-content-lower-text);
260
286
  --components-menu-contextual-border: var(--color-content-low-border);
@@ -374,43 +400,58 @@
374
400
  --components-form-text-label-default: var(--color-content-high-text);
375
401
  --components-form-text-info-icon: var(--color-content-low-text);
376
402
  --components-form-text-required: var(--color-feedback-error-low-icon);
377
- --components-button-medium-border-hover: var(--color-interaction-container-branded-low-border-hover);
378
- --components-button-medium-border: var(--color-interaction-container-branded-low-border);
379
- --components-button-medium-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
380
- --components-button-medium-icon: var(--color-interaction-container-branded-low-icon);
381
403
  --components-button-medium-text-hover: var(--color-interaction-container-branded-low-text-hover);
404
+ --components-button-medium-text-active: var(--color-interaction-container-branded-low-text-active);
382
405
  --components-button-medium-text: var(--color-interaction-container-branded-low-text);
406
+ --components-button-medium-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
407
+ --components-button-medium-icon-active: var(--color-interaction-container-branded-low-icon-active);
408
+ --components-button-medium-icon: var(--color-interaction-container-branded-low-icon);
409
+ --components-button-medium-border-hover: var(--color-interaction-container-branded-low-border-hover);
410
+ --components-button-medium-border-active: var(--color-interaction-container-branded-low-border-hover);
411
+ --components-button-medium-border: var(--color-interaction-container-branded-low-border);
383
412
  --components-button-medium-background-hover: var(--color-interaction-container-branded-low-background-hover);
384
- --components-button-lower-icon-hover: var(--color-content-high-text);
385
- --components-button-lower-icon: var(--color-content-medium-text);
386
- --components-button-lower-text-hover: var(--color-content-high-text);
387
- --components-button-lower-text: var(--color-content-medium-text);
388
- --components-button-low-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
389
- --components-button-low-icon: var(--color-interaction-container-branded-low-icon);
413
+ --components-button-medium-background-active: var(--color-interaction-container-branded-low-background-active);
414
+ --components-button-lower-text-active: var(--color-interaction-container-neutral-text-active);
415
+ --components-button-lower-icon-active: var(--color-interaction-container-neutral-icon-active);
416
+ --components-button-lower-background-active: var(--color-interaction-container-neutral-background-active);
390
417
  --components-button-low-text-hover: var(--color-interaction-container-branded-low-text-hover);
418
+ --components-button-low-text-active: var(--color-interaction-container-branded-low-text-active);
391
419
  --components-button-low-text: var(--color-interaction-container-branded-low-text);
420
+ --components-button-low-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
421
+ --components-button-low-icon-active: var(--color-interaction-container-branded-low-icon-active);
422
+ --components-button-low-icon: var(--color-interaction-container-branded-low-icon);
392
423
  --components-button-low-background-hover: var(--color-interaction-container-branded-low-background-hover);
424
+ --components-button-low-background-active: var(--color-interaction-container-branded-low-background-active);
393
425
  --components-button-high-icon-hover: var(--color-interaction-container-branded-high-icon-hover);
426
+ --components-button-high-icon-active: var(--color-interaction-container-branded-high-icon-active);
394
427
  --components-button-high-icon: var(--color-interaction-container-branded-high-icon);
395
428
  --components-button-high-text-hover: var(--color-interaction-container-branded-high-text-hover);
429
+ --components-button-high-text-active: var(--color-interaction-container-branded-high-text-active);
396
430
  --components-button-high-text: var(--color-interaction-container-branded-high-text);
397
431
  --components-button-high-background-hover: var(--color-interaction-container-branded-high-background-hover);
432
+ --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
398
433
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
399
434
  --color-focus-success: var(--color-feedback-success-low-border);
400
435
  --color-focus-destructive: var(--color-feedback-error-high-border);
436
+ --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
437
+ --color-interaction-link-inverted-text: var(--color-content-inverted-medium-text);
401
438
  --color-interaction-link-low-icon: var(--color-content-high-text);
402
439
  --color-interaction-link-low-text: var(--color-content-high-text);
403
- --color-interaction-container-neutral-border-hover: var(--color-content-medium-text);
404
- --color-interaction-container-neutral-border: var(--color-content-low-text);
405
- --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
406
- --color-interaction-container-neutral-icon: var(--color-content-low-text);
407
440
  --color-interaction-container-neutral-text-hover: var(--color-content-medium-text);
408
441
  --color-interaction-container-neutral-text: var(--color-content-low-text);
442
+ --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
443
+ --color-interaction-container-neutral-icon: var(--color-content-low-text);
444
+ --color-interaction-container-neutral-border-hover: var(--color-content-medium-text);
445
+ --color-interaction-container-neutral-border: var(--color-content-low-text);
409
446
  --components-menu-contextual-item-content-hover: var(--color-interaction-container-neutral-text-hover);
410
447
  --components-menu-contextual-item-content: var(--color-interaction-container-neutral-text);
411
448
  --components-list-custom-item-content-hover: var(--color-interaction-container-neutral-text-hover);
412
449
  --components-list-custom-item-content-default: var(--color-interaction-container-neutral-text);
413
450
  --components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
451
+ --components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
452
+ --components-button-lower-text: var(--color-interaction-container-neutral-text);
453
+ --components-button-lower-icon-hover: var(--color-interaction-container-neutral-icon-hover);
454
+ --components-button-lower-icon: var(--color-interaction-container-neutral-icon);
414
455
  }
415
456
 
416
457
  :root {
@@ -441,6 +482,7 @@
441
482
  */
442
483
 
443
484
  :root {
485
+ --components-overlay-opacity: 55px;
444
486
  --components-button-destructive-low-border-hover: rgba(255, 255, 255, 0);
445
487
  --components-button-destructive-low-border: rgba(255, 255, 255, 0);
446
488
  --components-button-destructive-low-background: rgba(255, 255, 255, 0);
@@ -462,12 +504,12 @@
462
504
  --components-button-lower-border-hover-2: rgba(255, 255, 255, 0);
463
505
  --components-button-lower-border-2: rgba(255, 255, 255, 0);
464
506
  --components-button-lower-border-hover: rgba(255, 255, 255, 0);
507
+ --components-button-lower-border-active: rgba(255, 255, 255, 0);
465
508
  --components-button-lower-border: rgba(255, 255, 255, 0);
466
- --components-button-lower-background: rgba(255, 255, 255, 0);
467
509
  --components-button-low-border-hover: rgba(255, 255, 255, 0);
510
+ --components-button-low-border-active: rgba(255, 255, 255, 0);
468
511
  --components-button-low-border: rgba(255, 255, 255, 0);
469
512
  --components-button-low-background: rgba(255, 255, 255, 0);
470
- --components-button-high-border-hover: rgba(255, 255, 255, 0);
471
513
  --components-button-high-border: rgba(255, 255, 255, 0);
472
514
  --components-wpf-components-2: #ffffff;
473
515
  --shadow-y-axis-2xl: 25px;
@@ -500,11 +542,15 @@
500
542
  --color-interaction-container-neutral-background-hover: rgba(165, 165, 165, 0.12);
501
543
  --color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
502
544
  --color-interaction-container-branded-low-background: rgba(255, 255, 255, 0);
545
+ --color-interaction-container-branded-high-border-hover: rgba(255, 255, 255, 0);
546
+ --color-interaction-container-branded-high-border-active: rgba(255, 255, 255, 0);
547
+ --color-interaction-container-branded-high-border: rgba(255, 255, 255, 0);
503
548
  --components-menu-contextual-item-background-hover: var(--color-interaction-container-neutral-background-hover);
504
549
  --components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
505
550
  --components-tooltip-border: var(--color-gray-spark-900);
506
551
  --components-tooltip-background: var(--color-gray-spark-900);
507
552
  --components-popover-background: var(--color-gray-spark-50);
553
+ --components-overlay-background: var(--color-gray-spark-850);
508
554
  --components-button-destructive-high-icon-hover: var(--color-base-white);
509
555
  --components-button-destructive-high-icon: var(--color-base-white);
510
556
  --components-button-destructive-high-text-hover: var(--color-base-white);
@@ -546,6 +592,9 @@
546
592
  --components-button-gr-as-complementary-background-hover: var(--color-gray-spark-300);
547
593
  --components-button-gr-as-complementary-background: var(--color-gray-spark-200);
548
594
  --components-button-lower-background-hover: var(--color-interaction-container-neutral-background-hover);
595
+ --components-button-lower-background: var(--color-interaction-container-neutral-background);
596
+ --components-button-high-border-active: var(--color-interaction-container-branded-high-border-active);
597
+ --components-button-high-border-hover: var(--color-interaction-container-branded-high-border-hover);
549
598
  --color-dont-use-background: var(--color-gray-spark-50);
550
599
  --color-dont-use-content: var(--color-gray-spark-100);
551
600
  --color-dont-use-border: var(--color-gray-spark-100);
@@ -666,33 +715,51 @@
666
715
  --color-content-high-icon: var(--color-gray-spark-800);
667
716
  --color-content-high-text: var(--color-gray-spark-800);
668
717
  --color-content-high-border: var(--color-gray-spark-300);
718
+ --color-level-inverted-05-background: var(--color-gray-spark-850);
719
+ --color-level-inverted-00-background: var(--color-gray-spark-900);
720
+ --color-level-inverted-40-background: var(--color-gray-spark-500);
721
+ --color-level-inverted-30-background: var(--color-gray-spark-600);
722
+ --color-level-inverted-20-background: var(--color-gray-spark-700);
723
+ --color-level-inverted-15-background: var(--color-gray-spark-750);
724
+ --color-level-inverted-10-background: var(--color-gray-spark-800);
669
725
  --color-level-05-background: var(--color-gray-spark-25);
670
726
  --color-level-00-background: var(--color-gray-spark-00);
671
727
  --color-level-40-background: var(--color-gray-spark-00);
672
728
  --color-level-30-background: var(--color-gray-spark-50);
673
729
  --color-level-20-background: var(--color-gray-spark-00);
730
+ --color-level-15-background: var(--color-gray-spark-75);
674
731
  --color-level-10-background: var(--color-gray-spark-50);
732
+ --color-interaction-link-inverted-icon-hover: var(--color-orange-500);
733
+ --color-interaction-link-inverted-text-hover: var(--color-orange-500);
675
734
  --color-interaction-link-low-icon-hover: var(--color-orange-500);
676
735
  --color-interaction-link-low-text-hover: var(--color-orange-500);
677
736
  --color-interaction-link-high-icon-hover: var(--color-orange-600);
678
737
  --color-interaction-link-high-icon: var(--color-orange-500);
679
738
  --color-interaction-link-high-text-hover: var(--color-orange-600);
680
739
  --color-interaction-link-high-text: var(--color-orange-500);
681
- --color-interaction-container-branded-high-border-hover: var(--color-orange-600);
682
- --color-interaction-container-branded-high-border: var(--color-orange-500);
683
- --color-interaction-container-branded-high-icon-hover: var(--color-base-white);
684
- --color-interaction-container-branded-high-icon: var(--color-base-white);
740
+ --color-interaction-container-neutral-text-active: var(--color-orange-600);
741
+ --color-interaction-container-neutral-icon-active: var(--color-orange-600);
742
+ --color-interaction-container-neutral-background-active: var(--color-orange-50);
743
+ --color-interaction-container-branded-low-text-hover: var(--color-orange-600);
744
+ --color-interaction-container-branded-low-text-active: var(--color-orange-600);
745
+ --color-interaction-container-branded-low-text: var(--color-orange-500);
746
+ --color-interaction-container-branded-low-icon-hover: var(--color-orange-600);
747
+ --color-interaction-container-branded-low-icon-active: var(--color-orange-600);
748
+ --color-interaction-container-branded-low-icon: var(--color-orange-500);
749
+ --color-interaction-container-branded-low-border-hover: var(--color-orange-600);
750
+ --color-interaction-container-branded-low-border-active: var(--color-orange-600);
751
+ --color-interaction-container-branded-low-border: var(--color-orange-500);
752
+ --color-interaction-container-branded-low-background-hover: var(--color-orange-50);
753
+ --color-interaction-container-branded-low-background-active: var(--color-orange-50);
685
754
  --color-interaction-container-branded-high-text-hover: var(--color-base-white);
755
+ --color-interaction-container-branded-high-text-active: var(--color-base-white);
686
756
  --color-interaction-container-branded-high-text: var(--color-base-white);
757
+ --color-interaction-container-branded-high-icon-hover: var(--color-base-white);
758
+ --color-interaction-container-branded-high-icon-active: var(--color-base-white);
759
+ --color-interaction-container-branded-high-icon: var(--color-base-white);
687
760
  --color-interaction-container-branded-high-background-hover: var(--color-orange-600);
761
+ --color-interaction-container-branded-high-background-active: var(--color-orange-600);
688
762
  --color-interaction-container-branded-high-background: var(--color-orange-500);
689
- --color-interaction-container-branded-low-border-hover: var(--color-orange-600);
690
- --color-interaction-container-branded-low-border: var(--color-orange-500);
691
- --color-interaction-container-branded-low-icon-hover: var(--color-orange-600);
692
- --color-interaction-container-branded-low-icon: var(--color-orange-500);
693
- --color-interaction-container-branded-low-text-hover: var(--color-orange-600);
694
- --color-interaction-container-branded-low-text: var(--color-orange-500);
695
- --color-interaction-container-branded-low-background-hover: var(--color-orange-50);
696
763
  --components-menu-contextual-item-content-disabled: var(--color-content-lower-text);
697
764
  --components-menu-contextual-item-shortcut: var(--color-content-lower-text);
698
765
  --components-menu-contextual-border: var(--color-content-low-border);
@@ -812,43 +879,58 @@
812
879
  --components-form-text-label-default: var(--color-content-high-text);
813
880
  --components-form-text-info-icon: var(--color-content-low-text);
814
881
  --components-form-text-required: var(--color-feedback-error-low-icon);
815
- --components-button-medium-border-hover: var(--color-interaction-container-branded-low-border-hover);
816
- --components-button-medium-border: var(--color-interaction-container-branded-low-border);
817
- --components-button-medium-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
818
- --components-button-medium-icon: var(--color-interaction-container-branded-low-icon);
819
882
  --components-button-medium-text-hover: var(--color-interaction-container-branded-low-text-hover);
883
+ --components-button-medium-text-active: var(--color-interaction-container-branded-low-text-active);
820
884
  --components-button-medium-text: var(--color-interaction-container-branded-low-text);
885
+ --components-button-medium-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
886
+ --components-button-medium-icon-active: var(--color-interaction-container-branded-low-icon-active);
887
+ --components-button-medium-icon: var(--color-interaction-container-branded-low-icon);
888
+ --components-button-medium-border-hover: var(--color-interaction-container-branded-low-border-hover);
889
+ --components-button-medium-border-active: var(--color-interaction-container-branded-low-border-hover);
890
+ --components-button-medium-border: var(--color-interaction-container-branded-low-border);
821
891
  --components-button-medium-background-hover: var(--color-interaction-container-branded-low-background-hover);
822
- --components-button-lower-icon-hover: var(--color-content-high-text);
823
- --components-button-lower-icon: var(--color-content-medium-text);
824
- --components-button-lower-text-hover: var(--color-content-high-text);
825
- --components-button-lower-text: var(--color-content-medium-text);
826
- --components-button-low-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
827
- --components-button-low-icon: var(--color-interaction-container-branded-low-icon);
892
+ --components-button-medium-background-active: var(--color-interaction-container-branded-low-background-active);
893
+ --components-button-lower-text-active: var(--color-interaction-container-neutral-text-active);
894
+ --components-button-lower-icon-active: var(--color-interaction-container-neutral-icon-active);
895
+ --components-button-lower-background-active: var(--color-interaction-container-neutral-background-active);
828
896
  --components-button-low-text-hover: var(--color-interaction-container-branded-low-text-hover);
897
+ --components-button-low-text-active: var(--color-interaction-container-branded-low-text-active);
829
898
  --components-button-low-text: var(--color-interaction-container-branded-low-text);
899
+ --components-button-low-icon-hover: var(--color-interaction-container-branded-low-icon-hover);
900
+ --components-button-low-icon-active: var(--color-interaction-container-branded-low-icon-active);
901
+ --components-button-low-icon: var(--color-interaction-container-branded-low-icon);
830
902
  --components-button-low-background-hover: var(--color-interaction-container-branded-low-background-hover);
903
+ --components-button-low-background-active: var(--color-interaction-container-branded-low-background-active);
831
904
  --components-button-high-icon-hover: var(--color-interaction-container-branded-high-icon-hover);
905
+ --components-button-high-icon-active: var(--color-interaction-container-branded-high-icon-active);
832
906
  --components-button-high-icon: var(--color-interaction-container-branded-high-icon);
833
907
  --components-button-high-text-hover: var(--color-interaction-container-branded-high-text-hover);
908
+ --components-button-high-text-active: var(--color-interaction-container-branded-high-text-active);
834
909
  --components-button-high-text: var(--color-interaction-container-branded-high-text);
835
910
  --components-button-high-background-hover: var(--color-interaction-container-branded-high-background-hover);
911
+ --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
836
912
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
837
913
  --color-focus-success: var(--color-feedback-success-low-border);
838
914
  --color-focus-destructive: var(--color-feedback-error-high-border);
915
+ --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
916
+ --color-interaction-link-inverted-text: var(--color-content-inverted-medium-text);
839
917
  --color-interaction-link-low-icon: var(--color-content-high-text);
840
918
  --color-interaction-link-low-text: var(--color-content-high-text);
841
- --color-interaction-container-neutral-border-hover: var(--color-content-medium-text);
842
- --color-interaction-container-neutral-border: var(--color-content-low-text);
843
- --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
844
- --color-interaction-container-neutral-icon: var(--color-content-low-text);
845
919
  --color-interaction-container-neutral-text-hover: var(--color-content-medium-text);
846
920
  --color-interaction-container-neutral-text: var(--color-content-low-text);
921
+ --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
922
+ --color-interaction-container-neutral-icon: var(--color-content-low-text);
923
+ --color-interaction-container-neutral-border-hover: var(--color-content-medium-text);
924
+ --color-interaction-container-neutral-border: var(--color-content-low-text);
847
925
  --components-menu-contextual-item-content-hover: var(--color-interaction-container-neutral-text-hover);
848
926
  --components-menu-contextual-item-content: var(--color-interaction-container-neutral-text);
849
927
  --components-list-custom-item-content-hover: var(--color-interaction-container-neutral-text-hover);
850
928
  --components-list-custom-item-content-default: var(--color-interaction-container-neutral-text);
851
929
  --components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
930
+ --components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
931
+ --components-button-lower-text: var(--color-interaction-container-neutral-text);
932
+ --components-button-lower-icon-hover: var(--color-interaction-container-neutral-icon-hover);
933
+ --components-button-lower-icon: var(--color-interaction-container-neutral-icon);
852
934
  }
853
935
 
854
936
  /**
@@ -1241,6 +1323,18 @@
1241
1323
  --focus-outline-stroke: var(--spacing-0-5);
1242
1324
  --focus-outline-offset: var(--spacing-0-5);
1243
1325
  --focus-field-stroke: var(--spacing-px);
1326
+ --dialog-footer-padding-x: var(--spacing-6);
1327
+ --dialog-footer-padding-bottom: var(--spacing-6);
1328
+ --dialog-footer-padding-top: var(--spacing-2);
1329
+ --dialog-footer-gap-y: var(--spacing-3);
1330
+ --dialog-body-padding-y: var(--spacing-2);
1331
+ --dialog-body-padding-x: var(--spacing-6);
1332
+ --dialog-header-padding-x: var(--spacing-6);
1333
+ --dialog-header-padding-bottom: var(--spacing-2);
1334
+ --dialog-header-padding-top: var(--spacing-6);
1335
+ --dialog-header-gap-y: var(--spacing-0);
1336
+ --dialog-dismissible-position-right: var(--spacing-3);
1337
+ --dialog-dismissible-position-top: var(--spacing-5);
1244
1338
  --badge-radius: var(--radius-rounded-full);
1245
1339
  --badge-padding-y: var(--spacing-1);
1246
1340
  --badge-padding-x: var(--spacing-2);
package/dist/{lib/generated → generated}/nova-tailwind-tokens.d.ts RENAMED
@@ -180,54 +180,81 @@ export declare const NOVA_TAILWIND_TOKENS: {
180
180
  '.bg-interaction-container-branded-high': {
181
181
  'background-color': string;
182
182
  };
183
+ '.bg-interaction-container-branded-high-active': {
184
+ 'background-color': string;
185
+ };
183
186
  '.bg-interaction-container-branded-high-hover': {
184
187
  'background-color': string;
185
188
  };
186
189
  '.border-interaction-container-branded-high': {
187
190
  'border-color': string;
188
191
  };
192
+ '.border-interaction-container-branded-high-active': {
193
+ 'border-color': string;
194
+ };
189
195
  '.border-interaction-container-branded-high-hover': {
190
196
  'border-color': string;
191
197
  };
192
198
  '.icon-interaction-container-branded-high': {
193
199
  color: string;
194
200
  };
201
+ '.icon-interaction-container-branded-high-active': {
202
+ color: string;
203
+ };
195
204
  '.icon-interaction-container-branded-high-hover': {
196
205
  color: string;
197
206
  };
198
207
  '.text-interaction-container-branded-high': {
199
208
  color: string;
200
209
  };
210
+ '.text-interaction-container-branded-high-active': {
211
+ color: string;
212
+ };
201
213
  '.text-interaction-container-branded-high-hover': {
202
214
  color: string;
203
215
  };
204
216
  '.bg-interaction-container-branded-low': {
205
217
  'background-color': string;
206
218
  };
219
+ '.bg-interaction-container-branded-low-active': {
220
+ 'background-color': string;
221
+ };
207
222
  '.bg-interaction-container-branded-low-hover': {
208
223
  'background-color': string;
209
224
  };
210
225
  '.border-interaction-container-branded-low': {
211
226
  'border-color': string;
212
227
  };
228
+ '.border-interaction-container-branded-low-active': {
229
+ 'border-color': string;
230
+ };
213
231
  '.border-interaction-container-branded-low-hover': {
214
232
  'border-color': string;
215
233
  };
216
234
  '.icon-interaction-container-branded-low': {
217
235
  color: string;
218
236
  };
237
+ '.icon-interaction-container-branded-low-active': {
238
+ color: string;
239
+ };
219
240
  '.icon-interaction-container-branded-low-hover': {
220
241
  color: string;
221
242
  };
222
243
  '.text-interaction-container-branded-low': {
223
244
  color: string;
224
245
  };
246
+ '.text-interaction-container-branded-low-active': {
247
+ color: string;
248
+ };
225
249
  '.text-interaction-container-branded-low-hover': {
226
250
  color: string;
227
251
  };
228
252
  '.bg-interaction-container-neutral': {
229
253
  'background-color': string;
230
254
  };
255
+ '.bg-interaction-container-neutral-active': {
256
+ 'background-color': string;
257
+ };
231
258
  '.bg-interaction-container-neutral-hover': {
232
259
  'background-color': string;
233
260
  };
@@ -240,12 +267,18 @@ export declare const NOVA_TAILWIND_TOKENS: {
240
267
  '.icon-interaction-container-neutral': {
241
268
  color: string;
242
269
  };
270
+ '.icon-interaction-container-neutral-active': {
271
+ color: string;
272
+ };
243
273
  '.icon-interaction-container-neutral-hover': {
244
274
  color: string;
245
275
  };
246
276
  '.text-interaction-container-neutral': {
247
277
  color: string;
248
278
  };
279
+ '.text-interaction-container-neutral-active': {
280
+ color: string;
281
+ };
249
282
  '.text-interaction-container-neutral-hover': {
250
283
  color: string;
251
284
  };
@@ -261,6 +294,18 @@ export declare const NOVA_TAILWIND_TOKENS: {
261
294
  '.text-interaction-link-high-hover': {
262
295
  color: string;
263
296
  };
297
+ '.icon-interaction-link-inverted': {
298
+ color: string;
299
+ };
300
+ '.icon-interaction-link-inverted-hover': {
301
+ color: string;
302
+ };
303
+ '.text-interaction-link-inverted': {
304
+ color: string;
305
+ };
306
+ '.text-interaction-link-inverted-hover': {
307
+ color: string;
308
+ };
264
309
  '.icon-interaction-link-low': {
265
310
  color: string;
266
311
  };
@@ -282,6 +327,9 @@ export declare const NOVA_TAILWIND_TOKENS: {
282
327
  '.bg-level-10': {
283
328
  'background-color': string;
284
329
  };
330
+ '.bg-level-15': {
331
+ 'background-color': string;
332
+ };
285
333
  '.bg-level-20': {
286
334
  'background-color': string;
287
335
  };
@@ -291,6 +339,27 @@ export declare const NOVA_TAILWIND_TOKENS: {
291
339
  '.bg-level-40': {
292
340
  'background-color': string;
293
341
  };
342
+ '.bg-level-inverted-00': {
343
+ 'background-color': string;
344
+ };
345
+ '.bg-level-inverted-05': {
346
+ 'background-color': string;
347
+ };
348
+ '.bg-level-inverted-10': {
349
+ 'background-color': string;
350
+ };
351
+ '.bg-level-inverted-15': {
352
+ 'background-color': string;
353
+ };
354
+ '.bg-level-inverted-20': {
355
+ 'background-color': string;
356
+ };
357
+ '.bg-level-inverted-30': {
358
+ 'background-color': string;
359
+ };
360
+ '.bg-level-inverted-40': {
361
+ 'background-color': string;
362
+ };
294
363
  '.bg-rainbow-1': {
295
364
  'background-color': string;
296
365
  };