@nova-design-system/nova-base 3.0.0-beta.37 → 3.0.0-beta.39

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.
@@ -74,6 +74,8 @@
74
74
  --components-popover-background: var(--color-gray-ocean-900);
75
75
  --components-menu-contextual-item-background-hover: var(--color-interaction-container-neutral-background-hover);
76
76
  --components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
77
+ --components-field-time-background-hover: var(--color-interaction-container-neutral-background-hover);
78
+ --components-field-time-background-default: var(--color-interaction-container-neutral-background);
77
79
  --components-overlay-background: var(--color-gray-ocean-650);
78
80
  --components-button-destructive-high-icon-hover: var(--color-base-black);
79
81
  --components-button-destructive-high-icon: var(--color-base-black);
@@ -96,10 +98,10 @@
96
98
  --components-loader-brand-foreground: var(--color-petrol-500);
97
99
  --components-loader-brand-background: var(--color-petrol-900);
98
100
  --components-loader-white-foreground: var(--color-base-white);
99
- --components-list-custom-item-background-title: var(--color-interaction-container-neutral-background);
100
- --components-list-custom-item-background-disabled: var(--color-interaction-container-neutral-background);
101
- --components-list-custom-item-background-hover: var(--color-interaction-container-neutral-background-hover);
102
- --components-list-custom-item-background-default: var(--color-interaction-container-neutral-background);
101
+ --components-list-dropdown-group-title-background: var(--color-transparent);
102
+ --components-list-dropdown-item-background-disabled: var(--color-interaction-container-neutral-background);
103
+ --components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
104
+ --components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
103
105
  --components-list-native-item-content-hover: var(--color-base-white);
104
106
  --components-list-native-item-content-default: var(--color-base-white);
105
107
  --components-form-shape-foreground-default: var(--color-base-black);
@@ -226,7 +228,7 @@
226
228
  --color-content-inverted-medium-text: var(--color-gray-ocean-650);
227
229
  --color-content-inverted-high-icon: var(--color-gray-ocean-900);
228
230
  --color-content-inverted-high-text: var(--color-gray-ocean-900);
229
- --color-content-lower-text: var(--color-gray-ocean-450);
231
+ --color-content-lower-text: var(--color-gray-ocean-400);
230
232
  --color-content-low-icon: var(--color-gray-ocean-300);
231
233
  --color-content-low-text: var(--color-gray-ocean-300);
232
234
  --color-content-low-border: var(--color-gray-ocean-500);
@@ -260,6 +262,7 @@
260
262
  --color-interaction-link-high-text: var(--color-petrol-500);
261
263
  --color-interaction-container-neutral-text-active: var(--color-petrol-400);
262
264
  --color-interaction-container-neutral-icon-active: var(--color-petrol-400);
265
+ --color-interaction-container-neutral-border-active: var(--color-petrol-400);
263
266
  --color-interaction-container-neutral-background-active: var(--color-petrol-900);
264
267
  --color-interaction-container-branded-high-text-hover: var(--color-base-black);
265
268
  --color-interaction-container-branded-high-text-active: var(--color-base-black);
@@ -313,6 +316,9 @@
313
316
  --components-breadcrumb-text-hover: var(--color-interaction-link-low-text-hover);
314
317
  --components-breadcrumb-text-active: var(--color-content-medium-text);
315
318
  --components-breadcrumb-text: var(--color-content-low-text);
319
+ --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
320
+ --components-field-time-text-active: var(--color-interaction-container-neutral-text-active);
321
+ --components-field-time-background-active: var(--color-interaction-container-neutral-background-active);
316
322
  --components-avatar-content-10: var(--color-rainbow-10-icon);
317
323
  --components-avatar-content-9: var(--color-rainbow-9-text);
318
324
  --components-avatar-content-8: var(--color-rainbow-8-text);
@@ -368,11 +374,20 @@
368
374
  --components-button-destructive-lower-text: var(--color-dont-use-content);
369
375
  --components-button-destructive-lower-background-hover: var(--color-dont-use-background);
370
376
  --components-button-destructive-lower-background: var(--color-dont-use-background);
371
- --components-list-custom-border: var(--color-content-low-border);
372
- --components-list-custom-separator: var(--color-content-low-border);
373
- --components-list-custom-item-title-content: var(--color-content-low-text);
374
- --components-list-custom-item-content-disabled: var(--color-content-low-text);
375
- --components-list-custom-background: var(--color-level-00-background);
377
+ --components-list-dropdown-border: var(--color-content-low-border);
378
+ --components-list-dropdown-separator: var(--color-content-low-border);
379
+ --components-list-dropdown-group-title-content: var(--color-content-medium-text);
380
+ --components-list-dropdown-item-background-active: var(--color-interaction-container-neutral-background-active);
381
+ --components-list-dropdown-item-description-disabled: var(--color-content-lower-text);
382
+ --components-list-dropdown-item-description-hover: var(--color-content-medium-text);
383
+ --components-list-dropdown-item-description-default: var(--color-content-low-text);
384
+ --components-list-dropdown-item-label-active: var(--color-content-low-text);
385
+ --components-list-dropdown-item-label-disabled: var(--color-content-low-text);
386
+ --components-list-dropdown-item-label-hover: var(--color-content-high-text);
387
+ --components-list-dropdown-item-label-default: var(--color-content-medium-text);
388
+ --components-list-dropdown-item-border-active: var(--color-interaction-container-neutral-border-active);
389
+ --components-list-dropdown-header-background: var(--color-level-10-background);
390
+ --components-list-dropdown-background: var(--color-level-00-background);
376
391
  --components-form-shape-foreground-disabled-error: var(--color-feedback-error-high-background);
377
392
  --components-form-shape-foreground-switch-dot: var(--color-content-medium-border);
378
393
  --components-form-shape-border-success: var(--color-feedback-success-low-border);
@@ -451,8 +466,8 @@
451
466
  --color-interaction-container-neutral-border: var(--color-content-low-text);
452
467
  --components-menu-contextual-item-content-hover: var(--color-interaction-container-neutral-text-hover);
453
468
  --components-menu-contextual-item-content: var(--color-interaction-container-neutral-text);
454
- --components-list-custom-item-content-hover: var(--color-interaction-container-neutral-text-hover);
455
- --components-list-custom-item-content-default: var(--color-interaction-container-neutral-text);
469
+ --components-field-time-text-hover: var(--color-interaction-container-neutral-text-hover);
470
+ --components-field-time-text-default: var(--color-interaction-container-neutral-text);
456
471
  --components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
457
472
  --components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
458
473
  --components-button-lower-text: var(--color-interaction-container-neutral-text);
@@ -559,6 +574,8 @@
559
574
  --components-popover-background: var(--color-gray-ocean-00);
560
575
  --components-menu-contextual-item-background-hover: var(--color-interaction-container-neutral-background-hover);
561
576
  --components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
577
+ --components-field-time-background-hover: var(--color-interaction-container-neutral-background-hover);
578
+ --components-field-time-background-default: var(--color-interaction-container-neutral-background);
562
579
  --components-overlay-background: var(--color-gray-ocean-850);
563
580
  --components-button-destructive-high-icon-hover: var(--color-base-white);
564
581
  --components-button-destructive-high-icon: var(--color-base-white);
@@ -581,10 +598,10 @@
581
598
  --components-loader-brand-foreground: var(--color-petrol-500);
582
599
  --components-loader-brand-background: var(--color-petrol-50);
583
600
  --components-loader-white-foreground: var(--color-base-white);
584
- --components-list-custom-item-background-title: var(--color-interaction-container-neutral-background);
585
- --components-list-custom-item-background-disabled: var(--color-interaction-container-neutral-background);
586
- --components-list-custom-item-background-hover: var(--color-interaction-container-neutral-background-hover);
587
- --components-list-custom-item-background-default: var(--color-interaction-container-neutral-background);
601
+ --components-list-dropdown-group-title-background: var(--color-transparent);
602
+ --components-list-dropdown-item-background-disabled: var(--color-interaction-container-neutral-background);
603
+ --components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
604
+ --components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
588
605
  --components-list-native-item-content-hover: var(--color-base-white);
589
606
  --components-list-native-item-content-default: var(--color-base-white);
590
607
  --components-form-shape-foreground-default: var(--color-base-white);
@@ -745,6 +762,7 @@
745
762
  --color-interaction-link-high-text: var(--color-petrol-600);
746
763
  --color-interaction-container-neutral-text-active: var(--color-petrol-700);
747
764
  --color-interaction-container-neutral-icon-active: var(--color-petrol-700);
765
+ --color-interaction-container-neutral-border-active: var(--color-petrol-700);
748
766
  --color-interaction-container-neutral-background-active: var(--color-petrol-50);
749
767
  --color-interaction-container-branded-high-text-hover: var(--color-base-white);
750
768
  --color-interaction-container-branded-high-text-active: var(--color-base-white);
@@ -798,6 +816,9 @@
798
816
  --components-breadcrumb-text-hover: var(--color-interaction-link-low-text-hover);
799
817
  --components-breadcrumb-text-active: var(--color-content-medium-text);
800
818
  --components-breadcrumb-text: var(--color-content-low-text);
819
+ --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
820
+ --components-field-time-text-active: var(--color-interaction-container-neutral-text-active);
821
+ --components-field-time-background-active: var(--color-interaction-container-neutral-background-active);
801
822
  --components-avatar-content-10: var(--color-rainbow-10-icon);
802
823
  --components-avatar-content-9: var(--color-rainbow-9-text);
803
824
  --components-avatar-content-8: var(--color-rainbow-8-text);
@@ -853,11 +874,20 @@
853
874
  --components-button-destructive-lower-text: var(--color-dont-use-content);
854
875
  --components-button-destructive-lower-background-hover: var(--color-dont-use-background);
855
876
  --components-button-destructive-lower-background: var(--color-dont-use-background);
856
- --components-list-custom-border: var(--color-content-low-border);
857
- --components-list-custom-separator: var(--color-content-low-border);
858
- --components-list-custom-item-title-content: var(--color-content-low-text);
859
- --components-list-custom-item-content-disabled: var(--color-content-low-text);
860
- --components-list-custom-background: var(--color-level-00-background);
877
+ --components-list-dropdown-border: var(--color-content-low-border);
878
+ --components-list-dropdown-separator: var(--color-content-low-border);
879
+ --components-list-dropdown-group-title-content: var(--color-content-medium-text);
880
+ --components-list-dropdown-item-background-active: var(--color-interaction-container-neutral-background-active);
881
+ --components-list-dropdown-item-description-disabled: var(--color-content-lower-text);
882
+ --components-list-dropdown-item-description-hover: var(--color-content-medium-text);
883
+ --components-list-dropdown-item-description-default: var(--color-content-low-text);
884
+ --components-list-dropdown-item-label-active: var(--color-content-low-text);
885
+ --components-list-dropdown-item-label-disabled: var(--color-content-low-text);
886
+ --components-list-dropdown-item-label-hover: var(--color-content-high-text);
887
+ --components-list-dropdown-item-label-default: var(--color-content-medium-text);
888
+ --components-list-dropdown-item-border-active: var(--color-interaction-container-neutral-border-active);
889
+ --components-list-dropdown-header-background: var(--color-level-10-background);
890
+ --components-list-dropdown-background: var(--color-level-00-background);
861
891
  --components-form-shape-foreground-disabled-error: var(--color-feedback-error-high-background);
862
892
  --components-form-shape-foreground-switch-dot: var(--color-content-medium-border);
863
893
  --components-form-shape-border-success: var(--color-feedback-success-low-border);
@@ -936,8 +966,8 @@
936
966
  --color-interaction-container-neutral-border: var(--color-content-inverted-low-text);
937
967
  --components-menu-contextual-item-content-hover: var(--color-interaction-container-neutral-text-hover);
938
968
  --components-menu-contextual-item-content: var(--color-interaction-container-neutral-text);
939
- --components-list-custom-item-content-hover: var(--color-interaction-container-neutral-text-hover);
940
- --components-list-custom-item-content-default: var(--color-interaction-container-neutral-text);
969
+ --components-field-time-text-hover: var(--color-interaction-container-neutral-text-hover);
970
+ --components-field-time-text-default: var(--color-interaction-container-neutral-text);
941
971
  --components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
942
972
  --components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
943
973
  --components-button-lower-text: var(--color-interaction-container-neutral-text);
@@ -1064,12 +1094,6 @@
1064
1094
  --color-turquoise-200: #b8d6d2;
1065
1095
  --color-turquoise-100: #d2e5e3;
1066
1096
  --color-turquoise-50: #ecf4f3;
1067
- --color-red-mccs-00: #ff6161;
1068
- --color-red-mccs-500: #450000;
1069
- --color-red-mccs-400: #7d0000;
1070
- --color-red-mccs-300: #ae0303;
1071
- --color-red-mccs-200: #d00202;
1072
- --color-red-mccs-100: #ff3838;
1073
1097
  --color-red-900: #3d0909;
1074
1098
  --color-red-800: #610e0e;
1075
1099
  --color-red-700: #851313;
@@ -1252,6 +1276,7 @@
1252
1276
  --popover-font-weight: 500;
1253
1277
  --menu-contextual-item-font-weight: 500;
1254
1278
  --menu-contextual-divider-padding-bottom: 3px;
1279
+ --form-field-badge-gap: 0px;
1255
1280
  --list-native-separator-padding-y: 3px;
1256
1281
  --list-native-separator-padding-x: 9px;
1257
1282
  --button-lg-ring-radius: 9px;
@@ -1293,53 +1318,6 @@
1293
1318
  --loader-size-md: var(--spacing-6);
1294
1319
  --loader-size-sm: var(--spacing-5);
1295
1320
  --loader-size-xs: var(--spacing-4);
1296
- --form-toggle-width: var(--spacing-9);
1297
- --form-toggle-switch-dot-selected: var(--spacing-3-5);
1298
- --form-toggle-switch-dot-default: var(--spacing-3);
1299
- --form-toggle-padding-selected: var(--spacing-0-5);
1300
- --form-toggle-padding-default: var(--spacing-1);
1301
- --form-toggle-radius: var(--radius-rounded-full);
1302
- --form-toggle-padding-top: var(--spacing-0);
1303
- --form-toggle-height: var(--spacing-5);
1304
- --form-toggle-border-width: var(--spacing-0-5);
1305
- --form-radio-ring-radius: var(--radius-rounded-full);
1306
- --form-radio-size: var(--spacing-5);
1307
- --form-radio-padding-top: var(--spacing-0);
1308
- --form-radio-inner-circle-size: var(--spacing-2);
1309
- --form-radio-inner-circle-padding: var(--spacing-1-5);
1310
- --form-radio-border-width: var(--spacing-0-5);
1311
- --form-checkbox-icon-stroke: var(--spacing-0-5);
1312
- --form-checkbox-ring-radius: var(--radius-rounded-lg);
1313
- --form-checkbox-size: var(--spacing-5);
1314
- --form-checkbox-radius: var(--radius-rounded-md);
1315
- --form-checkbox-padding-top: var(--spacing-0);
1316
- --form-checkbox-icon-size: var(--spacing-3-5);
1317
- --form-checkbox-border-width: var(--spacing-0-5);
1318
- --form-field-inner-button-padding-y: var(--spacing-2-5);
1319
- --form-field-inner-button-padding-x-int: var(--spacing-1-5);
1320
- --form-field-inner-button-padding-x-ext: var(--spacing-2-5);
1321
- --form-field-leading-trailing-line-height: var(--line-height-base);
1322
- --form-field-leading-trailing-icon-size: var(--spacing-5);
1323
- --form-field-leading-trailing-font-size: var(--font-size-sm);
1324
- --form-field-radius: var(--radius-rounded-md);
1325
- --form-field-padding-y: var(--spacing-2);
1326
- --form-field-padding-x-icon-button: var(--spacing-10);
1327
- --form-field-padding-x: var(--spacing-2);
1328
- --form-field-line-height: var(--line-height-base);
1329
- --form-field-gap-inner: var(--spacing-2);
1330
- --form-field-gap: var(--spacing-2);
1331
- --form-field-icon-size: var(--spacing-5);
1332
- --form-field-font-weight: var(--font-weight-medium-emphasis);
1333
- --form-field-font-size: var(--font-size-md);
1334
- --form-label-font-weight: var(--font-weight-medium-emphasis);
1335
- --form-label-line-height: var(--line-height-sm);
1336
- --form-label-gap: var(--spacing-1);
1337
- --form-label-font-size: var(--font-size-sm);
1338
- --form-description-font-weight: var(--font-weight-low-emphasis);
1339
- --form-description-line-height: var(--line-height-sm);
1340
- --form-description-font-size: var(--font-size-sm);
1341
- --form-gap-y: var(--spacing-1);
1342
- --form-gap-x: var(--spacing-3);
1343
1321
  --focus-outline-stroke: var(--spacing-0-5);
1344
1322
  --focus-outline-offset: var(--spacing-0-5);
1345
1323
  --focus-field-stroke: var(--spacing-px);
@@ -1446,21 +1424,71 @@
1446
1424
  --menu-contextual-item-font-size: var(--font-size-sm);
1447
1425
  --menu-contextual-divider-padding-x: var(--spacing-2-5);
1448
1426
  --menu-contextual-divider-padding-top: var(--spacing-1);
1449
- --list-custom-sub-item-padding-left: var(--spacing-10);
1450
- --list-custom-separator-padding-y: var(--spacing-0-5);
1451
- --list-custom-separator-padding-x: var(--spacing-0);
1452
- --list-custom-padding: var(--spacing-2);
1453
- --list-custom-radius: var(--radius-rounded-md);
1454
- --list-custom-gap-y: var(--spacing-0-5);
1455
- --list-custom-item-radius: var(--radius-rounded-md);
1456
- --list-custom-item-gap-x: var(--spacing-3);
1457
- --list-custom-item-padding-y: var(--spacing-2);
1458
- --list-custom-item-padding-x: var(--spacing-2);
1459
- --list-custom-item-padding-right: var(--spacing-2);
1460
- --list-custom-item-padding-left: var(--spacing-8);
1461
- --list-custom-line-height: var(--line-height-base);
1462
- --list-custom-font-size: var(--font-size-md);
1463
- --list-custom-icon-size: var(--spacing-5);
1427
+ --form-toggle-width: var(--spacing-9);
1428
+ --form-toggle-switch-dot-selected: var(--spacing-3-5);
1429
+ --form-toggle-switch-dot-default: var(--spacing-3);
1430
+ --form-toggle-padding-selected: var(--spacing-0-5);
1431
+ --form-toggle-padding-default: var(--spacing-1);
1432
+ --form-toggle-radius: var(--radius-rounded-full);
1433
+ --form-toggle-padding-top: var(--spacing-0);
1434
+ --form-toggle-height: var(--spacing-5);
1435
+ --form-toggle-border-width: var(--spacing-0-5);
1436
+ --form-radio-ring-radius: var(--radius-rounded-full);
1437
+ --form-radio-size: var(--spacing-5);
1438
+ --form-radio-padding-top: var(--spacing-0);
1439
+ --form-radio-inner-circle-size: var(--spacing-2);
1440
+ --form-radio-inner-circle-padding: var(--spacing-1-5);
1441
+ --form-radio-border-width: var(--spacing-0-5);
1442
+ --form-checkbox-icon-stroke: var(--spacing-0-5);
1443
+ --form-checkbox-ring-radius: var(--radius-rounded-lg);
1444
+ --form-checkbox-size: var(--spacing-5);
1445
+ --form-checkbox-radius: var(--radius-rounded-md);
1446
+ --form-checkbox-padding-top: var(--spacing-0);
1447
+ --form-checkbox-icon-size: var(--spacing-3-5);
1448
+ --form-checkbox-border-width: var(--spacing-0-5);
1449
+ --form-label-font-weight: var(--font-weight-medium-emphasis);
1450
+ --form-label-line-height: var(--line-height-sm);
1451
+ --form-label-gap: var(--spacing-1);
1452
+ --form-label-font-size: var(--font-size-sm);
1453
+ --form-description-font-weight: var(--font-weight-low-emphasis);
1454
+ --form-description-line-height: var(--line-height-sm);
1455
+ --form-description-font-size: var(--font-size-sm);
1456
+ --form-gap-y: var(--spacing-1);
1457
+ --form-gap-x: var(--spacing-3);
1458
+ --form-field-inner-button-padding-y: var(--spacing-2-5);
1459
+ --form-field-inner-button-padding-x-int: var(--spacing-1-5);
1460
+ --form-field-inner-button-padding-x-ext: var(--spacing-2-5);
1461
+ --form-field-leading-trailing-line-height: var(--line-height-base);
1462
+ --form-field-leading-trailing-icon-size: var(--spacing-5);
1463
+ --form-field-leading-trailing-font-size: var(--font-size-sm);
1464
+ --form-field-radius: var(--radius-rounded-md);
1465
+ --form-field-padding-y: var(--spacing-2);
1466
+ --form-field-padding-x-icon-button: var(--spacing-10);
1467
+ --form-field-padding-x: var(--spacing-2);
1468
+ --form-field-line-height: var(--line-height-base);
1469
+ --form-field-gap-inner: var(--spacing-2);
1470
+ --form-field-gap: var(--spacing-2);
1471
+ --form-field-icon-size: var(--spacing-5);
1472
+ --form-field-font-weight: var(--font-weight-medium-emphasis);
1473
+ --form-field-font-size: var(--font-size-md);
1474
+ --form-field-badge-padding-y: var(--spacing-0-5);
1475
+ --form-field-badge-padding-x: var(--spacing-1);
1476
+ --list-multiselect-padding: var(--spacing-3);
1477
+ --list-dropdown-sub-item-padding-left: var(--spacing-10);
1478
+ --list-dropdown-separator-padding-y: var(--spacing-0-5);
1479
+ --list-dropdown-separator-padding-x: var(--spacing-0);
1480
+ --list-dropdown-padding: var(--spacing-2);
1481
+ --list-dropdown-radius: var(--radius-rounded-md);
1482
+ --list-dropdown-gap-y: var(--spacing-0-5);
1483
+ --list-dropdown-item-radius: var(--radius-rounded-md);
1484
+ --list-dropdown-item-gap-x: var(--spacing-3);
1485
+ --list-dropdown-item-padding-y: var(--spacing-2);
1486
+ --list-dropdown-item-padding-x: var(--spacing-2);
1487
+ --list-dropdown-item-padding-right: var(--spacing-2);
1488
+ --list-dropdown-item-padding-left: var(--spacing-8);
1489
+ --list-dropdown-line-height: var(--line-height-base);
1490
+ --list-dropdown-font-size: var(--font-size-md);
1491
+ --list-dropdown-icon-size: var(--spacing-5);
1464
1492
  --list-native-sub-item-padding-left: var(--spacing-8);
1465
1493
  --list-native-padding: var(--spacing-2);
1466
1494
  --list-native-radius: var(--radius-rounded-md);