@salt-ds/theme 1.31.0 → 1.33.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 (5) hide show
  1. package/css/global.css +3 -3
  2. package/css/theme-next.css +36 -21
  3. package/css/theme.css +14 -8
  4. package/index.css +17 -11
  5. package/package.json +2 -2
package/css/global.css CHANGED
@@ -6,15 +6,15 @@
6
6
  letter-spacing: var(--salt-text-letterSpacing);
7
7
  line-height: var(--salt-text-lineHeight);
8
8
  }
9
- .salt-theme ::selection {
10
- background: var(--salt-content-foreground-highlight);
11
- }
12
9
  .salt-theme[data-mode=light] {
13
10
  color-scheme: light;
14
11
  }
15
12
  .salt-theme[data-mode=dark] {
16
13
  color-scheme: dark;
17
14
  }
15
+ :where(.salt-theme) :focus-visible {
16
+ outline: var(--salt-focused-outline);
17
+ }
18
18
  .salt-visuallyHidden {
19
19
  position: absolute;
20
20
  height: 1px;
package/css/theme-next.css CHANGED
@@ -575,32 +575,34 @@
575
575
  .salt-theme.salt-theme-next[data-mode=light] {
576
576
  --salt-palette-info: var(--salt-color-blue-500);
577
577
  --salt-palette-info-strong: var(--salt-color-blue-600);
578
- --salt-palette-info-weak: var(--salt-color-blue-100);
578
+ --salt-palette-info-weakest: var(--salt-color-blue-100);
579
579
  }
580
580
  .salt-theme.salt-theme-next[data-mode=dark] {
581
581
  --salt-palette-info: var(--salt-color-blue-500);
582
582
  --salt-palette-info-strong: var(--salt-color-blue-400);
583
- --salt-palette-info-weak: var(--salt-color-blue-900);
583
+ --salt-palette-info-weakest: var(--salt-color-blue-900);
584
584
  }
585
585
 
586
586
  /* css/palette/negative-next.css */
587
587
  .salt-theme.salt-theme-next[data-mode=light] {
588
588
  --salt-palette-negative: var(--salt-color-red-500);
589
+ --salt-palette-negative-disabled: var(--salt-color-red-500-40a);
589
590
  --salt-palette-negative-strong: var(--salt-color-red-600);
590
591
  --salt-palette-negative-strong-disabled: var(--salt-color-red-600-40a);
591
- --salt-palette-negative-weak: var(--salt-color-red-100);
592
+ --salt-palette-negative-weaker: var(--salt-color-red-200);
593
+ --salt-palette-negative-weakest: var(--salt-color-red-100);
592
594
  --salt-palette-negative-action-hover: var(--salt-color-red-600);
593
595
  --salt-palette-negative-action-active: var(--salt-color-red-800);
594
- --salt-palette-negative-disabled: var(--salt-color-red-500-40a);
595
596
  }
596
597
  .salt-theme.salt-theme-next[data-mode=dark] {
597
598
  --salt-palette-negative: var(--salt-color-red-500);
599
+ --salt-palette-negative-disabled: var(--salt-color-red-500-40a);
598
600
  --salt-palette-negative-strong: var(--salt-color-red-400);
599
601
  --salt-palette-negative-strong-disabled: var(--salt-color-red-400-40a);
600
- --salt-palette-negative-weak: var(--salt-color-red-900);
602
+ --salt-palette-negative-weaker: var(--salt-color-red-800);
603
+ --salt-palette-negative-weakest: var(--salt-color-red-900);
601
604
  --salt-palette-negative-action-hover: var(--salt-color-red-600);
602
605
  --salt-palette-negative-action-active: var(--salt-color-red-800);
603
- --salt-palette-negative-disabled: var(--salt-color-red-500-40a);
604
606
  }
605
607
 
606
608
  /* css/palette/neutral-next.css */
@@ -642,21 +644,23 @@
642
644
  /* css/palette/positive-next.css */
643
645
  .salt-theme.salt-theme-next[data-mode=light] {
644
646
  --salt-palette-positive: var(--salt-color-green-500);
647
+ --salt-palette-positive-disabled: var(--salt-color-green-500-40a);
645
648
  --salt-palette-positive-strong: var(--salt-color-green-600);
646
649
  --salt-palette-positive-strong-disabled: var(--salt-color-green-600-40a);
647
- --salt-palette-positive-weak: var(--salt-color-green-100);
650
+ --salt-palette-positive-weaker: var(--salt-color-green-200);
651
+ --salt-palette-positive-weakest: var(--salt-color-green-100);
648
652
  --salt-palette-positive-action-hover: var(--salt-color-green-600);
649
653
  --salt-palette-positive-action-active: var(--salt-color-green-800);
650
- --salt-palette-positive-disabled: var(--salt-color-green-500-40a);
651
654
  }
652
655
  .salt-theme.salt-theme-next[data-mode=dark] {
653
656
  --salt-palette-positive: var(--salt-color-green-500);
657
+ --salt-palette-positive-disabled: var(--salt-color-green-500-40a);
654
658
  --salt-palette-positive-strong: var(--salt-color-green-400);
655
659
  --salt-palette-positive-strong-disabled: var(--salt-color-green-400-40a);
656
- --salt-palette-positive-weak: var(--salt-color-green-900);
660
+ --salt-palette-positive-weaker: var(--salt-color-green-800);
661
+ --salt-palette-positive-weakest: var(--salt-color-green-900);
657
662
  --salt-palette-positive-action-hover: var(--salt-color-green-600);
658
663
  --salt-palette-positive-action-active: var(--salt-color-green-800);
659
- --salt-palette-positive-disabled: var(--salt-color-green-500-40a);
660
664
  }
661
665
 
662
666
  /* css/palette/text-next.css */
@@ -705,7 +709,8 @@
705
709
  --salt-palette-warning-disabled: var(--salt-color-orange-500-40a);
706
710
  --salt-palette-warning-strong: var(--salt-color-orange-600);
707
711
  --salt-palette-warning-strong-disabled: var(--salt-color-orange-600-40a);
708
- --salt-palette-warning-weak: var(--salt-color-orange-100);
712
+ --salt-palette-warning-weaker: var(--salt-color-orange-200);
713
+ --salt-palette-warning-weakest: var(--salt-color-orange-100);
709
714
  --salt-palette-warning-action-hover: var(--salt-color-orange-600);
710
715
  --salt-palette-warning-action-active: var(--salt-color-orange-800);
711
716
  }
@@ -714,7 +719,8 @@
714
719
  --salt-palette-warning-disabled: var(--salt-color-orange-500-40a);
715
720
  --salt-palette-warning-strong: var(--salt-color-orange-400);
716
721
  --salt-palette-warning-strong-disabled: var(--salt-color-orange-400-40a);
717
- --salt-palette-warning-weak: var(--salt-color-orange-900);
722
+ --salt-palette-warning-weaker: var(--salt-color-orange-800);
723
+ --salt-palette-warning-weakest: var(--salt-color-orange-900);
718
724
  --salt-palette-warning-action-hover: var(--salt-color-orange-600);
719
725
  --salt-palette-warning-action-active: var(--salt-color-orange-800);
720
726
  }
@@ -996,7 +1002,6 @@
996
1002
  .salt-theme.salt-theme-next {
997
1003
  --salt-navigable-indicator-hover: var(--salt-palette-neutral);
998
1004
  --salt-navigable-accent-indicator-active: var(--salt-palette-accent);
999
- --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
1000
1005
  --salt-navigable-accent-background-active: var(--salt-palette-accent-weakest);
1001
1006
  --salt-navigable-accent-borderColor-active: var(--salt-palette-accent);
1002
1007
  }
@@ -1004,6 +1009,7 @@
1004
1009
  /* css/characteristics/overlayable-next.css */
1005
1010
  .salt-theme.salt-theme-next {
1006
1011
  --salt-overlayable-background: var(--salt-palette-alpha-higher);
1012
+ --salt-overlayable-background-hover: var(--salt-palette-alpha-contrast-lowest);
1007
1013
  --salt-overlayable-background-highlight: var(--salt-palette-alpha-contrast-medium);
1008
1014
  --salt-overlayable-background-rangeSelection: var(--salt-palette-alpha-contrast-mediumLow);
1009
1015
  }
@@ -1015,7 +1021,7 @@
1015
1021
  --salt-selectable-borderColor-selected: var(--salt-palette-accent);
1016
1022
  --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-accent-disabled);
1017
1023
  --salt-selectable-borderColor-disabled: var(--salt-palette-neutral-disabled);
1018
- --salt-selectable-borderColor-readonly: var(--salt-palette-neutral-readonly);
1024
+ --salt-selectable-borderColor-readonly: var(--salt-palette-neutral);
1019
1025
  --salt-selectable-foreground: var(--salt-palette-neutral-strong);
1020
1026
  --salt-selectable-foreground-disabled: var(--salt-palette-neutral-strong-disabled);
1021
1027
  --salt-selectable-foreground-hover: var(--salt-palette-accent-weak);
@@ -1065,17 +1071,17 @@
1065
1071
  --salt-status-success-borderColor: var(--salt-palette-positive);
1066
1072
  --salt-status-warning-borderColor: var(--salt-palette-warning);
1067
1073
  --salt-status-error-borderColor: var(--salt-palette-negative);
1068
- --salt-status-info-background: var(--salt-palette-info-weak);
1069
- --salt-status-success-background: var(--salt-palette-positive-weak);
1070
- --salt-status-warning-background: var(--salt-palette-warning-weak);
1071
- --salt-status-error-background: var(--salt-palette-negative-weak);
1074
+ --salt-status-info-background: var(--salt-palette-info-weakest);
1075
+ --salt-status-success-background: var(--salt-palette-positive-weakest);
1076
+ --salt-status-warning-background: var(--salt-palette-warning-weakest);
1077
+ --salt-status-error-background: var(--salt-palette-negative-weakest);
1072
1078
  --salt-status-info-bold-background: var(--salt-palette-info);
1073
1079
  --salt-status-error-bold-background: var(--salt-palette-negative);
1074
1080
  --salt-status-warning-bold-background: var(--salt-palette-warning);
1075
1081
  --salt-status-success-bold-background: var(--salt-palette-positive);
1076
- --salt-status-success-background-selected: var(--salt-palette-positive-weak);
1077
- --salt-status-warning-background-selected: var(--salt-palette-warning-weak);
1078
- --salt-status-error-background-selected: var(--salt-palette-negative-weak);
1082
+ --salt-status-success-background-selected: var(--salt-palette-positive-weaker);
1083
+ --salt-status-warning-background-selected: var(--salt-palette-warning-weaker);
1084
+ --salt-status-error-background-selected: var(--salt-palette-negative-weaker);
1079
1085
  }
1080
1086
 
1081
1087
  /* css/characteristics/target-next.css */
@@ -1129,6 +1135,7 @@
1129
1135
  /* css/deprecated/characteristics-next.css */
1130
1136
  .salt-theme.salt-theme-next {
1131
1137
  --salt-navigable-indicator-active: var(--salt-palette-accent);
1138
+ --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
1132
1139
  --salt-selectable-background-blurSelected: var(--salt-palette-neutral-weakest);
1133
1140
  --salt-status-static-foreground: var(--salt-palette-foreground-secondary);
1134
1141
  --salt-status-negative-foreground: var(--salt-palette-negative);
@@ -1147,10 +1154,18 @@
1147
1154
  .salt-theme[data-mode=light] {
1148
1155
  --salt-palette-foreground-active: var(--salt-color-blue-700);
1149
1156
  --salt-palette-foreground-hover: var(--salt-color-blue-600);
1157
+ --salt-palette-warning-weak: var(--salt-color-orange-100);
1158
+ --salt-palette-positive-weak: var(--salt-color-green-100);
1159
+ --salt-palette-info-weak: var(--salt-color-blue-100);
1160
+ --salt-palette-negative-weak: var(--salt-color-red-100);
1150
1161
  }
1151
1162
  .salt-theme[data-mode=dark] {
1152
1163
  --salt-palette-foreground-active: var(--salt-color-blue-300);
1153
1164
  --salt-palette-foreground-hover: var(--salt-color-blue-400);
1165
+ --salt-palette-warning-weak: var(--salt-color-orange-900);
1166
+ --salt-palette-positive-weak: var(--salt-color-green-900);
1167
+ --salt-palette-info-weak: var(--salt-color-blue-900);
1168
+ --salt-palette-negative-weak: var(--salt-color-red-900);
1154
1169
  }
1155
1170
 
1156
1171
  /* css/theme-next.css */
package/css/theme.css CHANGED
@@ -324,6 +324,10 @@
324
324
  194,
325
325
  52,
326
326
  7;
327
+ --salt-color-orange-875-rgb:
328
+ 138,
329
+ 43,
330
+ 15;
327
331
  --salt-color-orange-900-rgb:
328
332
  54,
329
333
  44,
@@ -654,6 +658,7 @@
654
658
  --salt-color-orange-700: rgb(var(--salt-color-orange-700-rgb));
655
659
  --salt-color-orange-800: rgb(var(--salt-color-orange-800-rgb));
656
660
  --salt-color-orange-850: rgb(var(--salt-color-orange-850-rgb));
661
+ --salt-color-orange-875: rgb(var(--salt-color-orange-875-rgb));
657
662
  --salt-color-orange-900: rgb(var(--salt-color-orange-900-rgb));
658
663
  --salt-color-green-10: rgb(var(--salt-color-green-10-rgb));
659
664
  --salt-color-green-20: rgb(var(--salt-color-green-20-rgb));
@@ -1189,7 +1194,7 @@
1189
1194
  .salt-theme[data-mode=light] {
1190
1195
  --salt-palette-error-background: var(--salt-color-red-10);
1191
1196
  --salt-palette-error-bold-background: var(--salt-color-red-500);
1192
- --salt-palette-error-background-selected: var(--salt-color-red-20);
1197
+ --salt-palette-error-background-selected: var(--salt-color-red-30);
1193
1198
  --salt-palette-error-border: var(--salt-color-red-500);
1194
1199
  --salt-palette-error-foreground-decorative: var(--salt-color-red-500);
1195
1200
  --salt-palette-error-foreground-informative: var(--salt-color-red-600);
@@ -1197,7 +1202,7 @@
1197
1202
  .salt-theme[data-mode=dark] {
1198
1203
  --salt-palette-error-background: var(--salt-color-red-900);
1199
1204
  --salt-palette-error-bold-background: var(--salt-color-red-500);
1200
- --salt-palette-error-background-selected: var(--salt-color-red-900);
1205
+ --salt-palette-error-background-selected: var(--salt-color-red-800);
1201
1206
  --salt-palette-error-border: var(--salt-color-red-400);
1202
1207
  --salt-palette-error-foreground-decorative: var(--salt-color-red-400);
1203
1208
  --salt-palette-error-foreground-informative: var(--salt-color-red-200);
@@ -1525,7 +1530,7 @@
1525
1530
  .salt-theme[data-mode=light] {
1526
1531
  --salt-palette-success-background: var(--salt-color-green-10);
1527
1532
  --salt-palette-success-bold-background: var(--salt-color-green-500);
1528
- --salt-palette-success-background-selected: var(--salt-color-green-20);
1533
+ --salt-palette-success-background-selected: var(--salt-color-green-30);
1529
1534
  --salt-palette-success-border: var(--salt-color-green-500);
1530
1535
  --salt-palette-success-foreground-decorative: var(--salt-color-green-500);
1531
1536
  --salt-palette-success-foreground-informative: var(--salt-color-green-600);
@@ -1533,7 +1538,7 @@
1533
1538
  .salt-theme[data-mode=dark] {
1534
1539
  --salt-palette-success-background: var(--salt-color-green-900);
1535
1540
  --salt-palette-success-bold-background: var(--salt-color-green-500);
1536
- --salt-palette-success-background-selected: var(--salt-color-green-900);
1541
+ --salt-palette-success-background-selected: var(--salt-color-green-800);
1537
1542
  --salt-palette-success-border: var(--salt-color-green-400);
1538
1543
  --salt-palette-success-foreground-decorative: var(--salt-color-green-400);
1539
1544
  --salt-palette-success-foreground-informative: var(--salt-color-green-200);
@@ -1566,7 +1571,7 @@
1566
1571
  .salt-theme[data-mode=light] {
1567
1572
  --salt-palette-warning-background: var(--salt-color-orange-10);
1568
1573
  --salt-palette-warning-bold-background: var(--salt-color-orange-800);
1569
- --salt-palette-warning-background-selected: var(--salt-color-orange-20);
1574
+ --salt-palette-warning-background-selected: var(--salt-color-orange-30);
1570
1575
  --salt-palette-warning-border: var(--salt-color-orange-700);
1571
1576
  --salt-palette-warning-border-disabled: var(--salt-color-orange-700-40a);
1572
1577
  --salt-palette-warning-foreground-decorative: var(--salt-color-orange-700);
@@ -1582,7 +1587,7 @@
1582
1587
  .salt-theme[data-mode=dark] {
1583
1588
  --salt-palette-warning-background: var(--salt-color-orange-900);
1584
1589
  --salt-palette-warning-bold-background: var(--salt-color-orange-800);
1585
- --salt-palette-warning-background-selected: var(--salt-color-orange-900);
1590
+ --salt-palette-warning-background-selected: var(--salt-color-orange-875);
1586
1591
  --salt-palette-warning-border: var(--salt-color-orange-500);
1587
1592
  --salt-palette-warning-border-disabled: var(--salt-color-orange-500-40a);
1588
1593
  --salt-palette-warning-foreground-decorative: var(--salt-color-orange-500);
@@ -1962,7 +1967,6 @@
1962
1967
  .salt-theme {
1963
1968
  --salt-navigable-indicator-hover: var(--salt-palette-navigate-indicator-hover);
1964
1969
  --salt-navigable-accent-indicator-active: var(--salt-palette-navigate-indicator-active);
1965
- --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
1966
1970
  --salt-navigable-accent-background-active: var(--salt-palette-alpha-none);
1967
1971
  --salt-navigable-accent-borderColor-active: var(--salt-palette-interact-border-active);
1968
1972
  }
@@ -1977,6 +1981,7 @@
1977
1981
  --salt-overlayable-shadow-drag: var(--salt-shadow-400);
1978
1982
  --salt-overlayable-shadow-modal: var(--salt-shadow-500);
1979
1983
  --salt-overlayable-background: var(--salt-palette-alpha-higher);
1984
+ --salt-overlayable-background-hover: var(--salt-palette-alpha-contrast-lowest);
1980
1985
  --salt-overlayable-background-highlight: var(--salt-palette-alpha-contrast-medium);
1981
1986
  --salt-overlayable-background-rangeSelection: var(--salt-palette-alpha-contrast-mediumLow);
1982
1987
  }
@@ -1988,7 +1993,7 @@
1988
1993
  --salt-selectable-borderColor-selected: var(--salt-palette-interact-border-active);
1989
1994
  --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-interact-border-activeDisabled);
1990
1995
  --salt-selectable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
1991
- --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border-readonly);
1996
+ --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border);
1992
1997
  --salt-selectable-foreground: var(--salt-palette-interact-foreground);
1993
1998
  --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
1994
1999
  --salt-selectable-foreground-hover: var(--salt-palette-interact-foreground-hover);
@@ -2390,6 +2395,7 @@
2390
2395
  --salt-navigable-fontWeight-hover: var(--salt-typography-fontWeight-regular);
2391
2396
  --salt-navigable-fontWeight-active: var(--salt-typography-fontWeight-semiBold);
2392
2397
  --salt-navigable-fontWeight-edit: var(--salt-typography-fontWeight-regular);
2398
+ --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
2393
2399
  --salt-accent-fontWeight: var(--salt-typography-fontWeight-semiBold);
2394
2400
  --salt-accent-foreground-disabled: var(--salt-palette-accent-foreground-disabled);
2395
2401
  --salt-track-borderStyle: solid;
package/index.css CHANGED
@@ -6,15 +6,15 @@
6
6
  letter-spacing: var(--salt-text-letterSpacing);
7
7
  line-height: var(--salt-text-lineHeight);
8
8
  }
9
- .salt-theme ::selection {
10
- background: var(--salt-content-foreground-highlight);
11
- }
12
9
  .salt-theme[data-mode=light] {
13
10
  color-scheme: light;
14
11
  }
15
12
  .salt-theme[data-mode=dark] {
16
13
  color-scheme: dark;
17
14
  }
15
+ :where(.salt-theme) :focus-visible {
16
+ outline: var(--salt-focused-outline);
17
+ }
18
18
  .salt-visuallyHidden {
19
19
  position: absolute;
20
20
  height: 1px;
@@ -353,6 +353,10 @@
353
353
  194,
354
354
  52,
355
355
  7;
356
+ --salt-color-orange-875-rgb:
357
+ 138,
358
+ 43,
359
+ 15;
356
360
  --salt-color-orange-900-rgb:
357
361
  54,
358
362
  44,
@@ -683,6 +687,7 @@
683
687
  --salt-color-orange-700: rgb(var(--salt-color-orange-700-rgb));
684
688
  --salt-color-orange-800: rgb(var(--salt-color-orange-800-rgb));
685
689
  --salt-color-orange-850: rgb(var(--salt-color-orange-850-rgb));
690
+ --salt-color-orange-875: rgb(var(--salt-color-orange-875-rgb));
686
691
  --salt-color-orange-900: rgb(var(--salt-color-orange-900-rgb));
687
692
  --salt-color-green-10: rgb(var(--salt-color-green-10-rgb));
688
693
  --salt-color-green-20: rgb(var(--salt-color-green-20-rgb));
@@ -1218,7 +1223,7 @@
1218
1223
  .salt-theme[data-mode=light] {
1219
1224
  --salt-palette-error-background: var(--salt-color-red-10);
1220
1225
  --salt-palette-error-bold-background: var(--salt-color-red-500);
1221
- --salt-palette-error-background-selected: var(--salt-color-red-20);
1226
+ --salt-palette-error-background-selected: var(--salt-color-red-30);
1222
1227
  --salt-palette-error-border: var(--salt-color-red-500);
1223
1228
  --salt-palette-error-foreground-decorative: var(--salt-color-red-500);
1224
1229
  --salt-palette-error-foreground-informative: var(--salt-color-red-600);
@@ -1226,7 +1231,7 @@
1226
1231
  .salt-theme[data-mode=dark] {
1227
1232
  --salt-palette-error-background: var(--salt-color-red-900);
1228
1233
  --salt-palette-error-bold-background: var(--salt-color-red-500);
1229
- --salt-palette-error-background-selected: var(--salt-color-red-900);
1234
+ --salt-palette-error-background-selected: var(--salt-color-red-800);
1230
1235
  --salt-palette-error-border: var(--salt-color-red-400);
1231
1236
  --salt-palette-error-foreground-decorative: var(--salt-color-red-400);
1232
1237
  --salt-palette-error-foreground-informative: var(--salt-color-red-200);
@@ -1554,7 +1559,7 @@
1554
1559
  .salt-theme[data-mode=light] {
1555
1560
  --salt-palette-success-background: var(--salt-color-green-10);
1556
1561
  --salt-palette-success-bold-background: var(--salt-color-green-500);
1557
- --salt-palette-success-background-selected: var(--salt-color-green-20);
1562
+ --salt-palette-success-background-selected: var(--salt-color-green-30);
1558
1563
  --salt-palette-success-border: var(--salt-color-green-500);
1559
1564
  --salt-palette-success-foreground-decorative: var(--salt-color-green-500);
1560
1565
  --salt-palette-success-foreground-informative: var(--salt-color-green-600);
@@ -1562,7 +1567,7 @@
1562
1567
  .salt-theme[data-mode=dark] {
1563
1568
  --salt-palette-success-background: var(--salt-color-green-900);
1564
1569
  --salt-palette-success-bold-background: var(--salt-color-green-500);
1565
- --salt-palette-success-background-selected: var(--salt-color-green-900);
1570
+ --salt-palette-success-background-selected: var(--salt-color-green-800);
1566
1571
  --salt-palette-success-border: var(--salt-color-green-400);
1567
1572
  --salt-palette-success-foreground-decorative: var(--salt-color-green-400);
1568
1573
  --salt-palette-success-foreground-informative: var(--salt-color-green-200);
@@ -1595,7 +1600,7 @@
1595
1600
  .salt-theme[data-mode=light] {
1596
1601
  --salt-palette-warning-background: var(--salt-color-orange-10);
1597
1602
  --salt-palette-warning-bold-background: var(--salt-color-orange-800);
1598
- --salt-palette-warning-background-selected: var(--salt-color-orange-20);
1603
+ --salt-palette-warning-background-selected: var(--salt-color-orange-30);
1599
1604
  --salt-palette-warning-border: var(--salt-color-orange-700);
1600
1605
  --salt-palette-warning-border-disabled: var(--salt-color-orange-700-40a);
1601
1606
  --salt-palette-warning-foreground-decorative: var(--salt-color-orange-700);
@@ -1611,7 +1616,7 @@
1611
1616
  .salt-theme[data-mode=dark] {
1612
1617
  --salt-palette-warning-background: var(--salt-color-orange-900);
1613
1618
  --salt-palette-warning-bold-background: var(--salt-color-orange-800);
1614
- --salt-palette-warning-background-selected: var(--salt-color-orange-900);
1619
+ --salt-palette-warning-background-selected: var(--salt-color-orange-875);
1615
1620
  --salt-palette-warning-border: var(--salt-color-orange-500);
1616
1621
  --salt-palette-warning-border-disabled: var(--salt-color-orange-500-40a);
1617
1622
  --salt-palette-warning-foreground-decorative: var(--salt-color-orange-500);
@@ -1991,7 +1996,6 @@
1991
1996
  .salt-theme {
1992
1997
  --salt-navigable-indicator-hover: var(--salt-palette-navigate-indicator-hover);
1993
1998
  --salt-navigable-accent-indicator-active: var(--salt-palette-navigate-indicator-active);
1994
- --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
1995
1999
  --salt-navigable-accent-background-active: var(--salt-palette-alpha-none);
1996
2000
  --salt-navigable-accent-borderColor-active: var(--salt-palette-interact-border-active);
1997
2001
  }
@@ -2006,6 +2010,7 @@
2006
2010
  --salt-overlayable-shadow-drag: var(--salt-shadow-400);
2007
2011
  --salt-overlayable-shadow-modal: var(--salt-shadow-500);
2008
2012
  --salt-overlayable-background: var(--salt-palette-alpha-higher);
2013
+ --salt-overlayable-background-hover: var(--salt-palette-alpha-contrast-lowest);
2009
2014
  --salt-overlayable-background-highlight: var(--salt-palette-alpha-contrast-medium);
2010
2015
  --salt-overlayable-background-rangeSelection: var(--salt-palette-alpha-contrast-mediumLow);
2011
2016
  }
@@ -2017,7 +2022,7 @@
2017
2022
  --salt-selectable-borderColor-selected: var(--salt-palette-interact-border-active);
2018
2023
  --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-interact-border-activeDisabled);
2019
2024
  --salt-selectable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
2020
- --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border-readonly);
2025
+ --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border);
2021
2026
  --salt-selectable-foreground: var(--salt-palette-interact-foreground);
2022
2027
  --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
2023
2028
  --salt-selectable-foreground-hover: var(--salt-palette-interact-foreground-hover);
@@ -2419,6 +2424,7 @@
2419
2424
  --salt-navigable-fontWeight-hover: var(--salt-typography-fontWeight-regular);
2420
2425
  --salt-navigable-fontWeight-active: var(--salt-typography-fontWeight-semiBold);
2421
2426
  --salt-navigable-fontWeight-edit: var(--salt-typography-fontWeight-regular);
2427
+ --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
2422
2428
  --salt-accent-fontWeight: var(--salt-typography-fontWeight-semiBold);
2423
2429
  --salt-accent-foreground-disabled: var(--salt-palette-accent-foreground-disabled);
2424
2430
  --salt-track-borderStyle: solid;
package/package.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "name": "@salt-ds/theme",
3
- "version": "1.31.0",
3
+ "version": "1.33.0",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",
7
- "url": "https://github.com/jpmorganchase/salt-ds.git",
7
+ "url": "git+https://github.com/jpmorganchase/salt-ds.git",
8
8
  "directory": "packages/theme"
9
9
  },
10
10
  "bugs": "https://github.com/jpmorganchase/salt-ds/issues",