@salt-ds/theme 1.30.0 → 1.32.0

package/css/theme.css

@@ -1,23 +1,23 @@
 /* css/foundations/alpha.css */
 .salt-theme {
+  --salt-color-white-5a: rgba(var(--salt-color-white-rgb), 0.05);
   --salt-color-white-10a: rgba(var(--salt-color-white-rgb), 0.1);
+  --salt-color-white-15a: rgba(var(--salt-color-white-rgb), 0.15);
   --salt-color-white-20a: rgba(var(--salt-color-white-rgb), 0.2);
   --salt-color-white-30a: rgba(var(--salt-color-white-rgb), 0.3);
   --salt-color-white-40a: rgba(var(--salt-color-white-rgb), 0.4);
   --salt-color-white-50a: rgba(var(--salt-color-white-rgb), 0.5);
-  --salt-color-white-60a: rgba(var(--salt-color-white-rgb), 0.6);
-  --salt-color-white-70a: rgba(var(--salt-color-white-rgb), 0.7);
+  --salt-color-white-65a: rgba(var(--salt-color-white-rgb), 0.65);
   --salt-color-white-80a: rgba(var(--salt-color-white-rgb), 0.8);
-  --salt-color-white-90a: rgba(var(--salt-color-white-rgb), 0.9);
+  --salt-color-black-5a: rgba(var(--salt-color-black-rgb), 0.05);
   --salt-color-black-10a: rgba(var(--salt-color-black-rgb), 0.1);
+  --salt-color-black-15a: rgba(var(--salt-color-black-rgb), 0.15);
   --salt-color-black-20a: rgba(var(--salt-color-black-rgb), 0.2);
   --salt-color-black-30a: rgba(var(--salt-color-black-rgb), 0.3);
   --salt-color-black-40a: rgba(var(--salt-color-black-rgb), 0.4);
   --salt-color-black-50a: rgba(var(--salt-color-black-rgb), 0.5);
-  --salt-color-black-60a: rgba(var(--salt-color-black-rgb), 0.6);
-  --salt-color-black-70a: rgba(var(--salt-color-black-rgb), 0.7);
+  --salt-color-black-65a: rgba(var(--salt-color-black-rgb), 0.65);
   --salt-color-black-80a: rgba(var(--salt-color-black-rgb), 0.8);
-  --salt-color-black-90a: rgba(var(--salt-color-black-rgb), 0.9);
   --salt-color-blue-30-40a: rgba(var(--salt-color-blue-30-rgb), 0.4);
   --salt-color-blue-100-40a: rgba(var(--salt-color-blue-100-rgb), 0.4);
   --salt-color-blue-200-40a: rgba(var(--salt-color-blue-200-rgb), 0.4);
@@ -195,6 +195,13 @@
   }
 }
 
+/* css/foundations/borderStyle.css */
+.salt-theme {
+  --salt-borderStyle-solid: solid;
+  --salt-borderStyle-dashed: dashed;
+  --salt-borderStyle-dotted: dotted;
+}
+
 /* css/foundations/color.css */
 .salt-theme {
   --salt-color-white-rgb:
@@ -317,6 +324,10 @@
     194,
     52,
     7;
+  --salt-color-orange-875-rgb:
+    138,
+    43,
+    15;
   --salt-color-orange-900-rgb:
     54,
     44,
@@ -647,6 +658,7 @@
   --salt-color-orange-700: rgb(var(--salt-color-orange-700-rgb));
   --salt-color-orange-800: rgb(var(--salt-color-orange-800-rgb));
   --salt-color-orange-850: rgb(var(--salt-color-orange-850-rgb));
+  --salt-color-orange-875: rgb(var(--salt-color-orange-875-rgb));
   --salt-color-orange-900: rgb(var(--salt-color-orange-900-rgb));
   --salt-color-green-10: rgb(var(--salt-color-green-10-rgb));
   --salt-color-green-20: rgb(var(--salt-color-green-20-rgb));
@@ -1120,45 +1132,45 @@
 
 /* css/palette/alpha.css */
 .salt-theme[data-mode=light] {
-  --salt-palette-alpha-highest: var(--salt-color-white-90a);
-  --salt-palette-alpha-higher: var(--salt-color-white-80a);
-  --salt-palette-alpha-high: var(--salt-color-white-70a);
-  --salt-palette-alpha-mediumHigh: var(--salt-color-white-60a);
-  --salt-palette-alpha-medium: var(--salt-color-white-50a);
-  --salt-palette-alpha-mediumLow: var(--salt-color-white-40a);
-  --salt-palette-alpha-low: var(--salt-color-white-30a);
-  --salt-palette-alpha-lower: var(--salt-color-white-20a);
-  --salt-palette-alpha-lowest: var(--salt-color-white-10a);
-  --salt-palette-alpha-contrast-highest: var(--salt-color-black-90a);
-  --salt-palette-alpha-contrast-higher: var(--salt-color-black-80a);
-  --salt-palette-alpha-contrast-high: var(--salt-color-black-70a);
-  --salt-palette-alpha-contrast-mediumHigh: var(--salt-color-black-60a);
-  --salt-palette-alpha-contrast-medium: var(--salt-color-black-50a);
-  --salt-palette-alpha-contrast-mediumLow: var(--salt-color-black-40a);
-  --salt-palette-alpha-contrast-low: var(--salt-color-black-30a);
-  --salt-palette-alpha-contrast-lower: var(--salt-color-black-20a);
-  --salt-palette-alpha-contrast-lowest: var(--salt-color-black-10a);
+  --salt-palette-alpha-highest: var(--salt-color-white-80a);
+  --salt-palette-alpha-higher: var(--salt-color-white-65a);
+  --salt-palette-alpha-high: var(--salt-color-white-50a);
+  --salt-palette-alpha-mediumHigh: var(--salt-color-white-40a);
+  --salt-palette-alpha-medium: var(--salt-color-white-30a);
+  --salt-palette-alpha-mediumLow: var(--salt-color-white-20a);
+  --salt-palette-alpha-low: var(--salt-color-white-15a);
+  --salt-palette-alpha-lower: var(--salt-color-white-10a);
+  --salt-palette-alpha-lowest: var(--salt-color-white-5a);
+  --salt-palette-alpha-contrast-highest: var(--salt-color-black-80a);
+  --salt-palette-alpha-contrast-higher: var(--salt-color-black-65a);
+  --salt-palette-alpha-contrast-high: var(--salt-color-black-50a);
+  --salt-palette-alpha-contrast-mediumHigh: var(--salt-color-black-40a);
+  --salt-palette-alpha-contrast-medium: var(--salt-color-black-30a);
+  --salt-palette-alpha-contrast-mediumLow: var(--salt-color-black-20a);
+  --salt-palette-alpha-contrast-low: var(--salt-color-black-15a);
+  --salt-palette-alpha-contrast-lower: var(--salt-color-black-10a);
+  --salt-palette-alpha-contrast-lowest: var(--salt-color-black-5a);
   --salt-palette-alpha-none: transparent;
 }
 .salt-theme[data-mode=dark] {
-  --salt-palette-alpha-highest: var(--salt-color-black-90a);
-  --salt-palette-alpha-higher: var(--salt-color-black-80a);
-  --salt-palette-alpha-high: var(--salt-color-black-70a);
-  --salt-palette-alpha-mediumHigh: var(--salt-color-black-60a);
-  --salt-palette-alpha-medium: var(--salt-color-black-50a);
-  --salt-palette-alpha-mediumLow: var(--salt-color-black-40a);
-  --salt-palette-alpha-low: var(--salt-color-black-30a);
-  --salt-palette-alpha-lower: var(--salt-color-black-20a);
-  --salt-palette-alpha-lowest: var(--salt-color-black-10a);
-  --salt-palette-alpha-contrast-highest: var(--salt-color-white-90a);
-  --salt-palette-alpha-contrast-higher: var(--salt-color-white-80a);
-  --salt-palette-alpha-contrast-high: var(--salt-color-white-70a);
-  --salt-palette-alpha-contrast-mediumHigh: var(--salt-color-white-60a);
-  --salt-palette-alpha-contrast-medium: var(--salt-color-white-50a);
-  --salt-palette-alpha-contrast-mediumLow: var(--salt-color-white-40a);
-  --salt-palette-alpha-contrast-low: var(--salt-color-white-30a);
-  --salt-palette-alpha-contrast-lower: var(--salt-color-white-20a);
-  --salt-palette-alpha-contrast-lowest: var(--salt-color-white-10a);
+  --salt-palette-alpha-highest: var(--salt-color-black-80a);
+  --salt-palette-alpha-higher: var(--salt-color-black-65a);
+  --salt-palette-alpha-high: var(--salt-color-black-50a);
+  --salt-palette-alpha-mediumHigh: var(--salt-color-black-40a);
+  --salt-palette-alpha-medium: var(--salt-color-black-30a);
+  --salt-palette-alpha-mediumLow: var(--salt-color-black-20a);
+  --salt-palette-alpha-low: var(--salt-color-black-15a);
+  --salt-palette-alpha-lower: var(--salt-color-black-10a);
+  --salt-palette-alpha-lowest: var(--salt-color-black-5a);
+  --salt-palette-alpha-contrast-highest: var(--salt-color-white-80a);
+  --salt-palette-alpha-contrast-higher: var(--salt-color-white-65a);
+  --salt-palette-alpha-contrast-high: var(--salt-color-white-50a);
+  --salt-palette-alpha-contrast-mediumHigh: var(--salt-color-white-40a);
+  --salt-palette-alpha-contrast-medium: var(--salt-color-white-30a);
+  --salt-palette-alpha-contrast-mediumLow: var(--salt-color-white-20a);
+  --salt-palette-alpha-contrast-low: var(--salt-color-white-15a);
+  --salt-palette-alpha-contrast-lower: var(--salt-color-white-10a);
+  --salt-palette-alpha-contrast-lowest: var(--salt-color-white-5a);
   --salt-palette-alpha-none: transparent;
 }
 
@@ -1182,7 +1194,7 @@
 .salt-theme[data-mode=light] {
   --salt-palette-error-background: var(--salt-color-red-10);
   --salt-palette-error-bold-background: var(--salt-color-red-500);
-  --salt-palette-error-background-selected: var(--salt-color-red-20);
+  --salt-palette-error-background-selected: var(--salt-color-red-30);
   --salt-palette-error-border: var(--salt-color-red-500);
   --salt-palette-error-foreground-decorative: var(--salt-color-red-500);
   --salt-palette-error-foreground-informative: var(--salt-color-red-600);
@@ -1190,7 +1202,7 @@
 .salt-theme[data-mode=dark] {
   --salt-palette-error-background: var(--salt-color-red-900);
   --salt-palette-error-bold-background: var(--salt-color-red-500);
-  --salt-palette-error-background-selected: var(--salt-color-red-900);
+  --salt-palette-error-background-selected: var(--salt-color-red-800);
   --salt-palette-error-border: var(--salt-color-red-400);
   --salt-palette-error-foreground-decorative: var(--salt-color-red-400);
   --salt-palette-error-foreground-informative: var(--salt-color-red-200);
@@ -1350,7 +1362,6 @@
 
 /* css/palette/interact.css */
 .salt-theme[data-mode=light] {
-  --salt-palette-interact-background-blurSelected: var(--salt-color-gray-30);
   --salt-palette-interact-background-hover: var(--salt-color-blue-10);
   --salt-palette-interact-background-active: var(--salt-color-blue-30);
   --salt-palette-interact-background-activeDisabled: var(--salt-color-blue-30-40a);
@@ -1391,7 +1402,6 @@
 }
 .salt-theme[data-mode=dark] {
   --salt-palette-interact-background-active: var(--salt-color-blue-700);
-  --salt-palette-interact-background-blurSelected: var(--salt-color-gray-600);
   --salt-palette-interact-background-hover: var(--salt-color-blue-800);
   --salt-palette-interact-background-activeDisabled: var(--salt-color-blue-700-40a);
   --salt-palette-interact-border: var(--salt-color-gray-90);
@@ -1520,7 +1530,7 @@
 .salt-theme[data-mode=light] {
   --salt-palette-success-background: var(--salt-color-green-10);
   --salt-palette-success-bold-background: var(--salt-color-green-500);
-  --salt-palette-success-background-selected: var(--salt-color-green-20);
+  --salt-palette-success-background-selected: var(--salt-color-green-30);
   --salt-palette-success-border: var(--salt-color-green-500);
   --salt-palette-success-foreground-decorative: var(--salt-color-green-500);
   --salt-palette-success-foreground-informative: var(--salt-color-green-600);
@@ -1528,7 +1538,7 @@
 .salt-theme[data-mode=dark] {
   --salt-palette-success-background: var(--salt-color-green-900);
   --salt-palette-success-bold-background: var(--salt-color-green-500);
-  --salt-palette-success-background-selected: var(--salt-color-green-900);
+  --salt-palette-success-background-selected: var(--salt-color-green-800);
   --salt-palette-success-border: var(--salt-color-green-400);
   --salt-palette-success-foreground-decorative: var(--salt-color-green-400);
   --salt-palette-success-foreground-informative: var(--salt-color-green-200);
@@ -1561,7 +1571,7 @@
 .salt-theme[data-mode=light] {
   --salt-palette-warning-background: var(--salt-color-orange-10);
   --salt-palette-warning-bold-background: var(--salt-color-orange-800);
-  --salt-palette-warning-background-selected: var(--salt-color-orange-20);
+  --salt-palette-warning-background-selected: var(--salt-color-orange-30);
   --salt-palette-warning-border: var(--salt-color-orange-700);
   --salt-palette-warning-border-disabled: var(--salt-color-orange-700-40a);
   --salt-palette-warning-foreground-decorative: var(--salt-color-orange-700);
@@ -1577,7 +1587,7 @@
 .salt-theme[data-mode=dark] {
   --salt-palette-warning-background: var(--salt-color-orange-900);
   --salt-palette-warning-bold-background: var(--salt-color-orange-800);
-  --salt-palette-warning-background-selected: var(--salt-color-orange-900);
+  --salt-palette-warning-background-selected: var(--salt-color-orange-875);
   --salt-palette-warning-border: var(--salt-color-orange-500);
   --salt-palette-warning-border-disabled: var(--salt-color-orange-500-40a);
   --salt-palette-warning-foreground-decorative: var(--salt-color-orange-500);
@@ -1890,7 +1900,6 @@
 
 /* css/characteristics/container.css */
 .salt-theme {
-  --salt-container-borderStyle: solid;
   --salt-container-primary-background: var(--salt-palette-neutral-primary-background);
   --salt-container-primary-background-disabled: var(--salt-palette-neutral-primary-background-disabled);
   --salt-container-primary-borderColor: var(--salt-palette-neutral-border);
@@ -1903,26 +1912,18 @@
   --salt-container-tertiary-background-disabled: var(--salt-palette-neutral-tertiary-background-disabled);
   --salt-container-tertiary-borderColor: var(--salt-palette-neutral-border);
   --salt-container-tertiary-borderColor-disabled: var(--salt-palette-neutral-border-disabled);
-  --salt-container-ghost-background: var(--salt-palette-alpha-low);
-  --salt-container-ghost-borderColor: var(--salt-palette-alpha-contrast-low);
+  --salt-container-ghost-background: var(--salt-palette-alpha-medium);
+  --salt-container-ghost-borderColor: var(--salt-palette-alpha-contrast-medium);
 }
 
 /* css/characteristics/target.css */
 .salt-theme {
   --salt-target-background-hover: var(--salt-palette-interact-background-hover);
   --salt-target-borderColor-hover: var(--salt-palette-interact-border-hover);
-  --salt-target-borderStyle: dashed;
-  --salt-target-borderStyle-hover: solid;
-  --salt-target-borderStyle-disabled: dashed;
 }
 
 /* css/characteristics/editable.css */
 .salt-theme {
-  --salt-editable-borderStyle: solid;
-  --salt-editable-borderStyle-hover: solid;
-  --salt-editable-borderStyle-active: solid;
-  --salt-editable-borderStyle-disabled: solid;
-  --salt-editable-borderStyle-readonly: solid;
   --salt-editable-borderColor: var(--salt-palette-interact-border);
   --salt-editable-borderColor-active: var(--salt-palette-interact-border-active);
   --salt-editable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
@@ -1944,8 +1945,8 @@
 /* css/characteristics/focused.css */
 .salt-theme {
   --salt-focused-outlineColor: var(--salt-palette-interact-outline);
-  --salt-focused-outlineStyle: dotted;
-  --salt-focused-outlineWidth: 2px;
+  --salt-focused-outlineStyle: var(--salt-borderStyle-dotted);
+  --salt-focused-outlineWidth: var(--salt-size-fixed-200);
   --salt-focused-outlineInset: 0;
   --salt-focused-outlineOffset: 0;
   --salt-focused-outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--salt-focused-outlineColor);
@@ -1964,12 +1965,10 @@
 
 /* css/characteristics/navigable.css */
 .salt-theme {
-  --salt-navigable-fontWeight: var(--salt-typography-fontWeight-regular);
-  --salt-navigable-fontWeight-hover: var(--salt-typography-fontWeight-regular);
-  --salt-navigable-fontWeight-active: var(--salt-typography-fontWeight-semiBold);
-  --salt-navigable-fontWeight-edit: var(--salt-typography-fontWeight-regular);
   --salt-navigable-indicator-hover: var(--salt-palette-navigate-indicator-hover);
-  --salt-navigable-indicator-active: var(--salt-palette-navigate-indicator-active);
+  --salt-navigable-accent-indicator-active: var(--salt-palette-navigate-indicator-active);
+  --salt-navigable-accent-background-active: var(--salt-palette-alpha-none);
+  --salt-navigable-accent-borderColor-active: var(--salt-palette-interact-border-active);
 }
 
 /* css/characteristics/overlayable.css */
@@ -1981,23 +1980,20 @@
   --salt-overlayable-shadow-popout: var(--salt-shadow-400);
   --salt-overlayable-shadow-drag: var(--salt-shadow-400);
   --salt-overlayable-shadow-modal: var(--salt-shadow-500);
-  --salt-overlayable-background: var(--salt-palette-alpha-high);
-  --salt-overlayable-background-highlight: var(--salt-palette-alpha-contrast-low);
-  --salt-overlayable-background-rangeSelection: var(--salt-palette-alpha-contrast-lower);
+  --salt-overlayable-background: var(--salt-palette-alpha-higher);
+  --salt-overlayable-background-hover: var(--salt-palette-alpha-contrast-lowest);
+  --salt-overlayable-background-highlight: var(--salt-palette-alpha-contrast-medium);
+  --salt-overlayable-background-rangeSelection: var(--salt-palette-alpha-contrast-mediumLow);
 }
 
 /* css/characteristics/selectable.css */
 .salt-theme {
-  --salt-selectable-borderStyle: solid;
-  --salt-selectable-borderStyle-hover: solid;
-  --salt-selectable-borderStyle-selected: solid;
-  --salt-selectable-borderStyle-blurSelected: solid;
   --salt-selectable-borderColor: var(--salt-palette-interact-border);
   --salt-selectable-borderColor-hover: var(--salt-palette-interact-border-hover);
   --salt-selectable-borderColor-selected: var(--salt-palette-interact-border-active);
   --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-interact-border-activeDisabled);
   --salt-selectable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
-  --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border-readonly);
+  --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border);
   --salt-selectable-foreground: var(--salt-palette-interact-foreground);
   --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
   --salt-selectable-foreground-hover: var(--salt-palette-interact-foreground-hover);
@@ -2006,30 +2002,35 @@
   --salt-selectable-background: var(--salt-palette-alpha-none);
   --salt-selectable-background-hover: var(--salt-palette-interact-background-hover);
   --salt-selectable-background-selected: var(--salt-palette-interact-background-active);
-  --salt-selectable-background-blurSelected: var(--salt-palette-interact-background-blurSelected);
   --salt-selectable-background-disabled: var(--salt-palette-alpha-none);
   --salt-selectable-background-selectedDisabled: var(--salt-palette-interact-background-activeDisabled);
 }
 
+/* css/characteristics/sentiment.css */
+.salt-theme {
+  --salt-sentiment-negative-foreground-informative: var(--salt-palette-negative-foreground);
+  --salt-sentiment-positive-foreground-informative: var(--salt-palette-positive-foreground);
+  --salt-sentiment-negative-foreground-decorative: var(--salt-palette-negative-foreground);
+  --salt-sentiment-positive-foreground-decorative: var(--salt-palette-positive-foreground);
+  --salt-sentiment-neutral-track: var(--salt-palette-neutral-border);
+  --salt-sentiment-neutral-track-disabled: var(--salt-palette-neutral-border-disabled);
+}
+
 /* css/characteristics/separable.css */
 .salt-theme {
-  --salt-separable-borderStyle: solid;
-  --salt-separable-primary-borderColor: var(--salt-palette-alpha-contrast-mediumLow);
-  --salt-separable-secondary-borderColor: var(--salt-palette-alpha-contrast-low);
-  --salt-separable-tertiary-borderColor: var(--salt-palette-alpha-contrast-lower);
+  --salt-separable-primary-borderColor: var(--salt-palette-alpha-contrast-mediumHigh);
+  --salt-separable-secondary-borderColor: var(--salt-palette-alpha-contrast-medium);
+  --salt-separable-tertiary-borderColor: var(--salt-palette-alpha-contrast-mediumLow);
   --salt-separable-foreground: var(--salt-palette-neutral-primary-foreground);
   --salt-separable-foreground-hover: var(--salt-palette-neutral-primary-foreground);
   --salt-separable-foreground-active: var(--salt-palette-interact-cta-foreground);
   --salt-separable-background: var(--salt-palette-alpha-none);
-  --salt-separable-background-hover: var(--salt-palette-alpha-weak);
+  --salt-separable-background-hover: var(--salt-palette-alpha-contrast-mediumLow);
   --salt-separable-background-active: var(--salt-palette-accent);
 }
 
 /* css/characteristics/status.css */
 .salt-theme {
-  --salt-status-static-foreground: var(--salt-palette-neutral-secondary-foreground);
-  --salt-status-negative-foreground: var(--salt-palette-negative-foreground);
-  --salt-status-positive-foreground: var(--salt-palette-positive-foreground);
   --salt-status-info-foreground-decorative: var(--salt-palette-info-foreground-decorative);
   --salt-status-error-foreground-decorative: var(--salt-palette-error-foreground-decorative);
   --salt-status-warning-foreground-decorative: var(--salt-palette-warning-foreground-decorative);
@@ -2230,20 +2231,16 @@
   --salt-content-foreground-highlight: var(--salt-palette-interact-background-active);
 }
 
-/* css/characteristics/track.css */
-.salt-theme {
-  --salt-track-borderStyle: solid;
-  --salt-track-borderStyle-active: solid;
-  --salt-track-borderStyle-complete: solid;
-  --salt-track-borderStyle-incomplete: dotted;
-  --salt-track-borderColor: var(--salt-palette-neutral-border);
-  --salt-track-borderColor-disabled: var(--salt-palette-neutral-border-disabled);
-}
-
 /* css/deprecated/characteristics.css */
 .salt-theme {
+  --salt-container-borderStyle: solid;
   --salt-differential-positive-foreground: var(--salt-palette-positive-foreground);
   --salt-differential-negative-foreground: var(--salt-palette-negative-foreground);
+  --salt-editable-borderStyle: solid;
+  --salt-editable-borderStyle-hover: solid;
+  --salt-editable-borderStyle-active: solid;
+  --salt-editable-borderStyle-disabled: solid;
+  --salt-editable-borderStyle-readonly: solid;
   --salt-editable-cursor-hover: text;
   --salt-editable-cursor-active: text;
   --salt-editable-cursor-disabled: not-allowed;
@@ -2279,6 +2276,10 @@
   --salt-overlayable-shadow-scroll-color: var(--salt-shadow-1-color);
   --salt-overlayable-shadow-borderRegion: var(--salt-shadow-2);
   --salt-overlayable-rangeSelection: var(--salt-overlayable-background-rangeSelection);
+  --salt-selectable-borderStyle: solid;
+  --salt-selectable-borderStyle-hover: solid;
+  --salt-selectable-borderStyle-selected: solid;
+  --salt-selectable-borderStyle-blurSelected: solid;
   --salt-selectable-cursor-hover: pointer;
   --salt-selectable-cursor-selected: pointer;
   --salt-selectable-cursor-blurSelected: pointer;
@@ -2286,6 +2287,7 @@
   --salt-selectable-cursor-readonly: not-allowed;
   --salt-selectable-foreground-partial: var(--salt-palette-interact-foreground-partial);
   --salt-selectable-foreground-partialDisabled: var(--salt-palette-interact-foreground-partialDisabled);
+  --salt-selectable-background-blurSelected: var(--salt-palette-interact-background-blurSelected);
   --salt-selectable-cta-foreground: var(--salt-palette-interact-foreground);
   --salt-selectable-cta-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
   --salt-selectable-cta-foreground-hover: var(--salt-palette-interact-cta-foreground-hover);
@@ -2316,6 +2318,9 @@
   --salt-selectable-secondary-background-hover: var(--salt-palette-interact-secondary-background-hover);
   --salt-selectable-secondary-background-selected: var(--salt-palette-interact-secondary-background-active);
   --salt-selectable-secondary-background-selectedDisabled: var(--salt-palette-interact-secondary-background-activeDisabled);
+  --salt-separable-borderStyle: solid;
+  --salt-status-negative-foreground: var(--salt-palette-negative-foreground);
+  --salt-status-positive-foreground: var(--salt-palette-positive-foreground);
   --salt-status-info-background-emphasize: var(--salt-status-info-background);
   --salt-status-success-background-emphasize: var(--salt-status-success-background);
   --salt-status-warning-background-emphasize: var(--salt-status-warning-background);
@@ -2324,6 +2329,7 @@
   --salt-status-success-foreground-disabled: var(--salt-palette-success-foreground-disabled);
   --salt-status-warning-foreground-disabled: var(--salt-palette-warning-foreground-disabled);
   --salt-status-error-foreground-disabled: var(--salt-palette-error-foreground-disabled);
+  --salt-status-static-foreground: var(--salt-palette-neutral-secondary-foreground);
   --salt-status-static-foreground-disabled: var(--salt-palette-neutral-secondary-foreground-disabled);
   --salt-status-negative-foreground-disabled: var(--salt-palette-negative-foreground-disabled);
   --salt-status-positive-foreground-disabled: var(--salt-palette-positive-foreground-disabled);
@@ -2351,6 +2357,9 @@
   --salt-actionable-cta-fontWeight: var(--salt-typography-fontWeight-bold);
   --salt-actionable-secondary-fontWeight: var(--salt-typography-fontWeight-semiBold);
   --salt-target-cursor-disabled: not-allowed;
+  --salt-target-borderStyle: dashed;
+  --salt-target-borderStyle-hover: solid;
+  --salt-target-borderStyle-disabled: dashed;
   --salt-text-background-selected: var(--salt-content-foreground-highlight);
   --salt-text-link-foreground-hover: var(--salt-palette-navigate-foreground-hover);
   --salt-text-link-foreground-active: var(--salt-palette-navigate-foreground-active);
@@ -2377,13 +2386,22 @@
   --salt-navigable-tertiary-background: var(--salt-palette-navigate-tertiary-background);
   --salt-navigable-tertiary-background-hover: var(--salt-palette-navigate-tertiary-background-hover);
   --salt-navigable-tertiary-background-active: var(--salt-palette-navigate-tertiary-background-active);
+  --salt-navigable-indicator-active: var(--salt-palette-navigate-indicator-active);
   --salt-navigable-indicator-activeDisabled: var(--salt-palette-navigate-indicator-activeDisabled);
-  --salt-navigable-background-hover: var(--salt-palette-navigate-background-hover);
   --salt-navigable-textDecoration: var(--salt-typography-textDecoration-underline);
   --salt-navigable-textDecoration-hover: var(--salt-typography-textDecoration-none);
   --salt-navigable-textDecoration-selected: var(--salt-typography-textDecoration-underline);
+  --salt-navigable-fontWeight: var(--salt-typography-fontWeight-regular);
+  --salt-navigable-fontWeight-hover: var(--salt-typography-fontWeight-regular);
+  --salt-navigable-fontWeight-active: var(--salt-typography-fontWeight-semiBold);
+  --salt-navigable-fontWeight-edit: var(--salt-typography-fontWeight-regular);
+  --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
   --salt-accent-fontWeight: var(--salt-typography-fontWeight-semiBold);
   --salt-accent-foreground-disabled: var(--salt-palette-accent-foreground-disabled);
+  --salt-track-borderStyle: solid;
+  --salt-track-borderStyle-active: solid;
+  --salt-track-borderStyle-complete: solid;
+  --salt-track-borderStyle-incomplete: dotted;
   --salt-track-borderWidth: 2px;
   --salt-track-borderWidth-active: 2px;
   --salt-track-borderWidth-complete: 2px;
@@ -2392,6 +2410,8 @@
   --salt-track-textAlign: center;
   --salt-track-background: var(--salt-palette-track-background);
   --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
+  --salt-track-borderColor: var(--salt-palette-neutral-border);
+  --salt-track-borderColor-disabled: var(--salt-palette-neutral-border-disabled);
   --salt-taggable-cursor-hover: pointer;
   --salt-taggable-cursor-active: pointer;
   --salt-taggable-cursor-disabled: not-allowed;
@@ -2571,6 +2591,12 @@
   --salt-shadow-5: 0 12px 40px 0 var(--salt-shadow-5-color);
   --salt-typography-fontFamily: var(--salt-typography-fontFamily-openSans);
   --salt-typography-fontFamily-code: var(--salt-typography-fontFamily-ptMono);
+  --salt-color-black-60a: rgba(var(--salt-color-black-rgb), 0.6);
+  --salt-color-black-70a: rgba(var(--salt-color-black-rgb), 0.7);
+  --salt-color-black-90a: rgba(var(--salt-color-black-rgb), 0.9);
+  --salt-color-white-60a: rgba(var(--salt-color-white-rgb), 0.6);
+  --salt-color-white-70a: rgba(var(--salt-color-white-rgb), 0.7);
+  --salt-color-white-90a: rgba(var(--salt-color-white-rgb), 0.9);
 }
 .salt-theme[data-mode=light] {
   --salt-shadow-1-color: rgba(0, 0, 0, 0.1);
@@ -2658,11 +2684,11 @@
   --salt-palette-opacity-primary-border: var(--salt-opacity-45);
   --salt-palette-opacity-secondary-border: var(--salt-opacity-25);
   --salt-palette-opacity-tertiary-border: var(--salt-opacity-15);
-  --salt-palette-alpha: var(--salt-palette-alpha-contrast-low);
-  --salt-palette-alpha-strong: var(--salt-palette-alpha-contrast-mediumLow);
-  --salt-palette-alpha-weak: var(--salt-palette-alpha-contrast-lower);
-  --salt-palette-alpha-weaker: var(--salt-palette-alpha-contrast-lowest);
-  --salt-palette-alpha-backdrop: var(--salt-palette-alpha-high);
+  --salt-palette-alpha: var(--salt-palette-alpha-contrast-medium);
+  --salt-palette-alpha-strong: var(--salt-palette-alpha-contrast-mediumHigh);
+  --salt-palette-alpha-weak: var(--salt-palette-alpha-contrast-mediumLow);
+  --salt-palette-alpha-weaker: var(--salt-palette-alpha-contrast-lower);
+  --salt-palette-alpha-backdrop: var(--salt-palette-alpha-higher);
 }
 .salt-theme[data-mode=light] {
   --salt-palette-interact-foreground-partial: var(--salt-color-blue-600);
@@ -2674,6 +2700,7 @@
   --salt-palette-interact-secondary-foreground-activeDisabled: var(--salt-color-white-fade-foreground);
   --salt-palette-interact-secondary-background-activeDisabled: var(--salt-color-gray-200-fade-background);
   --salt-palette-interact-background: transparent;
+  --salt-palette-interact-background-blurSelected: var(--salt-color-gray-30);
   --salt-palette-interact-background-disabled: transparent;
   --salt-palette-interact-border-none: transparent;
   --salt-palette-interact-secondary-background: transparent;
@@ -2749,6 +2776,7 @@
   --salt-palette-interact-secondary-foreground-activeDisabled: var(--salt-color-gray-900-fade-foreground);
   --salt-palette-interact-secondary-background-activeDisabled: var(--salt-color-gray-70-fade-background);
   --salt-palette-interact-background: transparent;
+  --salt-palette-interact-background-blurSelected: var(--salt-color-gray-600);
   --salt-palette-interact-background-disabled: transparent;
   --salt-palette-interact-border-none: transparent;
   --salt-palette-interact-secondary-background: transparent;