@salt-ds/theme 1.41.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 +73 -69
  2. package/css/theme.css +94 -95
  3. package/index.css +94 -95
  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 */
@@ -1187,7 +1188,6 @@
1187
1188
  --salt-palette-alpha-contrast-low: var(--salt-color-black-15a);
1188
1189
  --salt-palette-alpha-contrast-lower: var(--salt-color-black-10a);
1189
1190
  --salt-palette-alpha-contrast-lowest: var(--salt-color-black-5a);
1190
- --salt-palette-alpha-none: transparent;
1191
1191
  }
1192
1192
  .salt-theme[data-mode=dark] {
1193
1193
  --salt-palette-alpha-highest: var(--salt-color-black-80a);
@@ -1208,7 +1208,6 @@
1208
1208
  --salt-palette-alpha-contrast-low: var(--salt-color-white-15a);
1209
1209
  --salt-palette-alpha-contrast-lower: var(--salt-color-white-10a);
1210
1210
  --salt-palette-alpha-contrast-lowest: var(--salt-color-white-5a);
1211
- --salt-palette-alpha-none: transparent;
1212
1211
  }
1213
1212
 
1214
1213
  /* css/legacy/palette/categorical.css */
@@ -1395,7 +1394,6 @@
1395
1394
  --salt-palette-interact-foreground: var(--salt-color-gray-200);
1396
1395
  --salt-palette-interact-foreground-active: var(--salt-color-blue-600);
1397
1396
  --salt-palette-interact-foreground-activeDisabled: var(--salt-color-blue-600-40a);
1398
- --salt-palette-interact-foreground-disabled: var(--salt-color-gray-200-40a);
1399
1397
  --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);
1400
1398
  --salt-palette-interact-outline: var(--salt-color-blue-600);
1401
1399
  --salt-palette-interact-cta-background: var(--salt-color-blue-600);
@@ -1432,7 +1430,6 @@
1432
1430
  --salt-palette-interact-foreground: var(--salt-color-gray-90);
1433
1431
  --salt-palette-interact-foreground-active: var(--salt-color-blue-100);
1434
1432
  --salt-palette-interact-foreground-activeDisabled: var(--salt-color-blue-100-40a);
1435
- --salt-palette-interact-foreground-disabled: var(--salt-color-gray-90-40a);
1436
1433
  --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);
1437
1434
  --salt-palette-interact-outline: var(--salt-color-blue-100);
1438
1435
  --salt-palette-interact-cta-background: var(--salt-color-blue-600);
@@ -1591,28 +1588,20 @@
1591
1588
  --salt-palette-warning-action-foreground: var(--salt-color-gray-900);
1592
1589
  }
1593
1590
 
1594
- /* css/legacy/characteristics/accent.css */
1595
- .salt-theme {
1596
- --salt-accent-background: var(--salt-palette-accent);
1597
- --salt-accent-background-disabled: var(--salt-palette-accent-disabled);
1598
- --salt-accent-borderColor: var(--salt-palette-accent);
1599
- --salt-accent-borderColor-disabled: var(--salt-palette-accent-disabled);
1600
- }
1601
-
1602
1591
  /* css/legacy/characteristics/actionable.css */
1603
1592
  .salt-theme {
1604
1593
  --salt-actionable-accented-bold-background-active: var(--salt-palette-interact-cta-background-active);
1605
1594
  --salt-actionable-accented-bold-background-hover: var(--salt-palette-interact-cta-background-hover);
1606
1595
  --salt-actionable-accented-bold-background: var(--salt-palette-interact-cta-background);
1607
- --salt-actionable-accented-bold-borderColor-active: var(--salt-palette-alpha-none);
1608
- --salt-actionable-accented-bold-borderColor-hover: var(--salt-palette-alpha-none);
1609
- --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);
1610
1599
  --salt-actionable-accented-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1611
1600
  --salt-actionable-accented-bold-foreground-hover: var(--salt-palette-interact-cta-foreground);
1612
1601
  --salt-actionable-accented-bold-foreground: var(--salt-palette-interact-cta-foreground);
1613
1602
  --salt-actionable-accented-background-active: var(--salt-palette-interact-cta-background-active);
1614
1603
  --salt-actionable-accented-background-hover: var(--salt-palette-interact-cta-background-hover);
1615
- --salt-actionable-accented-background: var(--salt-palette-alpha-none);
1604
+ --salt-actionable-accented-background: var(--salt-color-transparent);
1616
1605
  --salt-actionable-accented-borderColor-active: var(--salt-palette-interact-cta-border-active);
1617
1606
  --salt-actionable-accented-borderColor-hover: var(--salt-palette-interact-cta-border-hover);
1618
1607
  --salt-actionable-accented-borderColor: var(--salt-palette-accent);
@@ -1620,134 +1609,134 @@
1620
1609
  --salt-actionable-accented-foreground-hover: var(--salt-palette-interact-cta-foreground);
1621
1610
  --salt-actionable-accented-foreground: var(--salt-palette-accent-foreground-informative);
1622
1611
  --salt-actionable-accented-background-selected: var(--salt-palette-interact-cta-background-active);
1623
- --salt-actionable-accented-borderColor-selected: var(--salt-palette-alpha-none);
1612
+ --salt-actionable-accented-borderColor-selected: var(--salt-color-transparent);
1624
1613
  --salt-actionable-accented-foreground-selected: var(--salt-palette-interact-cta-foreground);
1625
1614
  --salt-actionable-accented-subtle-background-active: var(--salt-palette-interact-cta-background-active);
1626
1615
  --salt-actionable-accented-subtle-background-hover: var(--salt-palette-interact-cta-background-hover);
1627
- --salt-actionable-accented-subtle-background: var(--salt-palette-alpha-none);
1628
- --salt-actionable-accented-subtle-borderColor-active: var(--salt-palette-alpha-none);
1629
- --salt-actionable-accented-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1630
- --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);
1631
1620
  --salt-actionable-accented-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1632
1621
  --salt-actionable-accented-subtle-foreground-hover: var(--salt-palette-interact-cta-foreground);
1633
1622
  --salt-actionable-accented-subtle-foreground: var(--salt-palette-accent-foreground-informative);
1634
1623
  --salt-actionable-bold-background-active: var(--salt-palette-interact-primary-background-active);
1635
1624
  --salt-actionable-bold-background-hover: var(--salt-palette-interact-primary-background-hover);
1636
1625
  --salt-actionable-bold-background: var(--salt-palette-interact-primary-background);
1637
- --salt-actionable-bold-borderColor-active: var(--salt-palette-alpha-none);
1638
- --salt-actionable-bold-borderColor-hover: var(--salt-palette-alpha-none);
1639
- --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);
1640
1629
  --salt-actionable-bold-foreground-active: var(--salt-palette-interact-primary-foreground-active);
1641
1630
  --salt-actionable-bold-foreground-hover: var(--salt-palette-neutral-primary-foreground);
1642
1631
  --salt-actionable-bold-foreground: var(--salt-palette-neutral-primary-foreground);
1643
1632
  --salt-actionable-background-active: var(--salt-palette-interact-primary-background-active);
1644
1633
  --salt-actionable-background-hover: var(--salt-palette-interact-primary-background-hover);
1645
- --salt-actionable-background: var(--salt-palette-alpha-none);
1646
- --salt-actionable-borderColor-active: var(--salt-palette-alpha-none);
1647
- --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);
1648
1637
  --salt-actionable-borderColor: var(--salt-palette-interact-border);
1649
1638
  --salt-actionable-foreground-active: var(--salt-palette-interact-primary-foreground-active);
1650
1639
  --salt-actionable-foreground-hover: var(--salt-palette-neutral-primary-foreground);
1651
1640
  --salt-actionable-foreground: var(--salt-palette-neutral-primary-foreground);
1652
1641
  --salt-actionable-background-selected: var(--salt-palette-interact-primary-background-active);
1653
- --salt-actionable-borderColor-selected: var(--salt-palette-alpha-none);
1642
+ --salt-actionable-borderColor-selected: var(--salt-color-transparent);
1654
1643
  --salt-actionable-foreground-selected: var(--salt-palette-interact-primary-foreground-active);
1655
1644
  --salt-actionable-subtle-background-active: var(--salt-palette-interact-primary-background-active);
1656
1645
  --salt-actionable-subtle-background-hover: var(--salt-palette-interact-primary-background-hover);
1657
- --salt-actionable-subtle-background: var(--salt-palette-alpha-none);
1658
- --salt-actionable-subtle-borderColor-active: var(--salt-palette-alpha-none);
1659
- --salt-actionable-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1660
- --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);
1661
1650
  --salt-actionable-subtle-foreground-active: var(--salt-palette-interact-primary-foreground-active);
1662
1651
  --salt-actionable-subtle-foreground-hover: var(--salt-palette-neutral-primary-foreground);
1663
1652
  --salt-actionable-subtle-foreground: var(--salt-palette-neutral-primary-foreground);
1664
1653
  --salt-actionable-negative-bold-background-active: var(--salt-palette-negative-background-active);
1665
1654
  --salt-actionable-negative-bold-background-hover: var(--salt-palette-negative-background-hover);
1666
1655
  --salt-actionable-negative-bold-background: var(--salt-palette-negative-background);
1667
- --salt-actionable-negative-bold-borderColor-active: var(--salt-palette-alpha-none);
1668
- --salt-actionable-negative-bold-borderColor-hover: var(--salt-palette-alpha-none);
1669
- --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);
1670
1659
  --salt-actionable-negative-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1671
1660
  --salt-actionable-negative-bold-foreground-hover: var(--salt-palette-interact-cta-foreground);
1672
1661
  --salt-actionable-negative-bold-foreground: var(--salt-palette-interact-cta-foreground);
1673
1662
  --salt-actionable-negative-background-active: var(--salt-palette-negative-background-active);
1674
1663
  --salt-actionable-negative-background-hover: var(--salt-palette-negative-background-hover);
1675
- --salt-actionable-negative-background: var(--salt-palette-alpha-none);
1676
- --salt-actionable-negative-borderColor-active: var(--salt-palette-alpha-none);
1677
- --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);
1678
1667
  --salt-actionable-negative-borderColor: var(--salt-palette-negative-border);
1679
1668
  --salt-actionable-negative-foreground-active: var(--salt-palette-interact-cta-foreground);
1680
1669
  --salt-actionable-negative-foreground-hover: var(--salt-palette-interact-cta-foreground);
1681
1670
  --salt-actionable-negative-foreground: var(--salt-palette-negative-foreground);
1682
1671
  --salt-actionable-negative-background-selected: var(--salt-palette-negative-background-active);
1683
- --salt-actionable-negative-borderColor-selected: var(--salt-palette-alpha-none);
1672
+ --salt-actionable-negative-borderColor-selected: var(--salt-color-transparent);
1684
1673
  --salt-actionable-negative-foreground-selected: var(--salt-palette-interact-cta-foreground);
1685
1674
  --salt-actionable-negative-subtle-background-active: var(--salt-palette-negative-background-active);
1686
1675
  --salt-actionable-negative-subtle-background-hover: var(--salt-palette-negative-background-hover);
1687
- --salt-actionable-negative-subtle-background: var(--salt-palette-alpha-none);
1688
- --salt-actionable-negative-subtle-borderColor-active: var(--salt-palette-alpha-none);
1689
- --salt-actionable-negative-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1690
- --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);
1691
1680
  --salt-actionable-negative-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1692
1681
  --salt-actionable-negative-subtle-foreground-hover: var(--salt-palette-interact-cta-foreground);
1693
1682
  --salt-actionable-negative-subtle-foreground: var(--salt-palette-negative-foreground);
1694
1683
  --salt-actionable-positive-bold-background-active: var(--salt-palette-positive-background-active);
1695
1684
  --salt-actionable-positive-bold-background-hover: var(--salt-palette-positive-background-hover);
1696
1685
  --salt-actionable-positive-bold-background: var(--salt-palette-positive-background);
1697
- --salt-actionable-positive-bold-borderColor-active: var(--salt-palette-alpha-none);
1698
- --salt-actionable-positive-bold-borderColor-hover: var(--salt-palette-alpha-none);
1699
- --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);
1700
1689
  --salt-actionable-positive-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1701
1690
  --salt-actionable-positive-bold-foreground-hover: var(--salt-palette-interact-cta-foreground);
1702
1691
  --salt-actionable-positive-bold-foreground: var(--salt-palette-interact-cta-foreground);
1703
1692
  --salt-actionable-positive-background-active: var(--salt-palette-positive-background-active);
1704
1693
  --salt-actionable-positive-background-hover: var(--salt-palette-positive-background-hover);
1705
- --salt-actionable-positive-background: var(--salt-palette-alpha-none);
1706
- --salt-actionable-positive-borderColor-active: var(--salt-palette-alpha-none);
1707
- --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);
1708
1697
  --salt-actionable-positive-borderColor: var(--salt-palette-positive-border);
1709
1698
  --salt-actionable-positive-foreground-active: var(--salt-palette-interact-cta-foreground);
1710
1699
  --salt-actionable-positive-foreground-hover: var(--salt-palette-interact-cta-foreground);
1711
1700
  --salt-actionable-positive-foreground: var(--salt-palette-positive-foreground);
1712
1701
  --salt-actionable-positive-background-selected: var(--salt-palette-positive-background-active);
1713
- --salt-actionable-positive-borderColor-selected: var(--salt-palette-alpha-none);
1702
+ --salt-actionable-positive-borderColor-selected: var(--salt-color-transparent);
1714
1703
  --salt-actionable-positive-foreground-selected: var(--salt-palette-interact-cta-foreground);
1715
1704
  --salt-actionable-positive-subtle-background-active: var(--salt-palette-positive-background-active);
1716
1705
  --salt-actionable-positive-subtle-background-hover: var(--salt-palette-positive-background-hover);
1717
- --salt-actionable-positive-subtle-background: var(--salt-palette-alpha-none);
1718
- --salt-actionable-positive-subtle-borderColor-active: var(--salt-palette-alpha-none);
1719
- --salt-actionable-positive-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1720
- --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);
1721
1710
  --salt-actionable-positive-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1722
1711
  --salt-actionable-positive-subtle-foreground-hover: var(--salt-palette-interact-cta-foreground);
1723
1712
  --salt-actionable-positive-subtle-foreground: var(--salt-palette-positive-foreground);
1724
1713
  --salt-actionable-caution-bold-background-active: var(--salt-palette-warning-action-active);
1725
1714
  --salt-actionable-caution-bold-background-hover: var(--salt-palette-warning-action-hover);
1726
1715
  --salt-actionable-caution-bold-background: var(--salt-palette-warning-action);
1727
- --salt-actionable-caution-bold-borderColor-active: var(--salt-palette-alpha-none);
1728
- --salt-actionable-caution-bold-borderColor-hover: var(--salt-palette-alpha-none);
1729
- --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);
1730
1719
  --salt-actionable-caution-bold-foreground-active: var(--salt-palette-interact-cta-foreground);
1731
1720
  --salt-actionable-caution-bold-foreground-hover: var(--salt-palette-warning-action-foreground);
1732
1721
  --salt-actionable-caution-bold-foreground: var(--salt-palette-warning-action-foreground);
1733
1722
  --salt-actionable-caution-background-active: var(--salt-palette-warning-action-active);
1734
1723
  --salt-actionable-caution-background-hover: var(--salt-palette-warning-action-hover);
1735
- --salt-actionable-caution-background: var(--salt-palette-alpha-none);
1736
- --salt-actionable-caution-borderColor-active: var(--salt-palette-alpha-none);
1737
- --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);
1738
1727
  --salt-actionable-caution-borderColor: var(--salt-palette-warning-border);
1739
1728
  --salt-actionable-caution-foreground-active: var(--salt-palette-interact-cta-foreground);
1740
1729
  --salt-actionable-caution-foreground-hover: var(--salt-palette-warning-action-foreground);
1741
1730
  --salt-actionable-caution-foreground: var(--salt-palette-warning-foreground-informative);
1742
1731
  --salt-actionable-caution-background-selected: var(--salt-palette-warning-action-active);
1743
- --salt-actionable-caution-borderColor-selected: var(--salt-palette-alpha-none);
1732
+ --salt-actionable-caution-borderColor-selected: var(--salt-color-transparent);
1744
1733
  --salt-actionable-caution-foreground-selected: var(--salt-palette-interact-cta-foreground);
1745
1734
  --salt-actionable-caution-subtle-background-active: var(--salt-palette-warning-action-active);
1746
1735
  --salt-actionable-caution-subtle-background-hover: var(--salt-palette-warning-action-hover);
1747
- --salt-actionable-caution-subtle-background: var(--salt-palette-alpha-none);
1748
- --salt-actionable-caution-subtle-borderColor-active: var(--salt-palette-alpha-none);
1749
- --salt-actionable-caution-subtle-borderColor-hover: var(--salt-palette-alpha-none);
1750
- --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);
1751
1740
  --salt-actionable-caution-subtle-foreground-active: var(--salt-palette-interact-cta-foreground);
1752
1741
  --salt-actionable-caution-subtle-foreground-hover: var(--salt-palette-warning-action-foreground);
1753
1742
  --salt-actionable-caution-subtle-foreground: var(--salt-palette-warning-foreground-informative);
@@ -1895,7 +1884,7 @@
1895
1884
  --salt-editable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
1896
1885
  --salt-editable-borderColor-hover: var(--salt-palette-interact-border-hover);
1897
1886
  --salt-editable-borderColor-readonly: var(--salt-palette-interact-border-readonly);
1898
- --salt-editable-background-readonly: var(--salt-palette-alpha-none);
1887
+ --salt-editable-background-readonly: var(--salt-color-transparent);
1899
1888
  --salt-editable-primary-background: var(--salt-palette-neutral-primary-background);
1900
1889
  --salt-editable-primary-background-disabled: var(--salt-palette-neutral-primary-background-disabled);
1901
1890
  --salt-editable-secondary-background: var(--salt-palette-neutral-secondary-background);
@@ -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
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;
@@ -2446,10 +2438,10 @@
2446
2438
  --salt-editable-tertiary-background-readonly: var(--salt-palette-neutral-tertiary-background-readonly);
2447
2439
  --salt-editable-primary-background-active: var(--salt-palette-neutral-primary-background);
2448
2440
  --salt-editable-primary-background-hover: var(--salt-palette-neutral-primary-background);
2449
- --salt-editable-primary-background-readonly: var(--salt-palette-alpha-none);
2441
+ --salt-editable-primary-background-readonly: var(--salt-color-transparent);
2450
2442
  --salt-editable-secondary-background-active: var(--salt-palette-neutral-secondary-background);
2451
2443
  --salt-editable-secondary-background-hover: var(--salt-palette-neutral-secondary-background);
2452
- --salt-editable-secondary-background-readonly: var(--salt-palette-alpha-none);
2444
+ --salt-editable-secondary-background-readonly: var(--salt-color-transparent);
2453
2445
  --salt-measured-background: var(--salt-palette-measured-background);
2454
2446
  --salt-measured-background-disabled: var(--salt-palette-measured-background-disabled);
2455
2447
  --salt-measured-borderColor: var(--salt-palette-measured-border);
@@ -2465,6 +2457,8 @@
2465
2457
  --salt-overlayable-rangeSelection: var(--salt-overlayable-background-rangeSelection);
2466
2458
  --salt-selectable-foreground-partial: var(--salt-palette-interact-foreground-partial);
2467
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);
2468
2462
  --salt-selectable-background-blurSelected: var(--salt-palette-interact-background-blurSelected);
2469
2463
  --salt-selectable-cta-foreground: var(--salt-palette-interact-foreground);
2470
2464
  --salt-selectable-cta-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
@@ -2540,6 +2534,7 @@
2540
2534
  --salt-navigable-background-hover: var(--salt-palette-alpha-contrast-lowest);
2541
2535
  --salt-accent-foreground-disabled: var(--salt-palette-accent-foreground-disabled);
2542
2536
  --salt-accent-foreground: var(--salt-palette-accent-foreground);
2537
+ --salt-accent-borderColor-disabled: var(--salt-palette-accent-disabled);
2543
2538
  --salt-track-background: var(--salt-palette-track-background);
2544
2539
  --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
2545
2540
  --salt-track-borderColor: var(--salt-palette-neutral-border);
@@ -2589,51 +2584,51 @@
2589
2584
  --salt-actionable-secondary-foreground-hover: var(--salt-actionable-subtle-foreground-hover);
2590
2585
  --salt-actionable-secondary-foreground: var(--salt-actionable-subtle-foreground);
2591
2586
  --salt-actionable-accented-bold-background-disabled: var(--salt-palette-interact-cta-background-disabled);
2592
- --salt-actionable-accented-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2587
+ --salt-actionable-accented-bold-borderColor-disabled: var(--salt-color-transparent);
2593
2588
  --salt-actionable-accented-bold-foreground-disabled: var(--salt-palette-interact-cta-foreground-disabled);
2594
2589
  --salt-actionable-bold-background-disabled: var(--salt-palette-interact-primary-background-disabled);
2595
- --salt-actionable-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2590
+ --salt-actionable-bold-borderColor-disabled: var(--salt-color-transparent);
2596
2591
  --salt-actionable-bold-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
2597
- --salt-actionable-accented-background-disabled: var(--salt-palette-alpha-none);
2592
+ --salt-actionable-accented-background-disabled: var(--salt-color-transparent);
2598
2593
  --salt-actionable-accented-borderColor-disabled: var(--salt-palette-accent-disabled);
2599
2594
  --salt-actionable-accented-foreground-disabled: var(--salt-palette-accent-foreground-informative-disabled);
2600
- --salt-actionable-background-disabled: var(--salt-palette-alpha-none);
2595
+ --salt-actionable-background-disabled: var(--salt-color-transparent);
2601
2596
  --salt-actionable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
2602
2597
  --salt-actionable-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
2603
- --salt-actionable-accented-subtle-background-disabled: var(--salt-palette-alpha-none);
2604
- --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);
2605
2600
  --salt-actionable-accented-subtle-foreground-disabled: var(--salt-palette-accent-foreground-informative-disabled);
2606
- --salt-actionable-subtle-background-disabled: var(--salt-palette-alpha-none);
2607
- --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);
2608
2603
  --salt-actionable-subtle-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
2609
2604
  --salt-actionable-negative-bold-background-disabled: var(--salt-palette-negative-background-disabled);
2610
- --salt-actionable-negative-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2605
+ --salt-actionable-negative-bold-borderColor-disabled: var(--salt-color-transparent);
2611
2606
  --salt-actionable-negative-bold-foreground-disabled: var(--salt-palette-interact-cta-foreground-disabled);
2612
- --salt-actionable-negative-background-disabled: var(--salt-palette-alpha-none);
2607
+ --salt-actionable-negative-background-disabled: var(--salt-color-transparent);
2613
2608
  --salt-actionable-negative-borderColor-disabled: var(--salt-palette-negative-border-disabled);
2614
2609
  --salt-actionable-negative-foreground-disabled: var(--salt-palette-negative-foreground-disabled);
2615
- --salt-actionable-negative-subtle-background-disabled: var(--salt-palette-alpha-none);
2616
- --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);
2617
2612
  --salt-actionable-negative-subtle-foreground-disabled: var(--salt-palette-negative-foreground-disabled);
2618
2613
  --salt-actionable-positive-bold-background-disabled: var(--salt-palette-positive-background-disabled);
2619
- --salt-actionable-positive-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2614
+ --salt-actionable-positive-bold-borderColor-disabled: var(--salt-color-transparent);
2620
2615
  --salt-actionable-positive-bold-foreground-disabled: var(--salt-palette-interact-cta-foreground-disabled);
2621
- --salt-actionable-positive-background-disabled: var(--salt-palette-alpha-none);
2616
+ --salt-actionable-positive-background-disabled: var(--salt-color-transparent);
2622
2617
  --salt-actionable-positive-borderColor-disabled: var(--salt-palette-positive-border-disabled);
2623
2618
  --salt-actionable-positive-foreground-disabled: var(--salt-palette-positive-foreground-disabled);
2624
- --salt-actionable-positive-subtle-background-disabled: var(--salt-palette-alpha-none);
2625
- --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);
2626
2621
  --salt-actionable-positive-subtle-foreground-disabled: var(--salt-palette-positive-foreground-disabled);
2627
2622
  --salt-actionable-caution-bold-background-disabled: var(--salt-palette-warning-action-disabled);
2628
- --salt-actionable-caution-bold-borderColor-disabled: var(--salt-palette-alpha-none);
2623
+ --salt-actionable-caution-bold-borderColor-disabled: var(--salt-color-transparent);
2629
2624
  --salt-actionable-caution-bold-foreground-disabled: var(--salt-palette-warning-action-foreground-disabled);
2630
- --salt-actionable-caution-background-disabled: var(--salt-palette-alpha-none);
2625
+ --salt-actionable-caution-background-disabled: var(--salt-color-transparent);
2631
2626
  --salt-actionable-caution-borderColor-disabled: var(--salt-palette-warning-border-disabled);
2632
2627
  --salt-actionable-caution-foreground-disabled: var(--salt-palette-warning-foreground-informative-disabled);
2633
- --salt-actionable-caution-subtle-background-disabled: var(--salt-palette-alpha-none);
2634
- --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);
2635
2630
  --salt-actionable-caution-subtle-foreground-disabled: var(--salt-palette-warning-foreground-informative-disabled);
2636
- --salt-separable-background: var(--salt-palette-alpha-none);
2631
+ --salt-separable-background: var(--salt-color-transparent);
2637
2632
  --salt-category-1-bold-foreground: var(--salt-palette-accent-foreground);
2638
2633
  --salt-category-2-bold-foreground: var(--salt-palette-accent-foreground);
2639
2634
  --salt-category-3-bold-foreground: var(--salt-palette-accent-foreground);
@@ -2717,6 +2712,7 @@
2717
2712
  --salt-category-20-subtle-foreground: var(--salt-palette-categorical-20-strong);
2718
2713
  --salt-category-20-subtle-background: var(--salt-palette-categorical-20-weakest);
2719
2714
  --salt-category-20-subtle-borderColor: var(--salt-palette-categorical-20);
2715
+ --salt-sentiment-neutral-track-disabled: var(--salt-palette-neutral-border-disabled);
2720
2716
  }
2721
2717
 
2722
2718
  /* css/legacy/deprecated/fade.css */
@@ -2821,6 +2817,7 @@
2821
2817
  --salt-palette-opacity-primary-border: var(--salt-opacity-45);
2822
2818
  --salt-palette-opacity-secondary-border: var(--salt-opacity-25);
2823
2819
  --salt-palette-opacity-tertiary-border: var(--salt-opacity-15);
2820
+ --salt-palette-alpha-none: transparent;
2824
2821
  --salt-palette-alpha: var(--salt-palette-alpha-contrast-medium);
2825
2822
  --salt-palette-alpha-strong: var(--salt-palette-alpha-contrast-mediumHigh);
2826
2823
  --salt-palette-alpha-weak: var(--salt-palette-alpha-contrast-mediumLow);
@@ -2865,6 +2862,7 @@
2865
2862
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
2866
2863
  --salt-palette-interact-cta-background-disabled: var(--salt-color-blue-600-40a);
2867
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);
2868
2866
  --salt-palette-measured-fill: var(--salt-color-blue-500);
2869
2867
  --salt-palette-measured-fill-disabled: var(--salt-color-blue-500-fade-fill);
2870
2868
  --salt-palette-measured-foreground: var(--salt-color-gray-90);
@@ -2955,6 +2953,7 @@
2955
2953
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
2956
2954
  --salt-palette-interact-cta-background-disabled: var(--salt-color-blue-600-40a);
2957
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);
2958
2957
  --salt-palette-measured-fill: var(--salt-color-blue-300);
2959
2958
  --salt-palette-measured-fill-disabled: var(--salt-color-blue-300-fade-fill);
2960
2959
  --salt-palette-measured-foreground: var(--salt-color-gray-90);