@nova-design-system/nova-base 3.0.0 → 3.2.0

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 (26) hide show
  1. package/assets/icons/icon-sprite.svg +1 -1
  2. package/dist/cjs/generated/nova-tailwind-tokens.js +36 -0
  3. package/dist/cjs/plugin/nova-plugin.js +188 -2
  4. package/dist/css/mccs.css +56 -27
  5. package/dist/css/nova-utils.css +8361 -8313
  6. package/dist/css/ocean.css +121 -92
  7. package/dist/css/spark.css +122 -93
  8. package/dist/generated/nova-tailwind-tokens.d.ts +36 -0
  9. package/dist/generated/nova-tailwind-tokens.js +36 -0
  10. package/dist/js/mccs_dark.d.ts +23 -10
  11. package/dist/js/mccs_dark.js +28 -15
  12. package/dist/js/mccs_light.d.ts +23 -10
  13. package/dist/js/mccs_light.js +30 -17
  14. package/dist/js/ocean_dark.d.ts +23 -10
  15. package/dist/js/ocean_dark.js +90 -77
  16. package/dist/js/ocean_light.d.ts +23 -10
  17. package/dist/js/ocean_light.js +95 -82
  18. package/dist/js/primitives.js +3 -3
  19. package/dist/js/spacings.d.ts +3 -0
  20. package/dist/js/spacings.js +3 -0
  21. package/dist/js/spark_dark.d.ts +23 -10
  22. package/dist/js/spark_dark.js +90 -77
  23. package/dist/js/spark_light.d.ts +23 -10
  24. package/dist/js/spark_light.js +97 -84
  25. package/dist/plugin/nova-plugin.js +224 -2
  26. package/package.json +1 -1
package/dist/css/spark.css CHANGED
@@ -148,7 +148,7 @@
148
148
  --color-rainbow-6-text: var(--color-crimson-200);
149
149
  --color-rainbow-6-icon: var(--color-crimson-200);
150
150
  --color-rainbow-6-border: var(--color-crimson-200);
151
- --color-rainbow-6-background: var(--color-crimson-700);
151
+ --color-rainbow-6-background: var(--color-crimson-800);
152
152
  --color-rainbow-5-text: var(--color-turquoise-500);
153
153
  --color-rainbow-5-icon: var(--color-turquoise-500);
154
154
  --color-rainbow-5-border: var(--color-turquoise-500);
@@ -170,44 +170,44 @@
170
170
  --color-rainbow-1-border: var(--color-amber-500);
171
171
  --color-rainbow-1-background: var(--color-amber-900);
172
172
  --color-focus-brand: var(--color-orange-500);
173
- --color-feedback-success-low-text: var(--color-status-green-300);
174
- --color-feedback-success-low-icon: var(--color-status-green-300);
175
- --color-feedback-success-low-border: var(--color-status-green-300);
173
+ --color-feedback-success-low-text: var(--color-status-green-400);
174
+ --color-feedback-success-low-icon: var(--color-status-green-400);
175
+ --color-feedback-success-low-border: var(--color-status-green-400);
176
176
  --color-feedback-success-low-background: var(--color-status-green-900);
177
- --color-feedback-success-high-text: var(--color-base-black);
178
- --color-feedback-success-high-icon: var(--color-base-black);
177
+ --color-feedback-success-high-text: var(--color-status-green-800);
178
+ --color-feedback-success-high-icon: var(--color-status-green-800);
179
179
  --color-feedback-success-high-border: var(--color-status-green-300);
180
180
  --color-feedback-success-high-background: var(--color-status-green-300);
181
- --color-feedback-warning-low-text: var(--color-status-yellow-300);
182
- --color-feedback-warning-low-icon: var(--color-status-yellow-300);
183
- --color-feedback-warning-low-border: var(--color-status-yellow-300);
181
+ --color-feedback-warning-low-text: var(--color-status-yellow-500);
182
+ --color-feedback-warning-low-icon: var(--color-status-yellow-500);
183
+ --color-feedback-warning-low-border: var(--color-status-yellow-500);
184
184
  --color-feedback-warning-low-background: var(--color-status-yellow-900);
185
- --color-feedback-warning-high-text: var(--color-base-black);
186
- --color-feedback-warning-high-icon: var(--color-base-black);
187
- --color-feedback-warning-high-border: var(--color-status-yellow-300);
188
- --color-feedback-warning-high-background: var(--color-status-yellow-300);
189
- --color-feedback-neutral-low-text: var(--color-gray-spark-300);
190
- --color-feedback-neutral-low-icon: var(--color-gray-spark-300);
191
- --color-feedback-neutral-low-border: var(--color-gray-spark-300);
192
- --color-feedback-neutral-low-background: var(--color-gray-spark-650);
193
- --color-feedback-neutral-high-text: var(--color-base-black);
194
- --color-feedback-neutral-high-icon: var(--color-base-black);
195
- --color-feedback-neutral-high-border: var(--color-gray-spark-300);
196
- --color-feedback-neutral-high-background: var(--color-gray-spark-300);
197
- --color-feedback-error-low-text: var(--color-status-red-400);
198
- --color-feedback-error-low-icon: var(--color-status-red-400);
199
- --color-feedback-error-low-border: var(--color-status-red-400);
185
+ --color-feedback-warning-high-text: var(--color-status-yellow-900);
186
+ --color-feedback-warning-high-icon: var(--color-status-yellow-900);
187
+ --color-feedback-warning-high-border: var(--color-status-yellow-500);
188
+ --color-feedback-warning-high-background: var(--color-status-yellow-500);
189
+ --color-feedback-neutral-low-text: var(--color-gray-spark-250);
190
+ --color-feedback-neutral-low-icon: var(--color-gray-spark-250);
191
+ --color-feedback-neutral-low-border: var(--color-gray-spark-250);
192
+ --color-feedback-neutral-low-background: var(--color-gray-spark-800);
193
+ --color-feedback-neutral-high-text: var(--color-gray-spark-800);
194
+ --color-feedback-neutral-high-icon: var(--color-gray-spark-800);
195
+ --color-feedback-neutral-high-border: var(--color-gray-spark-250);
196
+ --color-feedback-neutral-high-background: var(--color-gray-spark-250);
197
+ --color-feedback-error-low-text: var(--color-status-red-300);
198
+ --color-feedback-error-low-icon: var(--color-status-red-300);
199
+ --color-feedback-error-low-border: var(--color-status-red-300);
200
200
  --color-feedback-error-low-background: var(--color-status-red-900);
201
- --color-feedback-error-high-text: var(--color-base-black);
202
- --color-feedback-error-high-icon: var(--color-base-black);
203
- --color-feedback-error-high-border: var(--color-status-red-400);
204
- --color-feedback-error-high-background: var(--color-status-red-400);
201
+ --color-feedback-error-high-text: var(--color-status-red-900);
202
+ --color-feedback-error-high-icon: var(--color-status-red-900);
203
+ --color-feedback-error-high-border: var(--color-status-red-300);
204
+ --color-feedback-error-high-background: var(--color-status-red-300);
205
205
  --color-feedback-information-low-text: var(--color-status-blue-300);
206
206
  --color-feedback-information-low-icon: var(--color-status-blue-300);
207
207
  --color-feedback-information-low-border: var(--color-status-blue-300);
208
208
  --color-feedback-information-low-background: var(--color-status-blue-900);
209
- --color-feedback-information-high-text: var(--color-base-black);
210
- --color-feedback-information-high-icon: var(--color-base-black);
209
+ --color-feedback-information-high-text: var(--color-status-blue-800);
210
+ --color-feedback-information-high-icon: var(--color-status-blue-800);
211
211
  --color-feedback-information-high-border: var(--color-status-blue-300);
212
212
  --color-feedback-information-high-background: var(--color-status-blue-300);
213
213
  --color-chart-10: var(--color-crimson-500);
@@ -260,14 +260,20 @@
260
260
  --color-level-20-background: var(--color-gray-spark-700);
261
261
  --color-level-15-background: var(--color-gray-spark-750);
262
262
  --color-level-10-background: var(--color-gray-spark-800);
263
- --color-interaction-link-inverted-icon-hover: var(--color-orange-500);
264
- --color-interaction-link-inverted-text-hover: var(--color-orange-500);
265
- --color-interaction-link-low-icon-hover: var(--color-orange-500);
263
+ --color-interaction-link-inverted-text-visited: var(--color-orange-400);
264
+ --color-interaction-link-inverted-text-hover: var(--color-orange-600);
265
+ --color-interaction-link-inverted-icon-visited: var(--color-orange-400);
266
+ --color-interaction-link-inverted-icon-hover: var(--color-orange-600);
267
+ --color-interaction-link-low-text-visited: var(--color-orange-700);
266
268
  --color-interaction-link-low-text-hover: var(--color-orange-500);
267
- --color-interaction-link-high-icon-hover: var(--color-orange-400);
268
- --color-interaction-link-high-icon: var(--color-orange-500);
269
+ --color-interaction-link-low-icon-visited: var(--color-orange-700);
270
+ --color-interaction-link-low-icon-hover: var(--color-orange-500);
271
+ --color-interaction-link-high-text-visited: var(--color-orange-700);
269
272
  --color-interaction-link-high-text-hover: var(--color-orange-400);
270
273
  --color-interaction-link-high-text: var(--color-orange-500);
274
+ --color-interaction-link-high-icon-visited: var(--color-orange-700);
275
+ --color-interaction-link-high-icon-hover: var(--color-orange-400);
276
+ --color-interaction-link-high-icon: var(--color-orange-500);
271
277
  --color-interaction-container-neutral-text-active: var(--color-orange-400);
272
278
  --color-interaction-container-neutral-icon-active: var(--color-orange-400);
273
279
  --color-interaction-container-neutral-border-active: var(--color-orange-400);
@@ -322,7 +328,11 @@
322
328
  --components-menu-contextual-border: var(--color-content-low-border);
323
329
  --components-menu-contextual-background: var(--color-level-00-background);
324
330
  --components-calendar-background: var(--color-level-00-background);
325
- --components-calendar-cell-text-today: var(--color-interaction-container-neutral-text-active);
331
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
332
+ --components-calendar-weeks-text: var(--color-content-high-text);
333
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
334
+ --components-calendar-weeks-background: var(--color-level-10-background);
335
+ --components-calendar-cell-text-today: var(--color-content-high-text);
326
336
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
327
337
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
328
338
  --components-calendar-cell-text-selected: var(--color-interaction-container-branded-high-text-active);
@@ -332,10 +342,6 @@
332
342
  --components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
333
343
  --components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
334
344
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
335
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
336
- --components-calendar-weeks-text: var(--color-content-high-text);
337
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
338
- --components-calendar-weeks-background: var(--color-level-10-background);
339
345
  --components-calendar-header-text: var(--color-content-high-text);
340
346
  --components-calendar-border: var(--color-content-low-border);
341
347
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -484,13 +490,20 @@
484
490
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
485
491
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
486
492
  --color-focus-success: var(--color-feedback-success-low-border);
493
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
487
494
  --color-focus-destructive: var(--color-feedback-error-high-border);
488
495
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
489
496
  --color-focus-background: var(--color-level-00-background);
490
- --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
497
+ --color-interaction-link-inverted-text-inactive: var(--color-content-inverted-low-text);
491
498
  --color-interaction-link-inverted-text: var(--color-content-inverted-medium-text);
492
- --color-interaction-link-low-icon: var(--color-content-high-text);
499
+ --color-interaction-link-inverted-icon-inactive: var(--color-content-inverted-low-icon);
500
+ --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
501
+ --color-interaction-link-low-text-inactive: var(--color-content-low-text);
493
502
  --color-interaction-link-low-text: var(--color-content-high-text);
503
+ --color-interaction-link-low-icon-inactive: var(--color-content-low-icon);
504
+ --color-interaction-link-low-icon: var(--color-content-high-text);
505
+ --color-interaction-link-high-text-inactive: var(--color-content-low-text);
506
+ --color-interaction-link-high-icon-inactive: var(--color-content-low-icon);
494
507
  --color-interaction-container-neutral-text-hover: var(--color-content-medium-text);
495
508
  --color-interaction-container-neutral-text: var(--color-content-low-text);
496
509
  --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
@@ -685,7 +698,7 @@
685
698
  --color-rainbow-5-text: var(--color-turquoise-800);
686
699
  --color-rainbow-5-icon: var(--color-turquoise-800);
687
700
  --color-rainbow-5-border: var(--color-turquoise-800);
688
- --color-rainbow-5-background: var(--color-turquoise-100);
701
+ --color-rainbow-5-background: var(--color-turquoise-50);
689
702
  --color-rainbow-4-text: var(--color-red-500);
690
703
  --color-rainbow-4-icon: var(--color-red-500);
691
704
  --color-rainbow-4-border: var(--color-red-500);
@@ -698,51 +711,51 @@
698
711
  --color-rainbow-2-icon: var(--color-orange-700);
699
712
  --color-rainbow-2-border: var(--color-orange-700);
700
713
  --color-rainbow-2-background: var(--color-orange-50);
701
- --color-rainbow-1-text: var(--color-amber-600);
702
- --color-rainbow-1-icon: var(--color-amber-600);
703
- --color-rainbow-1-border: var(--color-amber-600);
714
+ --color-rainbow-1-text: var(--color-amber-700);
715
+ --color-rainbow-1-icon: var(--color-amber-700);
716
+ --color-rainbow-1-border: var(--color-amber-700);
704
717
  --color-rainbow-1-background: var(--color-amber-50);
705
718
  --color-focus-brand: var(--color-orange-500);
706
- --color-feedback-success-low-text: var(--color-status-green-500);
707
- --color-feedback-success-low-icon: var(--color-status-green-500);
708
- --color-feedback-success-low-border: var(--color-status-green-500);
719
+ --color-feedback-success-low-text: var(--color-status-green-600);
720
+ --color-feedback-success-low-icon: var(--color-status-green-600);
721
+ --color-feedback-success-low-border: var(--color-status-green-600);
709
722
  --color-feedback-success-low-background: var(--color-status-green-50);
710
- --color-feedback-success-high-text: var(--color-base-white);
711
- --color-feedback-success-high-icon: var(--color-base-white);
723
+ --color-feedback-success-high-text: var(--color-status-green-800);
724
+ --color-feedback-success-high-icon: var(--color-status-green-800);
712
725
  --color-feedback-success-high-border: var(--color-status-green-400);
713
726
  --color-feedback-success-high-background: var(--color-status-green-400);
714
- --color-feedback-warning-low-text: var(--color-status-yellow-500);
715
- --color-feedback-warning-low-icon: var(--color-status-yellow-500);
716
- --color-feedback-warning-low-border: var(--color-status-yellow-500);
727
+ --color-feedback-warning-low-text: var(--color-status-yellow-700);
728
+ --color-feedback-warning-low-icon: var(--color-status-yellow-700);
729
+ --color-feedback-warning-low-border: var(--color-status-yellow-700);
717
730
  --color-feedback-warning-low-background: var(--color-status-yellow-50);
718
- --color-feedback-warning-high-text: var(--color-base-white);
719
- --color-feedback-warning-high-icon: var(--color-base-white);
720
- --color-feedback-warning-high-border: var(--color-status-yellow-400);
721
- --color-feedback-warning-high-background: var(--color-status-yellow-400);
722
- --color-feedback-neutral-low-text: var(--color-gray-spark-400);
723
- --color-feedback-neutral-low-icon: var(--color-gray-spark-400);
724
- --color-feedback-neutral-low-border: var(--color-gray-spark-400);
725
- --color-feedback-neutral-low-background: var(--color-gray-spark-75);
726
- --color-feedback-neutral-high-text: var(--color-base-white);
727
- --color-feedback-neutral-high-icon: var(--color-base-white);
728
- --color-feedback-neutral-high-border: var(--color-gray-spark-400);
729
- --color-feedback-neutral-high-background: var(--color-gray-spark-400);
730
- --color-feedback-error-low-text: var(--color-status-red-500);
731
- --color-feedback-error-low-icon: var(--color-status-red-500);
732
- --color-feedback-error-low-border: var(--color-status-red-500);
731
+ --color-feedback-warning-high-text: var(--color-status-yellow-900);
732
+ --color-feedback-warning-high-icon: var(--color-status-yellow-900);
733
+ --color-feedback-warning-high-border: var(--color-status-yellow-500);
734
+ --color-feedback-warning-high-background: var(--color-status-yellow-500);
735
+ --color-feedback-neutral-low-text: var(--color-gray-spark-450);
736
+ --color-feedback-neutral-low-icon: var(--color-gray-spark-450);
737
+ --color-feedback-neutral-low-border: var(--color-gray-spark-450);
738
+ --color-feedback-neutral-low-background: var(--color-gray-spark-50);
739
+ --color-feedback-neutral-high-text: var(--color-gray-spark-800);
740
+ --color-feedback-neutral-high-icon: var(--color-gray-spark-800);
741
+ --color-feedback-neutral-high-border: var(--color-gray-spark-250);
742
+ --color-feedback-neutral-high-background: var(--color-gray-spark-250);
743
+ --color-feedback-error-low-text: var(--color-status-red-600);
744
+ --color-feedback-error-low-icon: var(--color-status-red-600);
745
+ --color-feedback-error-low-border: var(--color-status-red-600);
733
746
  --color-feedback-error-low-background: var(--color-status-red-50);
734
- --color-feedback-error-high-text: var(--color-base-white);
735
- --color-feedback-error-high-icon: var(--color-base-white);
736
- --color-feedback-error-high-border: var(--color-status-red-500);
737
- --color-feedback-error-high-background: var(--color-status-red-500);
747
+ --color-feedback-error-high-text: var(--color-status-red-900);
748
+ --color-feedback-error-high-icon: var(--color-status-red-900);
749
+ --color-feedback-error-high-border: var(--color-status-red-300);
750
+ --color-feedback-error-high-background: var(--color-status-red-300);
738
751
  --color-feedback-information-low-text: var(--color-status-blue-500);
739
752
  --color-feedback-information-low-icon: var(--color-status-blue-500);
740
753
  --color-feedback-information-low-border: var(--color-status-blue-500);
741
754
  --color-feedback-information-low-background: var(--color-status-blue-50);
742
- --color-feedback-information-high-text: var(--color-base-white);
743
- --color-feedback-information-high-icon: var(--color-base-white);
744
- --color-feedback-information-high-border: var(--color-status-blue-400);
745
- --color-feedback-information-high-background: var(--color-status-blue-400);
755
+ --color-feedback-information-high-text: var(--color-status-blue-800);
756
+ --color-feedback-information-high-icon: var(--color-status-blue-800);
757
+ --color-feedback-information-high-border: var(--color-status-blue-300);
758
+ --color-feedback-information-high-background: var(--color-status-blue-300);
746
759
  --color-chart-10: var(--color-crimson-500);
747
760
  --color-chart-9: var(--color-dark-blue-500);
748
761
  --color-chart-8: var(--color-orange-500);
@@ -793,14 +806,20 @@
793
806
  --color-level-20-background: var(--color-gray-spark-00);
794
807
  --color-level-15-background: var(--color-gray-spark-75);
795
808
  --color-level-10-background: var(--color-gray-spark-50);
796
- --color-interaction-link-inverted-icon-hover: var(--color-orange-500);
809
+ --color-interaction-link-inverted-text-visited: var(--color-orange-700);
797
810
  --color-interaction-link-inverted-text-hover: var(--color-orange-500);
798
- --color-interaction-link-low-icon-hover: var(--color-orange-500);
799
- --color-interaction-link-low-text-hover: var(--color-orange-500);
800
- --color-interaction-link-high-icon-hover: var(--color-orange-600);
801
- --color-interaction-link-high-icon: var(--color-orange-500);
802
- --color-interaction-link-high-text-hover: var(--color-orange-600);
803
- --color-interaction-link-high-text: var(--color-orange-500);
811
+ --color-interaction-link-inverted-icon-visited: var(--color-orange-700);
812
+ --color-interaction-link-inverted-icon-hover: var(--color-orange-500);
813
+ --color-interaction-link-low-text-visited: var(--color-orange-400);
814
+ --color-interaction-link-low-text-hover: var(--color-orange-600);
815
+ --color-interaction-link-low-icon-visited: var(--color-orange-400);
816
+ --color-interaction-link-low-icon-hover: var(--color-orange-600);
817
+ --color-interaction-link-high-text-visited: var(--color-orange-400);
818
+ --color-interaction-link-high-text-hover: var(--color-orange-700);
819
+ --color-interaction-link-high-text: var(--color-orange-600);
820
+ --color-interaction-link-high-icon-visited: var(--color-orange-400);
821
+ --color-interaction-link-high-icon-hover: var(--color-orange-700);
822
+ --color-interaction-link-high-icon: var(--color-orange-600);
804
823
  --color-interaction-container-neutral-text-active: var(--color-orange-600);
805
824
  --color-interaction-container-neutral-icon-active: var(--color-orange-600);
806
825
  --color-interaction-container-neutral-border-active: var(--color-orange-600);
@@ -855,6 +874,10 @@
855
874
  --components-menu-contextual-border: var(--color-content-low-border);
856
875
  --components-menu-contextual-background: var(--color-level-00-background);
857
876
  --components-calendar-background: var(--color-level-00-background);
877
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
878
+ --components-calendar-weeks-text: var(--color-content-high-text);
879
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
880
+ --components-calendar-weeks-background: var(--color-level-10-background);
858
881
  --components-calendar-cell-text-today: var(--color-content-high-text);
859
882
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
860
883
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
@@ -864,10 +887,6 @@
864
887
  --components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
865
888
  --components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
866
889
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
867
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
868
- --components-calendar-weeks-text: var(--color-content-high-text);
869
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
870
- --components-calendar-weeks-background: var(--color-level-10-background);
871
890
  --components-calendar-header-text: var(--color-content-high-text);
872
891
  --components-calendar-border: var(--color-content-low-border);
873
892
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -1018,13 +1037,20 @@
1018
1037
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
1019
1038
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
1020
1039
  --color-focus-success: var(--color-feedback-success-low-border);
1040
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
1021
1041
  --color-focus-destructive: var(--color-feedback-error-high-border);
1022
1042
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
1023
1043
  --color-focus-background: var(--color-level-00-background);
1024
- --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
1044
+ --color-interaction-link-inverted-text-inactive: var(--color-content-inverted-low-text);
1025
1045
  --color-interaction-link-inverted-text: var(--color-content-inverted-medium-text);
1026
- --color-interaction-link-low-icon: var(--color-content-high-text);
1046
+ --color-interaction-link-inverted-icon-inactive: var(--color-content-inverted-low-icon);
1047
+ --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
1048
+ --color-interaction-link-low-text-inactive: var(--color-content-low-text);
1027
1049
  --color-interaction-link-low-text: var(--color-content-high-text);
1050
+ --color-interaction-link-low-icon-inactive: var(--color-content-low-icon);
1051
+ --color-interaction-link-low-icon: var(--color-content-high-text);
1052
+ --color-interaction-link-high-text-inactive: var(--color-content-low-text);
1053
+ --color-interaction-link-high-icon-inactive: var(--color-content-low-icon);
1028
1054
  --color-interaction-container-neutral-text-hover: var(--color-content-medium-text);
1029
1055
  --color-interaction-container-neutral-text: var(--color-content-low-text);
1030
1056
  --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
@@ -1154,7 +1180,7 @@
1154
1180
  --color-yellow-200: #ffe286;
1155
1181
  --color-yellow-100: #ffecb3;
1156
1182
  --color-yellow-50: #fff7df;
1157
- --color-turquoise-900: #203330;
1183
+ --color-turquoise-900: #1c2b28;
1158
1184
  --color-turquoise-800: #32504c;
1159
1185
  --color-turquoise-700: #456e68;
1160
1186
  --color-turquoise-600: #578b84;
@@ -1309,8 +1335,8 @@
1309
1335
  --color-crimson-300: #bd597c;
1310
1336
  --color-crimson-200: #cf869f;
1311
1337
  --color-crimson-100: #e0b3c2;
1312
- --color-crimson-50: #f2dfe6;
1313
- --color-amber-900: #482608;
1338
+ --color-crimson-50: #f7e9ee;
1339
+ --color-amber-900: #432306;
1314
1340
  --color-amber-800: #723d0c;
1315
1341
  --color-amber-700: #9c5311;
1316
1342
  --color-amber-600: #c66a15;
@@ -1346,6 +1372,7 @@
1346
1372
  --popover-font-weight: 500;
1347
1373
  --menu-contextual-item-font-weight: 500;
1348
1374
  --menu-contextual-divider-padding-bottom: 3px;
1375
+ --form-max-width: 480px;
1349
1376
  --form-field-badge-gap: 0px;
1350
1377
  --list-native-separator-padding-y: 3px;
1351
1378
  --list-native-separator-padding-x: 9px;
@@ -1415,7 +1442,9 @@
1415
1442
  --breadcrumb-padding-y: var(--spacing-1);
1416
1443
  --badge-radius: var(--radius-rounded-full);
1417
1444
  --badge-padding-y: var(--spacing-1);
1445
+ --badge-padding-icon-only-x: var(--spacing-1);
1418
1446
  --badge-padding-x: var(--spacing-2);
1447
+ --badge-gap-icon-only-x: var(--spacing-0);
1419
1448
  --badge-gap-x: var(--spacing-1);
1420
1449
  --avatar-xl-size: var(--spacing-16);
1421
1450
  --avatar-xl-icon-size: var(--spacing-11);
package/dist/generated/nova-tailwind-tokens.d.ts CHANGED
@@ -297,36 +297,72 @@ export declare const NOVA_TAILWIND_TOKENS: {
297
297
  '.icon-interaction-link-high-hover': {
298
298
  color: string;
299
299
  };
300
+ '.icon-interaction-link-high-inactive': {
301
+ color: string;
302
+ };
303
+ '.icon-interaction-link-high-visited': {
304
+ color: string;
305
+ };
300
306
  '.text-interaction-link-high': {
301
307
  color: string;
302
308
  };
303
309
  '.text-interaction-link-high-hover': {
304
310
  color: string;
305
311
  };
312
+ '.text-interaction-link-high-inactive': {
313
+ color: string;
314
+ };
315
+ '.text-interaction-link-high-visited': {
316
+ color: string;
317
+ };
306
318
  '.icon-interaction-link-inverted': {
307
319
  color: string;
308
320
  };
309
321
  '.icon-interaction-link-inverted-hover': {
310
322
  color: string;
311
323
  };
324
+ '.icon-interaction-link-inverted-inactive': {
325
+ color: string;
326
+ };
327
+ '.icon-interaction-link-inverted-visited': {
328
+ color: string;
329
+ };
312
330
  '.text-interaction-link-inverted': {
313
331
  color: string;
314
332
  };
315
333
  '.text-interaction-link-inverted-hover': {
316
334
  color: string;
317
335
  };
336
+ '.text-interaction-link-inverted-inactive': {
337
+ color: string;
338
+ };
339
+ '.text-interaction-link-inverted-visited': {
340
+ color: string;
341
+ };
318
342
  '.icon-interaction-link-low': {
319
343
  color: string;
320
344
  };
321
345
  '.icon-interaction-link-low-hover': {
322
346
  color: string;
323
347
  };
348
+ '.icon-interaction-link-low-inactive': {
349
+ color: string;
350
+ };
351
+ '.icon-interaction-link-low-visited': {
352
+ color: string;
353
+ };
324
354
  '.text-interaction-link-low': {
325
355
  color: string;
326
356
  };
327
357
  '.text-interaction-link-low-hover': {
328
358
  color: string;
329
359
  };
360
+ '.text-interaction-link-low-inactive': {
361
+ color: string;
362
+ };
363
+ '.text-interaction-link-low-visited': {
364
+ color: string;
365
+ };
330
366
  '.bg-level-00': {
331
367
  'background-color': string;
332
368
  };
package/dist/generated/nova-tailwind-tokens.js CHANGED
@@ -298,36 +298,72 @@ export const NOVA_TAILWIND_TOKENS = {
298
298
  '.icon-interaction-link-high-hover': {
299
299
  'color': 'var(--color-interaction-link-high-icon-hover)'
300
300
  },
301
+ '.icon-interaction-link-high-inactive': {
302
+ 'color': 'var(--color-interaction-link-high-icon-inactive)'
303
+ },
304
+ '.icon-interaction-link-high-visited': {
305
+ 'color': 'var(--color-interaction-link-high-icon-visited)'
306
+ },
301
307
  '.text-interaction-link-high': {
302
308
  'color': 'var(--color-interaction-link-high-text)'
303
309
  },
304
310
  '.text-interaction-link-high-hover': {
305
311
  'color': 'var(--color-interaction-link-high-text-hover)'
306
312
  },
313
+ '.text-interaction-link-high-inactive': {
314
+ 'color': 'var(--color-interaction-link-high-text-inactive)'
315
+ },
316
+ '.text-interaction-link-high-visited': {
317
+ 'color': 'var(--color-interaction-link-high-text-visited)'
318
+ },
307
319
  '.icon-interaction-link-inverted': {
308
320
  'color': 'var(--color-interaction-link-inverted-icon)'
309
321
  },
310
322
  '.icon-interaction-link-inverted-hover': {
311
323
  'color': 'var(--color-interaction-link-inverted-icon-hover)'
312
324
  },
325
+ '.icon-interaction-link-inverted-inactive': {
326
+ 'color': 'var(--color-interaction-link-inverted-icon-inactive)'
327
+ },
328
+ '.icon-interaction-link-inverted-visited': {
329
+ 'color': 'var(--color-interaction-link-inverted-icon-visited)'
330
+ },
313
331
  '.text-interaction-link-inverted': {
314
332
  'color': 'var(--color-interaction-link-inverted-text)'
315
333
  },
316
334
  '.text-interaction-link-inverted-hover': {
317
335
  'color': 'var(--color-interaction-link-inverted-text-hover)'
318
336
  },
337
+ '.text-interaction-link-inverted-inactive': {
338
+ 'color': 'var(--color-interaction-link-inverted-text-inactive)'
339
+ },
340
+ '.text-interaction-link-inverted-visited': {
341
+ 'color': 'var(--color-interaction-link-inverted-text-visited)'
342
+ },
319
343
  '.icon-interaction-link-low': {
320
344
  'color': 'var(--color-interaction-link-low-icon)'
321
345
  },
322
346
  '.icon-interaction-link-low-hover': {
323
347
  'color': 'var(--color-interaction-link-low-icon-hover)'
324
348
  },
349
+ '.icon-interaction-link-low-inactive': {
350
+ 'color': 'var(--color-interaction-link-low-icon-inactive)'
351
+ },
352
+ '.icon-interaction-link-low-visited': {
353
+ 'color': 'var(--color-interaction-link-low-icon-visited)'
354
+ },
325
355
  '.text-interaction-link-low': {
326
356
  'color': 'var(--color-interaction-link-low-text)'
327
357
  },
328
358
  '.text-interaction-link-low-hover': {
329
359
  'color': 'var(--color-interaction-link-low-text-hover)'
330
360
  },
361
+ '.text-interaction-link-low-inactive': {
362
+ 'color': 'var(--color-interaction-link-low-text-inactive)'
363
+ },
364
+ '.text-interaction-link-low-visited': {
365
+ 'color': 'var(--color-interaction-link-low-text-visited)'
366
+ },
331
367
  '.bg-level-00': {
332
368
  'background-color': 'var(--color-level-00-background)'
333
369
  },
package/dist/js/mccs_dark.d.ts CHANGED
@@ -38,18 +38,30 @@ export const ColorInteractionContainerNeutralIconHover : string;
38
38
  export const ColorInteractionContainerNeutralText : string;
39
39
  export const ColorInteractionContainerNeutralTextActive : string;
40
40
  export const ColorInteractionContainerNeutralTextHover : string;
41
- export const ColorInteractionLinkHighText : string;
42
- export const ColorInteractionLinkHighTextHover : string;
43
41
  export const ColorInteractionLinkHighIcon : string;
44
42
  export const ColorInteractionLinkHighIconHover : string;
45
- export const ColorInteractionLinkLowText : string;
46
- export const ColorInteractionLinkLowTextHover : string;
43
+ export const ColorInteractionLinkHighIconInactive : string;
44
+ export const ColorInteractionLinkHighIconVisited : string;
45
+ export const ColorInteractionLinkHighText : string;
46
+ export const ColorInteractionLinkHighTextHover : string;
47
+ export const ColorInteractionLinkHighTextInactive : string;
48
+ export const ColorInteractionLinkHighTextVisited : string;
47
49
  export const ColorInteractionLinkLowIcon : string;
48
50
  export const ColorInteractionLinkLowIconHover : string;
49
- export const ColorInteractionLinkInvertedText : string;
50
- export const ColorInteractionLinkInvertedTextHover : string;
51
+ export const ColorInteractionLinkLowIconInactive : string;
52
+ export const ColorInteractionLinkLowIconVisited : string;
53
+ export const ColorInteractionLinkLowText : string;
54
+ export const ColorInteractionLinkLowTextHover : string;
55
+ export const ColorInteractionLinkLowTextInactive : string;
56
+ export const ColorInteractionLinkLowTextVisited : string;
51
57
  export const ColorInteractionLinkInvertedIcon : string;
52
58
  export const ColorInteractionLinkInvertedIconHover : string;
59
+ export const ColorInteractionLinkInvertedIconInactive : string;
60
+ export const ColorInteractionLinkInvertedIconVisited : string;
61
+ export const ColorInteractionLinkInvertedText : string;
62
+ export const ColorInteractionLinkInvertedTextHover : string;
63
+ export const ColorInteractionLinkInvertedTextInactive : string;
64
+ export const ColorInteractionLinkInvertedTextVisited : string;
53
65
  export const ColorBlack : string;
54
66
  export const ColorWhite : string;
55
67
  export const ColorTransparent : string;
@@ -147,6 +159,7 @@ export const ColorFocusBrand : string;
147
159
  export const ColorFocusBackground : string;
148
160
  export const ColorFocusBackgroundInverted : string;
149
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
150
163
  export const ColorFocusSuccess : string;
151
164
  export const ColorRainbow1Background : string;
152
165
  export const ColorRainbow1Border : string;
@@ -455,10 +468,6 @@ export const ComponentsFieldTimeTextActive : string;
455
468
  export const ComponentsFieldTimeBorderActive : string;
456
469
  export const ComponentsCalendarBorder : string;
457
470
  export const ComponentsCalendarHeaderText : string;
458
- export const ComponentsCalendarWeeksBackground : string;
459
- export const ComponentsCalendarWeeksBackgroundHover : string;
460
- export const ComponentsCalendarWeeksText : string;
461
- export const ComponentsCalendarWeeksTextHover : string;
462
471
  export const ComponentsCalendarCellBackground : string;
463
472
  export const ComponentsCalendarCellBackgroundSelected : string;
464
473
  export const ComponentsCalendarCellBackgroundInRange : string;
@@ -473,6 +482,10 @@ export const ComponentsCalendarCellTextInRange : string;
473
482
  export const ComponentsCalendarCellTextHover : string;
474
483
  export const ComponentsCalendarCellTextOutsideMonth : string;
475
484
  export const ComponentsCalendarCellTextToday : string;
485
+ export const ComponentsCalendarWeeksBackground : string;
486
+ export const ComponentsCalendarWeeksBackgroundHover : string;
487
+ export const ComponentsCalendarWeeksText : string;
488
+ export const ComponentsCalendarWeeksTextHover : string;
476
489
  export const ComponentsCalendarBackground : string;
477
490
  export const ComponentsMenuContextualBackground : string;
478
491
  export const ComponentsMenuContextualBorder : string;