@salt-ds/theme 1.40.0 → 1.42.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 (4) hide show
  1. package/css/theme-next.css +82 -72
  2. package/css/theme.css +104 -101
  3. package/index.css +104 -101
  4. package/package.json +1 -1
package/css/theme.css CHANGED
@@ -185,6 +185,7 @@
185
185
  255;
186
186
  --salt-color-black: rgb(var(--salt-color-black-rgb));
187
187
  --salt-color-white: rgb(var(--salt-color-white-rgb));
188
+ --salt-color-transparent: transparent;
188
189
  }
189
190
 
190
191
  /* css/foundations/cursor.css */
@@ -377,6 +378,9 @@
377
378
  --salt-spacing-fixed-700: 7px;
378
379
  --salt-spacing-fixed-800: 8px;
379
380
  --salt-spacing-fixed-900: 9px;
381
+ --salt-spacing-fixed-1000: 10px;
382
+ --salt-spacing-fixed-1100: 11px;
383
+ --salt-spacing-fixed-1200: 12px;
380
384
  }
381
385
 
382
386
  /* css/foundations/typography.css */
@@ -1184,7 +1188,6 @@
1184
1188
  --salt-palette-alpha-contrast-low: var(--salt-color-black-15a);
1185
1189
  --salt-palette-alpha-contrast-lower: var(--salt-color-black-10a);
1186
1190
  --salt-palette-alpha-contrast-lowest: var(--salt-color-black-5a);
1187
- --salt-palette-alpha-none: transparent;
1188
1191
  }
1189
1192
  .salt-theme[data-mode=dark] {
1190
1193
  --salt-palette-alpha-highest: var(--salt-color-black-80a);
@@ -1205,7 +1208,6 @@
1205
1208
  --salt-palette-alpha-contrast-low: var(--salt-color-white-15a);
1206
1209
  --salt-palette-alpha-contrast-lower: var(--salt-color-white-10a);
1207
1210
  --salt-palette-alpha-contrast-lowest: var(--salt-color-white-5a);
1208
- --salt-palette-alpha-none: transparent;
1209
1211
  }
1210
1212
 
1211
1213
  /* css/legacy/palette/categorical.css */
@@ -1392,7 +1394,6 @@
1392
1394
  --salt-palette-interact-foreground: var(--salt-color-gray-200);
1393
1395
  --salt-palette-interact-foreground-active: var(--salt-color-blue-600);
1394
1396
  --salt-palette-interact-foreground-activeDisabled: var(--salt-color-blue-600-40a);
1395
- --salt-palette-interact-foreground-disabled: var(--salt-color-gray-200-40a);
1396
1397
  --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);
1397
1398
  --salt-palette-interact-outline: var(--salt-color-blue-600);
1398
1399
  --salt-palette-interact-cta-background: var(--salt-color-blue-600);
@@ -1429,7 +1430,6 @@
1429
1430
  --salt-palette-interact-foreground: var(--salt-color-gray-90);
1430
1431
  --salt-palette-interact-foreground-active: var(--salt-color-blue-100);
1431
1432
  --salt-palette-interact-foreground-activeDisabled: var(--salt-color-blue-100-40a);
1432
- --salt-palette-interact-foreground-disabled: var(--salt-color-gray-90-40a);
1433
1433
  --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);
1434
1434
  --salt-palette-interact-outline: var(--salt-color-blue-100);
1435
1435
  --salt-palette-interact-cta-background: var(--salt-color-blue-600);
@@ -1588,28 +1588,20 @@
1588
1588
  --salt-palette-warning-action-foreground: var(--salt-color-gray-900);
1589
1589
  }
1590
1590
 
1591
- /* css/legacy/characteristics/accent.css */
1592
- .salt-theme {
1593
- --salt-accent-background: var(--salt-palette-accent);
1594
- --salt-accent-background-disabled: var(--salt-palette-accent-disabled);
1595
- --salt-accent-borderColor: var(--salt-palette-accent);
1596
- --salt-accent-borderColor-disabled: var(--salt-palette-accent-disabled);
1597
- }
1598
-
1599
1591
  /* css/legacy/characteristics/actionable.css */
1600
1592
  .salt-theme {
1601
1593
  --salt-actionable-accented-bold-background-active: var(--salt-palette-interact-cta-background-active);
1602
1594
  --salt-actionable-accented-bold-background-hover: var(--salt-palette-interact-cta-background-hover);
1603
1595
  --salt-actionable-accented-bold-background: var(--salt-palette-interact-cta-background);
1604
- --salt-actionable-accented-bold-borderColor-active: var(--salt-palette-alpha-none);
1605
- --salt-actionable-accented-bold-borderColor-hover: var(--salt-palette-alpha-none);
1606
- --salt-actionable-accented-bold-borderColor: var(--salt-palette-alpha-none);
1596
+ --salt-actionable-accented-bold-borderColor-active: var(--salt-color-transparent);
1597
+ --salt-actionable-accented-bold-borderColor-hover: var(--salt-color-transparent);
1598
+ --salt-actionable-accented-bold-borderColor: var(--salt-color-transparent);
1607
1599
  --salt-actionable-accented-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1608
1600
  --salt-actionable-accented-bold-foreground-hover: var(--salt-palette-interact-cta-foreground);
1609
1601
  --salt-actionable-accented-bold-foreground: var(--salt-palette-interact-cta-foreground);
1610
1602
  --salt-actionable-accented-background-active: var(--salt-palette-interact-cta-background-active);
1611
1603
  --salt-actionable-accented-background-hover: var(--salt-palette-interact-cta-background-hover);
1612
- --salt-actionable-accented-background: var(--salt-palette-alpha-none);
1604
+ --salt-actionable-accented-background: var(--salt-color-transparent);
1613
1605
  --salt-actionable-accented-borderColor-active: var(--salt-palette-interact-cta-border-active);
1614
1606
  --salt-actionable-accented-borderColor-hover: var(--salt-palette-interact-cta-border-hover);
1615
1607
  --salt-actionable-accented-borderColor: var(--salt-palette-accent);
@@ -1617,134 +1609,134 @@
1617
1609
  --salt-actionable-accented-foreground-hover: var(--salt-palette-interact-cta-foreground);
1618
1610
  --salt-actionable-accented-foreground: var(--salt-palette-accent-foreground-informative);
1619
1611
  --salt-actionable-accented-background-selected: var(--salt-palette-interact-cta-background-active);
1620
- --salt-actionable-accented-borderColor-selected: var(--salt-palette-alpha-none);
1612
+ --salt-actionable-accented-borderColor-selected: var(--salt-color-transparent);
1621
1613
  --salt-actionable-accented-foreground-selected: var(--salt-palette-interact-cta-foreground);
1622
1614
  --salt-actionable-accented-subtle-background-active: var(--salt-palette-interact-cta-background-active);
1623
1615
  --salt-actionable-accented-subtle-background-hover: var(--salt-palette-interact-cta-background-hover);
1624
- --salt-actionable-accented-subtle-background: var(--salt-palette-alpha-none);
1625
- --salt-actionable-accented-subtle-borderColor-active: var(--salt-palette-alpha-none);
1626
- --salt-actionable-accented-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1627
- --salt-actionable-accented-subtle-borderColor: var(--salt-palette-alpha-none);
1616
+ --salt-actionable-accented-subtle-background: var(--salt-color-transparent);
1617
+ --salt-actionable-accented-subtle-borderColor-active: var(--salt-color-transparent);
1618
+ --salt-actionable-accented-subtle-borderColor-hover: var(--salt-color-transparent);
1619
+ --salt-actionable-accented-subtle-borderColor: var(--salt-color-transparent);
1628
1620
  --salt-actionable-accented-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1629
1621
  --salt-actionable-accented-subtle-foreground-hover: var(--salt-palette-interact-cta-foreground);
1630
1622
  --salt-actionable-accented-subtle-foreground: var(--salt-palette-accent-foreground-informative);
1631
1623
  --salt-actionable-bold-background-active: var(--salt-palette-interact-primary-background-active);
1632
1624
  --salt-actionable-bold-background-hover: var(--salt-palette-interact-primary-background-hover);
1633
1625
  --salt-actionable-bold-background: var(--salt-palette-interact-primary-background);
1634
- --salt-actionable-bold-borderColor-active: var(--salt-palette-alpha-none);
1635
- --salt-actionable-bold-borderColor-hover: var(--salt-palette-alpha-none);
1636
- --salt-actionable-bold-borderColor: var(--salt-palette-alpha-none);
1626
+ --salt-actionable-bold-borderColor-active: var(--salt-color-transparent);
1627
+ --salt-actionable-bold-borderColor-hover: var(--salt-color-transparent);
1628
+ --salt-actionable-bold-borderColor: var(--salt-color-transparent);
1637
1629
  --salt-actionable-bold-foreground-active: var(--salt-palette-interact-primary-foreground-active);
1638
1630
  --salt-actionable-bold-foreground-hover: var(--salt-palette-neutral-primary-foreground);
1639
1631
  --salt-actionable-bold-foreground: var(--salt-palette-neutral-primary-foreground);
1640
1632
  --salt-actionable-background-active: var(--salt-palette-interact-primary-background-active);
1641
1633
  --salt-actionable-background-hover: var(--salt-palette-interact-primary-background-hover);
1642
- --salt-actionable-background: var(--salt-palette-alpha-none);
1643
- --salt-actionable-borderColor-active: var(--salt-palette-alpha-none);
1644
- --salt-actionable-borderColor-hover: var(--salt-palette-alpha-none);
1634
+ --salt-actionable-background: var(--salt-color-transparent);
1635
+ --salt-actionable-borderColor-active: var(--salt-color-transparent);
1636
+ --salt-actionable-borderColor-hover: var(--salt-color-transparent);
1645
1637
  --salt-actionable-borderColor: var(--salt-palette-interact-border);
1646
1638
  --salt-actionable-foreground-active: var(--salt-palette-interact-primary-foreground-active);
1647
1639
  --salt-actionable-foreground-hover: var(--salt-palette-neutral-primary-foreground);
1648
1640
  --salt-actionable-foreground: var(--salt-palette-neutral-primary-foreground);
1649
1641
  --salt-actionable-background-selected: var(--salt-palette-interact-primary-background-active);
1650
- --salt-actionable-borderColor-selected: var(--salt-palette-alpha-none);
1642
+ --salt-actionable-borderColor-selected: var(--salt-color-transparent);
1651
1643
  --salt-actionable-foreground-selected: var(--salt-palette-interact-primary-foreground-active);
1652
1644
  --salt-actionable-subtle-background-active: var(--salt-palette-interact-primary-background-active);
1653
1645
  --salt-actionable-subtle-background-hover: var(--salt-palette-interact-primary-background-hover);
1654
- --salt-actionable-subtle-background: var(--salt-palette-alpha-none);
1655
- --salt-actionable-subtle-borderColor-active: var(--salt-palette-alpha-none);
1656
- --salt-actionable-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1657
- --salt-actionable-subtle-borderColor: var(--salt-palette-alpha-none);
1646
+ --salt-actionable-subtle-background: var(--salt-color-transparent);
1647
+ --salt-actionable-subtle-borderColor-active: var(--salt-color-transparent);
1648
+ --salt-actionable-subtle-borderColor-hover: var(--salt-color-transparent);
1649
+ --salt-actionable-subtle-borderColor: var(--salt-color-transparent);
1658
1650
  --salt-actionable-subtle-foreground-active: var(--salt-palette-interact-primary-foreground-active);
1659
1651
  --salt-actionable-subtle-foreground-hover: var(--salt-palette-neutral-primary-foreground);
1660
1652
  --salt-actionable-subtle-foreground: var(--salt-palette-neutral-primary-foreground);
1661
1653
  --salt-actionable-negative-bold-background-active: var(--salt-palette-negative-background-active);
1662
1654
  --salt-actionable-negative-bold-background-hover: var(--salt-palette-negative-background-hover);
1663
1655
  --salt-actionable-negative-bold-background: var(--salt-palette-negative-background);
1664
- --salt-actionable-negative-bold-borderColor-active: var(--salt-palette-alpha-none);
1665
- --salt-actionable-negative-bold-borderColor-hover: var(--salt-palette-alpha-none);
1666
- --salt-actionable-negative-bold-borderColor: var(--salt-palette-alpha-none);
1656
+ --salt-actionable-negative-bold-borderColor-active: var(--salt-color-transparent);
1657
+ --salt-actionable-negative-bold-borderColor-hover: var(--salt-color-transparent);
1658
+ --salt-actionable-negative-bold-borderColor: var(--salt-color-transparent);
1667
1659
  --salt-actionable-negative-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1668
1660
  --salt-actionable-negative-bold-foreground-hover: var(--salt-palette-interact-cta-foreground);
1669
1661
  --salt-actionable-negative-bold-foreground: var(--salt-palette-interact-cta-foreground);
1670
1662
  --salt-actionable-negative-background-active: var(--salt-palette-negative-background-active);
1671
1663
  --salt-actionable-negative-background-hover: var(--salt-palette-negative-background-hover);
1672
- --salt-actionable-negative-background: var(--salt-palette-alpha-none);
1673
- --salt-actionable-negative-borderColor-active: var(--salt-palette-alpha-none);
1674
- --salt-actionable-negative-borderColor-hover: var(--salt-palette-alpha-none);
1664
+ --salt-actionable-negative-background: var(--salt-color-transparent);
1665
+ --salt-actionable-negative-borderColor-active: var(--salt-color-transparent);
1666
+ --salt-actionable-negative-borderColor-hover: var(--salt-color-transparent);
1675
1667
  --salt-actionable-negative-borderColor: var(--salt-palette-negative-border);
1676
1668
  --salt-actionable-negative-foreground-active: var(--salt-palette-interact-cta-foreground);
1677
1669
  --salt-actionable-negative-foreground-hover: var(--salt-palette-interact-cta-foreground);
1678
1670
  --salt-actionable-negative-foreground: var(--salt-palette-negative-foreground);
1679
1671
  --salt-actionable-negative-background-selected: var(--salt-palette-negative-background-active);
1680
- --salt-actionable-negative-borderColor-selected: var(--salt-palette-alpha-none);
1672
+ --salt-actionable-negative-borderColor-selected: var(--salt-color-transparent);
1681
1673
  --salt-actionable-negative-foreground-selected: var(--salt-palette-interact-cta-foreground);
1682
1674
  --salt-actionable-negative-subtle-background-active: var(--salt-palette-negative-background-active);
1683
1675
  --salt-actionable-negative-subtle-background-hover: var(--salt-palette-negative-background-hover);
1684
- --salt-actionable-negative-subtle-background: var(--salt-palette-alpha-none);
1685
- --salt-actionable-negative-subtle-borderColor-active: var(--salt-palette-alpha-none);
1686
- --salt-actionable-negative-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1687
- --salt-actionable-negative-subtle-borderColor: var(--salt-palette-alpha-none);
1676
+ --salt-actionable-negative-subtle-background: var(--salt-color-transparent);
1677
+ --salt-actionable-negative-subtle-borderColor-active: var(--salt-color-transparent);
1678
+ --salt-actionable-negative-subtle-borderColor-hover: var(--salt-color-transparent);
1679
+ --salt-actionable-negative-subtle-borderColor: var(--salt-color-transparent);
1688
1680
  --salt-actionable-negative-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1689
1681
  --salt-actionable-negative-subtle-foreground-hover: var(--salt-palette-interact-cta-foreground);
1690
1682
  --salt-actionable-negative-subtle-foreground: var(--salt-palette-negative-foreground);
1691
1683
  --salt-actionable-positive-bold-background-active: var(--salt-palette-positive-background-active);
1692
1684
  --salt-actionable-positive-bold-background-hover: var(--salt-palette-positive-background-hover);
1693
1685
  --salt-actionable-positive-bold-background: var(--salt-palette-positive-background);
1694
- --salt-actionable-positive-bold-borderColor-active: var(--salt-palette-alpha-none);
1695
- --salt-actionable-positive-bold-borderColor-hover: var(--salt-palette-alpha-none);
1696
- --salt-actionable-positive-bold-borderColor: var(--salt-palette-alpha-none);
1686
+ --salt-actionable-positive-bold-borderColor-active: var(--salt-color-transparent);
1687
+ --salt-actionable-positive-bold-borderColor-hover: var(--salt-color-transparent);
1688
+ --salt-actionable-positive-bold-borderColor: var(--salt-color-transparent);
1697
1689
  --salt-actionable-positive-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1698
1690
  --salt-actionable-positive-bold-foreground-hover: var(--salt-palette-interact-cta-foreground);
1699
1691
  --salt-actionable-positive-bold-foreground: var(--salt-palette-interact-cta-foreground);
1700
1692
  --salt-actionable-positive-background-active: var(--salt-palette-positive-background-active);
1701
1693
  --salt-actionable-positive-background-hover: var(--salt-palette-positive-background-hover);
1702
- --salt-actionable-positive-background: var(--salt-palette-alpha-none);
1703
- --salt-actionable-positive-borderColor-active: var(--salt-palette-alpha-none);
1704
- --salt-actionable-positive-borderColor-hover: var(--salt-palette-alpha-none);
1694
+ --salt-actionable-positive-background: var(--salt-color-transparent);
1695
+ --salt-actionable-positive-borderColor-active: var(--salt-color-transparent);
1696
+ --salt-actionable-positive-borderColor-hover: var(--salt-color-transparent);
1705
1697
  --salt-actionable-positive-borderColor: var(--salt-palette-positive-border);
1706
1698
  --salt-actionable-positive-foreground-active: var(--salt-palette-interact-cta-foreground);
1707
1699
  --salt-actionable-positive-foreground-hover: var(--salt-palette-interact-cta-foreground);
1708
1700
  --salt-actionable-positive-foreground: var(--salt-palette-positive-foreground);
1709
1701
  --salt-actionable-positive-background-selected: var(--salt-palette-positive-background-active);
1710
- --salt-actionable-positive-borderColor-selected: var(--salt-palette-alpha-none);
1702
+ --salt-actionable-positive-borderColor-selected: var(--salt-color-transparent);
1711
1703
  --salt-actionable-positive-foreground-selected: var(--salt-palette-interact-cta-foreground);
1712
1704
  --salt-actionable-positive-subtle-background-active: var(--salt-palette-positive-background-active);
1713
1705
  --salt-actionable-positive-subtle-background-hover: var(--salt-palette-positive-background-hover);
1714
- --salt-actionable-positive-subtle-background: var(--salt-palette-alpha-none);
1715
- --salt-actionable-positive-subtle-borderColor-active: var(--salt-palette-alpha-none);
1716
- --salt-actionable-positive-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1717
- --salt-actionable-positive-subtle-borderColor: var(--salt-palette-alpha-none);
1706
+ --salt-actionable-positive-subtle-background: var(--salt-color-transparent);
1707
+ --salt-actionable-positive-subtle-borderColor-active: var(--salt-color-transparent);
1708
+ --salt-actionable-positive-subtle-borderColor-hover: var(--salt-color-transparent);
1709
+ --salt-actionable-positive-subtle-borderColor: var(--salt-color-transparent);
1718
1710
  --salt-actionable-positive-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1719
1711
  --salt-actionable-positive-subtle-foreground-hover: var(--salt-palette-interact-cta-foreground);
1720
1712
  --salt-actionable-positive-subtle-foreground: var(--salt-palette-positive-foreground);
1721
1713
  --salt-actionable-caution-bold-background-active: var(--salt-palette-warning-action-active);
1722
1714
  --salt-actionable-caution-bold-background-hover: var(--salt-palette-warning-action-hover);
1723
1715
  --salt-actionable-caution-bold-background: var(--salt-palette-warning-action);
1724
- --salt-actionable-caution-bold-borderColor-active: var(--salt-palette-alpha-none);
1725
- --salt-actionable-caution-bold-borderColor-hover: var(--salt-palette-alpha-none);
1726
- --salt-actionable-caution-bold-borderColor: var(--salt-palette-alpha-none);
1716
+ --salt-actionable-caution-bold-borderColor-active: var(--salt-color-transparent);
1717
+ --salt-actionable-caution-bold-borderColor-hover: var(--salt-color-transparent);
1718
+ --salt-actionable-caution-bold-borderColor: var(--salt-color-transparent);
1727
1719
  --salt-actionable-caution-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1728
1720
  --salt-actionable-caution-bold-foreground-hover: var(--salt-palette-warning-action-foreground);
1729
1721
  --salt-actionable-caution-bold-foreground: var(--salt-palette-warning-action-foreground);
1730
1722
  --salt-actionable-caution-background-active: var(--salt-palette-warning-action-active);
1731
1723
  --salt-actionable-caution-background-hover: var(--salt-palette-warning-action-hover);
1732
- --salt-actionable-caution-background: var(--salt-palette-alpha-none);
1733
- --salt-actionable-caution-borderColor-active: var(--salt-palette-alpha-none);
1734
- --salt-actionable-caution-borderColor-hover: var(--salt-palette-alpha-none);
1724
+ --salt-actionable-caution-background: var(--salt-color-transparent);
1725
+ --salt-actionable-caution-borderColor-active: var(--salt-color-transparent);
1726
+ --salt-actionable-caution-borderColor-hover: var(--salt-color-transparent);
1735
1727
  --salt-actionable-caution-borderColor: var(--salt-palette-warning-border);
1736
1728
  --salt-actionable-caution-foreground-active: var(--salt-palette-interact-cta-foreground);
1737
1729
  --salt-actionable-caution-foreground-hover: var(--salt-palette-warning-action-foreground);
1738
1730
  --salt-actionable-caution-foreground: var(--salt-palette-warning-foreground-informative);
1739
1731
  --salt-actionable-caution-background-selected: var(--salt-palette-warning-action-active);
1740
- --salt-actionable-caution-borderColor-selected: var(--salt-palette-alpha-none);
1732
+ --salt-actionable-caution-borderColor-selected: var(--salt-color-transparent);
1741
1733
  --salt-actionable-caution-foreground-selected: var(--salt-palette-interact-cta-foreground);
1742
1734
  --salt-actionable-caution-subtle-background-active: var(--salt-palette-warning-action-active);
1743
1735
  --salt-actionable-caution-subtle-background-hover: var(--salt-palette-warning-action-hover);
1744
- --salt-actionable-caution-subtle-background: var(--salt-palette-alpha-none);
1745
- --salt-actionable-caution-subtle-borderColor-active: var(--salt-palette-alpha-none);
1746
- --salt-actionable-caution-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1747
- --salt-actionable-caution-subtle-borderColor: var(--salt-palette-alpha-none);
1736
+ --salt-actionable-caution-subtle-background: var(--salt-color-transparent);
1737
+ --salt-actionable-caution-subtle-borderColor-active: var(--salt-color-transparent);
1738
+ --salt-actionable-caution-subtle-borderColor-hover: var(--salt-color-transparent);
1739
+ --salt-actionable-caution-subtle-borderColor: var(--salt-color-transparent);
1748
1740
  --salt-actionable-caution-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1749
1741
  --salt-actionable-caution-subtle-foreground-hover: var(--salt-palette-warning-action-foreground);
1750
1742
  --salt-actionable-caution-subtle-foreground: var(--salt-palette-warning-foreground-informative);
@@ -1892,16 +1884,13 @@
1892
1884
  --salt-editable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
1893
1885
  --salt-editable-borderColor-hover: var(--salt-palette-interact-border-hover);
1894
1886
  --salt-editable-borderColor-readonly: var(--salt-palette-interact-border-readonly);
1887
+ --salt-editable-background-readonly: var(--salt-color-transparent);
1895
1888
  --salt-editable-primary-background: var(--salt-palette-neutral-primary-background);
1896
- --salt-editable-primary-background-active: var(--salt-palette-neutral-primary-background);
1897
1889
  --salt-editable-primary-background-disabled: var(--salt-palette-neutral-primary-background-disabled);
1898
- --salt-editable-primary-background-hover: var(--salt-palette-neutral-primary-background);
1899
- --salt-editable-primary-background-readonly: var(--salt-palette-alpha-none);
1900
1890
  --salt-editable-secondary-background: var(--salt-palette-neutral-secondary-background);
1901
- --salt-editable-secondary-background-active: var(--salt-palette-neutral-secondary-background);
1902
1891
  --salt-editable-secondary-background-disabled: var(--salt-palette-neutral-secondary-background-disabled);
1903
- --salt-editable-secondary-background-hover: var(--salt-palette-neutral-secondary-background);
1904
- --salt-editable-secondary-background-readonly: var(--salt-palette-alpha-none);
1892
+ --salt-editable-tertiary-background: var(--salt-palette-neutral-tertiary-background);
1893
+ --salt-editable-tertiary-background-disabled: var(--salt-palette-neutral-tertiary-background-disabled);
1905
1894
  }
1906
1895
 
1907
1896
  /* css/legacy/characteristics/focused.css */
@@ -1931,7 +1920,7 @@
1931
1920
  .salt-theme {
1932
1921
  --salt-navigable-indicator-hover: var(--salt-palette-navigate-indicator-hover);
1933
1922
  --salt-navigable-accent-indicator-active: var(--salt-palette-navigate-indicator-active);
1934
- --salt-navigable-accent-background-active: var(--salt-palette-alpha-none);
1923
+ --salt-navigable-accent-background-active: var(--salt-color-transparent);
1935
1924
  --salt-navigable-accent-borderColor-active: var(--salt-palette-interact-border-active);
1936
1925
  }
1937
1926
 
@@ -1956,17 +1945,15 @@
1956
1945
  --salt-selectable-borderColor-hover: var(--salt-palette-interact-border-hover);
1957
1946
  --salt-selectable-borderColor-selected: var(--salt-palette-interact-border-active);
1958
1947
  --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-interact-border-activeDisabled);
1959
- --salt-selectable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
1960
1948
  --salt-selectable-borderColor-readonly: var(--salt-palette-interact-border);
1961
1949
  --salt-selectable-foreground: var(--salt-palette-interact-foreground);
1962
- --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
1963
1950
  --salt-selectable-foreground-hover: var(--salt-palette-interact-foreground-hover);
1964
1951
  --salt-selectable-foreground-selected: var(--salt-palette-interact-foreground-active);
1965
1952
  --salt-selectable-foreground-selectedDisabled: var(--salt-palette-interact-foreground-activeDisabled);
1966
- --salt-selectable-background: var(--salt-palette-alpha-none);
1953
+ --salt-selectable-background: var(--salt-color-transparent);
1967
1954
  --salt-selectable-background-hover: var(--salt-palette-interact-background-hover);
1968
1955
  --salt-selectable-background-selected: var(--salt-palette-interact-background-active);
1969
- --salt-selectable-background-disabled: var(--salt-palette-alpha-none);
1956
+ --salt-selectable-background-disabled: var(--salt-color-transparent);
1970
1957
  --salt-selectable-background-selectedDisabled: var(--salt-palette-interact-background-activeDisabled);
1971
1958
  }
1972
1959
 
@@ -1977,12 +1964,14 @@
1977
1964
  --salt-sentiment-negative-foreground-decorative: var(--salt-palette-negative-foreground);
1978
1965
  --salt-sentiment-positive-foreground-decorative: var(--salt-palette-positive-foreground);
1979
1966
  --salt-sentiment-neutral-track: var(--salt-palette-neutral-border);
1980
- --salt-sentiment-neutral-track-disabled: var(--salt-palette-neutral-border-disabled);
1981
1967
  --salt-sentiment-caution-dataviz: var(--salt-palette-warning-foreground-decorative);
1982
1968
  --salt-sentiment-negative-dataviz: var(--salt-palette-error-foreground-decorative);
1983
1969
  --salt-sentiment-positive-dataviz: var(--salt-palette-success-foreground-decorative);
1984
1970
  --salt-sentiment-neutral-dataviz: var(--salt-palette-neutral-secondary-foreground);
1985
- --salt-sentiment-accent-dataviz: var(--salt-palette-accent-foreground-informative);
1971
+ --salt-sentiment-accent-dataviz: var(--salt-palette-warning-foreground-decorative);
1972
+ --salt-sentiment-accent-background: var(--salt-palette-accent);
1973
+ --salt-sentiment-accent-background-disabled: var(--salt-palette-accent-disabled);
1974
+ --salt-sentiment-accent-borderColor: var(--salt-palette-accent);
1986
1975
  }
1987
1976
 
1988
1977
  /* css/legacy/characteristics/separable.css */
@@ -2404,6 +2393,9 @@
2404
2393
  --salt-navigable-fontWeight-active: var(--salt-typography-fontWeight-semiBold);
2405
2394
  --salt-navigable-fontWeight-edit: var(--salt-typography-fontWeight-regular);
2406
2395
  --salt-accent-fontWeight: var(--salt-typography-fontWeight-semiBold);
2396
+ --salt-accent-background: var(--salt-palette-accent);
2397
+ --salt-accent-background-disabled: var(--salt-palette-accent-disabled);
2398
+ --salt-accent-borderColor: var(--salt-palette-accent);
2407
2399
  --salt-track-borderStyle: solid;
2408
2400
  --salt-track-borderStyle-active: solid;
2409
2401
  --salt-track-borderStyle-complete: solid;
@@ -2441,11 +2433,15 @@
2441
2433
  .salt-theme {
2442
2434
  --salt-differential-positive-foreground: var(--salt-palette-positive-foreground);
2443
2435
  --salt-differential-negative-foreground: var(--salt-palette-negative-foreground);
2444
- --salt-editable-tertiary-background: var(--salt-palette-neutral-tertiary-background);
2445
2436
  --salt-editable-tertiary-background-active: var(--salt-palette-neutral-tertiary-background);
2446
- --salt-editable-tertiary-background-disabled: var(--salt-palette-neutral-tertiary-background-disabled);
2447
2437
  --salt-editable-tertiary-background-hover: var(--salt-palette-neutral-tertiary-background);
2448
2438
  --salt-editable-tertiary-background-readonly: var(--salt-palette-neutral-tertiary-background-readonly);
2439
+ --salt-editable-primary-background-active: var(--salt-palette-neutral-primary-background);
2440
+ --salt-editable-primary-background-hover: var(--salt-palette-neutral-primary-background);
2441
+ --salt-editable-primary-background-readonly: var(--salt-color-transparent);
2442
+ --salt-editable-secondary-background-active: var(--salt-palette-neutral-secondary-background);
2443
+ --salt-editable-secondary-background-hover: var(--salt-palette-neutral-secondary-background);
2444
+ --salt-editable-secondary-background-readonly: var(--salt-color-transparent);
2449
2445
  --salt-measured-background: var(--salt-palette-measured-background);
2450
2446
  --salt-measured-background-disabled: var(--salt-palette-measured-background-disabled);
2451
2447
  --salt-measured-borderColor: var(--salt-palette-measured-border);
@@ -2461,6 +2457,8 @@
2461
2457
  --salt-overlayable-rangeSelection: var(--salt-overlayable-background-rangeSelection);
2462
2458
  --salt-selectable-foreground-partial: var(--salt-palette-interact-foreground-partial);
2463
2459
  --salt-selectable-foreground-partialDisabled: var(--salt-palette-interact-foreground-partialDisabled);
2460
+ --salt-selectable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
2461
+ --salt-selectable-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
2464
2462
  --salt-selectable-background-blurSelected: var(--salt-palette-interact-background-blurSelected);
2465
2463
  --salt-selectable-cta-foreground: var(--salt-palette-interact-foreground);
2466
2464
  --salt-selectable-cta-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
@@ -2536,6 +2534,7 @@
2536
2534
  --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
2537
2535
  --salt-accent-foreground-disabled: var(--salt-palette-accent-foreground-disabled);
2538
2536
  --salt-accent-foreground: var(--salt-palette-accent-foreground);
2537
+ --salt-accent-borderColor-disabled: var(--salt-palette-accent-disabled);
2539
2538
  --salt-track-background: var(--salt-palette-track-background);
2540
2539
  --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
2541
2540
  --salt-track-borderColor: var(--salt-palette-neutral-border);
@@ -2585,51 +2584,51 @@
2585
2584
  --salt-actionable-secondary-foreground-hover: var(--salt-actionable-subtle-foreground-hover);
2586
2585
  --salt-actionable-secondary-foreground: var(--salt-actionable-subtle-foreground);
2587
2586
  --salt-actionable-accented-bold-background-disabled: var(--salt-palette-interact-cta-background-disabled);
2588
- --salt-actionable-accented-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2587
+ --salt-actionable-accented-bold-borderColor-disabled: var(--salt-color-transparent);
2589
2588
  --salt-actionable-accented-bold-foreground-disabled: var(--salt-palette-interact-cta-foreground-disabled);
2590
2589
  --salt-actionable-bold-background-disabled: var(--salt-palette-interact-primary-background-disabled);
2591
- --salt-actionable-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2590
+ --salt-actionable-bold-borderColor-disabled: var(--salt-color-transparent);
2592
2591
  --salt-actionable-bold-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
2593
- --salt-actionable-accented-background-disabled: var(--salt-palette-alpha-none);
2592
+ --salt-actionable-accented-background-disabled: var(--salt-color-transparent);
2594
2593
  --salt-actionable-accented-borderColor-disabled: var(--salt-palette-accent-disabled);
2595
2594
  --salt-actionable-accented-foreground-disabled: var(--salt-palette-accent-foreground-informative-disabled);
2596
- --salt-actionable-background-disabled: var(--salt-palette-alpha-none);
2595
+ --salt-actionable-background-disabled: var(--salt-color-transparent);
2597
2596
  --salt-actionable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
2598
2597
  --salt-actionable-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
2599
- --salt-actionable-accented-subtle-background-disabled: var(--salt-palette-alpha-none);
2600
- --salt-actionable-accented-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
2598
+ --salt-actionable-accented-subtle-background-disabled: var(--salt-color-transparent);
2599
+ --salt-actionable-accented-subtle-borderColor-disabled: var(--salt-color-transparent);
2601
2600
  --salt-actionable-accented-subtle-foreground-disabled: var(--salt-palette-accent-foreground-informative-disabled);
2602
- --salt-actionable-subtle-background-disabled: var(--salt-palette-alpha-none);
2603
- --salt-actionable-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
2601
+ --salt-actionable-subtle-background-disabled: var(--salt-color-transparent);
2602
+ --salt-actionable-subtle-borderColor-disabled: var(--salt-color-transparent);
2604
2603
  --salt-actionable-subtle-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
2605
2604
  --salt-actionable-negative-bold-background-disabled: var(--salt-palette-negative-background-disabled);
2606
- --salt-actionable-negative-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2605
+ --salt-actionable-negative-bold-borderColor-disabled: var(--salt-color-transparent);
2607
2606
  --salt-actionable-negative-bold-foreground-disabled: var(--salt-palette-interact-cta-foreground-disabled);
2608
- --salt-actionable-negative-background-disabled: var(--salt-palette-alpha-none);
2607
+ --salt-actionable-negative-background-disabled: var(--salt-color-transparent);
2609
2608
  --salt-actionable-negative-borderColor-disabled: var(--salt-palette-negative-border-disabled);
2610
2609
  --salt-actionable-negative-foreground-disabled: var(--salt-palette-negative-foreground-disabled);
2611
- --salt-actionable-negative-subtle-background-disabled: var(--salt-palette-alpha-none);
2612
- --salt-actionable-negative-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
2610
+ --salt-actionable-negative-subtle-background-disabled: var(--salt-color-transparent);
2611
+ --salt-actionable-negative-subtle-borderColor-disabled: var(--salt-color-transparent);
2613
2612
  --salt-actionable-negative-subtle-foreground-disabled: var(--salt-palette-negative-foreground-disabled);
2614
2613
  --salt-actionable-positive-bold-background-disabled: var(--salt-palette-positive-background-disabled);
2615
- --salt-actionable-positive-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2614
+ --salt-actionable-positive-bold-borderColor-disabled: var(--salt-color-transparent);
2616
2615
  --salt-actionable-positive-bold-foreground-disabled: var(--salt-palette-interact-cta-foreground-disabled);
2617
- --salt-actionable-positive-background-disabled: var(--salt-palette-alpha-none);
2616
+ --salt-actionable-positive-background-disabled: var(--salt-color-transparent);
2618
2617
  --salt-actionable-positive-borderColor-disabled: var(--salt-palette-positive-border-disabled);
2619
2618
  --salt-actionable-positive-foreground-disabled: var(--salt-palette-positive-foreground-disabled);
2620
- --salt-actionable-positive-subtle-background-disabled: var(--salt-palette-alpha-none);
2621
- --salt-actionable-positive-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
2619
+ --salt-actionable-positive-subtle-background-disabled: var(--salt-color-transparent);
2620
+ --salt-actionable-positive-subtle-borderColor-disabled: var(--salt-color-transparent);
2622
2621
  --salt-actionable-positive-subtle-foreground-disabled: var(--salt-palette-positive-foreground-disabled);
2623
2622
  --salt-actionable-caution-bold-background-disabled: var(--salt-palette-warning-action-disabled);
2624
- --salt-actionable-caution-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2623
+ --salt-actionable-caution-bold-borderColor-disabled: var(--salt-color-transparent);
2625
2624
  --salt-actionable-caution-bold-foreground-disabled: var(--salt-palette-warning-action-foreground-disabled);
2626
- --salt-actionable-caution-background-disabled: var(--salt-palette-alpha-none);
2625
+ --salt-actionable-caution-background-disabled: var(--salt-color-transparent);
2627
2626
  --salt-actionable-caution-borderColor-disabled: var(--salt-palette-warning-border-disabled);
2628
2627
  --salt-actionable-caution-foreground-disabled: var(--salt-palette-warning-foreground-informative-disabled);
2629
- --salt-actionable-caution-subtle-background-disabled: var(--salt-palette-alpha-none);
2630
- --salt-actionable-caution-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
2628
+ --salt-actionable-caution-subtle-background-disabled: var(--salt-color-transparent);
2629
+ --salt-actionable-caution-subtle-borderColor-disabled: var(--salt-color-transparent);
2631
2630
  --salt-actionable-caution-subtle-foreground-disabled: var(--salt-palette-warning-foreground-informative-disabled);
2632
- --salt-separable-background: var(--salt-palette-alpha-none);
2631
+ --salt-separable-background: var(--salt-color-transparent);
2633
2632
  --salt-category-1-bold-foreground: var(--salt-palette-accent-foreground);
2634
2633
  --salt-category-2-bold-foreground: var(--salt-palette-accent-foreground);
2635
2634
  --salt-category-3-bold-foreground: var(--salt-palette-accent-foreground);
@@ -2713,6 +2712,7 @@
2713
2712
  --salt-category-20-subtle-foreground: var(--salt-palette-categorical-20-strong);
2714
2713
  --salt-category-20-subtle-background: var(--salt-palette-categorical-20-weakest);
2715
2714
  --salt-category-20-subtle-borderColor: var(--salt-palette-categorical-20);
2715
+ --salt-sentiment-neutral-track-disabled: var(--salt-palette-neutral-border-disabled);
2716
2716
  }
2717
2717
 
2718
2718
  /* css/legacy/deprecated/fade.css */
@@ -2817,6 +2817,7 @@
2817
2817
  --salt-palette-opacity-primary-border: var(--salt-opacity-45);
2818
2818
  --salt-palette-opacity-secondary-border: var(--salt-opacity-25);
2819
2819
  --salt-palette-opacity-tertiary-border: var(--salt-opacity-15);
2820
+ --salt-palette-alpha-none: transparent;
2820
2821
  --salt-palette-alpha: var(--salt-palette-alpha-contrast-medium);
2821
2822
  --salt-palette-alpha-strong: var(--salt-palette-alpha-contrast-mediumHigh);
2822
2823
  --salt-palette-alpha-weak: var(--salt-palette-alpha-contrast-mediumLow);
@@ -2861,6 +2862,7 @@
2861
2862
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
2862
2863
  --salt-palette-interact-cta-background-disabled: var(--salt-color-blue-600-40a);
2863
2864
  --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-60-40a);
2865
+ --salt-palette-interact-foreground-disabled: var(--salt-color-gray-200-40a);
2864
2866
  --salt-palette-measured-fill: var(--salt-color-blue-500);
2865
2867
  --salt-palette-measured-fill-disabled: var(--salt-color-blue-500-fade-fill);
2866
2868
  --salt-palette-measured-foreground: var(--salt-color-gray-90);
@@ -2951,6 +2953,7 @@
2951
2953
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
2952
2954
  --salt-palette-interact-cta-background-disabled: var(--salt-color-blue-600-40a);
2953
2955
  --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-300-40a);
2956
+ --salt-palette-interact-foreground-disabled: var(--salt-color-gray-90-40a);
2954
2957
  --salt-palette-measured-fill: var(--salt-color-blue-300);
2955
2958
  --salt-palette-measured-fill-disabled: var(--salt-color-blue-300-fade-fill);
2956
2959
  --salt-palette-measured-foreground: var(--salt-color-gray-90);