@salt-ds/theme 1.29.0 → 1.30.0

package/css/theme.css

@@ -904,6 +904,20 @@
   --salt-color-forest-900: rgb(0, 51, 31);
 }
 
+/* css/foundations/cursor.css */
+.salt-theme {
+  --salt-cursor-active: pointer;
+  --salt-cursor-disabled: not-allowed;
+  --salt-cursor-drag-ew: ew-resize;
+  --salt-cursor-drag-ns: ns-resize;
+  --salt-cursor-grab: grab;
+  --salt-cursor-grab-active: grabbing;
+  --salt-cursor-hover: pointer;
+  --salt-cursor-pending: progress;
+  --salt-cursor-readonly: text;
+  --salt-cursor-text: text;
+}
+
 /* css/foundations/curve.css */
 .salt-density-high {
   --salt-curve-0: 0;
@@ -978,49 +992,51 @@
   --salt-size-adornment: 6px;
   --salt-size-bar: 2px;
   --salt-size-base: 20px;
-  --salt-size-border: 1px;
   --salt-size-icon: 10px;
   --salt-size-indicator: 2px;
   --salt-size-selectable: 12px;
   --salt-size-bar-strong: 4px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
 }
 .salt-density-medium {
   --salt-size-adornment: 8px;
   --salt-size-bar: 4px;
   --salt-size-base: 28px;
-  --salt-size-border: 1px;
   --salt-size-icon: 12px;
   --salt-size-indicator: 3px;
   --salt-size-selectable: 14px;
   --salt-size-bar-strong: 8px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
 }
 .salt-density-low {
   --salt-size-adornment: 10px;
   --salt-size-bar: 6px;
   --salt-size-base: 36px;
-  --salt-size-border: 1px;
   --salt-size-icon: 14px;
   --salt-size-indicator: 4px;
   --salt-size-selectable: 16px;
   --salt-size-bar-strong: 12px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
 }
 .salt-density-touch {
   --salt-size-adornment: 12px;
   --salt-size-bar: 8px;
   --salt-size-base: 44px;
-  --salt-size-border: 1px;
   --salt-size-icon: 16px;
   --salt-size-indicator: 5px;
   --salt-size-selectable: 18px;
   --salt-size-bar-strong: 16px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
+}
+.salt-density-touch,
+.salt-density-low,
+.salt-density-medium,
+.salt-density-high {
+  --salt-size-fixed-100: 1px;
+  --salt-size-fixed-200: 2px;
+  --salt-size-fixed-300: 3px;
+  --salt-size-fixed-400: 4px;
+  --salt-size-fixed-500: 5px;
+  --salt-size-fixed-600: 6px;
+  --salt-size-fixed-700: 7px;
+  --salt-size-fixed-800: 8px;
+  --salt-size-fixed-900: 9px;
 }
 
 /* css/foundations/spacing.css */
@@ -1060,6 +1076,15 @@
   --salt-spacing-850: calc(8.5 * var(--salt-spacing-100));
   --salt-spacing-900: calc(9 * var(--salt-spacing-100));
   --salt-spacing-950: calc(9.5 * var(--salt-spacing-100));
+  --salt-spacing-fixed-100: 1px;
+  --salt-spacing-fixed-200: 2px;
+  --salt-spacing-fixed-300: 3px;
+  --salt-spacing-fixed-400: 4px;
+  --salt-spacing-fixed-500: 5px;
+  --salt-spacing-fixed-600: 6px;
+  --salt-spacing-fixed-700: 7px;
+  --salt-spacing-fixed-800: 8px;
+  --salt-spacing-fixed-900: 9px;
 }
 
 /* css/foundations/typography.css */
@@ -1577,9 +1602,6 @@
 
 /* css/characteristics/actionable.css */
 .salt-theme {
-  --salt-actionable-cursor-hover: pointer;
-  --salt-actionable-cursor-active: pointer;
-  --salt-actionable-cursor-disabled: not-allowed;
   --salt-actionable-accented-bold-background-active: var(--salt-palette-interact-cta-background-active);
   --salt-actionable-accented-bold-background-disabled: var(--salt-palette-interact-cta-background-disabled);
   --salt-actionable-accented-bold-background-hover: var(--salt-palette-interact-cta-background-hover);
@@ -1885,16 +1907,6 @@
   --salt-container-ghost-borderColor: var(--salt-palette-alpha-contrast-low);
 }
 
-/* css/characteristics/draggable.css */
-.salt-theme {
-  --salt-draggable-horizontal-cursor-hover: row-resize;
-  --salt-draggable-horizontal-cursor-active: row-resize;
-  --salt-draggable-vertical-cursor-hover: col-resize;
-  --salt-draggable-vertical-cursor-active: col-resize;
-  --salt-draggable-grab-cursor-hover: grab;
-  --salt-draggable-grab-cursor-active: grabbing;
-}
-
 /* css/characteristics/target.css */
 .salt-theme {
   --salt-target-background-hover: var(--salt-palette-interact-background-hover);
@@ -1902,21 +1914,15 @@
   --salt-target-borderStyle: dashed;
   --salt-target-borderStyle-hover: solid;
   --salt-target-borderStyle-disabled: dashed;
-  --salt-target-cursor-disabled: not-allowed;
 }
 
 /* css/characteristics/editable.css */
 .salt-theme {
-  --salt-editable-cursor-hover: text;
-  --salt-editable-cursor-active: text;
-  --salt-editable-cursor-disabled: not-allowed;
-  --salt-editable-cursor-readonly: text;
   --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-borderWidth-active: 2px;
   --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);
@@ -1958,10 +1964,6 @@
 
 /* css/characteristics/navigable.css */
 .salt-theme {
-  --salt-navigable-cursor-active: pointer;
-  --salt-navigable-cursor-hover: pointer;
-  --salt-navigable-cursor-disabled: not-allowed;
-  --salt-navigable-cursor-edit: text;
   --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);
@@ -1986,11 +1988,6 @@
 
 /* css/characteristics/selectable.css */
 .salt-theme {
-  --salt-selectable-cursor-hover: pointer;
-  --salt-selectable-cursor-selected: pointer;
-  --salt-selectable-cursor-blurSelected: pointer;
-  --salt-selectable-cursor-disabled: not-allowed;
-  --salt-selectable-cursor-readonly: not-allowed;
   --salt-selectable-borderStyle: solid;
   --salt-selectable-borderStyle-hover: solid;
   --salt-selectable-borderStyle-selected: solid;
@@ -2247,11 +2244,16 @@
 .salt-theme {
   --salt-differential-positive-foreground: var(--salt-palette-positive-foreground);
   --salt-differential-negative-foreground: var(--salt-palette-negative-foreground);
+  --salt-editable-cursor-hover: text;
+  --salt-editable-cursor-active: text;
+  --salt-editable-cursor-disabled: not-allowed;
+  --salt-editable-cursor-readonly: text;
   --salt-editable-tertiary-background: var(--salt-palette-neutral-tertiary-background);
   --salt-editable-tertiary-background-active: var(--salt-palette-neutral-tertiary-background);
   --salt-editable-tertiary-background-disabled: var(--salt-palette-neutral-tertiary-background-disabled);
   --salt-editable-tertiary-background-hover: var(--salt-palette-neutral-tertiary-background);
   --salt-editable-tertiary-background-readonly: var(--salt-palette-neutral-tertiary-background-readonly);
+  --salt-editable-borderWidth-active: 2px;
   --salt-measured-borderStyle: solid;
   --salt-measured-borderStyle-active: solid;
   --salt-measured-borderStyle-complete: solid;
@@ -2277,6 +2279,11 @@
   --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-cursor-hover: pointer;
+  --salt-selectable-cursor-selected: pointer;
+  --salt-selectable-cursor-blurSelected: pointer;
+  --salt-selectable-cursor-disabled: not-allowed;
+  --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-cta-foreground: var(--salt-palette-interact-foreground);
@@ -2328,12 +2335,22 @@
   --salt-status-error-foreground: var(--salt-palette-error-foreground);
   --salt-status-warning-foreground: var(--salt-palette-warning-foreground);
   --salt-status-success-foreground: var(--salt-palette-success-foreground);
+  --salt-draggable-horizontal-cursor-hover: row-resize;
+  --salt-draggable-horizontal-cursor-active: row-resize;
+  --salt-draggable-vertical-cursor-hover: col-resize;
+  --salt-draggable-vertical-cursor-active: col-resize;
+  --salt-draggable-grab-cursor-hover: grab;
+  --salt-draggable-grab-cursor-active: grabbing;
+  --salt-actionable-cursor-hover: pointer;
+  --salt-actionable-cursor-active: pointer;
+  --salt-actionable-cursor-disabled: not-allowed;
   --salt-actionable-letterSpacing: 0.6px;
   --salt-actionable-textTransform: uppercase;
   --salt-actionable-textAlign: center;
   --salt-actionable-primary-fontWeight: var(--salt-typography-fontWeight-bold);
   --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-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);
@@ -2347,6 +2364,10 @@
   --salt-text-secondary-foreground-disabled: var(--salt-palette-neutral-secondary-foreground-disabled);
   --salt-text-textDecoration: var(--salt-typography-textDecoration-none);
   --salt-text-textTransform: none;
+  --salt-navigable-cursor-active: pointer;
+  --salt-navigable-cursor-hover: pointer;
+  --salt-navigable-cursor-disabled: not-allowed;
+  --salt-navigable-cursor-edit: text;
   --salt-navigable-primary-background: var(--salt-palette-navigate-primary-background);
   --salt-navigable-primary-background-hover: var(--salt-palette-navigate-primary-background-hover);
   --salt-navigable-primary-background-active: var(--salt-palette-navigate-primary-background-active);
@@ -2585,6 +2606,9 @@
   --salt-size-sharktooth-height: 5px;
   --salt-size-sharktooth-width: 10px;
   --salt-size-stackable: calc(var(--salt-size-base) + var(--salt-size-unit));
+  --salt-size-border: 1px;
+  --salt-size-bar-small: 2px;
+  --salt-size-border-strong: 2px;
   --salt-zIndex-docked: 1050;
 }
 .salt-density-high {

package/index.css

@@ -933,6 +933,20 @@
   --salt-color-forest-900: rgb(0, 51, 31);
 }
 
+/* css/foundations/cursor.css */
+.salt-theme {
+  --salt-cursor-active: pointer;
+  --salt-cursor-disabled: not-allowed;
+  --salt-cursor-drag-ew: ew-resize;
+  --salt-cursor-drag-ns: ns-resize;
+  --salt-cursor-grab: grab;
+  --salt-cursor-grab-active: grabbing;
+  --salt-cursor-hover: pointer;
+  --salt-cursor-pending: progress;
+  --salt-cursor-readonly: text;
+  --salt-cursor-text: text;
+}
+
 /* css/foundations/curve.css */
 .salt-density-high {
   --salt-curve-0: 0;
@@ -1007,49 +1021,51 @@
   --salt-size-adornment: 6px;
   --salt-size-bar: 2px;
   --salt-size-base: 20px;
-  --salt-size-border: 1px;
   --salt-size-icon: 10px;
   --salt-size-indicator: 2px;
   --salt-size-selectable: 12px;
   --salt-size-bar-strong: 4px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
 }
 .salt-density-medium {
   --salt-size-adornment: 8px;
   --salt-size-bar: 4px;
   --salt-size-base: 28px;
-  --salt-size-border: 1px;
   --salt-size-icon: 12px;
   --salt-size-indicator: 3px;
   --salt-size-selectable: 14px;
   --salt-size-bar-strong: 8px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
 }
 .salt-density-low {
   --salt-size-adornment: 10px;
   --salt-size-bar: 6px;
   --salt-size-base: 36px;
-  --salt-size-border: 1px;
   --salt-size-icon: 14px;
   --salt-size-indicator: 4px;
   --salt-size-selectable: 16px;
   --salt-size-bar-strong: 12px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
 }
 .salt-density-touch {
   --salt-size-adornment: 12px;
   --salt-size-bar: 8px;
   --salt-size-base: 44px;
-  --salt-size-border: 1px;
   --salt-size-icon: 16px;
   --salt-size-indicator: 5px;
   --salt-size-selectable: 18px;
   --salt-size-bar-strong: 16px;
-  --salt-size-bar-small: 2px;
-  --salt-size-border-strong: 2px;
+}
+.salt-density-touch,
+.salt-density-low,
+.salt-density-medium,
+.salt-density-high {
+  --salt-size-fixed-100: 1px;
+  --salt-size-fixed-200: 2px;
+  --salt-size-fixed-300: 3px;
+  --salt-size-fixed-400: 4px;
+  --salt-size-fixed-500: 5px;
+  --salt-size-fixed-600: 6px;
+  --salt-size-fixed-700: 7px;
+  --salt-size-fixed-800: 8px;
+  --salt-size-fixed-900: 9px;
 }
 
 /* css/foundations/spacing.css */
@@ -1089,6 +1105,15 @@
   --salt-spacing-850: calc(8.5 * var(--salt-spacing-100));
   --salt-spacing-900: calc(9 * var(--salt-spacing-100));
   --salt-spacing-950: calc(9.5 * var(--salt-spacing-100));
+  --salt-spacing-fixed-100: 1px;
+  --salt-spacing-fixed-200: 2px;
+  --salt-spacing-fixed-300: 3px;
+  --salt-spacing-fixed-400: 4px;
+  --salt-spacing-fixed-500: 5px;
+  --salt-spacing-fixed-600: 6px;
+  --salt-spacing-fixed-700: 7px;
+  --salt-spacing-fixed-800: 8px;
+  --salt-spacing-fixed-900: 9px;
 }
 
 /* css/foundations/typography.css */
@@ -1606,9 +1631,6 @@
 
 /* css/characteristics/actionable.css */
 .salt-theme {
-  --salt-actionable-cursor-hover: pointer;
-  --salt-actionable-cursor-active: pointer;
-  --salt-actionable-cursor-disabled: not-allowed;
   --salt-actionable-accented-bold-background-active: var(--salt-palette-interact-cta-background-active);
   --salt-actionable-accented-bold-background-disabled: var(--salt-palette-interact-cta-background-disabled);
   --salt-actionable-accented-bold-background-hover: var(--salt-palette-interact-cta-background-hover);
@@ -1914,16 +1936,6 @@
   --salt-container-ghost-borderColor: var(--salt-palette-alpha-contrast-low);
 }
 
-/* css/characteristics/draggable.css */
-.salt-theme {
-  --salt-draggable-horizontal-cursor-hover: row-resize;
-  --salt-draggable-horizontal-cursor-active: row-resize;
-  --salt-draggable-vertical-cursor-hover: col-resize;
-  --salt-draggable-vertical-cursor-active: col-resize;
-  --salt-draggable-grab-cursor-hover: grab;
-  --salt-draggable-grab-cursor-active: grabbing;
-}
-
 /* css/characteristics/target.css */
 .salt-theme {
   --salt-target-background-hover: var(--salt-palette-interact-background-hover);
@@ -1931,21 +1943,15 @@
   --salt-target-borderStyle: dashed;
   --salt-target-borderStyle-hover: solid;
   --salt-target-borderStyle-disabled: dashed;
-  --salt-target-cursor-disabled: not-allowed;
 }
 
 /* css/characteristics/editable.css */
 .salt-theme {
-  --salt-editable-cursor-hover: text;
-  --salt-editable-cursor-active: text;
-  --salt-editable-cursor-disabled: not-allowed;
-  --salt-editable-cursor-readonly: text;
   --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-borderWidth-active: 2px;
   --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);
@@ -1987,10 +1993,6 @@
 
 /* css/characteristics/navigable.css */
 .salt-theme {
-  --salt-navigable-cursor-active: pointer;
-  --salt-navigable-cursor-hover: pointer;
-  --salt-navigable-cursor-disabled: not-allowed;
-  --salt-navigable-cursor-edit: text;
   --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);
@@ -2015,11 +2017,6 @@
 
 /* css/characteristics/selectable.css */
 .salt-theme {
-  --salt-selectable-cursor-hover: pointer;
-  --salt-selectable-cursor-selected: pointer;
-  --salt-selectable-cursor-blurSelected: pointer;
-  --salt-selectable-cursor-disabled: not-allowed;
-  --salt-selectable-cursor-readonly: not-allowed;
   --salt-selectable-borderStyle: solid;
   --salt-selectable-borderStyle-hover: solid;
   --salt-selectable-borderStyle-selected: solid;
@@ -2276,11 +2273,16 @@
 .salt-theme {
   --salt-differential-positive-foreground: var(--salt-palette-positive-foreground);
   --salt-differential-negative-foreground: var(--salt-palette-negative-foreground);
+  --salt-editable-cursor-hover: text;
+  --salt-editable-cursor-active: text;
+  --salt-editable-cursor-disabled: not-allowed;
+  --salt-editable-cursor-readonly: text;
   --salt-editable-tertiary-background: var(--salt-palette-neutral-tertiary-background);
   --salt-editable-tertiary-background-active: var(--salt-palette-neutral-tertiary-background);
   --salt-editable-tertiary-background-disabled: var(--salt-palette-neutral-tertiary-background-disabled);
   --salt-editable-tertiary-background-hover: var(--salt-palette-neutral-tertiary-background);
   --salt-editable-tertiary-background-readonly: var(--salt-palette-neutral-tertiary-background-readonly);
+  --salt-editable-borderWidth-active: 2px;
   --salt-measured-borderStyle: solid;
   --salt-measured-borderStyle-active: solid;
   --salt-measured-borderStyle-complete: solid;
@@ -2306,6 +2308,11 @@
   --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-cursor-hover: pointer;
+  --salt-selectable-cursor-selected: pointer;
+  --salt-selectable-cursor-blurSelected: pointer;
+  --salt-selectable-cursor-disabled: not-allowed;
+  --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-cta-foreground: var(--salt-palette-interact-foreground);
@@ -2357,12 +2364,22 @@
   --salt-status-error-foreground: var(--salt-palette-error-foreground);
   --salt-status-warning-foreground: var(--salt-palette-warning-foreground);
   --salt-status-success-foreground: var(--salt-palette-success-foreground);
+  --salt-draggable-horizontal-cursor-hover: row-resize;
+  --salt-draggable-horizontal-cursor-active: row-resize;
+  --salt-draggable-vertical-cursor-hover: col-resize;
+  --salt-draggable-vertical-cursor-active: col-resize;
+  --salt-draggable-grab-cursor-hover: grab;
+  --salt-draggable-grab-cursor-active: grabbing;
+  --salt-actionable-cursor-hover: pointer;
+  --salt-actionable-cursor-active: pointer;
+  --salt-actionable-cursor-disabled: not-allowed;
   --salt-actionable-letterSpacing: 0.6px;
   --salt-actionable-textTransform: uppercase;
   --salt-actionable-textAlign: center;
   --salt-actionable-primary-fontWeight: var(--salt-typography-fontWeight-bold);
   --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-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);
@@ -2376,6 +2393,10 @@
   --salt-text-secondary-foreground-disabled: var(--salt-palette-neutral-secondary-foreground-disabled);
   --salt-text-textDecoration: var(--salt-typography-textDecoration-none);
   --salt-text-textTransform: none;
+  --salt-navigable-cursor-active: pointer;
+  --salt-navigable-cursor-hover: pointer;
+  --salt-navigable-cursor-disabled: not-allowed;
+  --salt-navigable-cursor-edit: text;
   --salt-navigable-primary-background: var(--salt-palette-navigate-primary-background);
   --salt-navigable-primary-background-hover: var(--salt-palette-navigate-primary-background-hover);
   --salt-navigable-primary-background-active: var(--salt-palette-navigate-primary-background-active);
@@ -2614,6 +2635,9 @@
   --salt-size-sharktooth-height: 5px;
   --salt-size-sharktooth-width: 10px;
   --salt-size-stackable: calc(var(--salt-size-base) + var(--salt-size-unit));
+  --salt-size-border: 1px;
+  --salt-size-bar-small: 2px;
+  --salt-size-border-strong: 2px;
   --salt-zIndex-docked: 1050;
 }
 .salt-density-high {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salt-ds/theme",
-  "version": "1.29.0",
+  "version": "1.30.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",