@vectoriox/iox-ui 5.24.0 → 5.26.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.
- package/design-core/index.d.ts +1153 -191
- package/fesm2022/vectoriox-iox-ui-design-core.mjs +1680 -241
- package/fesm2022/vectoriox-iox-ui-design-core.mjs.map +1 -1
- package/fesm2022/vectoriox-iox-ui.mjs +81 -14
- package/fesm2022/vectoriox-iox-ui.mjs.map +1 -1
- package/index.d.ts +35 -3
- package/package.json +1 -1
- package/src/design-core/brand-neutrals.ts +236 -0
- package/src/design-core/brand.ts +24 -14
- package/src/design-core/colour-eval.ts +117 -0
- package/src/design-core/contrast-audit.ts +214 -0
- package/src/design-core/design-apply.ts +34 -14
- package/src/design-core/design-settings.ts +12 -3
- package/src/design-core/design-token.model.ts +26 -0
- package/src/design-core/flavor-fixtures.generated.ts +150 -0
- package/src/design-core/flavor-spec.generated.ts +1061 -189
- package/src/design-core/flavor-tokens.ts +36 -8
- package/src/design-core/public-api.ts +3 -0
- package/src/design-core/token-css.ts +48 -15
- package/styles/iox-design.css +16 -0
- package/styles/iox-forms.css +15 -9
package/design-core/index.d.ts
CHANGED
|
@@ -870,6 +870,51 @@ declare const SPEC_AXES: {
|
|
|
870
870
|
readonly "ease-exit": "cubic-bezier(0.3, 0, 0.8, 0.15)";
|
|
871
871
|
};
|
|
872
872
|
readonly modes: readonly ["light", "dark", "auto"];
|
|
873
|
+
readonly tints: {
|
|
874
|
+
readonly neutral: {
|
|
875
|
+
readonly label: "Neutral";
|
|
876
|
+
};
|
|
877
|
+
readonly subtle: {
|
|
878
|
+
readonly label: "Subtle";
|
|
879
|
+
readonly paintChroma: 1;
|
|
880
|
+
readonly ownScale: 1;
|
|
881
|
+
readonly groundMaxL: 0.99;
|
|
882
|
+
readonly chroma: {
|
|
883
|
+
readonly bg: 0.008;
|
|
884
|
+
readonly surface: 0.004;
|
|
885
|
+
readonly "surface-2": 0.014;
|
|
886
|
+
readonly line: 0.012;
|
|
887
|
+
readonly "line-strong": 0.018;
|
|
888
|
+
readonly text: 0.008;
|
|
889
|
+
readonly "text-muted": 0.022;
|
|
890
|
+
readonly "inverse-bg": 0.014;
|
|
891
|
+
readonly "inverse-surface": 0.018;
|
|
892
|
+
readonly "inverse-text": 0.005;
|
|
893
|
+
readonly "inverse-muted": 0.02;
|
|
894
|
+
readonly "inverse-line": 0.016;
|
|
895
|
+
};
|
|
896
|
+
};
|
|
897
|
+
readonly rich: {
|
|
898
|
+
readonly label: "Rich";
|
|
899
|
+
readonly paintChroma: 1.35;
|
|
900
|
+
readonly ownScale: 1.6;
|
|
901
|
+
readonly groundMaxL: 0.975;
|
|
902
|
+
readonly chroma: {
|
|
903
|
+
readonly bg: 0.02;
|
|
904
|
+
readonly surface: 0.008;
|
|
905
|
+
readonly "surface-2": 0.03;
|
|
906
|
+
readonly line: 0.024;
|
|
907
|
+
readonly "line-strong": 0.032;
|
|
908
|
+
readonly text: 0.014;
|
|
909
|
+
readonly "text-muted": 0.04;
|
|
910
|
+
readonly "inverse-bg": 0.03;
|
|
911
|
+
readonly "inverse-surface": 0.036;
|
|
912
|
+
readonly "inverse-text": 0.01;
|
|
913
|
+
readonly "inverse-muted": 0.034;
|
|
914
|
+
readonly "inverse-line": 0.03;
|
|
915
|
+
};
|
|
916
|
+
};
|
|
917
|
+
};
|
|
873
918
|
};
|
|
874
919
|
declare const SPEC_SPRINGS: {
|
|
875
920
|
readonly lively: {
|
|
@@ -942,6 +987,10 @@ declare const SPEC_SCHEMES: {
|
|
|
942
987
|
readonly "accent-ink": "var(--iox-inverse-accent-ink)";
|
|
943
988
|
readonly "accent-hover": "var(--iox-inverse-accent)";
|
|
944
989
|
readonly "accent-text": "var(--iox-inverse-accent)";
|
|
990
|
+
readonly danger: "{{~danger}}";
|
|
991
|
+
readonly "danger-bg": "{{~danger-bg}}";
|
|
992
|
+
readonly success: "{{~success}}";
|
|
993
|
+
readonly "success-bg": "{{~success-bg}}";
|
|
945
994
|
};
|
|
946
995
|
};
|
|
947
996
|
readonly accent: {
|
|
@@ -949,10 +998,10 @@ declare const SPEC_SCHEMES: {
|
|
|
949
998
|
readonly set: {
|
|
950
999
|
readonly "section-bg": "{{accent}}";
|
|
951
1000
|
readonly bg: "{{accent}}";
|
|
952
|
-
readonly surface: "
|
|
953
|
-
readonly "surface-2": "
|
|
954
|
-
readonly "surface-glass": "
|
|
955
|
-
readonly "surface-glass-strong": "
|
|
1001
|
+
readonly surface: "{{accent-hover}}";
|
|
1002
|
+
readonly "surface-2": "{{accent-hover}}";
|
|
1003
|
+
readonly "surface-glass": "{{accent-hover}}";
|
|
1004
|
+
readonly "surface-glass-strong": "{{accent-hover}}";
|
|
956
1005
|
readonly text: "{{accent-ink}}";
|
|
957
1006
|
readonly "text-muted": "{{accent-ink}}";
|
|
958
1007
|
readonly line: "color-mix(in srgb, {{accent-ink}} 28%, transparent)";
|
|
@@ -961,7 +1010,11 @@ declare const SPEC_SCHEMES: {
|
|
|
961
1010
|
readonly accent: "{{accent-ink}}";
|
|
962
1011
|
readonly "accent-ink": "{{accent}}";
|
|
963
1012
|
readonly "accent-text": "{{accent-ink}}";
|
|
964
|
-
readonly "accent-hover": "
|
|
1013
|
+
readonly "accent-hover": "{{accent-ink}}";
|
|
1014
|
+
readonly danger: "{{accent-ink}}";
|
|
1015
|
+
readonly "danger-bg": "{{accent-hover}}";
|
|
1016
|
+
readonly success: "{{accent-ink}}";
|
|
1017
|
+
readonly "success-bg": "{{accent-hover}}";
|
|
965
1018
|
};
|
|
966
1019
|
};
|
|
967
1020
|
};
|
|
@@ -1456,7 +1509,7 @@ declare const SPEC_FIELD_CLASS_BASELINE: {
|
|
|
1456
1509
|
readonly transition: "border-color var(--iox-dur-base) var(--iox-ease-standard), box-shadow var(--iox-dur-base) var(--iox-ease-standard)";
|
|
1457
1510
|
};
|
|
1458
1511
|
readonly ".iox-es-field .iox-field__control:focus-visible": {
|
|
1459
|
-
readonly "border-color": "var(--iox-accent)";
|
|
1512
|
+
readonly "border-color": "var(--iox-accent-text)";
|
|
1460
1513
|
readonly "box-shadow": "var(--iox-field-focus)";
|
|
1461
1514
|
readonly outline: "none";
|
|
1462
1515
|
};
|
|
@@ -1477,6 +1530,179 @@ declare const SPEC_FIELD_CLASS_BASELINE: {
|
|
|
1477
1530
|
readonly ".iox-es-field.iox-invalid .iox-field__control": {
|
|
1478
1531
|
readonly "border-color": "var(--iox-danger)";
|
|
1479
1532
|
};
|
|
1533
|
+
readonly ".iox-es-field .iox-field__control::placeholder": {
|
|
1534
|
+
readonly color: "var(--iox-text-muted)";
|
|
1535
|
+
readonly opacity: "1";
|
|
1536
|
+
};
|
|
1537
|
+
readonly ".iox-es-field .iox-field__control:where([type='checkbox'], [type='radio'], [type='range'])": {
|
|
1538
|
+
readonly border: "none";
|
|
1539
|
+
readonly padding: "0";
|
|
1540
|
+
readonly background: "transparent";
|
|
1541
|
+
readonly "accent-color": "var(--iox-accent-text)";
|
|
1542
|
+
};
|
|
1543
|
+
readonly ".iox-es-field .iox-field__control--switch": {
|
|
1544
|
+
readonly background: "var(--iox-text-muted)";
|
|
1545
|
+
readonly transition: "background var(--iox-dur-fast) var(--iox-ease-standard)";
|
|
1546
|
+
};
|
|
1547
|
+
readonly ".iox-es-field .iox-field__control--switch::before": {
|
|
1548
|
+
readonly background: "var(--iox-bg)";
|
|
1549
|
+
readonly transition: "transform var(--iox-dur-fast) var(--iox-ease-standard)";
|
|
1550
|
+
};
|
|
1551
|
+
readonly ".iox-es-field .iox-field__control--switch:checked": {
|
|
1552
|
+
readonly background: "var(--iox-accent-text)";
|
|
1553
|
+
};
|
|
1554
|
+
};
|
|
1555
|
+
declare const SPEC_INK_SCOPES: readonly [{
|
|
1556
|
+
readonly styles: readonly ["button-primary", "button-secondary", "button-ghost"];
|
|
1557
|
+
readonly set: {
|
|
1558
|
+
readonly "icon-color": "currentColor";
|
|
1559
|
+
readonly "heading-color": "currentColor";
|
|
1560
|
+
readonly "eyebrow-color": "currentColor";
|
|
1561
|
+
readonly "link-color": "currentColor";
|
|
1562
|
+
readonly "link-hover-color": "currentColor";
|
|
1563
|
+
readonly "text-muted": "currentColor";
|
|
1564
|
+
};
|
|
1565
|
+
}];
|
|
1566
|
+
declare const SPEC_CONTRAST_AUDIT: {
|
|
1567
|
+
readonly pairs: readonly [{
|
|
1568
|
+
readonly fg: "text";
|
|
1569
|
+
readonly bg: "bg";
|
|
1570
|
+
readonly min: 4.5;
|
|
1571
|
+
}, {
|
|
1572
|
+
readonly fg: "text";
|
|
1573
|
+
readonly bg: "surface";
|
|
1574
|
+
readonly min: 4.5;
|
|
1575
|
+
}, {
|
|
1576
|
+
readonly fg: "text-muted";
|
|
1577
|
+
readonly bg: "bg";
|
|
1578
|
+
readonly min: 4.5;
|
|
1579
|
+
}, {
|
|
1580
|
+
readonly fg: "text-muted";
|
|
1581
|
+
readonly bg: "surface";
|
|
1582
|
+
readonly min: 4.5;
|
|
1583
|
+
}, {
|
|
1584
|
+
readonly fg: "accent-ink";
|
|
1585
|
+
readonly bg: "accent";
|
|
1586
|
+
readonly min: 4.5;
|
|
1587
|
+
}, {
|
|
1588
|
+
readonly fg: "accent-text";
|
|
1589
|
+
readonly bg: "bg";
|
|
1590
|
+
readonly min: 4.5;
|
|
1591
|
+
}, {
|
|
1592
|
+
readonly fg: "inverse-text";
|
|
1593
|
+
readonly bg: "inverse-bg";
|
|
1594
|
+
readonly min: 4.5;
|
|
1595
|
+
}, {
|
|
1596
|
+
readonly fg: "inverse-muted";
|
|
1597
|
+
readonly bg: "inverse-bg";
|
|
1598
|
+
readonly min: 4.5;
|
|
1599
|
+
}, {
|
|
1600
|
+
readonly fg: "inverse-accent-ink";
|
|
1601
|
+
readonly bg: "inverse-accent";
|
|
1602
|
+
readonly min: 4.5;
|
|
1603
|
+
}, {
|
|
1604
|
+
readonly fg: "inverse-accent";
|
|
1605
|
+
readonly bg: "inverse-bg";
|
|
1606
|
+
readonly min: 4.5;
|
|
1607
|
+
}, {
|
|
1608
|
+
readonly fg: "success";
|
|
1609
|
+
readonly bg: "success-bg";
|
|
1610
|
+
readonly min: 4.5;
|
|
1611
|
+
}, {
|
|
1612
|
+
readonly fg: "danger";
|
|
1613
|
+
readonly bg: "danger-bg";
|
|
1614
|
+
readonly min: 4.5;
|
|
1615
|
+
}, {
|
|
1616
|
+
readonly fg: "accent-ink";
|
|
1617
|
+
readonly bg: "accent-hover";
|
|
1618
|
+
readonly min: 4.5;
|
|
1619
|
+
}, {
|
|
1620
|
+
readonly fg: "text-muted";
|
|
1621
|
+
readonly bg: "surface-2";
|
|
1622
|
+
readonly min: 4.5;
|
|
1623
|
+
}, {
|
|
1624
|
+
readonly fg: "text";
|
|
1625
|
+
readonly bg: "surface-2";
|
|
1626
|
+
readonly min: 4.5;
|
|
1627
|
+
}, {
|
|
1628
|
+
readonly fg: "accent-text";
|
|
1629
|
+
readonly bg: "surface";
|
|
1630
|
+
readonly min: 4.5;
|
|
1631
|
+
}, {
|
|
1632
|
+
readonly fg: "accent-text";
|
|
1633
|
+
readonly bg: "surface-2";
|
|
1634
|
+
readonly min: 4.5;
|
|
1635
|
+
}, {
|
|
1636
|
+
readonly fg: "inverse-text";
|
|
1637
|
+
readonly bg: "inverse-surface";
|
|
1638
|
+
readonly min: 4.5;
|
|
1639
|
+
}, {
|
|
1640
|
+
readonly fg: "inverse-muted";
|
|
1641
|
+
readonly bg: "inverse-surface";
|
|
1642
|
+
readonly min: 4.5;
|
|
1643
|
+
}, {
|
|
1644
|
+
readonly fg: "inverse-accent";
|
|
1645
|
+
readonly bg: "inverse-surface";
|
|
1646
|
+
readonly min: 4.5;
|
|
1647
|
+
}, {
|
|
1648
|
+
readonly fg: "line-strong";
|
|
1649
|
+
readonly bg: "bg";
|
|
1650
|
+
readonly min: 3;
|
|
1651
|
+
}, {
|
|
1652
|
+
readonly fg: "line-strong";
|
|
1653
|
+
readonly bg: "surface";
|
|
1654
|
+
readonly min: 3;
|
|
1655
|
+
}, {
|
|
1656
|
+
readonly fg: "line-strong";
|
|
1657
|
+
readonly bg: "surface-2";
|
|
1658
|
+
readonly min: 3;
|
|
1659
|
+
}];
|
|
1660
|
+
readonly formParts: readonly [{
|
|
1661
|
+
readonly part: "input text";
|
|
1662
|
+
readonly fg: "var(--iox-field-ink)";
|
|
1663
|
+
readonly on: "var(--iox-field-bg)";
|
|
1664
|
+
readonly min: 4.5;
|
|
1665
|
+
}, {
|
|
1666
|
+
readonly part: "placeholder";
|
|
1667
|
+
readonly fg: "var(--iox-text-muted)";
|
|
1668
|
+
readonly on: "var(--iox-field-bg)";
|
|
1669
|
+
readonly min: 4.5;
|
|
1670
|
+
}, {
|
|
1671
|
+
readonly part: "label";
|
|
1672
|
+
readonly fg: "var(--iox-text)";
|
|
1673
|
+
readonly min: 4.5;
|
|
1674
|
+
}, {
|
|
1675
|
+
readonly part: "help";
|
|
1676
|
+
readonly fg: "var(--iox-text-muted)";
|
|
1677
|
+
readonly min: 4.5;
|
|
1678
|
+
}, {
|
|
1679
|
+
readonly part: "error";
|
|
1680
|
+
readonly fg: "var(--iox-danger)";
|
|
1681
|
+
readonly min: 4.5;
|
|
1682
|
+
}, {
|
|
1683
|
+
readonly part: "boundary";
|
|
1684
|
+
readonly fg: readonly ["var(--iox-field-border)", "var(--iox-field-bg)"];
|
|
1685
|
+
readonly any: true;
|
|
1686
|
+
readonly min: 3;
|
|
1687
|
+
}, {
|
|
1688
|
+
readonly part: "focus edge";
|
|
1689
|
+
readonly fg: "var(--iox-accent-text)";
|
|
1690
|
+
readonly min: 3;
|
|
1691
|
+
}, {
|
|
1692
|
+
readonly part: "switch off";
|
|
1693
|
+
readonly fg: "var(--iox-text-muted)";
|
|
1694
|
+
readonly thumb: "var(--iox-bg)";
|
|
1695
|
+
readonly min: 3;
|
|
1696
|
+
}, {
|
|
1697
|
+
readonly part: "switch on";
|
|
1698
|
+
readonly fg: "var(--iox-accent-text)";
|
|
1699
|
+
readonly thumb: "var(--iox-bg)";
|
|
1700
|
+
readonly min: 3;
|
|
1701
|
+
}, {
|
|
1702
|
+
readonly part: "checkbox · radio · range";
|
|
1703
|
+
readonly fg: "var(--iox-accent-text)";
|
|
1704
|
+
readonly min: 3;
|
|
1705
|
+
}];
|
|
1480
1706
|
};
|
|
1481
1707
|
declare const SPEC_LEGACY_ALIASES: {
|
|
1482
1708
|
readonly "radius-control": "var(--iox-button-radius)";
|
|
@@ -1497,6 +1723,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1497
1723
|
readonly motion: "standard";
|
|
1498
1724
|
readonly pillButtons: false;
|
|
1499
1725
|
readonly mode: "light";
|
|
1726
|
+
readonly tint: "subtle";
|
|
1500
1727
|
};
|
|
1501
1728
|
readonly seed: "#2F5BEA";
|
|
1502
1729
|
readonly seeds: readonly ["#2F5BEA", "#0F766E", "#7C3AED", "#BE123C", "#111827"];
|
|
@@ -1543,13 +1770,83 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1543
1770
|
};
|
|
1544
1771
|
readonly families: readonly ["IBM Plex Sans"];
|
|
1545
1772
|
}];
|
|
1773
|
+
readonly palette: {
|
|
1774
|
+
readonly light: {
|
|
1775
|
+
readonly bg: "#FFFFFF";
|
|
1776
|
+
readonly "page-bg": "var(--iox-bg)";
|
|
1777
|
+
readonly "section-bg": "transparent";
|
|
1778
|
+
readonly surface: "#FFFFFF";
|
|
1779
|
+
readonly "surface-2": "#F6F7F9";
|
|
1780
|
+
readonly "surface-glass": "var(--iox-surface)";
|
|
1781
|
+
readonly "surface-glass-strong": "var(--iox-surface)";
|
|
1782
|
+
readonly "glass-border": "var(--iox-line)";
|
|
1783
|
+
readonly text: "#0F1115";
|
|
1784
|
+
readonly "text-muted": "#5B616E";
|
|
1785
|
+
readonly line: "#E6E8EC";
|
|
1786
|
+
readonly "line-strong": "#8B8F97";
|
|
1787
|
+
readonly accent: "#2F5BEA";
|
|
1788
|
+
readonly "accent-ink": "#FFFFFF";
|
|
1789
|
+
readonly "accent-hover": "#2449C4";
|
|
1790
|
+
readonly "accent-text": "#2F5BEA";
|
|
1791
|
+
readonly "inverse-bg": "#0F1115";
|
|
1792
|
+
readonly "inverse-surface": "#1A1D23";
|
|
1793
|
+
readonly "inverse-text": "#F2F3F5";
|
|
1794
|
+
readonly "inverse-muted": "#A3A9B4";
|
|
1795
|
+
readonly "inverse-line": "#2A2E36";
|
|
1796
|
+
readonly "inverse-accent": "#8EA9FF";
|
|
1797
|
+
readonly "inverse-accent-ink": "#0F1115";
|
|
1798
|
+
readonly success: "#1B6B3D";
|
|
1799
|
+
readonly "success-bg": "#E7F4EC";
|
|
1800
|
+
readonly danger: "#B3261E";
|
|
1801
|
+
readonly "danger-bg": "#FBE9E7";
|
|
1802
|
+
readonly scrim: "rgba(15, 17, 21, 0.45)";
|
|
1803
|
+
};
|
|
1804
|
+
readonly dark: {
|
|
1805
|
+
readonly bg: "#0E0F12";
|
|
1806
|
+
readonly surface: "#16181D";
|
|
1807
|
+
readonly "surface-2": "#1C1F25";
|
|
1808
|
+
readonly text: "#F2F3F5";
|
|
1809
|
+
readonly "text-muted": "#9AA0AC";
|
|
1810
|
+
readonly line: "#262A31";
|
|
1811
|
+
readonly "line-strong": "#646A74";
|
|
1812
|
+
readonly accent: "#7A9BFF";
|
|
1813
|
+
readonly "accent-ink": "#0E0F12";
|
|
1814
|
+
readonly "accent-hover": "#9AB3FF";
|
|
1815
|
+
readonly "accent-text": "#8EA9FF";
|
|
1816
|
+
readonly "inverse-bg": "#F6F7F9";
|
|
1817
|
+
readonly "inverse-surface": "#FFFFFF";
|
|
1818
|
+
readonly "inverse-text": "#0F1115";
|
|
1819
|
+
readonly "inverse-muted": "#5B616E";
|
|
1820
|
+
readonly "inverse-line": "#E6E8EC";
|
|
1821
|
+
readonly "inverse-accent": "#2F5BEA";
|
|
1822
|
+
readonly "inverse-accent-ink": "#FFFFFF";
|
|
1823
|
+
readonly success: "#5FD08E";
|
|
1824
|
+
readonly "success-bg": "#13291C";
|
|
1825
|
+
readonly danger: "#FF8A80";
|
|
1826
|
+
readonly "danger-bg": "#3A1715";
|
|
1827
|
+
readonly scrim: "rgba(0, 0, 0, 0.6)";
|
|
1828
|
+
};
|
|
1829
|
+
};
|
|
1830
|
+
readonly tint: {
|
|
1831
|
+
readonly scale: 1;
|
|
1832
|
+
readonly roles: readonly ["bg", "surface", "surface-2", "line", "line-strong", "text", "text-muted", "inverse-bg", "inverse-surface", "inverse-text", "inverse-muted", "inverse-line"];
|
|
1833
|
+
};
|
|
1834
|
+
readonly legacy: {
|
|
1835
|
+
readonly "line-strong": {
|
|
1836
|
+
readonly value: "#C9CED6";
|
|
1837
|
+
readonly dark: "#3A3F49";
|
|
1838
|
+
};
|
|
1839
|
+
readonly "focus-ring": {
|
|
1840
|
+
readonly value: "0 0 0 3px color-mix(in srgb, var(--iox-accent) 35%, transparent)";
|
|
1841
|
+
};
|
|
1842
|
+
};
|
|
1546
1843
|
readonly tokens: readonly [{
|
|
1547
1844
|
readonly name: "bg";
|
|
1548
1845
|
readonly tier: "semantic";
|
|
1549
1846
|
readonly type: "color";
|
|
1550
1847
|
readonly group: "colour";
|
|
1551
|
-
readonly value: "#
|
|
1552
|
-
readonly dark: "#
|
|
1848
|
+
readonly value: "#FAFCFF";
|
|
1849
|
+
readonly dark: "#0D0F13";
|
|
1553
1850
|
}, {
|
|
1554
1851
|
readonly name: "page-bg";
|
|
1555
1852
|
readonly tier: "semantic";
|
|
@@ -1574,8 +1871,8 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1574
1871
|
readonly tier: "semantic";
|
|
1575
1872
|
readonly type: "color";
|
|
1576
1873
|
readonly group: "colour";
|
|
1577
|
-
readonly value: "#
|
|
1578
|
-
readonly dark: "#
|
|
1874
|
+
readonly value: "#F3F7FF";
|
|
1875
|
+
readonly dark: "#1C1F26";
|
|
1579
1876
|
}, {
|
|
1580
1877
|
readonly name: "surface-glass";
|
|
1581
1878
|
readonly tier: "semantic";
|
|
@@ -1600,28 +1897,28 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1600
1897
|
readonly type: "color";
|
|
1601
1898
|
readonly group: "colour";
|
|
1602
1899
|
readonly value: "#0F1115";
|
|
1603
|
-
readonly dark: "#
|
|
1900
|
+
readonly dark: "#F0F3F9";
|
|
1604
1901
|
}, {
|
|
1605
1902
|
readonly name: "text-muted";
|
|
1606
1903
|
readonly tier: "semantic";
|
|
1607
1904
|
readonly type: "color";
|
|
1608
1905
|
readonly group: "colour";
|
|
1609
1906
|
readonly value: "#5B616E";
|
|
1610
|
-
readonly dark: "#
|
|
1907
|
+
readonly dark: "#99A0AE";
|
|
1611
1908
|
}, {
|
|
1612
1909
|
readonly name: "line";
|
|
1613
1910
|
readonly tier: "semantic";
|
|
1614
1911
|
readonly type: "color";
|
|
1615
1912
|
readonly group: "colour";
|
|
1616
|
-
readonly value: "#
|
|
1913
|
+
readonly value: "#E4E8F0";
|
|
1617
1914
|
readonly dark: "#262A31";
|
|
1618
1915
|
}, {
|
|
1619
1916
|
readonly name: "line-strong";
|
|
1620
1917
|
readonly tier: "semantic";
|
|
1621
1918
|
readonly type: "color";
|
|
1622
1919
|
readonly group: "colour";
|
|
1623
|
-
readonly value: "#
|
|
1624
|
-
readonly dark: "#
|
|
1920
|
+
readonly value: "#898F9A";
|
|
1921
|
+
readonly dark: "#646A74";
|
|
1625
1922
|
}, {
|
|
1626
1923
|
readonly name: "accent";
|
|
1627
1924
|
readonly tier: "semantic";
|
|
@@ -1655,28 +1952,28 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1655
1952
|
readonly tier: "semantic";
|
|
1656
1953
|
readonly type: "color";
|
|
1657
1954
|
readonly group: "colour";
|
|
1658
|
-
readonly value: "#
|
|
1659
|
-
readonly dark: "#
|
|
1955
|
+
readonly value: "#0E1117";
|
|
1956
|
+
readonly dark: "#F3F7FF";
|
|
1660
1957
|
}, {
|
|
1661
1958
|
readonly name: "inverse-surface";
|
|
1662
1959
|
readonly tier: "semantic";
|
|
1663
1960
|
readonly type: "color";
|
|
1664
1961
|
readonly group: "colour";
|
|
1665
|
-
readonly value: "#
|
|
1962
|
+
readonly value: "#191D26";
|
|
1666
1963
|
readonly dark: "#FFFFFF";
|
|
1667
1964
|
}, {
|
|
1668
1965
|
readonly name: "inverse-text";
|
|
1669
1966
|
readonly tier: "semantic";
|
|
1670
1967
|
readonly type: "color";
|
|
1671
1968
|
readonly group: "colour";
|
|
1672
|
-
readonly value: "#
|
|
1969
|
+
readonly value: "#F1F3F7";
|
|
1673
1970
|
readonly dark: "#0F1115";
|
|
1674
1971
|
}, {
|
|
1675
1972
|
readonly name: "inverse-muted";
|
|
1676
1973
|
readonly tier: "semantic";
|
|
1677
1974
|
readonly type: "color";
|
|
1678
1975
|
readonly group: "colour";
|
|
1679
|
-
readonly value: "#
|
|
1976
|
+
readonly value: "#A2A9B6";
|
|
1680
1977
|
readonly dark: "#5B616E";
|
|
1681
1978
|
}, {
|
|
1682
1979
|
readonly name: "inverse-line";
|
|
@@ -1684,7 +1981,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1684
1981
|
readonly type: "color";
|
|
1685
1982
|
readonly group: "colour";
|
|
1686
1983
|
readonly value: "#2A2E36";
|
|
1687
|
-
readonly dark: "#
|
|
1984
|
+
readonly dark: "#E3E8F3";
|
|
1688
1985
|
}, {
|
|
1689
1986
|
readonly name: "inverse-accent";
|
|
1690
1987
|
readonly tier: "semantic";
|
|
@@ -1958,7 +2255,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
1958
2255
|
readonly tier: "semantic";
|
|
1959
2256
|
readonly type: "shadow";
|
|
1960
2257
|
readonly group: "depth";
|
|
1961
|
-
readonly value: "0 0 0
|
|
2258
|
+
readonly value: "0 0 0 2px var(--iox-bg), 0 0 0 4px var(--iox-accent-text)";
|
|
1962
2259
|
}, {
|
|
1963
2260
|
readonly name: "space-section";
|
|
1964
2261
|
readonly tier: "semantic";
|
|
@@ -2549,6 +2846,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
2549
2846
|
readonly motion: "calm";
|
|
2550
2847
|
readonly pillButtons: false;
|
|
2551
2848
|
readonly mode: "light";
|
|
2849
|
+
readonly tint: "subtle";
|
|
2552
2850
|
};
|
|
2553
2851
|
readonly seed: "#7A5B36";
|
|
2554
2852
|
readonly seeds: readonly ["#7A5B36", "#5E6B3A", "#9A4F2B", "#3F4A5A", "#7D4E5E"];
|
|
@@ -2595,12 +2893,82 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
2595
2893
|
};
|
|
2596
2894
|
readonly families: readonly ["Fraunces", "Manrope"];
|
|
2597
2895
|
}];
|
|
2896
|
+
readonly palette: {
|
|
2897
|
+
readonly light: {
|
|
2898
|
+
readonly bg: "#F7F3EC";
|
|
2899
|
+
readonly "page-bg": "var(--iox-bg)";
|
|
2900
|
+
readonly "section-bg": "transparent";
|
|
2901
|
+
readonly surface: "#FBF8F3";
|
|
2902
|
+
readonly "surface-2": "#EFE9DF";
|
|
2903
|
+
readonly "surface-glass": "var(--iox-surface)";
|
|
2904
|
+
readonly "surface-glass-strong": "var(--iox-surface)";
|
|
2905
|
+
readonly "glass-border": "var(--iox-line)";
|
|
2906
|
+
readonly text: "#1F1B16";
|
|
2907
|
+
readonly "text-muted": "#665D54";
|
|
2908
|
+
readonly line: "#DDD4C7";
|
|
2909
|
+
readonly "line-strong": "#908574";
|
|
2910
|
+
readonly accent: "#7A5B36";
|
|
2911
|
+
readonly "accent-ink": "#FBF8F3";
|
|
2912
|
+
readonly "accent-hover": "#5E4527";
|
|
2913
|
+
readonly "accent-text": "#7A5B36";
|
|
2914
|
+
readonly "inverse-bg": "#1F1B16";
|
|
2915
|
+
readonly "inverse-surface": "#2A251F";
|
|
2916
|
+
readonly "inverse-text": "#EFE8DC";
|
|
2917
|
+
readonly "inverse-muted": "#B3A897";
|
|
2918
|
+
readonly "inverse-line": "#3A332B";
|
|
2919
|
+
readonly "inverse-accent": "#C9A878";
|
|
2920
|
+
readonly "inverse-accent-ink": "#1F1B16";
|
|
2921
|
+
readonly success: "#3F6B3A";
|
|
2922
|
+
readonly "success-bg": "#E9EEDF";
|
|
2923
|
+
readonly danger: "#9A3324";
|
|
2924
|
+
readonly "danger-bg": "#F5E3DC";
|
|
2925
|
+
readonly scrim: "rgba(31, 27, 22, 0.5)";
|
|
2926
|
+
};
|
|
2927
|
+
readonly dark: {
|
|
2928
|
+
readonly bg: "#14110E";
|
|
2929
|
+
readonly surface: "#1A1612";
|
|
2930
|
+
readonly "surface-2": "#1D1915";
|
|
2931
|
+
readonly text: "#EFE8DC";
|
|
2932
|
+
readonly "text-muted": "#A9A090";
|
|
2933
|
+
readonly line: "#2E2822";
|
|
2934
|
+
readonly "line-strong": "#6D6459";
|
|
2935
|
+
readonly accent: "#C9A878";
|
|
2936
|
+
readonly "accent-ink": "#14110E";
|
|
2937
|
+
readonly "accent-hover": "#D8BD93";
|
|
2938
|
+
readonly "accent-text": "#C9A878";
|
|
2939
|
+
readonly "inverse-bg": "#EFE9DF";
|
|
2940
|
+
readonly "inverse-surface": "#F7F3EC";
|
|
2941
|
+
readonly "inverse-text": "#1F1B16";
|
|
2942
|
+
readonly "inverse-muted": "#665D54";
|
|
2943
|
+
readonly "inverse-line": "#DDD4C7";
|
|
2944
|
+
readonly "inverse-accent": "#7A5B36";
|
|
2945
|
+
readonly "inverse-accent-ink": "#FBF8F3";
|
|
2946
|
+
readonly success: "#A9C79A";
|
|
2947
|
+
readonly "success-bg": "#1E2619";
|
|
2948
|
+
readonly danger: "#E8A08F";
|
|
2949
|
+
readonly "danger-bg": "#2E1A15";
|
|
2950
|
+
readonly scrim: "rgba(0, 0, 0, 0.6)";
|
|
2951
|
+
};
|
|
2952
|
+
};
|
|
2953
|
+
readonly tint: {
|
|
2954
|
+
readonly scale: 1.2;
|
|
2955
|
+
readonly roles: readonly ["bg", "surface", "surface-2", "line", "line-strong", "text", "text-muted", "inverse-bg", "inverse-surface", "inverse-text", "inverse-muted", "inverse-line"];
|
|
2956
|
+
};
|
|
2957
|
+
readonly legacy: {
|
|
2958
|
+
readonly "line-strong": {
|
|
2959
|
+
readonly value: "#B9AD9C";
|
|
2960
|
+
readonly dark: "#4A4137";
|
|
2961
|
+
};
|
|
2962
|
+
readonly "focus-ring": {
|
|
2963
|
+
readonly value: "0 0 0 3px color-mix(in srgb, var(--iox-accent) 35%, transparent)";
|
|
2964
|
+
};
|
|
2965
|
+
};
|
|
2598
2966
|
readonly tokens: readonly [{
|
|
2599
2967
|
readonly name: "bg";
|
|
2600
2968
|
readonly tier: "semantic";
|
|
2601
2969
|
readonly type: "color";
|
|
2602
2970
|
readonly group: "colour";
|
|
2603
|
-
readonly value: "#
|
|
2971
|
+
readonly value: "#F6F3ED";
|
|
2604
2972
|
readonly dark: "#14110E";
|
|
2605
2973
|
}, {
|
|
2606
2974
|
readonly name: "page-bg";
|
|
@@ -2619,15 +2987,15 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
2619
2987
|
readonly tier: "semantic";
|
|
2620
2988
|
readonly type: "color";
|
|
2621
2989
|
readonly group: "colour";
|
|
2622
|
-
readonly value: "#
|
|
2623
|
-
readonly dark: "#
|
|
2990
|
+
readonly value: "#FBF8F4";
|
|
2991
|
+
readonly dark: "#191613";
|
|
2624
2992
|
}, {
|
|
2625
2993
|
readonly name: "surface-2";
|
|
2626
2994
|
readonly tier: "semantic";
|
|
2627
2995
|
readonly type: "color";
|
|
2628
2996
|
readonly group: "colour";
|
|
2629
|
-
readonly value: "#
|
|
2630
|
-
readonly dark: "#
|
|
2997
|
+
readonly value: "#EFE9E0";
|
|
2998
|
+
readonly dark: "#1E1913";
|
|
2631
2999
|
}, {
|
|
2632
3000
|
readonly name: "surface-glass";
|
|
2633
3001
|
readonly tier: "semantic";
|
|
@@ -2651,29 +3019,29 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
2651
3019
|
readonly tier: "semantic";
|
|
2652
3020
|
readonly type: "color";
|
|
2653
3021
|
readonly group: "colour";
|
|
2654
|
-
readonly value: "#
|
|
2655
|
-
readonly dark: "#
|
|
3022
|
+
readonly value: "#1E1B17";
|
|
3023
|
+
readonly dark: "#EEE8DE";
|
|
2656
3024
|
}, {
|
|
2657
3025
|
readonly name: "text-muted";
|
|
2658
3026
|
readonly tier: "semantic";
|
|
2659
3027
|
readonly type: "color";
|
|
2660
3028
|
readonly group: "colour";
|
|
2661
|
-
readonly value: "#
|
|
2662
|
-
readonly dark: "#
|
|
3029
|
+
readonly value: "#675D52";
|
|
3030
|
+
readonly dark: "#A8A092";
|
|
2663
3031
|
}, {
|
|
2664
3032
|
readonly name: "line";
|
|
2665
3033
|
readonly tier: "semantic";
|
|
2666
3034
|
readonly type: "color";
|
|
2667
3035
|
readonly group: "colour";
|
|
2668
|
-
readonly value: "#
|
|
2669
|
-
readonly dark: "#
|
|
3036
|
+
readonly value: "#DCD4C9";
|
|
3037
|
+
readonly dark: "#2D2823";
|
|
2670
3038
|
}, {
|
|
2671
3039
|
readonly name: "line-strong";
|
|
2672
3040
|
readonly tier: "semantic";
|
|
2673
3041
|
readonly type: "color";
|
|
2674
3042
|
readonly group: "colour";
|
|
2675
|
-
readonly value: "#
|
|
2676
|
-
readonly dark: "#
|
|
3043
|
+
readonly value: "#8E8577";
|
|
3044
|
+
readonly dark: "#6C645B";
|
|
2677
3045
|
}, {
|
|
2678
3046
|
readonly name: "accent";
|
|
2679
3047
|
readonly tier: "semantic";
|
|
@@ -2707,36 +3075,36 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
2707
3075
|
readonly tier: "semantic";
|
|
2708
3076
|
readonly type: "color";
|
|
2709
3077
|
readonly group: "colour";
|
|
2710
|
-
readonly value: "#
|
|
2711
|
-
readonly dark: "#
|
|
3078
|
+
readonly value: "#201B15";
|
|
3079
|
+
readonly dark: "#EFE9E0";
|
|
2712
3080
|
}, {
|
|
2713
3081
|
readonly name: "inverse-surface";
|
|
2714
3082
|
readonly tier: "semantic";
|
|
2715
3083
|
readonly type: "color";
|
|
2716
3084
|
readonly group: "colour";
|
|
2717
|
-
readonly value: "#
|
|
2718
|
-
readonly dark: "#
|
|
3085
|
+
readonly value: "#2B251C";
|
|
3086
|
+
readonly dark: "#FAF3E6";
|
|
2719
3087
|
}, {
|
|
2720
3088
|
readonly name: "inverse-text";
|
|
2721
3089
|
readonly tier: "semantic";
|
|
2722
3090
|
readonly type: "color";
|
|
2723
3091
|
readonly group: "colour";
|
|
2724
|
-
readonly value: "#
|
|
2725
|
-
readonly dark: "#
|
|
3092
|
+
readonly value: "#EEE8DE";
|
|
3093
|
+
readonly dark: "#1E1B17";
|
|
2726
3094
|
}, {
|
|
2727
3095
|
readonly name: "inverse-muted";
|
|
2728
3096
|
readonly tier: "semantic";
|
|
2729
3097
|
readonly type: "color";
|
|
2730
3098
|
readonly group: "colour";
|
|
2731
|
-
readonly value: "#
|
|
2732
|
-
readonly dark: "#
|
|
3099
|
+
readonly value: "#B1A89A";
|
|
3100
|
+
readonly dark: "#675D53";
|
|
2733
3101
|
}, {
|
|
2734
3102
|
readonly name: "inverse-line";
|
|
2735
3103
|
readonly tier: "semantic";
|
|
2736
3104
|
readonly type: "color";
|
|
2737
3105
|
readonly group: "colour";
|
|
2738
|
-
readonly value: "#
|
|
2739
|
-
readonly dark: "#
|
|
3106
|
+
readonly value: "#3A332C";
|
|
3107
|
+
readonly dark: "#DCD4C9";
|
|
2740
3108
|
}, {
|
|
2741
3109
|
readonly name: "inverse-accent";
|
|
2742
3110
|
readonly tier: "semantic";
|
|
@@ -3008,7 +3376,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3008
3376
|
readonly tier: "semantic";
|
|
3009
3377
|
readonly type: "shadow";
|
|
3010
3378
|
readonly group: "depth";
|
|
3011
|
-
readonly value: "0 0 0
|
|
3379
|
+
readonly value: "0 0 0 2px var(--iox-bg), 0 0 0 4px var(--iox-accent-text)";
|
|
3012
3380
|
}, {
|
|
3013
3381
|
readonly name: "space-section";
|
|
3014
3382
|
readonly tier: "semantic";
|
|
@@ -3621,6 +3989,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3621
3989
|
readonly motion: "standard";
|
|
3622
3990
|
readonly pillButtons: false;
|
|
3623
3991
|
readonly mode: "dark";
|
|
3992
|
+
readonly tint: "subtle";
|
|
3624
3993
|
};
|
|
3625
3994
|
readonly seed: "#6E5BFF";
|
|
3626
3995
|
readonly seeds: readonly ["#6E5BFF", "#0891B2", "#059669", "#EA580C", "#DB2777"];
|
|
@@ -3667,13 +4036,83 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3667
4036
|
};
|
|
3668
4037
|
readonly families: readonly ["Space Grotesk", "Inter", "JetBrains Mono"];
|
|
3669
4038
|
}];
|
|
4039
|
+
readonly palette: {
|
|
4040
|
+
readonly light: {
|
|
4041
|
+
readonly bg: "#FBFBFC";
|
|
4042
|
+
readonly "page-bg": "radial-gradient(60% 50% at 50% 0%, color-mix(in srgb, var(--iox-accent) 10%, transparent), transparent 70%), var(--iox-bg)";
|
|
4043
|
+
readonly "section-bg": "transparent";
|
|
4044
|
+
readonly surface: "#FFFFFF";
|
|
4045
|
+
readonly "surface-2": "#F3F3F6";
|
|
4046
|
+
readonly "surface-glass": "var(--iox-surface)";
|
|
4047
|
+
readonly "surface-glass-strong": "var(--iox-surface)";
|
|
4048
|
+
readonly "glass-border": "var(--iox-line)";
|
|
4049
|
+
readonly text: "#0B0B0F";
|
|
4050
|
+
readonly "text-muted": "#5E6270";
|
|
4051
|
+
readonly line: "#E4E4EA";
|
|
4052
|
+
readonly "line-strong": "#878690";
|
|
4053
|
+
readonly accent: "#5B47F0";
|
|
4054
|
+
readonly "accent-ink": "#FFFFFF";
|
|
4055
|
+
readonly "accent-hover": "#4A36DE";
|
|
4056
|
+
readonly "accent-text": "#5B47F0";
|
|
4057
|
+
readonly "inverse-bg": "#08090A";
|
|
4058
|
+
readonly "inverse-surface": "#111214";
|
|
4059
|
+
readonly "inverse-text": "#F7F8F8";
|
|
4060
|
+
readonly "inverse-muted": "#8F949D";
|
|
4061
|
+
readonly "inverse-line": "rgba(255, 255, 255, 0.08)";
|
|
4062
|
+
readonly "inverse-accent": "#A69BFF";
|
|
4063
|
+
readonly "inverse-accent-ink": "#08090A";
|
|
4064
|
+
readonly success: "#1B6B3D";
|
|
4065
|
+
readonly "success-bg": "#E7F4EC";
|
|
4066
|
+
readonly danger: "#B3261E";
|
|
4067
|
+
readonly "danger-bg": "#FBE9E7";
|
|
4068
|
+
readonly scrim: "rgba(8, 9, 10, 0.55)";
|
|
4069
|
+
};
|
|
4070
|
+
readonly dark: {
|
|
4071
|
+
readonly bg: "#08090A";
|
|
4072
|
+
readonly "page-bg": "radial-gradient(60% 50% at 50% 0%, color-mix(in srgb, var(--iox-accent) 22%, transparent), transparent 70%), var(--iox-bg)";
|
|
4073
|
+
readonly surface: "#111214";
|
|
4074
|
+
readonly "surface-2": "#18191C";
|
|
4075
|
+
readonly text: "#F7F8F8";
|
|
4076
|
+
readonly "text-muted": "#8F949D";
|
|
4077
|
+
readonly line: "rgba(255, 255, 255, 0.08)";
|
|
4078
|
+
readonly "line-strong": "rgba(255, 255, 255, 0.34)";
|
|
4079
|
+
readonly accent: "#6E5BFF";
|
|
4080
|
+
readonly "accent-hover": "#5B47F0";
|
|
4081
|
+
readonly "accent-text": "#A69BFF";
|
|
4082
|
+
readonly "inverse-bg": "#F7F8F8";
|
|
4083
|
+
readonly "inverse-surface": "#FFFFFF";
|
|
4084
|
+
readonly "inverse-text": "#0B0B0F";
|
|
4085
|
+
readonly "inverse-muted": "#5E6270";
|
|
4086
|
+
readonly "inverse-line": "#E4E4EA";
|
|
4087
|
+
readonly "inverse-accent": "#5B47F0";
|
|
4088
|
+
readonly "inverse-accent-ink": "#FFFFFF";
|
|
4089
|
+
readonly success: "#4ADE80";
|
|
4090
|
+
readonly "success-bg": "#0F2418";
|
|
4091
|
+
readonly danger: "#FF7B72";
|
|
4092
|
+
readonly "danger-bg": "#2D1213";
|
|
4093
|
+
readonly scrim: "rgba(0, 0, 0, 0.7)";
|
|
4094
|
+
};
|
|
4095
|
+
};
|
|
4096
|
+
readonly tint: {
|
|
4097
|
+
readonly scale: 1;
|
|
4098
|
+
readonly roles: readonly ["bg", "surface", "surface-2", "line", "line-strong", "text", "text-muted", "inverse-bg", "inverse-surface", "inverse-text", "inverse-muted", "inverse-line"];
|
|
4099
|
+
};
|
|
4100
|
+
readonly legacy: {
|
|
4101
|
+
readonly "line-strong": {
|
|
4102
|
+
readonly value: "#C9C9D3";
|
|
4103
|
+
readonly dark: "rgba(255, 255, 255, 0.16)";
|
|
4104
|
+
};
|
|
4105
|
+
readonly "focus-ring": {
|
|
4106
|
+
readonly value: "0 0 0 3px color-mix(in srgb, var(--iox-accent) 35%, transparent)";
|
|
4107
|
+
};
|
|
4108
|
+
};
|
|
3670
4109
|
readonly tokens: readonly [{
|
|
3671
4110
|
readonly name: "bg";
|
|
3672
4111
|
readonly tier: "semantic";
|
|
3673
4112
|
readonly type: "color";
|
|
3674
4113
|
readonly group: "colour";
|
|
3675
|
-
readonly value: "#
|
|
3676
|
-
readonly dark: "#
|
|
4114
|
+
readonly value: "#FAFBFF";
|
|
4115
|
+
readonly dark: "#08090C";
|
|
3677
4116
|
}, {
|
|
3678
4117
|
readonly name: "page-bg";
|
|
3679
4118
|
readonly tier: "semantic";
|
|
@@ -3693,14 +4132,14 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3693
4132
|
readonly type: "color";
|
|
3694
4133
|
readonly group: "colour";
|
|
3695
4134
|
readonly value: "#FFFFFF";
|
|
3696
|
-
readonly dark: "#
|
|
4135
|
+
readonly dark: "#121214";
|
|
3697
4136
|
}, {
|
|
3698
4137
|
readonly name: "surface-2";
|
|
3699
4138
|
readonly tier: "semantic";
|
|
3700
4139
|
readonly type: "color";
|
|
3701
4140
|
readonly group: "colour";
|
|
3702
|
-
readonly value: "#
|
|
3703
|
-
readonly dark: "#
|
|
4141
|
+
readonly value: "#F2F3FD";
|
|
4142
|
+
readonly dark: "#181820";
|
|
3704
4143
|
}, {
|
|
3705
4144
|
readonly name: "surface-glass";
|
|
3706
4145
|
readonly tier: "semantic";
|
|
@@ -3725,28 +4164,28 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3725
4164
|
readonly type: "color";
|
|
3726
4165
|
readonly group: "colour";
|
|
3727
4166
|
readonly value: "#0B0B0F";
|
|
3728
|
-
readonly dark: "#
|
|
4167
|
+
readonly dark: "#F7F7FD";
|
|
3729
4168
|
}, {
|
|
3730
4169
|
readonly name: "text-muted";
|
|
3731
4170
|
readonly tier: "semantic";
|
|
3732
4171
|
readonly type: "color";
|
|
3733
4172
|
readonly group: "colour";
|
|
3734
4173
|
readonly value: "#5E6270";
|
|
3735
|
-
readonly dark: "#
|
|
4174
|
+
readonly dark: "#8D94A2";
|
|
3736
4175
|
}, {
|
|
3737
4176
|
readonly name: "line";
|
|
3738
4177
|
readonly tier: "semantic";
|
|
3739
4178
|
readonly type: "color";
|
|
3740
4179
|
readonly group: "colour";
|
|
3741
|
-
readonly value: "#
|
|
4180
|
+
readonly value: "#E3E4ED";
|
|
3742
4181
|
readonly dark: "rgba(255, 255, 255, 0.08)";
|
|
3743
4182
|
}, {
|
|
3744
4183
|
readonly name: "line-strong";
|
|
3745
4184
|
readonly tier: "semantic";
|
|
3746
4185
|
readonly type: "color";
|
|
3747
4186
|
readonly group: "colour";
|
|
3748
|
-
readonly value: "#
|
|
3749
|
-
readonly dark: "rgba(255, 255, 255, 0.
|
|
4187
|
+
readonly value: "#878692";
|
|
4188
|
+
readonly dark: "rgba(255, 255, 255, 0.34)";
|
|
3750
4189
|
}, {
|
|
3751
4190
|
readonly name: "accent";
|
|
3752
4191
|
readonly tier: "semantic";
|
|
@@ -3779,28 +4218,28 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3779
4218
|
readonly tier: "semantic";
|
|
3780
4219
|
readonly type: "color";
|
|
3781
4220
|
readonly group: "colour";
|
|
3782
|
-
readonly value: "#
|
|
3783
|
-
readonly dark: "#
|
|
4221
|
+
readonly value: "#08080F";
|
|
4222
|
+
readonly dark: "#F6F7FF";
|
|
3784
4223
|
}, {
|
|
3785
4224
|
readonly name: "inverse-surface";
|
|
3786
4225
|
readonly tier: "semantic";
|
|
3787
4226
|
readonly type: "color";
|
|
3788
4227
|
readonly group: "colour";
|
|
3789
|
-
readonly value: "#
|
|
4228
|
+
readonly value: "#11111A";
|
|
3790
4229
|
readonly dark: "#FFFFFF";
|
|
3791
4230
|
}, {
|
|
3792
4231
|
readonly name: "inverse-text";
|
|
3793
4232
|
readonly tier: "semantic";
|
|
3794
4233
|
readonly type: "color";
|
|
3795
4234
|
readonly group: "colour";
|
|
3796
|
-
readonly value: "#
|
|
4235
|
+
readonly value: "#F7F7FB";
|
|
3797
4236
|
readonly dark: "#0B0B0F";
|
|
3798
4237
|
}, {
|
|
3799
4238
|
readonly name: "inverse-muted";
|
|
3800
4239
|
readonly tier: "semantic";
|
|
3801
4240
|
readonly type: "color";
|
|
3802
4241
|
readonly group: "colour";
|
|
3803
|
-
readonly value: "#
|
|
4242
|
+
readonly value: "#8D94A1";
|
|
3804
4243
|
readonly dark: "#5E6270";
|
|
3805
4244
|
}, {
|
|
3806
4245
|
readonly name: "inverse-line";
|
|
@@ -3808,7 +4247,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
3808
4247
|
readonly type: "color";
|
|
3809
4248
|
readonly group: "colour";
|
|
3810
4249
|
readonly value: "rgba(255, 255, 255, 0.08)";
|
|
3811
|
-
readonly dark: "#
|
|
4250
|
+
readonly dark: "#E3E4F0";
|
|
3812
4251
|
}, {
|
|
3813
4252
|
readonly name: "inverse-accent";
|
|
3814
4253
|
readonly tier: "semantic";
|
|
@@ -4083,7 +4522,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4083
4522
|
readonly tier: "semantic";
|
|
4084
4523
|
readonly type: "shadow";
|
|
4085
4524
|
readonly group: "depth";
|
|
4086
|
-
readonly value: "0 0 0
|
|
4525
|
+
readonly value: "0 0 0 2px var(--iox-bg), 0 0 0 4px var(--iox-accent-text)";
|
|
4087
4526
|
}, {
|
|
4088
4527
|
readonly name: "space-section";
|
|
4089
4528
|
readonly tier: "semantic";
|
|
@@ -4682,6 +5121,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4682
5121
|
readonly motion: "lively";
|
|
4683
5122
|
readonly pillButtons: true;
|
|
4684
5123
|
readonly mode: "light";
|
|
5124
|
+
readonly tint: "subtle";
|
|
4685
5125
|
};
|
|
4686
5126
|
readonly seed: "#0A66E8";
|
|
4687
5127
|
readonly seeds: readonly ["#0A66E8", "#7C5CFF", "#0E8A89", "#E5484D", "#1F2937"];
|
|
@@ -4728,13 +5168,92 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4728
5168
|
};
|
|
4729
5169
|
readonly families: readonly ["Manrope", "Inter"];
|
|
4730
5170
|
}];
|
|
5171
|
+
readonly palette: {
|
|
5172
|
+
readonly light: {
|
|
5173
|
+
readonly bg: "#EEF1F6";
|
|
5174
|
+
readonly "page-bg": "radial-gradient(40% 50% at 12% 8%, #C9D8FF 0%, transparent 70%), radial-gradient(45% 55% at 88% 18%, #F5D0E6 0%, transparent 70%), radial-gradient(55% 60% at 50% 100%, #D7F2EA 0%, transparent 70%), var(--iox-bg)";
|
|
5175
|
+
readonly "section-bg": "transparent";
|
|
5176
|
+
readonly surface: "#FFFFFF";
|
|
5177
|
+
readonly "surface-2": "#F5F7FA";
|
|
5178
|
+
readonly "surface-glass": "rgba(255, 255, 255, 0.55)";
|
|
5179
|
+
readonly "surface-glass-strong": "rgba(255, 255, 255, 0.78)";
|
|
5180
|
+
readonly "glass-border": "rgba(255, 255, 255, 0.6)";
|
|
5181
|
+
readonly text: "#0B0C0F";
|
|
5182
|
+
readonly "text-muted": "#545966";
|
|
5183
|
+
readonly line: "rgba(15, 23, 42, 0.10)";
|
|
5184
|
+
readonly "line-strong": "rgba(15, 23, 42, 0.49)";
|
|
5185
|
+
readonly accent: "#0A66E8";
|
|
5186
|
+
readonly "accent-ink": "#FFFFFF";
|
|
5187
|
+
readonly "accent-hover": "#0855C4";
|
|
5188
|
+
readonly "accent-text": "#0658CC";
|
|
5189
|
+
readonly "inverse-bg": "#0B0C10";
|
|
5190
|
+
readonly "inverse-surface": "#1A1B20";
|
|
5191
|
+
readonly "inverse-text": "#F5F6F8";
|
|
5192
|
+
readonly "inverse-muted": "#A3A8B3";
|
|
5193
|
+
readonly "inverse-line": "rgba(255, 255, 255, 0.12)";
|
|
5194
|
+
readonly "inverse-accent": "#4C9AFF";
|
|
5195
|
+
readonly "inverse-accent-ink": "#0B0C10";
|
|
5196
|
+
readonly success: "#1B6B3D";
|
|
5197
|
+
readonly "success-bg": "#E3F5EA";
|
|
5198
|
+
readonly danger: "#B3261E";
|
|
5199
|
+
readonly "danger-bg": "#FCE8E6";
|
|
5200
|
+
readonly scrim: "rgba(15, 23, 42, 0.30)";
|
|
5201
|
+
};
|
|
5202
|
+
readonly dark: {
|
|
5203
|
+
readonly bg: "#0B0C10";
|
|
5204
|
+
readonly "page-bg": "radial-gradient(40% 50% at 12% 8%, #1B2A5C 0%, transparent 70%), radial-gradient(45% 55% at 88% 18%, #3D1F3A 0%, transparent 70%), radial-gradient(55% 60% at 50% 100%, #0F3A33 0%, transparent 70%), var(--iox-bg)";
|
|
5205
|
+
readonly surface: "#1A1B20";
|
|
5206
|
+
readonly "surface-2": "#22232A";
|
|
5207
|
+
readonly "surface-glass": "rgba(28, 28, 32, 0.55)";
|
|
5208
|
+
readonly "surface-glass-strong": "rgba(28, 28, 32, 0.80)";
|
|
5209
|
+
readonly "glass-border": "rgba(255, 255, 255, 0.12)";
|
|
5210
|
+
readonly text: "#F5F6F8";
|
|
5211
|
+
readonly "text-muted": "#A3A8B3";
|
|
5212
|
+
readonly line: "rgba(255, 255, 255, 0.10)";
|
|
5213
|
+
readonly "line-strong": "rgba(255, 255, 255, 0.37)";
|
|
5214
|
+
readonly accent: "#4C9AFF";
|
|
5215
|
+
readonly "accent-ink": "#0B0C10";
|
|
5216
|
+
readonly "accent-hover": "#6DADFF";
|
|
5217
|
+
readonly "accent-text": "#6DADFF";
|
|
5218
|
+
readonly "inverse-bg": "#F5F7FA";
|
|
5219
|
+
readonly "inverse-surface": "#FFFFFF";
|
|
5220
|
+
readonly "inverse-text": "#0B0C0F";
|
|
5221
|
+
readonly "inverse-muted": "#545966";
|
|
5222
|
+
readonly "inverse-line": "rgba(15, 23, 42, 0.10)";
|
|
5223
|
+
readonly "inverse-accent": "#0A66E8";
|
|
5224
|
+
readonly "inverse-accent-ink": "#FFFFFF";
|
|
5225
|
+
readonly success: "#5FD08E";
|
|
5226
|
+
readonly "success-bg": "#12291C";
|
|
5227
|
+
readonly danger: "#FF8A80";
|
|
5228
|
+
readonly "danger-bg": "#3A1715";
|
|
5229
|
+
readonly scrim: "rgba(0, 0, 0, 0.5)";
|
|
5230
|
+
};
|
|
5231
|
+
};
|
|
5232
|
+
readonly tint: {
|
|
5233
|
+
readonly scale: 1.2;
|
|
5234
|
+
readonly roles: readonly ["bg", "surface", "surface-2", "line", "line-strong", "text", "text-muted", "inverse-bg", "inverse-surface", "inverse-text", "inverse-muted", "inverse-line"];
|
|
5235
|
+
readonly paints: readonly ["page-bg"];
|
|
5236
|
+
};
|
|
5237
|
+
readonly legacy: {
|
|
5238
|
+
readonly "line-strong": {
|
|
5239
|
+
readonly value: "rgba(15, 23, 42, 0.18)";
|
|
5240
|
+
readonly dark: "rgba(255, 255, 255, 0.18)";
|
|
5241
|
+
};
|
|
5242
|
+
readonly "accent-text": {
|
|
5243
|
+
readonly value: "#0A5BCF";
|
|
5244
|
+
readonly dark: "#6DADFF";
|
|
5245
|
+
};
|
|
5246
|
+
readonly "focus-ring": {
|
|
5247
|
+
readonly value: "0 0 0 3px color-mix(in srgb, var(--iox-accent) 35%, transparent)";
|
|
5248
|
+
};
|
|
5249
|
+
};
|
|
4731
5250
|
readonly tokens: readonly [{
|
|
4732
5251
|
readonly name: "bg";
|
|
4733
5252
|
readonly tier: "semantic";
|
|
4734
5253
|
readonly type: "color";
|
|
4735
5254
|
readonly group: "colour";
|
|
4736
|
-
readonly value: "#
|
|
4737
|
-
readonly dark: "#
|
|
5255
|
+
readonly value: "#EDF1F8";
|
|
5256
|
+
readonly dark: "#0A0C10";
|
|
4738
5257
|
}, {
|
|
4739
5258
|
readonly name: "page-bg";
|
|
4740
5259
|
readonly tier: "semantic";
|
|
@@ -4754,14 +5273,14 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4754
5273
|
readonly type: "color";
|
|
4755
5274
|
readonly group: "colour";
|
|
4756
5275
|
readonly value: "#FFFFFF";
|
|
4757
|
-
readonly dark: "#
|
|
5276
|
+
readonly dark: "#191B20";
|
|
4758
5277
|
}, {
|
|
4759
5278
|
readonly name: "surface-2";
|
|
4760
5279
|
readonly tier: "semantic";
|
|
4761
5280
|
readonly type: "color";
|
|
4762
5281
|
readonly group: "colour";
|
|
4763
|
-
readonly value: "#
|
|
4764
|
-
readonly dark: "#
|
|
5282
|
+
readonly value: "#F2F7FF";
|
|
5283
|
+
readonly dark: "#22232C";
|
|
4765
5284
|
}, {
|
|
4766
5285
|
readonly name: "surface-glass";
|
|
4767
5286
|
readonly tier: "semantic";
|
|
@@ -4788,15 +5307,15 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4788
5307
|
readonly tier: "semantic";
|
|
4789
5308
|
readonly type: "color";
|
|
4790
5309
|
readonly group: "colour";
|
|
4791
|
-
readonly value: "#
|
|
4792
|
-
readonly dark: "#
|
|
5310
|
+
readonly value: "#0A0C10";
|
|
5311
|
+
readonly dark: "#F2F6FD";
|
|
4793
5312
|
}, {
|
|
4794
5313
|
readonly name: "text-muted";
|
|
4795
5314
|
readonly tier: "semantic";
|
|
4796
5315
|
readonly type: "color";
|
|
4797
5316
|
readonly group: "colour";
|
|
4798
|
-
readonly value: "#
|
|
4799
|
-
readonly dark: "#
|
|
5317
|
+
readonly value: "#535969";
|
|
5318
|
+
readonly dark: "#A0A8B9";
|
|
4800
5319
|
}, {
|
|
4801
5320
|
readonly name: "line";
|
|
4802
5321
|
readonly tier: "semantic";
|
|
@@ -4809,8 +5328,8 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4809
5328
|
readonly tier: "semantic";
|
|
4810
5329
|
readonly type: "color";
|
|
4811
5330
|
readonly group: "colour";
|
|
4812
|
-
readonly value: "rgba(15, 23, 42, 0.
|
|
4813
|
-
readonly dark: "rgba(255, 255, 255, 0.
|
|
5331
|
+
readonly value: "rgba(15, 23, 42, 0.49)";
|
|
5332
|
+
readonly dark: "rgba(255, 255, 255, 0.37)";
|
|
4814
5333
|
}, {
|
|
4815
5334
|
readonly name: "accent";
|
|
4816
5335
|
readonly tier: "semantic";
|
|
@@ -4837,36 +5356,36 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
4837
5356
|
readonly tier: "semantic";
|
|
4838
5357
|
readonly type: "color";
|
|
4839
5358
|
readonly group: "colour";
|
|
4840
|
-
readonly value: "#
|
|
5359
|
+
readonly value: "#0658CC";
|
|
4841
5360
|
readonly dark: "#6DADFF";
|
|
4842
5361
|
}, {
|
|
4843
5362
|
readonly name: "inverse-bg";
|
|
4844
5363
|
readonly tier: "semantic";
|
|
4845
5364
|
readonly type: "color";
|
|
4846
5365
|
readonly group: "colour";
|
|
4847
|
-
readonly value: "#
|
|
4848
|
-
readonly dark: "#
|
|
5366
|
+
readonly value: "#080C13";
|
|
5367
|
+
readonly dark: "#F2F7FF";
|
|
4849
5368
|
}, {
|
|
4850
5369
|
readonly name: "inverse-surface";
|
|
4851
5370
|
readonly tier: "semantic";
|
|
4852
5371
|
readonly type: "color";
|
|
4853
5372
|
readonly group: "colour";
|
|
4854
|
-
readonly value: "#
|
|
5373
|
+
readonly value: "#151C26";
|
|
4855
5374
|
readonly dark: "#FFFFFF";
|
|
4856
5375
|
}, {
|
|
4857
5376
|
readonly name: "inverse-text";
|
|
4858
5377
|
readonly tier: "semantic";
|
|
4859
5378
|
readonly type: "color";
|
|
4860
5379
|
readonly group: "colour";
|
|
4861
|
-
readonly value: "#
|
|
4862
|
-
readonly dark: "#
|
|
5380
|
+
readonly value: "#F4F6FA";
|
|
5381
|
+
readonly dark: "#0A0C0F";
|
|
4863
5382
|
}, {
|
|
4864
5383
|
readonly name: "inverse-muted";
|
|
4865
5384
|
readonly tier: "semantic";
|
|
4866
5385
|
readonly type: "color";
|
|
4867
5386
|
readonly group: "colour";
|
|
4868
|
-
readonly value: "#
|
|
4869
|
-
readonly dark: "#
|
|
5387
|
+
readonly value: "#A1A8B8";
|
|
5388
|
+
readonly dark: "#545967";
|
|
4870
5389
|
}, {
|
|
4871
5390
|
readonly name: "inverse-line";
|
|
4872
5391
|
readonly tier: "semantic";
|
|
@@ -5149,7 +5668,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5149
5668
|
readonly tier: "semantic";
|
|
5150
5669
|
readonly type: "shadow";
|
|
5151
5670
|
readonly group: "depth";
|
|
5152
|
-
readonly value: "0 0 0
|
|
5671
|
+
readonly value: "0 0 0 2px var(--iox-bg), 0 0 0 4px var(--iox-accent-text)";
|
|
5153
5672
|
}, {
|
|
5154
5673
|
readonly name: "space-section";
|
|
5155
5674
|
readonly tier: "semantic";
|
|
@@ -5766,6 +6285,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5766
6285
|
readonly motion: "lively";
|
|
5767
6286
|
readonly pillButtons: true;
|
|
5768
6287
|
readonly mode: "light";
|
|
6288
|
+
readonly tint: "subtle";
|
|
5769
6289
|
};
|
|
5770
6290
|
readonly seed: "#6750A4";
|
|
5771
6291
|
readonly seeds: readonly ["#6750A4", "#006A6A", "#9C4146", "#7D5260", "#3B6939"];
|
|
@@ -5812,12 +6332,81 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5812
6332
|
};
|
|
5813
6333
|
readonly families: readonly ["Nunito"];
|
|
5814
6334
|
}];
|
|
6335
|
+
readonly palette: {
|
|
6336
|
+
readonly light: {
|
|
6337
|
+
readonly bg: "#FFFBFE";
|
|
6338
|
+
readonly "page-bg": "var(--iox-bg)";
|
|
6339
|
+
readonly "section-bg": "transparent";
|
|
6340
|
+
readonly surface: "#FFFFFF";
|
|
6341
|
+
readonly "surface-2": "#F3EDF7";
|
|
6342
|
+
readonly "surface-glass": "var(--iox-surface)";
|
|
6343
|
+
readonly "surface-glass-strong": "var(--iox-surface)";
|
|
6344
|
+
readonly "glass-border": "var(--iox-line)";
|
|
6345
|
+
readonly text: "#1D1B20";
|
|
6346
|
+
readonly "text-muted": "#49454F";
|
|
6347
|
+
readonly line: "#CAC4D0";
|
|
6348
|
+
readonly "line-strong": "#79747E";
|
|
6349
|
+
readonly accent: "#6750A4";
|
|
6350
|
+
readonly "accent-ink": "#FFFFFF";
|
|
6351
|
+
readonly "accent-hover": "#5A4491";
|
|
6352
|
+
readonly "accent-text": "#6750A4";
|
|
6353
|
+
readonly "inverse-bg": "#322F35";
|
|
6354
|
+
readonly "inverse-surface": "#3D3A41";
|
|
6355
|
+
readonly "inverse-text": "#F5EFF7";
|
|
6356
|
+
readonly "inverse-muted": "#CAC4D0";
|
|
6357
|
+
readonly "inverse-line": "#49454F";
|
|
6358
|
+
readonly "inverse-accent": "#D0BCFF";
|
|
6359
|
+
readonly "inverse-accent-ink": "#381E72";
|
|
6360
|
+
readonly success: "#1F6B3A";
|
|
6361
|
+
readonly "success-bg": "#DDF3E3";
|
|
6362
|
+
readonly danger: "#B3261E";
|
|
6363
|
+
readonly "danger-bg": "#F9DEDC";
|
|
6364
|
+
readonly scrim: "rgba(29, 27, 32, 0.4)";
|
|
6365
|
+
};
|
|
6366
|
+
readonly dark: {
|
|
6367
|
+
readonly bg: "#141218";
|
|
6368
|
+
readonly surface: "#1D1B20";
|
|
6369
|
+
readonly "surface-2": "#2B2930";
|
|
6370
|
+
readonly text: "#E6E0E9";
|
|
6371
|
+
readonly "text-muted": "#CAC4D0";
|
|
6372
|
+
readonly line: "#49454F";
|
|
6373
|
+
readonly "line-strong": "#938F99";
|
|
6374
|
+
readonly accent: "#D0BCFF";
|
|
6375
|
+
readonly "accent-ink": "#381E72";
|
|
6376
|
+
readonly "accent-hover": "#DCCBFF";
|
|
6377
|
+
readonly "accent-text": "#D0BCFF";
|
|
6378
|
+
readonly "inverse-bg": "#E6E0E9";
|
|
6379
|
+
readonly "inverse-surface": "#F3EDF7";
|
|
6380
|
+
readonly "inverse-text": "#322F35";
|
|
6381
|
+
readonly "inverse-muted": "#49454F";
|
|
6382
|
+
readonly "inverse-line": "#CAC4D0";
|
|
6383
|
+
readonly "inverse-accent": "#6750A4";
|
|
6384
|
+
readonly "inverse-accent-ink": "#FFFFFF";
|
|
6385
|
+
readonly success: "#8FD9A4";
|
|
6386
|
+
readonly "success-bg": "#123620";
|
|
6387
|
+
readonly danger: "#F2B8B5";
|
|
6388
|
+
readonly "danger-bg": "#601410";
|
|
6389
|
+
readonly scrim: "rgba(0, 0, 0, 0.55)";
|
|
6390
|
+
};
|
|
6391
|
+
};
|
|
6392
|
+
readonly tint: {
|
|
6393
|
+
readonly scale: 1.5;
|
|
6394
|
+
readonly roles: readonly ["bg", "surface", "surface-2", "line", "line-strong", "text", "text-muted", "inverse-bg", "inverse-surface", "inverse-text", "inverse-muted", "inverse-line"];
|
|
6395
|
+
};
|
|
6396
|
+
readonly legacy: {
|
|
6397
|
+
readonly "focus-ring": {
|
|
6398
|
+
readonly value: "0 0 0 3px color-mix(in srgb, var(--iox-accent) 35%, transparent)";
|
|
6399
|
+
};
|
|
6400
|
+
readonly "field-border": {
|
|
6401
|
+
readonly value: "transparent";
|
|
6402
|
+
};
|
|
6403
|
+
};
|
|
5815
6404
|
readonly tokens: readonly [{
|
|
5816
6405
|
readonly name: "bg";
|
|
5817
6406
|
readonly tier: "semantic";
|
|
5818
6407
|
readonly type: "color";
|
|
5819
6408
|
readonly group: "colour";
|
|
5820
|
-
readonly value: "#
|
|
6409
|
+
readonly value: "#FCFBFF";
|
|
5821
6410
|
readonly dark: "#141218";
|
|
5822
6411
|
}, {
|
|
5823
6412
|
readonly name: "page-bg";
|
|
@@ -5837,14 +6426,14 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5837
6426
|
readonly type: "color";
|
|
5838
6427
|
readonly group: "colour";
|
|
5839
6428
|
readonly value: "#FFFFFF";
|
|
5840
|
-
readonly dark: "#
|
|
6429
|
+
readonly dark: "#1C1B20";
|
|
5841
6430
|
}, {
|
|
5842
6431
|
readonly name: "surface-2";
|
|
5843
6432
|
readonly tier: "semantic";
|
|
5844
6433
|
readonly type: "color";
|
|
5845
6434
|
readonly group: "colour";
|
|
5846
|
-
readonly value: "#
|
|
5847
|
-
readonly dark: "#
|
|
6435
|
+
readonly value: "#F4ECFA";
|
|
6436
|
+
readonly dark: "#2C2834";
|
|
5848
6437
|
}, {
|
|
5849
6438
|
readonly name: "surface-glass";
|
|
5850
6439
|
readonly tier: "semantic";
|
|
@@ -5868,15 +6457,15 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5868
6457
|
readonly tier: "semantic";
|
|
5869
6458
|
readonly type: "color";
|
|
5870
6459
|
readonly group: "colour";
|
|
5871
|
-
readonly value: "#
|
|
6460
|
+
readonly value: "#1C1B21";
|
|
5872
6461
|
readonly dark: "#E6E0E9";
|
|
5873
6462
|
}, {
|
|
5874
6463
|
readonly name: "text-muted";
|
|
5875
6464
|
readonly tier: "semantic";
|
|
5876
6465
|
readonly type: "color";
|
|
5877
6466
|
readonly group: "colour";
|
|
5878
|
-
readonly value: "#
|
|
5879
|
-
readonly dark: "#
|
|
6467
|
+
readonly value: "#4B4356";
|
|
6468
|
+
readonly dark: "#CDC2D8";
|
|
5880
6469
|
}, {
|
|
5881
6470
|
readonly name: "line";
|
|
5882
6471
|
readonly tier: "semantic";
|
|
@@ -5889,8 +6478,8 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5889
6478
|
readonly tier: "semantic";
|
|
5890
6479
|
readonly type: "color";
|
|
5891
6480
|
readonly group: "colour";
|
|
5892
|
-
readonly value: "#
|
|
5893
|
-
readonly dark: "#
|
|
6481
|
+
readonly value: "#7B7283";
|
|
6482
|
+
readonly dark: "#958D9F";
|
|
5894
6483
|
}, {
|
|
5895
6484
|
readonly name: "accent";
|
|
5896
6485
|
readonly tier: "semantic";
|
|
@@ -5924,15 +6513,15 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5924
6513
|
readonly tier: "semantic";
|
|
5925
6514
|
readonly type: "color";
|
|
5926
6515
|
readonly group: "colour";
|
|
5927
|
-
readonly value: "#
|
|
5928
|
-
readonly dark: "#
|
|
6516
|
+
readonly value: "#332E39";
|
|
6517
|
+
readonly dark: "#E8DFED";
|
|
5929
6518
|
}, {
|
|
5930
6519
|
readonly name: "inverse-surface";
|
|
5931
6520
|
readonly tier: "semantic";
|
|
5932
6521
|
readonly type: "color";
|
|
5933
6522
|
readonly group: "colour";
|
|
5934
|
-
readonly value: "#
|
|
5935
|
-
readonly dark: "#
|
|
6523
|
+
readonly value: "#3F3847";
|
|
6524
|
+
readonly dark: "#F6EBFD";
|
|
5936
6525
|
}, {
|
|
5937
6526
|
readonly name: "inverse-text";
|
|
5938
6527
|
readonly tier: "semantic";
|
|
@@ -5945,15 +6534,15 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
5945
6534
|
readonly tier: "semantic";
|
|
5946
6535
|
readonly type: "color";
|
|
5947
6536
|
readonly group: "colour";
|
|
5948
|
-
readonly value: "#
|
|
5949
|
-
readonly dark: "#
|
|
6537
|
+
readonly value: "#CCC2D6";
|
|
6538
|
+
readonly dark: "#4A4355";
|
|
5950
6539
|
}, {
|
|
5951
6540
|
readonly name: "inverse-line";
|
|
5952
6541
|
readonly tier: "semantic";
|
|
5953
6542
|
readonly type: "color";
|
|
5954
6543
|
readonly group: "colour";
|
|
5955
|
-
readonly value: "#
|
|
5956
|
-
readonly dark: "#
|
|
6544
|
+
readonly value: "#4A4452";
|
|
6545
|
+
readonly dark: "#CBC3D3";
|
|
5957
6546
|
}, {
|
|
5958
6547
|
readonly name: "inverse-accent";
|
|
5959
6548
|
readonly tier: "semantic";
|
|
@@ -6227,7 +6816,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6227
6816
|
readonly tier: "semantic";
|
|
6228
6817
|
readonly type: "shadow";
|
|
6229
6818
|
readonly group: "depth";
|
|
6230
|
-
readonly value: "0 0 0
|
|
6819
|
+
readonly value: "0 0 0 2px var(--iox-bg), 0 0 0 4px var(--iox-accent-text)";
|
|
6231
6820
|
}, {
|
|
6232
6821
|
readonly name: "space-section";
|
|
6233
6822
|
readonly tier: "semantic";
|
|
@@ -6683,8 +7272,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6683
7272
|
readonly tier: "component";
|
|
6684
7273
|
readonly type: "color";
|
|
6685
7274
|
readonly group: "components";
|
|
6686
|
-
readonly value: "
|
|
6687
|
-
readonly overridden: true;
|
|
7275
|
+
readonly value: "var(--iox-line-strong)";
|
|
6688
7276
|
}, {
|
|
6689
7277
|
readonly name: "field-border-width";
|
|
6690
7278
|
readonly tier: "component";
|
|
@@ -6831,6 +7419,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6831
7419
|
readonly motion: "snappy";
|
|
6832
7420
|
readonly pillButtons: false;
|
|
6833
7421
|
readonly mode: "light";
|
|
7422
|
+
readonly tint: "subtle";
|
|
6834
7423
|
};
|
|
6835
7424
|
readonly seed: "#FF5C39";
|
|
6836
7425
|
readonly seeds: readonly ["#FF5C39", "#3D5AFE", "#00B86B", "#FF4FA3", "#FFD23F"];
|
|
@@ -6877,13 +7466,79 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6877
7466
|
};
|
|
6878
7467
|
readonly families: readonly ["Syne", "DM Sans", "Space Mono"];
|
|
6879
7468
|
}];
|
|
7469
|
+
readonly palette: {
|
|
7470
|
+
readonly light: {
|
|
7471
|
+
readonly bg: "#FFF8E7";
|
|
7472
|
+
readonly "page-bg": "var(--iox-bg)";
|
|
7473
|
+
readonly "section-bg": "transparent";
|
|
7474
|
+
readonly surface: "#FFFFFF";
|
|
7475
|
+
readonly "surface-2": "#FFD23F";
|
|
7476
|
+
readonly "surface-glass": "var(--iox-surface)";
|
|
7477
|
+
readonly "surface-glass-strong": "var(--iox-surface)";
|
|
7478
|
+
readonly "glass-border": "var(--iox-line)";
|
|
7479
|
+
readonly text: "#0A0A0A";
|
|
7480
|
+
readonly "text-muted": "#3D3D3D";
|
|
7481
|
+
readonly line: "#0A0A0A";
|
|
7482
|
+
readonly "line-strong": "#0A0A0A";
|
|
7483
|
+
readonly accent: "#FF5C39";
|
|
7484
|
+
readonly "accent-ink": "#0A0A0A";
|
|
7485
|
+
readonly "accent-hover": "#FF7A5C";
|
|
7486
|
+
readonly "accent-text": "#AD3112";
|
|
7487
|
+
readonly "inverse-bg": "#0A0A0A";
|
|
7488
|
+
readonly "inverse-surface": "#1E1E1E";
|
|
7489
|
+
readonly "inverse-text": "#FFF8E7";
|
|
7490
|
+
readonly "inverse-muted": "#C9C3B4";
|
|
7491
|
+
readonly "inverse-line": "#FFF8E7";
|
|
7492
|
+
readonly "inverse-accent": "#FFD23F";
|
|
7493
|
+
readonly "inverse-accent-ink": "#0A0A0A";
|
|
7494
|
+
readonly success: "#0B6B3A";
|
|
7495
|
+
readonly "success-bg": "#C9F2D9";
|
|
7496
|
+
readonly danger: "#B3261E";
|
|
7497
|
+
readonly "danger-bg": "#FFD9D2";
|
|
7498
|
+
readonly scrim: "rgba(10, 10, 10, 0.5)";
|
|
7499
|
+
};
|
|
7500
|
+
readonly dark: {
|
|
7501
|
+
readonly bg: "#121212";
|
|
7502
|
+
readonly surface: "#1E1E1E";
|
|
7503
|
+
readonly "surface-2": "#2A2A2A";
|
|
7504
|
+
readonly text: "#F5F5F0";
|
|
7505
|
+
readonly "text-muted": "#BDBDB5";
|
|
7506
|
+
readonly line: "#F5F5F0";
|
|
7507
|
+
readonly "line-strong": "#F5F5F0";
|
|
7508
|
+
readonly accent: "#FF7A5C";
|
|
7509
|
+
readonly "accent-hover": "#FF9478";
|
|
7510
|
+
readonly "accent-text": "#FF8A6E";
|
|
7511
|
+
readonly "inverse-bg": "#FFF8E7";
|
|
7512
|
+
readonly "inverse-surface": "#FFFFFF";
|
|
7513
|
+
readonly "inverse-text": "#0A0A0A";
|
|
7514
|
+
readonly "inverse-muted": "#3D3D3D";
|
|
7515
|
+
readonly "inverse-line": "#0A0A0A";
|
|
7516
|
+
readonly "inverse-accent": "#B5381B";
|
|
7517
|
+
readonly "inverse-accent-ink": "#FFFFFF";
|
|
7518
|
+
readonly success: "#5FD08E";
|
|
7519
|
+
readonly "success-bg": "#0F2A1A";
|
|
7520
|
+
readonly danger: "#FF8A80";
|
|
7521
|
+
readonly "danger-bg": "#3A1715";
|
|
7522
|
+
readonly scrim: "rgba(0, 0, 0, 0.6)";
|
|
7523
|
+
};
|
|
7524
|
+
};
|
|
7525
|
+
readonly tint: {
|
|
7526
|
+
readonly scale: 2.4;
|
|
7527
|
+
readonly roles: readonly ["bg", "surface", "inverse-text", "inverse-line"];
|
|
7528
|
+
};
|
|
7529
|
+
readonly legacy: {
|
|
7530
|
+
readonly "accent-text": {
|
|
7531
|
+
readonly value: "#B5381B";
|
|
7532
|
+
readonly dark: "#FF8A6E";
|
|
7533
|
+
};
|
|
7534
|
+
};
|
|
6880
7535
|
readonly tokens: readonly [{
|
|
6881
7536
|
readonly name: "bg";
|
|
6882
7537
|
readonly tier: "semantic";
|
|
6883
7538
|
readonly type: "color";
|
|
6884
7539
|
readonly group: "colour";
|
|
6885
7540
|
readonly value: "#FFF8E7";
|
|
6886
|
-
readonly dark: "#
|
|
7541
|
+
readonly dark: "#1A0F0C";
|
|
6887
7542
|
}, {
|
|
6888
7543
|
readonly name: "page-bg";
|
|
6889
7544
|
readonly tier: "semantic";
|
|
@@ -6902,7 +7557,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6902
7557
|
readonly type: "color";
|
|
6903
7558
|
readonly group: "colour";
|
|
6904
7559
|
readonly value: "#FFFFFF";
|
|
6905
|
-
readonly dark: "#
|
|
7560
|
+
readonly dark: "#221D1B";
|
|
6906
7561
|
}, {
|
|
6907
7562
|
readonly name: "surface-2";
|
|
6908
7563
|
readonly tier: "semantic";
|
|
@@ -6981,7 +7636,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
6981
7636
|
readonly tier: "semantic";
|
|
6982
7637
|
readonly type: "color";
|
|
6983
7638
|
readonly group: "colour";
|
|
6984
|
-
readonly value: "#
|
|
7639
|
+
readonly value: "#AD3112";
|
|
6985
7640
|
readonly dark: "#FF8A6E";
|
|
6986
7641
|
}, {
|
|
6987
7642
|
readonly name: "inverse-bg";
|
|
@@ -7003,7 +7658,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
7003
7658
|
readonly type: "color";
|
|
7004
7659
|
readonly group: "colour";
|
|
7005
7660
|
readonly value: "#FFF8E7";
|
|
7006
|
-
readonly dark: "#
|
|
7661
|
+
readonly dark: "#0F0807";
|
|
7007
7662
|
}, {
|
|
7008
7663
|
readonly name: "inverse-muted";
|
|
7009
7664
|
readonly tier: "semantic";
|
|
@@ -7017,7 +7672,7 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
7017
7672
|
readonly type: "color";
|
|
7018
7673
|
readonly group: "colour";
|
|
7019
7674
|
readonly value: "#FFF8E7";
|
|
7020
|
-
readonly dark: "#
|
|
7675
|
+
readonly dark: "#170402";
|
|
7021
7676
|
}, {
|
|
7022
7677
|
readonly name: "inverse-accent";
|
|
7023
7678
|
readonly tier: "semantic";
|
|
@@ -7897,64 +8552,100 @@ declare const SPEC_FLAVOR_PACKS: readonly [{
|
|
|
7897
8552
|
}];
|
|
7898
8553
|
declare const SPEC_CONTRAST: {
|
|
7899
8554
|
readonly crisp: {
|
|
7900
|
-
readonly "light:text/bg": 18.
|
|
8555
|
+
readonly "light:text/bg": 18.39;
|
|
7901
8556
|
readonly "light:text/surface": 18.9;
|
|
7902
|
-
readonly "light:text-muted/bg": 6.
|
|
8557
|
+
readonly "light:text-muted/bg": 6.05;
|
|
7903
8558
|
readonly "light:text-muted/surface": 6.21;
|
|
7904
8559
|
readonly "light:accent-ink/accent": 5.52;
|
|
7905
|
-
readonly "light:accent-text/bg": 5.
|
|
7906
|
-
readonly "light:inverse-text/inverse-bg": 17.
|
|
8560
|
+
readonly "light:accent-text/bg": 5.37;
|
|
8561
|
+
readonly "light:inverse-text/inverse-bg": 17.01;
|
|
7907
8562
|
readonly "light:inverse-muted/inverse-bg": 8;
|
|
7908
8563
|
readonly "light:inverse-accent-ink/inverse-accent": 8.34;
|
|
7909
8564
|
readonly "light:inverse-accent/inverse-bg": 8.34;
|
|
7910
8565
|
readonly "light:success/success-bg": 5.77;
|
|
7911
8566
|
readonly "light:danger/danger-bg": 5.58;
|
|
7912
8567
|
readonly "light:accent-ink/accent-hover": 7.43;
|
|
7913
|
-
readonly "light:text-muted/surface-2": 5.
|
|
8568
|
+
readonly "light:text-muted/surface-2": 5.79;
|
|
8569
|
+
readonly "light:text/surface-2": 17.6;
|
|
8570
|
+
readonly "light:accent-text/surface": 5.52;
|
|
8571
|
+
readonly "light:accent-text/surface-2": 5.14;
|
|
8572
|
+
readonly "light:inverse-text/inverse-surface": 15.18;
|
|
8573
|
+
readonly "light:inverse-muted/inverse-surface": 7.14;
|
|
8574
|
+
readonly "light:inverse-accent/inverse-surface": 7.44;
|
|
8575
|
+
readonly "light:line-strong/bg": 3.16;
|
|
8576
|
+
readonly "light:line-strong/surface": 3.25;
|
|
8577
|
+
readonly "light:line-strong/surface-2": 3.03;
|
|
7914
8578
|
readonly "dark:text/bg": 17.26;
|
|
7915
|
-
readonly "dark:text/surface": 15.
|
|
8579
|
+
readonly "dark:text/surface": 15.98;
|
|
7916
8580
|
readonly "dark:text-muted/bg": 7.3;
|
|
7917
8581
|
readonly "dark:text-muted/surface": 6.76;
|
|
7918
8582
|
readonly "dark:accent-ink/accent": 7.26;
|
|
7919
|
-
readonly "dark:accent-text/bg": 8.
|
|
7920
|
-
readonly "dark:inverse-text/inverse-bg": 17.
|
|
7921
|
-
readonly "dark:inverse-muted/inverse-bg": 5.
|
|
8583
|
+
readonly "dark:accent-text/bg": 8.47;
|
|
8584
|
+
readonly "dark:inverse-text/inverse-bg": 17.6;
|
|
8585
|
+
readonly "dark:inverse-muted/inverse-bg": 5.79;
|
|
7922
8586
|
readonly "dark:inverse-accent-ink/inverse-accent": 5.52;
|
|
7923
|
-
readonly "dark:inverse-accent/inverse-bg": 5.
|
|
8587
|
+
readonly "dark:inverse-accent/inverse-bg": 5.14;
|
|
7924
8588
|
readonly "dark:success/success-bg": 8;
|
|
7925
8589
|
readonly "dark:danger/danger-bg": 7;
|
|
7926
8590
|
readonly "dark:accent-ink/accent-hover": 9.37;
|
|
7927
|
-
readonly "dark:text-muted/surface-2": 6.
|
|
8591
|
+
readonly "dark:text-muted/surface-2": 6.28;
|
|
8592
|
+
readonly "dark:text/surface-2": 14.84;
|
|
8593
|
+
readonly "dark:accent-text/surface": 7.84;
|
|
8594
|
+
readonly "dark:accent-text/surface-2": 7.28;
|
|
8595
|
+
readonly "dark:inverse-text/inverse-surface": 18.9;
|
|
8596
|
+
readonly "dark:inverse-muted/inverse-surface": 6.21;
|
|
8597
|
+
readonly "dark:inverse-accent/inverse-surface": 5.52;
|
|
8598
|
+
readonly "dark:line-strong/bg": 3.52;
|
|
8599
|
+
readonly "dark:line-strong/surface": 3.26;
|
|
8600
|
+
readonly "dark:line-strong/surface-2": 3.03;
|
|
7928
8601
|
};
|
|
7929
8602
|
readonly linen: {
|
|
7930
|
-
readonly "light:text/bg": 15.
|
|
7931
|
-
readonly "light:text/surface": 16.
|
|
7932
|
-
readonly "light:text-muted/bg": 5.
|
|
8603
|
+
readonly "light:text/bg": 15.49;
|
|
8604
|
+
readonly "light:text/surface": 16.2;
|
|
8605
|
+
readonly "light:text-muted/bg": 5.81;
|
|
7933
8606
|
readonly "light:text-muted/surface": 6.08;
|
|
7934
8607
|
readonly "light:accent-ink/accent": 5.87;
|
|
7935
|
-
readonly "light:accent-text/bg": 5.
|
|
7936
|
-
readonly "light:inverse-text/inverse-bg": 14.
|
|
7937
|
-
readonly "light:inverse-muted/inverse-bg": 7.
|
|
8608
|
+
readonly "light:accent-text/bg": 5.61;
|
|
8609
|
+
readonly "light:inverse-text/inverse-bg": 14.02;
|
|
8610
|
+
readonly "light:inverse-muted/inverse-bg": 7.27;
|
|
7938
8611
|
readonly "light:inverse-accent-ink/inverse-accent": 7.63;
|
|
7939
|
-
readonly "light:inverse-accent/inverse-bg": 7.
|
|
8612
|
+
readonly "light:inverse-accent/inverse-bg": 7.61;
|
|
7940
8613
|
readonly "light:success/success-bg": 5.26;
|
|
7941
8614
|
readonly "light:danger/danger-bg": 5.88;
|
|
7942
8615
|
readonly "light:accent-ink/accent-hover": 8.41;
|
|
7943
|
-
readonly "light:text-muted/surface-2": 5.
|
|
7944
|
-
readonly "
|
|
7945
|
-
readonly "
|
|
7946
|
-
readonly "
|
|
7947
|
-
readonly "
|
|
8616
|
+
readonly "light:text-muted/surface-2": 5.33;
|
|
8617
|
+
readonly "light:text/surface-2": 14.21;
|
|
8618
|
+
readonly "light:accent-text/surface": 5.87;
|
|
8619
|
+
readonly "light:accent-text/surface-2": 5.15;
|
|
8620
|
+
readonly "light:inverse-text/inverse-surface": 12.45;
|
|
8621
|
+
readonly "light:inverse-muted/inverse-surface": 6.46;
|
|
8622
|
+
readonly "light:inverse-accent/inverse-surface": 6.76;
|
|
8623
|
+
readonly "light:line-strong/bg": 3.29;
|
|
8624
|
+
readonly "light:line-strong/surface": 3.44;
|
|
8625
|
+
readonly "light:line-strong/surface-2": 3.02;
|
|
8626
|
+
readonly "dark:text/bg": 15.44;
|
|
8627
|
+
readonly "dark:text/surface": 14.79;
|
|
8628
|
+
readonly "dark:text-muted/bg": 7.26;
|
|
8629
|
+
readonly "dark:text-muted/surface": 6.96;
|
|
7948
8630
|
readonly "dark:accent-ink/accent": 8.38;
|
|
7949
8631
|
readonly "dark:accent-text/bg": 8.38;
|
|
7950
|
-
readonly "dark:inverse-text/inverse-bg": 14.
|
|
7951
|
-
readonly "dark:inverse-muted/inverse-bg": 5.
|
|
8632
|
+
readonly "dark:inverse-text/inverse-bg": 14.21;
|
|
8633
|
+
readonly "dark:inverse-muted/inverse-bg": 5.33;
|
|
7952
8634
|
readonly "dark:inverse-accent-ink/inverse-accent": 5.87;
|
|
7953
8635
|
readonly "dark:inverse-accent/inverse-bg": 5.15;
|
|
7954
8636
|
readonly "dark:success/success-bg": 8.41;
|
|
7955
8637
|
readonly "dark:danger/danger-bg": 7.73;
|
|
7956
8638
|
readonly "dark:accent-ink/accent-hover": 10.41;
|
|
7957
|
-
readonly "dark:text-muted/surface-2": 6.
|
|
8639
|
+
readonly "dark:text-muted/surface-2": 6.74;
|
|
8640
|
+
readonly "dark:text/surface-2": 14.32;
|
|
8641
|
+
readonly "dark:accent-text/surface": 8.03;
|
|
8642
|
+
readonly "dark:accent-text/surface-2": 7.77;
|
|
8643
|
+
readonly "dark:inverse-text/inverse-surface": 15.54;
|
|
8644
|
+
readonly "dark:inverse-muted/inverse-surface": 5.82;
|
|
8645
|
+
readonly "dark:inverse-accent/inverse-surface": 5.63;
|
|
8646
|
+
readonly "dark:line-strong/bg": 3.24;
|
|
8647
|
+
readonly "dark:line-strong/surface": 3.1;
|
|
8648
|
+
readonly "dark:line-strong/surface-2": 3;
|
|
7958
8649
|
};
|
|
7959
8650
|
readonly midnight: {
|
|
7960
8651
|
readonly "light:text/bg": 19;
|
|
@@ -7963,88 +8654,133 @@ declare const SPEC_CONTRAST: {
|
|
|
7963
8654
|
readonly "light:text-muted/surface": 6.07;
|
|
7964
8655
|
readonly "light:accent-ink/accent": 5.83;
|
|
7965
8656
|
readonly "light:accent-text/bg": 5.63;
|
|
7966
|
-
readonly "light:inverse-text/inverse-bg": 18.
|
|
8657
|
+
readonly "light:inverse-text/inverse-bg": 18.68;
|
|
7967
8658
|
readonly "light:inverse-muted/inverse-bg": 6.54;
|
|
7968
8659
|
readonly "light:inverse-accent-ink/inverse-accent": 8.31;
|
|
7969
|
-
readonly "light:inverse-accent/inverse-bg": 8.
|
|
8660
|
+
readonly "light:inverse-accent/inverse-bg": 8.32;
|
|
7970
8661
|
readonly "light:success/success-bg": 5.77;
|
|
7971
8662
|
readonly "light:danger/danger-bg": 5.58;
|
|
7972
8663
|
readonly "light:accent-ink/accent-hover": 7.31;
|
|
7973
|
-
readonly "light:text-muted/surface-2": 5.
|
|
7974
|
-
readonly "
|
|
7975
|
-
readonly "
|
|
7976
|
-
readonly "
|
|
7977
|
-
readonly "
|
|
8664
|
+
readonly "light:text-muted/surface-2": 5.5;
|
|
8665
|
+
readonly "light:text/surface-2": 17.79;
|
|
8666
|
+
readonly "light:accent-text/surface": 5.83;
|
|
8667
|
+
readonly "light:accent-text/surface-2": 5.28;
|
|
8668
|
+
readonly "light:inverse-text/inverse-surface": 17.56;
|
|
8669
|
+
readonly "light:inverse-muted/inverse-surface": 6.15;
|
|
8670
|
+
readonly "light:inverse-accent/inverse-surface": 7.82;
|
|
8671
|
+
readonly "light:line-strong/bg": 3.47;
|
|
8672
|
+
readonly "light:line-strong/surface": 3.59;
|
|
8673
|
+
readonly "light:line-strong/surface-2": 3.25;
|
|
8674
|
+
readonly "dark:text/bg": 18.66;
|
|
8675
|
+
readonly "dark:text/surface": 17.53;
|
|
8676
|
+
readonly "dark:text-muted/bg": 6.53;
|
|
8677
|
+
readonly "dark:text-muted/surface": 6.14;
|
|
7978
8678
|
readonly "dark:accent-ink/accent": 4.56;
|
|
7979
|
-
readonly "dark:accent-text/bg": 8.
|
|
7980
|
-
readonly "dark:inverse-text/inverse-bg": 18.
|
|
7981
|
-
readonly "dark:inverse-muted/inverse-bg": 5.
|
|
8679
|
+
readonly "dark:accent-text/bg": 8.3;
|
|
8680
|
+
readonly "dark:inverse-text/inverse-bg": 18.4;
|
|
8681
|
+
readonly "dark:inverse-muted/inverse-bg": 5.69;
|
|
7982
8682
|
readonly "dark:inverse-accent-ink/inverse-accent": 5.83;
|
|
7983
|
-
readonly "dark:inverse-accent/inverse-bg": 5.
|
|
8683
|
+
readonly "dark:inverse-accent/inverse-bg": 5.46;
|
|
7984
8684
|
readonly "dark:success/success-bg": 9.37;
|
|
7985
8685
|
readonly "dark:danger/danger-bg": 6.9;
|
|
7986
8686
|
readonly "dark:accent-ink/accent-hover": 5.83;
|
|
7987
|
-
readonly "dark:text-muted/surface-2": 5.
|
|
8687
|
+
readonly "dark:text-muted/surface-2": 5.79;
|
|
8688
|
+
readonly "dark:text/surface-2": 16.53;
|
|
8689
|
+
readonly "dark:accent-text/surface": 7.8;
|
|
8690
|
+
readonly "dark:accent-text/surface-2": 7.35;
|
|
8691
|
+
readonly "dark:inverse-text/inverse-surface": 19.64;
|
|
8692
|
+
readonly "dark:inverse-muted/inverse-surface": 6.07;
|
|
8693
|
+
readonly "dark:inverse-accent/inverse-surface": 5.83;
|
|
7988
8694
|
};
|
|
7989
8695
|
readonly glass: {
|
|
7990
|
-
readonly "light:text/bg": 17.
|
|
7991
|
-
readonly "light:text/surface": 19.
|
|
7992
|
-
readonly "light:text-muted/bg": 6.
|
|
7993
|
-
readonly "light:text-muted/surface": 7
|
|
8696
|
+
readonly "light:text/bg": 17.28;
|
|
8697
|
+
readonly "light:text/surface": 19.57;
|
|
8698
|
+
readonly "light:text-muted/bg": 6.18;
|
|
8699
|
+
readonly "light:text-muted/surface": 7;
|
|
7994
8700
|
readonly "light:accent-ink/accent": 5.15;
|
|
7995
|
-
readonly "light:accent-text/bg": 5.
|
|
7996
|
-
readonly "light:inverse-text/inverse-bg": 18.
|
|
7997
|
-
readonly "light:inverse-muted/inverse-bg": 8.
|
|
8701
|
+
readonly "light:accent-text/bg": 5.66;
|
|
8702
|
+
readonly "light:inverse-text/inverse-bg": 18.1;
|
|
8703
|
+
readonly "light:inverse-muted/inverse-bg": 8.21;
|
|
7998
8704
|
readonly "light:inverse-accent-ink/inverse-accent": 6.86;
|
|
7999
|
-
readonly "light:inverse-accent/inverse-bg": 6.
|
|
8705
|
+
readonly "light:inverse-accent/inverse-bg": 6.88;
|
|
8000
8706
|
readonly "light:success/success-bg": 5.76;
|
|
8001
8707
|
readonly "light:danger/danger-bg": 5.55;
|
|
8002
8708
|
readonly "light:accent-ink/accent-hover": 6.76;
|
|
8003
|
-
readonly "light:text-muted/surface-2": 6.
|
|
8004
|
-
readonly "
|
|
8709
|
+
readonly "light:text-muted/surface-2": 6.51;
|
|
8710
|
+
readonly "light:text/surface-2": 18.2;
|
|
8711
|
+
readonly "light:accent-text/surface": 6.41;
|
|
8712
|
+
readonly "light:accent-text/surface-2": 5.96;
|
|
8713
|
+
readonly "light:inverse-text/inverse-surface": 15.83;
|
|
8714
|
+
readonly "light:inverse-muted/inverse-surface": 7.18;
|
|
8715
|
+
readonly "light:inverse-accent/inverse-surface": 6.01;
|
|
8716
|
+
readonly "dark:text/bg": 18.06;
|
|
8005
8717
|
readonly "dark:text/surface": 15.9;
|
|
8006
8718
|
readonly "dark:text-muted/bg": 8.2;
|
|
8007
|
-
readonly "dark:text-muted/surface": 7.
|
|
8719
|
+
readonly "dark:text-muted/surface": 7.22;
|
|
8008
8720
|
readonly "dark:accent-ink/accent": 6.86;
|
|
8009
|
-
readonly "dark:accent-text/bg": 8.
|
|
8010
|
-
readonly "dark:inverse-text/inverse-bg": 18.
|
|
8011
|
-
readonly "dark:inverse-muted/inverse-bg": 6.
|
|
8721
|
+
readonly "dark:accent-text/bg": 8.45;
|
|
8722
|
+
readonly "dark:inverse-text/inverse-bg": 18.21;
|
|
8723
|
+
readonly "dark:inverse-muted/inverse-bg": 6.5;
|
|
8012
8724
|
readonly "dark:inverse-accent-ink/inverse-accent": 5.15;
|
|
8013
|
-
readonly "dark:inverse-accent/inverse-bg": 4.
|
|
8725
|
+
readonly "dark:inverse-accent/inverse-bg": 4.79;
|
|
8014
8726
|
readonly "dark:success/success-bg": 8.02;
|
|
8015
8727
|
readonly "dark:danger/danger-bg": 7;
|
|
8016
8728
|
readonly "dark:accent-ink/accent-hover": 8.44;
|
|
8017
|
-
readonly "dark:text-muted/surface-2": 6.
|
|
8729
|
+
readonly "dark:text-muted/surface-2": 6.54;
|
|
8730
|
+
readonly "dark:text/surface-2": 14.41;
|
|
8731
|
+
readonly "dark:accent-text/surface": 7.44;
|
|
8732
|
+
readonly "dark:accent-text/surface-2": 6.75;
|
|
8733
|
+
readonly "dark:inverse-text/inverse-surface": 19.58;
|
|
8734
|
+
readonly "dark:inverse-muted/inverse-surface": 7;
|
|
8735
|
+
readonly "dark:inverse-accent/inverse-surface": 5.15;
|
|
8018
8736
|
};
|
|
8019
8737
|
readonly bloom: {
|
|
8020
|
-
readonly "light:text/bg": 16.
|
|
8021
|
-
readonly "light:text/surface": 17.
|
|
8738
|
+
readonly "light:text/bg": 16.6;
|
|
8739
|
+
readonly "light:text/surface": 17.1;
|
|
8022
8740
|
readonly "light:text-muted/bg": 9.11;
|
|
8023
|
-
readonly "light:text-muted/surface": 9.
|
|
8741
|
+
readonly "light:text-muted/surface": 9.39;
|
|
8024
8742
|
readonly "light:accent-ink/accent": 6.44;
|
|
8025
|
-
readonly "light:accent-text/bg": 6.
|
|
8026
|
-
readonly "light:inverse-text/inverse-bg": 11.
|
|
8027
|
-
readonly "light:inverse-muted/inverse-bg": 7.
|
|
8743
|
+
readonly "light:accent-text/bg": 6.25;
|
|
8744
|
+
readonly "light:inverse-text/inverse-bg": 11.68;
|
|
8745
|
+
readonly "light:inverse-muted/inverse-bg": 7.7;
|
|
8028
8746
|
readonly "light:inverse-accent-ink/inverse-accent": 7.71;
|
|
8029
|
-
readonly "light:inverse-accent/inverse-bg": 7.
|
|
8747
|
+
readonly "light:inverse-accent/inverse-bg": 7.74;
|
|
8030
8748
|
readonly "light:success/success-bg": 5.59;
|
|
8031
8749
|
readonly "light:danger/danger-bg": 5.14;
|
|
8032
8750
|
readonly "light:accent-ink/accent-hover": 7.86;
|
|
8033
|
-
readonly "light:text-muted/surface-2": 8.
|
|
8751
|
+
readonly "light:text-muted/surface-2": 8.15;
|
|
8752
|
+
readonly "light:text/surface-2": 14.84;
|
|
8753
|
+
readonly "light:accent-text/surface": 6.44;
|
|
8754
|
+
readonly "light:accent-text/surface-2": 5.59;
|
|
8755
|
+
readonly "light:inverse-text/inverse-surface": 9.94;
|
|
8756
|
+
readonly "light:inverse-muted/inverse-surface": 6.56;
|
|
8757
|
+
readonly "light:inverse-accent/inverse-surface": 6.59;
|
|
8758
|
+
readonly "light:line-strong/bg": 4.45;
|
|
8759
|
+
readonly "light:line-strong/surface": 4.59;
|
|
8760
|
+
readonly "light:line-strong/surface-2": 3.98;
|
|
8034
8761
|
readonly "dark:text/bg": 14.35;
|
|
8035
|
-
readonly "dark:text/surface": 13.
|
|
8036
|
-
readonly "dark:text-muted/bg": 10.
|
|
8037
|
-
readonly "dark:text-muted/surface": 10.
|
|
8762
|
+
readonly "dark:text/surface": 13.21;
|
|
8763
|
+
readonly "dark:text-muted/bg": 10.89;
|
|
8764
|
+
readonly "dark:text-muted/surface": 10.03;
|
|
8038
8765
|
readonly "dark:accent-ink/accent": 7.71;
|
|
8039
8766
|
readonly "dark:accent-text/bg": 10.91;
|
|
8040
8767
|
readonly "dark:inverse-text/inverse-bg": 10.17;
|
|
8041
|
-
readonly "dark:inverse-muted/inverse-bg": 7.
|
|
8768
|
+
readonly "dark:inverse-muted/inverse-bg": 7.28;
|
|
8042
8769
|
readonly "dark:inverse-accent-ink/inverse-accent": 6.44;
|
|
8043
8770
|
readonly "dark:inverse-accent/inverse-bg": 4.97;
|
|
8044
8771
|
readonly "dark:success/success-bg": 8.02;
|
|
8045
8772
|
readonly "dark:danger/danger-bg": 7.66;
|
|
8046
8773
|
readonly "dark:accent-ink/accent-hover": 8.79;
|
|
8047
|
-
readonly "dark:text-muted/surface-2": 8.
|
|
8774
|
+
readonly "dark:text-muted/surface-2": 8.43;
|
|
8775
|
+
readonly "dark:text/surface-2": 11.1;
|
|
8776
|
+
readonly "dark:accent-text/surface": 10.04;
|
|
8777
|
+
readonly "dark:accent-text/surface-2": 8.44;
|
|
8778
|
+
readonly "dark:inverse-text/inverse-surface": 11.43;
|
|
8779
|
+
readonly "dark:inverse-muted/inverse-surface": 8.19;
|
|
8780
|
+
readonly "dark:inverse-accent/inverse-surface": 5.59;
|
|
8781
|
+
readonly "dark:line-strong/bg": 5.83;
|
|
8782
|
+
readonly "dark:line-strong/surface": 5.37;
|
|
8783
|
+
readonly "dark:line-strong/surface-2": 4.51;
|
|
8048
8784
|
};
|
|
8049
8785
|
readonly pop: {
|
|
8050
8786
|
readonly "light:text/bg": 18.7;
|
|
@@ -8052,7 +8788,7 @@ declare const SPEC_CONTRAST: {
|
|
|
8052
8788
|
readonly "light:text-muted/bg": 10.26;
|
|
8053
8789
|
readonly "light:text-muted/surface": 10.86;
|
|
8054
8790
|
readonly "light:accent-ink/accent": 6.45;
|
|
8055
|
-
readonly "light:accent-text/bg":
|
|
8791
|
+
readonly "light:accent-text/bg": 6.15;
|
|
8056
8792
|
readonly "light:inverse-text/inverse-bg": 18.7;
|
|
8057
8793
|
readonly "light:inverse-muted/inverse-bg": 11.26;
|
|
8058
8794
|
readonly "light:inverse-accent-ink/inverse-accent": 13.71;
|
|
@@ -8061,13 +8797,22 @@ declare const SPEC_CONTRAST: {
|
|
|
8061
8797
|
readonly "light:danger/danger-bg": 5.01;
|
|
8062
8798
|
readonly "light:accent-ink/accent-hover": 7.72;
|
|
8063
8799
|
readonly "light:text-muted/surface-2": 7.52;
|
|
8064
|
-
readonly "
|
|
8800
|
+
readonly "light:text/surface-2": 13.71;
|
|
8801
|
+
readonly "light:accent-text/surface": 6.51;
|
|
8802
|
+
readonly "light:accent-text/surface-2": 4.51;
|
|
8803
|
+
readonly "light:inverse-text/inverse-surface": 15.74;
|
|
8804
|
+
readonly "light:inverse-muted/inverse-surface": 9.49;
|
|
8805
|
+
readonly "light:inverse-accent/inverse-surface": 11.54;
|
|
8806
|
+
readonly "light:line-strong/bg": 18.7;
|
|
8807
|
+
readonly "light:line-strong/surface": 19.8;
|
|
8808
|
+
readonly "light:line-strong/surface-2": 13.71;
|
|
8809
|
+
readonly "dark:text/bg": 17.18;
|
|
8065
8810
|
readonly "dark:text/surface": 15.24;
|
|
8066
|
-
readonly "dark:text-muted/bg": 9.
|
|
8811
|
+
readonly "dark:text-muted/bg": 9.94;
|
|
8067
8812
|
readonly "dark:text-muted/surface": 8.82;
|
|
8068
8813
|
readonly "dark:accent-ink/accent": 7.72;
|
|
8069
|
-
readonly "dark:accent-text/bg": 8.
|
|
8070
|
-
readonly "dark:inverse-text/inverse-bg": 18.
|
|
8814
|
+
readonly "dark:accent-text/bg": 8.15;
|
|
8815
|
+
readonly "dark:inverse-text/inverse-bg": 18.74;
|
|
8071
8816
|
readonly "dark:inverse-muted/inverse-bg": 10.26;
|
|
8072
8817
|
readonly "dark:inverse-accent-ink/inverse-accent": 5.92;
|
|
8073
8818
|
readonly "dark:inverse-accent/inverse-bg": 5.59;
|
|
@@ -8075,6 +8820,15 @@ declare const SPEC_CONTRAST: {
|
|
|
8075
8820
|
readonly "dark:danger/danger-bg": 7;
|
|
8076
8821
|
readonly "dark:accent-ink/accent-hover": 9.2;
|
|
8077
8822
|
readonly "dark:text-muted/surface-2": 7.59;
|
|
8823
|
+
readonly "dark:text/surface-2": 13.12;
|
|
8824
|
+
readonly "dark:accent-text/surface": 7.23;
|
|
8825
|
+
readonly "dark:accent-text/surface-2": 6.23;
|
|
8826
|
+
readonly "dark:inverse-text/inverse-surface": 19.85;
|
|
8827
|
+
readonly "dark:inverse-muted/inverse-surface": 10.86;
|
|
8828
|
+
readonly "dark:inverse-accent/inverse-surface": 5.92;
|
|
8829
|
+
readonly "dark:line-strong/bg": 17.18;
|
|
8830
|
+
readonly "dark:line-strong/surface": 15.24;
|
|
8831
|
+
readonly "dark:line-strong/surface-2": 13.12;
|
|
8078
8832
|
};
|
|
8079
8833
|
};
|
|
8080
8834
|
declare const SPEC_TIER_IDS: readonly ["semantic", "component"];
|
|
@@ -8113,6 +8867,11 @@ type ShapeId = keyof typeof SPEC_AXES.shapes;
|
|
|
8113
8867
|
type DensityId = keyof typeof SPEC_AXES.densities;
|
|
8114
8868
|
type MotionId = keyof typeof SPEC_AXES.motions;
|
|
8115
8869
|
type DesignMode = (typeof SPEC_AXES.modes)[number];
|
|
8870
|
+
/** Background tint (DS9): Neutral keeps the look's own palette; Subtle / Rich tint its neutrals with the brand. */
|
|
8871
|
+
type TintId = keyof typeof SPEC_AXES.tints;
|
|
8872
|
+
declare const TINT_IDS: ReadonlyArray<TintId>;
|
|
8873
|
+
/** What a studio that stored its look BEFORE the tint existed wears: exactly the look's own palette. */
|
|
8874
|
+
declare const PRE_TINT_DEFAULT: TintId;
|
|
8116
8875
|
type SchemeId = keyof typeof SPEC_SCHEMES;
|
|
8117
8876
|
type FontRoleToken = (typeof SPEC_FONT_ROLES)[number]['token'];
|
|
8118
8877
|
/** Everything a studio chose about its look — the `settings.design` row, typed. */
|
|
@@ -8125,6 +8884,9 @@ interface DesignChoices {
|
|
|
8125
8884
|
motion: MotionId;
|
|
8126
8885
|
pillButtons: boolean;
|
|
8127
8886
|
mode: DesignMode;
|
|
8887
|
+
/** Absent = the pack's default (`defaults.tint`). `readDesignConfig` reads a row stored before DS9 as
|
|
8888
|
+
* `neutral` — the palette it was applied with. */
|
|
8889
|
+
tint?: TintId;
|
|
8128
8890
|
fonts?: Partial<Record<FontRoleToken, string>>;
|
|
8129
8891
|
}
|
|
8130
8892
|
interface FlavorSpecToken {
|
|
@@ -8143,6 +8905,17 @@ interface FontPair {
|
|
|
8143
8905
|
readonly tokens: Readonly<Record<string, string>>;
|
|
8144
8906
|
readonly families: ReadonlyArray<string>;
|
|
8145
8907
|
}
|
|
8908
|
+
/** A flavor's own colour palette (the Neutral tint): every colour token, light + the dark values that differ. */
|
|
8909
|
+
interface FlavorPalette {
|
|
8910
|
+
readonly light: Readonly<Record<string, string>>;
|
|
8911
|
+
readonly dark: Readonly<Record<string, string>>;
|
|
8912
|
+
}
|
|
8913
|
+
/** How a flavor takes the brand's tint: which neutral roles, how strongly, and its tinted paints. */
|
|
8914
|
+
interface FlavorTintConfig {
|
|
8915
|
+
readonly scale: number;
|
|
8916
|
+
readonly roles: ReadonlyArray<string>;
|
|
8917
|
+
readonly paints?: ReadonlyArray<string>;
|
|
8918
|
+
}
|
|
8146
8919
|
/** A flavor exactly as the spec writes it. */
|
|
8147
8920
|
interface FlavorPackV2 {
|
|
8148
8921
|
readonly id: string;
|
|
@@ -8158,10 +8931,18 @@ interface FlavorPackV2 {
|
|
|
8158
8931
|
readonly motion: MotionId;
|
|
8159
8932
|
readonly pillButtons: boolean;
|
|
8160
8933
|
readonly mode: DesignMode;
|
|
8934
|
+
readonly tint: TintId;
|
|
8161
8935
|
};
|
|
8162
8936
|
readonly seed: string;
|
|
8163
8937
|
readonly seeds: ReadonlyArray<string>;
|
|
8164
8938
|
readonly pairs: ReadonlyArray<FontPair>;
|
|
8939
|
+
readonly palette: FlavorPalette;
|
|
8940
|
+
readonly tint: FlavorTintConfig;
|
|
8941
|
+
/** What the contract wrote before DS9 for the rows DS9 changed at the Neutral tint (`legacyFlavorTokens`). */
|
|
8942
|
+
readonly legacy: Readonly<Record<string, {
|
|
8943
|
+
readonly value: string;
|
|
8944
|
+
readonly dark?: string;
|
|
8945
|
+
}>>;
|
|
8165
8946
|
readonly tokens: ReadonlyArray<FlavorSpecToken>;
|
|
8166
8947
|
}
|
|
8167
8948
|
/** The spec's flavors, typed. Assignment here is the compile-time proof that the generated
|
|
@@ -8243,12 +9024,20 @@ type ResolvedMode = Exclude<DesignMode, 'auto'>;
|
|
|
8243
9024
|
/** Every token's ROOT value in one mode, with `var(--iox-…)` references resolved against the same
|
|
8244
9025
|
* set (recursively; a reference cycle or an unknown token is left as written). */
|
|
8245
9026
|
declare function resolveTokenValues(tokens: ReadonlyArray<DesignTokenLike> | null | undefined, mode?: ResolvedMode): Record<string, string>;
|
|
9027
|
+
/**
|
|
9028
|
+
* Every token's value INSIDE a section wearing `schemeId`, in one mode — what CSS computes there: the
|
|
9029
|
+
* scheme's overrides (`{{token}}` / `{{~token}}` placeholders substituted from the root), every other
|
|
9030
|
+
* row as declared, and `var()` references resolved within the section (the §3c re-declaration rule
|
|
9031
|
+
* makes that the section's own resolution). `default` (or an unknown id) is the root.
|
|
9032
|
+
*/
|
|
9033
|
+
declare function resolveSchemeTokenValues(tokens: ReadonlyArray<DesignTokenLike> | null | undefined, mode: ResolvedMode, schemeId: string): Record<string, string>;
|
|
8246
9034
|
/**
|
|
8247
9035
|
* `value` with every `var(--iox-…)` replaced by that token's resolved root value in `mode` — what
|
|
8248
9036
|
* the Style panel's Detach writes, so the node keeps exactly what it showed as a literal. An unknown
|
|
8249
9037
|
* token falls back to its declared fallback, else stays as written.
|
|
8250
9038
|
*/
|
|
8251
9039
|
declare function resolveTokenReferences(value: string, tokens: ReadonlyArray<DesignTokenLike> | null | undefined, mode?: ResolvedMode): string;
|
|
9040
|
+
type ResolvedValues = Readonly<Record<string, string>>;
|
|
8252
9041
|
/**
|
|
8253
9042
|
* Section colour schemes (design-system plan §3c). Two rules, both about WHERE a custom property
|
|
8254
9043
|
* resolves:
|
|
@@ -8262,7 +9051,7 @@ declare function resolveTokenReferences(value: string, tokens: ReadonlyArray<Des
|
|
|
8262
9051
|
* and CSS makes both invalid. The contract writes `{{accent}}` instead — the token's ROOT value,
|
|
8263
9052
|
* resolved here at compile time (and again from dark values for the dark twin).
|
|
8264
9053
|
*/
|
|
8265
|
-
declare function compileSchemeCss(tokens: ReadonlyArray<DesignTokenLike> | null | undefined, scope?: string): string;
|
|
9054
|
+
declare function compileSchemeCss(tokens: ReadonlyArray<DesignTokenLike> | null | undefined, scope?: string, opposite?: ResolvedValues): string;
|
|
8266
9055
|
/** The token CSS as the two halves a renderer places around its node rules. */
|
|
8267
9056
|
declare function compileTokenCssBlocks(tokens: ReadonlyArray<DesignTokenLike> | null | undefined, opts?: TokenCssOptions): TokenCssBlocks;
|
|
8268
9057
|
/** One stylesheet string: base → schemes → reduced motion → reduced transparency → dark LAST. */
|
|
@@ -8672,6 +9461,9 @@ declare function parseHexColor(hex: string): Rgb | null;
|
|
|
8672
9461
|
declare function toHexColor(c: Rgb): string;
|
|
8673
9462
|
declare function rgbToOklab(c: Rgb): OkLab;
|
|
8674
9463
|
declare function oklabToRgb(c: OkLab): Rgb;
|
|
9464
|
+
declare const inSrgbGamut: (c: Rgb) => boolean;
|
|
9465
|
+
/** The OKLab colour at (L, hue, chroma), chroma reduced until it fits sRGB. */
|
|
9466
|
+
declare function atLightness(L: number, hueA: number, hueB: number, chroma: number): Rgb;
|
|
8675
9467
|
declare function relativeLuminance(c: Rgb): number;
|
|
8676
9468
|
/** WCAG 2 contrast ratio between two colours (order-independent), 1..21. */
|
|
8677
9469
|
declare function wcagContrastRatio(a: string | Rgb, b: string | Rgb): number;
|
|
@@ -8697,13 +9489,16 @@ declare function deriveBrandTokens(seed: string, pack: Pick<FlavorPack, 'accentH
|
|
|
8697
9489
|
declare const WCAG_AA_TEXT = 4.5;
|
|
8698
9490
|
declare const ACCENT_TOKEN_NAMES: readonly ["accent", "accent-ink", "accent-hover", "accent-text", "inverse-accent", "inverse-accent-ink"];
|
|
8699
9491
|
type AccentTokenName = (typeof ACCENT_TOKEN_NAMES)[number];
|
|
9492
|
+
/** One ground, or every ground the accent must read on (DS9: the bg, the surfaces a scheme or a
|
|
9493
|
+
* container puts under the same text, the page's own paint) — the FIRST decides direction. */
|
|
9494
|
+
type AccentGround = string | ReadonlyArray<string>;
|
|
8700
9495
|
/** The backgrounds the accent must read on, light and (optionally) dark. Without an inverse
|
|
8701
9496
|
* background the inverse pair is not derived — the pack's own stays. */
|
|
8702
9497
|
interface AccentBackgrounds {
|
|
8703
|
-
bg:
|
|
8704
|
-
bgDark?:
|
|
8705
|
-
inverseBg?:
|
|
8706
|
-
inverseBgDark?:
|
|
9498
|
+
bg: AccentGround;
|
|
9499
|
+
bgDark?: AccentGround;
|
|
9500
|
+
inverseBg?: AccentGround;
|
|
9501
|
+
inverseBgDark?: AccentGround;
|
|
8707
9502
|
}
|
|
8708
9503
|
/**
|
|
8709
9504
|
* The quartet a seed different from the pack's own becomes, built ON `deriveBrandTokens` (its
|
|
@@ -8725,6 +9520,155 @@ interface AccentBackgrounds {
|
|
|
8725
9520
|
*/
|
|
8726
9521
|
declare function deriveAccentTokens(seed: string, against: AccentBackgrounds, pack?: Pick<FlavorPack, 'accentHueDeg'>): FlavorTokenDef[];
|
|
8727
9522
|
|
|
9523
|
+
/**
|
|
9524
|
+
* What a token VALUE paints, as colours (design-system DS9): the evaluator the contrast audit and the
|
|
9525
|
+
* brand-tinted neutrals read a resolved CSS value with. It understands exactly the colour syntax the
|
|
9526
|
+
* contract writes — `#rgb`/`#rrggbb`, `rgb()`/`rgba()`, `transparent`, `currentColor`/`inherit`,
|
|
9527
|
+
* `color-mix(in srgb, A p%, B)` (premultiplied, as CSS mixes), and a gradient layer list (each stop
|
|
9528
|
+
* over the final plain layer: the page's paint shows every one of those to a reader somewhere).
|
|
9529
|
+
* Port of iox-ai-guidance `design-system/colour.mjs` — held equal by the derivation fixtures.
|
|
9530
|
+
*/
|
|
9531
|
+
interface Rgba extends Rgb {
|
|
9532
|
+
a: number;
|
|
9533
|
+
}
|
|
9534
|
+
/** Split on top-level commas (never inside parentheses). */
|
|
9535
|
+
declare function splitTopLevel(value: string, separator?: string): string[];
|
|
9536
|
+
/** `top` composited over an opaque `under`. */
|
|
9537
|
+
declare function compositeOver(top: Rgba, under: Rgb): Rgba;
|
|
9538
|
+
/** The 8-bit colour a screen shows — contrast is judged on WHAT SHIPS, as the derivation's grounds are. */
|
|
9539
|
+
declare const quantizeRgb: (c: Rgb) => Rgb;
|
|
9540
|
+
/** One CSS colour → RGBA, or null when it is not a colour this evaluator reads. `ink` = currentColor. */
|
|
9541
|
+
declare function parseCssColour(value: string | null | undefined, ink?: Rgba | null): Rgba | null;
|
|
9542
|
+
/**
|
|
9543
|
+
* A paint → every colour a reader can meet ON it: a plain colour is one; a gradient layer list is each
|
|
9544
|
+
* stop over the final plain layer, and that layer itself. The worst case is the one a check reads.
|
|
9545
|
+
*/
|
|
9546
|
+
declare function paintColours(value: string | null | undefined, ink?: Rgba | null): Rgba[];
|
|
9547
|
+
/** The outermost ring of a box-shadow list (`0 0 0 4px <colour>`) — a focus indicator's colour. */
|
|
9548
|
+
declare function ringColour(shadow: string | null | undefined, ink?: Rgba | null): Rgba | null;
|
|
9549
|
+
|
|
9550
|
+
/**
|
|
9551
|
+
* The whole colour system follows the brand (design-system DS9 — Doron, 2026-10-19: "I would imagine
|
|
9552
|
+
* that once I change the colour of the brand, the whole colour system changes, but it doesn't").
|
|
9553
|
+
*
|
|
9554
|
+
* One brand colour in → every colour token of the look out, light and dark:
|
|
9555
|
+
* - **Background tint** (`DesignChoices.tint`): Neutral is the look's own palette, untouched; Subtle and
|
|
9556
|
+
* Rich give every neutral role the flavor lists the BRAND's hue — the role keeps its own OKLab
|
|
9557
|
+
* lightness (so the look's light/dark structure and contrast survive) at the level's chroma (or its
|
|
9558
|
+
* own, when the flavor coloured it more), scaled by how chromatic the brand is: a grey brand tints
|
|
9559
|
+
* nothing. Material 3's neutral tonal palettes and Radix's tinted greys, as one table in the contract.
|
|
9560
|
+
* A pure-white page is capped just under white (the level's `groundMaxL`) so it can carry the tint; the flavor's paints rotate
|
|
9561
|
+
* with the brand (Glass's mesh); Midnight's glow already reads the accent.
|
|
9562
|
+
* - **Accents**: the flavor's own quartet at its own seed, else derived from the brand ramp — and
|
|
9563
|
+
* `accent-text` is the first step that reads on EVERY ground (bg, surface, surface-2, the page's paint).
|
|
9564
|
+
* - **Held pairs**: every text and line role is pushed until it clears its pair again on its grounds.
|
|
9565
|
+
* A no-op for the hand-tuned palette at its own seed — the generator's gate proves it.
|
|
9566
|
+
*
|
|
9567
|
+
* Port of iox-ai-guidance `design-system/colour.mjs` `flavorColours`; held equal to it by
|
|
9568
|
+
* `flavor-fixtures.v1.json` (brand-neutrals.spec.ts). Change the maths THERE first.
|
|
9569
|
+
*/
|
|
9570
|
+
/** A seed below this OKLCH chroma tints at a proportionally lower strength. */
|
|
9571
|
+
declare const TINT_FULL_CHROMA = 0.08;
|
|
9572
|
+
/** A neutral at least this chromatic was coloured on purpose: it keeps its hue offset from the flavor's seed. */
|
|
9573
|
+
declare const TINT_OWN_HUE_CHROMA = 0.01;
|
|
9574
|
+
/** A brand below this chroma has no reliable hue: paints and coloured neutrals are not turned toward it. */
|
|
9575
|
+
declare const TINT_TURN_CHROMA = 0.02;
|
|
9576
|
+
/** WCAG 1.4.11 — non-text contrast: UI boundaries, glyphs, focus indicators. */
|
|
9577
|
+
declare const WCAG_AA_UI = 3;
|
|
9578
|
+
/** The roles a derivation holds to their pair, on the grounds named (`page` = the page paint's colours). */
|
|
9579
|
+
declare const HELD_CONTRAST: ReadonlyArray<readonly [string, ReadonlyArray<string>, number]>;
|
|
9580
|
+
/** One tint level of the contract (`axes.tints`). */
|
|
9581
|
+
interface TintLevel {
|
|
9582
|
+
readonly label: string;
|
|
9583
|
+
readonly chroma?: Readonly<Record<string, number>>;
|
|
9584
|
+
readonly ownScale?: number;
|
|
9585
|
+
readonly paintChroma?: number;
|
|
9586
|
+
/** A pure-white page is capped just under white so it can carry any chroma (at L 1 only white exists). */
|
|
9587
|
+
readonly groundMaxL?: number;
|
|
9588
|
+
}
|
|
9589
|
+
declare const TINT_LEVELS: Readonly<Record<TintId, TintLevel>>;
|
|
9590
|
+
/** What the colour derivation reads of a flavor. */
|
|
9591
|
+
interface ColourFlavor {
|
|
9592
|
+
readonly seed: string;
|
|
9593
|
+
readonly palette: FlavorPalette;
|
|
9594
|
+
readonly tint: FlavorTintConfig;
|
|
9595
|
+
}
|
|
9596
|
+
/** Every colour token of a look: `[light, dark]` per name. */
|
|
9597
|
+
type FlavorColours = Record<string, [string, string]>;
|
|
9598
|
+
/** The lightest/darkest version of `fg` (its own hue and chroma) that clears `min` on every ground. */
|
|
9599
|
+
declare function ensureContrast(fg: string, bgs: ReadonlyArray<string>, min: number): string;
|
|
9600
|
+
/** A translucent `fg` (rgba) made just opaque enough to clear `min` on every ground, in 0.01 steps. */
|
|
9601
|
+
declare function ensureAlpha(fg: string, bgs: ReadonlyArray<string>, min: number): string;
|
|
9602
|
+
/** The colour at (L, hue angle) with the most chroma ≤ `chroma` that fits sRGB (a tint never overshoots its
|
|
9603
|
+
* level, and a stronger level never lands under a weaker one — `atLightness`'s ×0.82 steps can). */
|
|
9604
|
+
declare function atLightnessMaxChroma(L: number, hue: number, chroma: number): Rgb;
|
|
9605
|
+
/**
|
|
9606
|
+
* The colour tokens of a flavor for a brand `seed` and a background `tint`, light and dark.
|
|
9607
|
+
* Neutral at the flavor's own seed returns its palette exactly.
|
|
9608
|
+
*/
|
|
9609
|
+
declare function flavorColours(flavor: ColourFlavor, choices: {
|
|
9610
|
+
seed?: string | null;
|
|
9611
|
+
tint?: TintId | null;
|
|
9612
|
+
}): FlavorColours;
|
|
9613
|
+
/** The grounds the PRE-DS9 accent derivation read: `bg` alone (light/dark), `inverse-bg` alone. */
|
|
9614
|
+
declare function preTintAccentGrounds(palette: FlavorPalette): {
|
|
9615
|
+
bg: AccentGround;
|
|
9616
|
+
bgDark?: AccentGround;
|
|
9617
|
+
inverseBg?: AccentGround;
|
|
9618
|
+
inverseBgDark?: AccentGround;
|
|
9619
|
+
};
|
|
9620
|
+
|
|
9621
|
+
/**
|
|
9622
|
+
* The contrast AUDIT (design-system DS9). The contract's token pairs were all AA and Doron still found a
|
|
9623
|
+
* button whose icon was "almost hard to see": the failures live in the PAIRINGS element styles make — an
|
|
9624
|
+
* Icon dropped into a Primary button painted `icon-color` (accent-text) on the accent fill, 1:1 in a Brand
|
|
9625
|
+
* section. So this resolves what each element style actually paints, the way CSS resolves it:
|
|
9626
|
+
*
|
|
9627
|
+
* - in every section scheme (`resolveSchemeTokenValues`), directly on the section and inside every
|
|
9628
|
+
* container style (Card, Panel, Navigation bar, Dialog);
|
|
9629
|
+
* - `inherit` → the container's ink, a transparent fill → what is under it, translucent fills composited,
|
|
9630
|
+
* a gradient ground (Glass's mesh, Midnight's glow) checked at its worst stop;
|
|
9631
|
+
* - base and hover; a button's icon read through the contract's `inkScopes` (it takes the button's ink),
|
|
9632
|
+
* its focus ring; the form parts the field baseline paints (`contrastAudit.formParts`).
|
|
9633
|
+
*
|
|
9634
|
+
* WCAG 2: 4.5:1 for text, 3:1 for glyphs, UI boundaries and focus indicators (1.4.11), judged on 8-bit
|
|
9635
|
+
* colours. The same audit gates the contract (`colour.mjs auditContrast`, every flavor × tint × a seed
|
|
9636
|
+
* sweep) and `contrast-audit.spec.ts` sweeps it here, so no pack or brand can regress.
|
|
9637
|
+
*/
|
|
9638
|
+
interface ContrastFinding {
|
|
9639
|
+
scheme: string;
|
|
9640
|
+
/** `section`, or the container style the element sits in. */
|
|
9641
|
+
container: string;
|
|
9642
|
+
element: string;
|
|
9643
|
+
part: string;
|
|
9644
|
+
fg: string;
|
|
9645
|
+
bg: string;
|
|
9646
|
+
ratio: number;
|
|
9647
|
+
min: number;
|
|
9648
|
+
pass: boolean;
|
|
9649
|
+
}
|
|
9650
|
+
/** Every pair a reader meets, for one set of token rows in one mode. */
|
|
9651
|
+
declare function auditDesignContrast(rows: ReadonlyArray<DesignTokenLike>, mode: ResolvedMode): ContrastFinding[];
|
|
9652
|
+
/** The pairs the Design ▸ Colour tab lists for the CURRENT brand (Board 6 + DS9): what a filled button
|
|
9653
|
+
* shows, and the link on every section scheme — each the worst case on the section itself. */
|
|
9654
|
+
declare enum ColourCheckId {
|
|
9655
|
+
ButtonLabel = "button-label",
|
|
9656
|
+
ButtonIcon = "button-icon",
|
|
9657
|
+
Link = "link"
|
|
9658
|
+
}
|
|
9659
|
+
interface ColourCheck {
|
|
9660
|
+
id: ColourCheckId;
|
|
9661
|
+
/** The section scheme the pair sits in (`default` for the button). */
|
|
9662
|
+
scheme: string;
|
|
9663
|
+
fg: string;
|
|
9664
|
+
bg: string;
|
|
9665
|
+
ratio: number;
|
|
9666
|
+
min: number;
|
|
9667
|
+
passes: boolean;
|
|
9668
|
+
}
|
|
9669
|
+
/** The Colour tab's brand rows, from one audit of the rows the canvas wears. */
|
|
9670
|
+
declare function colourTabChecks(rows: ReadonlyArray<DesignTokenLike>, mode: ResolvedMode): ColourCheck[];
|
|
9671
|
+
|
|
8728
9672
|
/** The pack's own defaults as a full set of choices — what Apply means with nothing changed. */
|
|
8729
9673
|
declare function defaultDesignChoices(pack: FlavorPackV2): DesignChoices;
|
|
8730
9674
|
/**
|
|
@@ -8736,6 +9680,13 @@ declare function defaultDesignChoices(pack: FlavorPackV2): DesignChoices;
|
|
|
8736
9680
|
*/
|
|
8737
9681
|
declare function userFontStack(family: string, packStack?: string | null): string;
|
|
8738
9682
|
declare function buildFlavorTokens(pack: FlavorPackV2, choices: DesignChoices): DesignTokenRow[];
|
|
9683
|
+
/**
|
|
9684
|
+
* What the contract wrote for `choices` BEFORE DS9 — the baseline a studio that applied its look before
|
|
9685
|
+
* the tint existed is judged against (`designBaseline`, `designTokenRepairs`): the look's own palette, the
|
|
9686
|
+
* rows DS9 changed at their old values (`pack.legacy`), and a seed ≠ the pack's own re-deriving the accent
|
|
9687
|
+
* set against `bg` alone, as `deriveAccentTokens` was called then. No held pairs, no tint.
|
|
9688
|
+
*/
|
|
9689
|
+
declare function legacyFlavorTokens(pack: FlavorPackV2, choices: DesignChoices): DesignTokenRow[];
|
|
8739
9690
|
|
|
8740
9691
|
/** One row's fate in a seed/re-seed pass (the §10 C2 merge semantics). */
|
|
8741
9692
|
interface FlavorSeedPlan {
|
|
@@ -9094,6 +10045,7 @@ declare enum DesignConfigKey {
|
|
|
9094
10045
|
Motion = "motion",
|
|
9095
10046
|
PillButtons = "pillButtons",
|
|
9096
10047
|
Mode = "mode",
|
|
10048
|
+
Tint = "tint",
|
|
9097
10049
|
Fonts = "fonts",
|
|
9098
10050
|
Revert = "revert"
|
|
9099
10051
|
}
|
|
@@ -9126,7 +10078,11 @@ declare function packDesignChoices(flavorId: string): DesignChoices;
|
|
|
9126
10078
|
* author chose survives a pack switch unless the author changes it). Both picker homes call this.
|
|
9127
10079
|
*/
|
|
9128
10080
|
declare function choicesForPack(flavorId: string, applied: DesignChoices | null | undefined): DesignChoices;
|
|
9129
|
-
/**
|
|
10081
|
+
/**
|
|
10082
|
+
* A stored `settings.design` config → the resolved design. No row (or no config) → Crisp's defaults. A
|
|
10083
|
+
* row stored before DS9 has no `tint`: it was applied with the look's own palette, so it reads `neutral`
|
|
10084
|
+
* (never the pack's new default — the studio's rows hold the palette, and nothing may repaint them unasked).
|
|
10085
|
+
*/
|
|
9130
10086
|
declare function readDesignConfig(config: ReadonlyArray<DesignConfigEntry> | null | undefined, hasRow?: boolean): StoredDesign;
|
|
9131
10087
|
/** The colour mode a stored config compiles in — what the public page read hands the engine. */
|
|
9132
10088
|
declare function designModeOf(config: ReadonlyArray<DesignConfigEntry> | null | undefined): DesignMode;
|
|
@@ -9137,6 +10093,9 @@ declare function sameDesignChoices(a: DesignChoices, b: DesignChoices): boolean;
|
|
|
9137
10093
|
|
|
9138
10094
|
/** Every row a design writes — `buildFlavorTokens` for its pack. Empty for an unknown pack. */
|
|
9139
10095
|
declare function designTokenRows(choices: DesignChoices): DesignTokenRow[];
|
|
10096
|
+
/** What a design wrote BEFORE DS9 (the look's own palette, the rows DS9 changed at their old values, the
|
|
10097
|
+
* accent derived against `bg` alone) — empty for an unknown pack. */
|
|
10098
|
+
declare function legacyDesignTokenRows(choices: DesignChoices): DesignTokenRow[];
|
|
9140
10099
|
/**
|
|
9141
10100
|
* What the PREVIOUS design wrote, as a baseline keyed by the row's own stamp: a row Swiss stamped is
|
|
9142
10101
|
* judged against what Swiss wrote, every other row against `buildFlavorTokens` of the stored choices
|
|
@@ -9177,15 +10136,18 @@ declare function missingDesignRows(existing: ReadonlyArray<{
|
|
|
9177
10136
|
/**
|
|
9178
10137
|
* The builder-load REPAIR (DS4.1): rows the design writes that are the machine's and nobody touched,
|
|
9179
10138
|
* yet hold something other than the design's value, are rewritten — so an org heals on its next load
|
|
9180
|
-
* with no author action.
|
|
10139
|
+
* with no author action. Three shapes:
|
|
9181
10140
|
* - stamped by the current pack, light value exactly the pack's, dark half not: iox-cms dropped
|
|
9182
10141
|
* `values.dark` on every write from F0 to DS4 (`values` was an implicit relation), and a revert could
|
|
9183
10142
|
* leave the previous apply's dark behind;
|
|
9184
10143
|
* - stamped by a v2 pack and still holding what THAT pack writes at its own defaults (its dark half
|
|
9185
10144
|
* possibly lost the same way) while the stored design says otherwise: an apply that judged the row
|
|
9186
10145
|
* edited (before 5.24.0, a lost dark half did) left it on the default — the six brand rows of a studio
|
|
9187
|
-
* whose brand colour never reached its accent
|
|
9188
|
-
*
|
|
10146
|
+
* whose brand colour never reached its accent;
|
|
10147
|
+
* - stamped by the current pack and still holding what the design wrote BEFORE DS9
|
|
10148
|
+
* (`legacyDesignTokenRows`): the contrast fixes — a 3:1 `line-strong`, a 3:1 focus ring, an
|
|
10149
|
+
* `accent-text` that reads on every ground — reach a studio that applied its look before them.
|
|
10150
|
+
* No author edit produces any of these shapes — the Tokens panel edited the light value only, and since DS8 an
|
|
9189
10151
|
* edit makes the row `source: user`, which this never touches.
|
|
9190
10152
|
*/
|
|
9191
10153
|
declare function designTokenRepairs(existing: ReadonlyArray<StoredDesignTokenRow>, choices: DesignChoices): FlavorSeedPlan['update'];
|
|
@@ -9231,5 +10193,5 @@ interface FontFamilyRemoval {
|
|
|
9231
10193
|
*/
|
|
9232
10194
|
declare function planFontFamilyRemoval(existing: ReadonlyArray<StoredDesignTokenRow>, previous: StoredDesign, family: string): FontFamilyRemoval;
|
|
9233
10195
|
|
|
9234
|
-
export { ACCENT_TOKEN_NAMES, AdoptOutcome, AdoptSkipReason, BUTTON_VARIANT_TO_STYLE, COLOR_SCHEMES, COLOR_SCHEME_TRAIT, COLOR_SCHEME_TYPES, ColorScheme, DEFAULT_FLAVOR_ID, DESIGN_TOKEN_GROUPS, DESIGN_TOKEN_TIERS, DESIGN_TOKEN_TYPES, DesignConfigKey, ELEMENT_STYLES, ELEMENT_STYLE_MARKER_CLASS, ELEMENT_STYLE_STATES, EMPTY_IMAGE_ATTRIBUTE, EMPTY_IMAGE_SRC, ElementStyleState, FLAVOR_SPEC_VERSION, FONT_CATALOG, FONT_FAMILY_TOKENS, FONT_FILE_ACCEPT, FONT_FILE_EXTENSIONS, FONT_FILE_FORMATS, FONT_STYLES, FONT_WEIGHTS, FontUploadError, GOOGLE_FONTS_CSS_ORIGIN, GOOGLE_FONTS_FILE_ORIGIN, MAX_FONT_FILE_BYTES, NEW_NODE_STYLE_DEFAULTS, OwnedTraitLink, PALETTE_PRESETS, PRE_DS2_FLAVOR_DEFAULTS, REDUCED_MOTION_OVERRIDES, REDUCED_TRANSPARENCY_OVERRIDES, REVERT_WINDOW_MS, SPEC_A11Y, SPEC_AXES, SPEC_BUTTON_VARIANT_TO_STYLE, SPEC_CONTRAST, SPEC_DEFAULT_ELEMENT_STYLE, SPEC_ELEMENT_STYLES, SPEC_FIELD_CLASS_BASELINE, SPEC_FLAVORS, SPEC_FLAVOR_PACKS, SPEC_FONTS, SPEC_FONT_ROLES, SPEC_LEGACY_ALIASES, SPEC_PALETTE_PRESETS, SPEC_SCHEMES, SPEC_SPRINGS, SPEC_TIERS, SPEC_TIER_IDS, SPEC_TOKEN_TYPES, SUPERSEDED_STYLE_VALUES, SWISS_FLAVOR, USER_TOKEN_SOURCE, WCAG_AA_TEXT, adoptElementStyles, adoptionStyleFor, apcaLc, applyElementStyle, applyHeadingLevelRule, buildFlavorTokens, buildFontFaceCss, catalogFontId, checkFontWeight, choicesForPack, colorSchemeClass, colorSchemeOf, compareFontWeights, compileSchemeCss, compileTokenCss, compileTokenCssBlocks, cssString, defaultDesignChoices, defaultElementStyleFor, deriveAccentTokens, deriveBrandTokens, designBaseline, designConfigEntries, designModeOf, designTokenRepairs, designTokenRows, elementStyleById, elementStyleClass, elementStylesFor, emptyImageLabelSrc, emptyImagePlaceholder, emptyImageSrc, flavorPackById, flavorSeedWrites, flavorSourceStamp, fontFamilyKey, fontFileName, fontFileStem, fontFormatOf, fontPreloads, fontRoleReferences, fontStackWithout, fontWeightCovers, fontWeightRange, fontWeightValue, fontsForTokens, formatFontFamilies, formatFontFamily, formatFontWeight, googleFontHref, groupFontFamilies, hasElementStyleMarker, isDesignTokenGroup, isDesignTokenTier, isDesignTokenType, isFontWeightRange, isRetiredFlavorId, legacyRuleTokenReferences, matchFontWeight, missingDesignRows, missingFontRoles, nodeDesignClasses, normalizeFontStyle, normalizeFontWeight, normalizeFontWeightValue, oklabToRgb, ownedTraitStatus, ownedTraitsOf, packDesignChoices, parseFontFamilies, parseFontWeight, parseHexColor, planDesignApply, planDesignRevert, planFlavorRevert, planFlavorSeed, planFontFamilyRemoval, planSwissMigration, previewElementStyleAdoption, previewFontWeight, readDesignConfig, readOwnedTrait, relativeLuminance, resolveDesignChoices, resolveTokenReferences, resolveTokenValues, revertAvailable, rgbToOklab, sameDesignChoices, specTokenNames, springToLinear, stackNamesFamily, styleKeyToKebab, switchElementStyle, syncNodeDesignClasses, toHexColor, tokenReferences, tokensToDarkVarMap, tokensToVarMap, unknownTokenReferences, untouchedSeedRow, userFontStack, validateFlavorPack, wcagContrastRatio, writeOwnedTrait };
|
|
9235
|
-
export type { AccentBackgrounds, AccentTokenName, AdoptContext, AdoptReport, AdoptableNode, AdoptedNode, ApplyElementStyleResult, DensityId, DesignApplyOptions, DesignChoices, DesignClassSource, DesignConfigEntry, DesignMode, DesignTokenGroup, DesignTokenLike, DesignTokenRow, DesignTokenTier, DesignTokenType, ElementStyle, ElementStyleTarget, ElementStyleTraitLike, FlavorPack, FlavorPackV2, FlavorRevertPlan, FlavorRevertSnapshot, FlavorRevertWrite, FlavorSeedOptions, FlavorSeedPlan, FlavorSpecToken, FlavorTokenDef, FontDescriptor, FontFamilyGroup, FontFamilyRemoval, FontFamilyToken, FontFormat, FontPair, FontRoleToken, FontStyle, FontWeight, FontWeightRange, FontsForTokensOptions, KeptEdit, LinearSpring, MissingFontRole, MotionId, OkLab, OwnedTrait, OwnedTraitStatus, PalettePreset, ResolvedMode, Rgb, SchemeId, SeedBaseline, SeedExpectation, ShapeId, SkippedNode, StoredDesign, StoredDesignTokenRow, SupersededStyleValue, SwissMigration, SwitchElementStyleResult, TokenCssBlocks, TokenCssOptions };
|
|
10196
|
+
export { ACCENT_TOKEN_NAMES, AdoptOutcome, AdoptSkipReason, BUTTON_VARIANT_TO_STYLE, COLOR_SCHEMES, COLOR_SCHEME_TRAIT, COLOR_SCHEME_TYPES, ColorScheme, ColourCheckId, DEFAULT_FLAVOR_ID, DESIGN_TOKEN_GROUPS, DESIGN_TOKEN_TIERS, DESIGN_TOKEN_TYPES, DesignConfigKey, ELEMENT_STYLES, ELEMENT_STYLE_MARKER_CLASS, ELEMENT_STYLE_STATES, EMPTY_IMAGE_ATTRIBUTE, EMPTY_IMAGE_SRC, ElementStyleState, FLAVOR_SPEC_VERSION, FONT_CATALOG, FONT_FAMILY_TOKENS, FONT_FILE_ACCEPT, FONT_FILE_EXTENSIONS, FONT_FILE_FORMATS, FONT_STYLES, FONT_WEIGHTS, FontUploadError, GOOGLE_FONTS_CSS_ORIGIN, GOOGLE_FONTS_FILE_ORIGIN, HELD_CONTRAST, MAX_FONT_FILE_BYTES, NEW_NODE_STYLE_DEFAULTS, OwnedTraitLink, PALETTE_PRESETS, PRE_DS2_FLAVOR_DEFAULTS, PRE_TINT_DEFAULT, REDUCED_MOTION_OVERRIDES, REDUCED_TRANSPARENCY_OVERRIDES, REVERT_WINDOW_MS, SPEC_A11Y, SPEC_AXES, SPEC_BUTTON_VARIANT_TO_STYLE, SPEC_CONTRAST, SPEC_CONTRAST_AUDIT, SPEC_DEFAULT_ELEMENT_STYLE, SPEC_ELEMENT_STYLES, SPEC_FIELD_CLASS_BASELINE, SPEC_FLAVORS, SPEC_FLAVOR_PACKS, SPEC_FONTS, SPEC_FONT_ROLES, SPEC_INK_SCOPES, SPEC_LEGACY_ALIASES, SPEC_PALETTE_PRESETS, SPEC_SCHEMES, SPEC_SPRINGS, SPEC_TIERS, SPEC_TIER_IDS, SPEC_TOKEN_TYPES, SUPERSEDED_STYLE_VALUES, SWISS_FLAVOR, TINT_FULL_CHROMA, TINT_IDS, TINT_LEVELS, TINT_OWN_HUE_CHROMA, TINT_TURN_CHROMA, USER_TOKEN_SOURCE, WCAG_AA_TEXT, WCAG_AA_UI, adoptElementStyles, adoptionStyleFor, apcaLc, applyElementStyle, applyHeadingLevelRule, atLightness, atLightnessMaxChroma, auditDesignContrast, buildFlavorTokens, buildFontFaceCss, catalogFontId, checkFontWeight, choicesForPack, colorSchemeClass, colorSchemeOf, colourTabChecks, compareFontWeights, compileSchemeCss, compileTokenCss, compileTokenCssBlocks, compositeOver, cssString, defaultDesignChoices, defaultElementStyleFor, deriveAccentTokens, deriveBrandTokens, designBaseline, designConfigEntries, designModeOf, designTokenRepairs, designTokenRows, elementStyleById, elementStyleClass, elementStylesFor, emptyImageLabelSrc, emptyImagePlaceholder, emptyImageSrc, ensureAlpha, ensureContrast, flavorColours, flavorPackById, flavorSeedWrites, flavorSourceStamp, fontFamilyKey, fontFileName, fontFileStem, fontFormatOf, fontPreloads, fontRoleReferences, fontStackWithout, fontWeightCovers, fontWeightRange, fontWeightValue, fontsForTokens, formatFontFamilies, formatFontFamily, formatFontWeight, googleFontHref, groupFontFamilies, hasElementStyleMarker, inSrgbGamut, isDesignTokenGroup, isDesignTokenTier, isDesignTokenType, isFontWeightRange, isRetiredFlavorId, legacyDesignTokenRows, legacyFlavorTokens, legacyRuleTokenReferences, matchFontWeight, missingDesignRows, missingFontRoles, nodeDesignClasses, normalizeFontStyle, normalizeFontWeight, normalizeFontWeightValue, oklabToRgb, ownedTraitStatus, ownedTraitsOf, packDesignChoices, paintColours, parseCssColour, parseFontFamilies, parseFontWeight, parseHexColor, planDesignApply, planDesignRevert, planFlavorRevert, planFlavorSeed, planFontFamilyRemoval, planSwissMigration, preTintAccentGrounds, previewElementStyleAdoption, previewFontWeight, quantizeRgb, readDesignConfig, readOwnedTrait, relativeLuminance, resolveDesignChoices, resolveSchemeTokenValues, resolveTokenReferences, resolveTokenValues, revertAvailable, rgbToOklab, ringColour, sameDesignChoices, specTokenNames, splitTopLevel, springToLinear, stackNamesFamily, styleKeyToKebab, switchElementStyle, syncNodeDesignClasses, toHexColor, tokenReferences, tokensToDarkVarMap, tokensToVarMap, unknownTokenReferences, untouchedSeedRow, userFontStack, validateFlavorPack, wcagContrastRatio, writeOwnedTrait };
|
|
10197
|
+
export type { AccentBackgrounds, AccentGround, AccentTokenName, AdoptContext, AdoptReport, AdoptableNode, AdoptedNode, ApplyElementStyleResult, ColourCheck, ColourFlavor, ContrastFinding, DensityId, DesignApplyOptions, DesignChoices, DesignClassSource, DesignConfigEntry, DesignMode, DesignTokenGroup, DesignTokenLike, DesignTokenRow, DesignTokenTier, DesignTokenType, ElementStyle, ElementStyleTarget, ElementStyleTraitLike, FlavorColours, FlavorPack, FlavorPackV2, FlavorPalette, FlavorRevertPlan, FlavorRevertSnapshot, FlavorRevertWrite, FlavorSeedOptions, FlavorSeedPlan, FlavorSpecToken, FlavorTintConfig, FlavorTokenDef, FontDescriptor, FontFamilyGroup, FontFamilyRemoval, FontFamilyToken, FontFormat, FontPair, FontRoleToken, FontStyle, FontWeight, FontWeightRange, FontsForTokensOptions, KeptEdit, LinearSpring, MissingFontRole, MotionId, OkLab, OwnedTrait, OwnedTraitStatus, PalettePreset, ResolvedMode, Rgb, Rgba, SchemeId, SeedBaseline, SeedExpectation, ShapeId, SkippedNode, StoredDesign, StoredDesignTokenRow, SupersededStyleValue, SwissMigration, SwitchElementStyleResult, TintId, TintLevel, TokenCssBlocks, TokenCssOptions };
|