@adobe/spectrum-tokens 13.0.0-beta.47 → 13.0.0-beta.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/CHANGELOG.md +88 -0
  2. package/dist/json/drover.json +109 -9
  3. package/dist/json/variables.json +962 -171
  4. package/package.json +1 -1
  5. package/schemas/token-types/token.json +8 -1
  6. package/src/color-component.json +19 -1
  7. package/src/color-palette.json +61 -1
  8. package/src/layout-component.json +678 -30
  9. package/src/layout.json +30 -0
  10. package/src/typography.json +117 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,93 @@
1
1
  # @adobe/spectrum-tokens
2
2
 
3
+ ## 13.0.0-beta.48
4
+
5
+ ### Minor Changes
6
+
7
+ - [#415](https://github.com/adobe/spectrum-tokens/pull/415) [`caca973`](https://github.com/adobe/spectrum-tokens/commit/caca973300d34fc688fb828633b1da2ba8284990) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - 1. New typography tokens:
8
+
9
+ - Letter spacing, text-align, cjk
10
+
11
+ 1. New gradient stop tokens
12
+ 1. New component tokens for bar panel, rating, segmented control, slider, select box
13
+ 1. New static color tokens
14
+
15
+ _Tokens added (51):_
16
+
17
+ - `letter-spacing`
18
+ - `text-align-start`
19
+ - `text-align-center`
20
+ - `text-align-end`
21
+ - `body-size-xxs`
22
+ - `body-cjk-size-xxxl`
23
+ - `body-cjk-size-xxl`
24
+ - `body-cjk-size-xl`
25
+ - `body-cjk-size-l`
26
+ - `body-cjk-size-m`
27
+ - `body-cjk-size-s`
28
+ - `body-cjk-size-xs`
29
+ - `body-cjk-size-xxs`
30
+ - `gradient-stop-1-genai`
31
+ - `gradient-stop-2-genai`
32
+ - `gradient-stop-3-genai`
33
+ - `gradient-stop-1-premium`
34
+ - `gradient-stop-2-premium`
35
+ - `gradient-stop-3-premium`
36
+ - `bar-panel-width`
37
+ - `bar-panel-minimum-width`
38
+ - `bar-panel-maximum-width`
39
+ - `bar-panel-spacing-extra-spacious`
40
+ - `rating-top-to-content-area-small`
41
+ - `rating-bottom-to-content-area-small`
42
+ - `rating-edge-to-content-area-small`
43
+ - `rating-top-to-content-area-medium`
44
+ - `rating-bottom-to-content-area-medium`
45
+ - `rating-edge-to-content-area-medium`
46
+ - `rating-width-small`
47
+ - `rating-height-small`
48
+ - `rating-width-medium`
49
+ - `rating-height-medium`
50
+ - `segmented-control-selection-border-width`
51
+ - `slider-handle-precision-width`
52
+ - `slider-track-height-medium`
53
+ - `slider-track-height-large`
54
+ - `segmented-control-item-height`
55
+ - `static-blue-900`
56
+ - `static-blue-1000`
57
+ - `static-fuchsia-900`
58
+ - `static-fuchsia-1000`
59
+ - `static-indigo-900`
60
+ - `static-indigo-1000`
61
+ - `static-magenta-900`
62
+ - `static-magenta-1000`
63
+ - `static-red-900`
64
+ - `static-red-1000`
65
+ - `bar-panel-gripper-color`
66
+ - `bar-panel-gripper-color-drag`
67
+ - `select-box-selected-border-color`
68
+
69
+ _Token values updated (9):_
70
+
71
+ - `font-size-1200`
72
+ - `desktop`: `50px` -> `51px`
73
+ - `font-size-1300`
74
+ - `desktop`: `60px` -> `58px`
75
+ - `cjk-letter-spacing`: `0.05em` -> `letter-spacing`
76
+ - `body-cjk-strong-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
77
+ - `body-cjk-strong-emphasized-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
78
+ - `slider-control-to-field-label-small`
79
+ - `desktop`: `5px` -> `-4px`
80
+ - `mobile`: `6px` -> `-8px`
81
+ - `slider-control-to-field-label-medium`
82
+ - `desktop`: `8px` -> `-12px`
83
+ - `mobile`: `10px` -> `-16px`
84
+ - `slider-control-to-field-label-large`
85
+ - `desktop`: `11px` -> `-16px`
86
+ - `mobile`: `14px` -> `-20px`
87
+ - `slider-control-to-field-label-extra-large`
88
+ - `desktop`: `14px` -> `-20px`
89
+ - `mobile`: `17px` -> `-28px`
90
+
3
91
  ## 13.0.0-beta.47
4
92
 
5
93
  ### Minor Changes
package/dist/json/drover.json CHANGED
@@ -45,6 +45,8 @@
45
45
  "background-layer-1-color": "rgb(248, 248, 248)",
46
46
  "background-layer-2-color": "rgb(255, 255, 255)",
47
47
  "background-pasteboard-color": "rgb(233, 233, 233)",
48
+ "bar-panel-gripper-color": "rgb(225, 225, 225)",
49
+ "bar-panel-gripper-color-drag": "rgb(41, 41, 41)",
48
50
  "black": "rgb(0, 0, 0)",
49
51
  "blue-100": "rgb(245, 249, 255)",
50
52
  "blue-1000": "rgb(39, 77, 234)",
@@ -602,6 +604,7 @@
602
604
  "seafoam-background-color-default": "rgb(7, 129, 109)",
603
605
  "seafoam-subtle-background-color-default": "rgb(211, 246, 234)",
604
606
  "seafoam-visual-color": "rgb(11, 162, 134)",
607
+ "select-box-selected-border-color": "rgb(41, 41, 41)",
605
608
  "silver-100": "rgb(247, 247, 247)",
606
609
  "silver-1000": "rgb(96, 96, 96)",
607
610
  "silver-1100": "rgb(81, 81, 81)",
@@ -627,6 +630,16 @@
627
630
  "static-black-text-color": "rgb(0, 0, 0)",
628
631
  "static-black-track-color": "rgba(0, 0, 0, 0.15)",
629
632
  "static-black-track-indicator-color": "rgba(0, 0, 0, 0.93)",
633
+ "static-blue-1000": "rgb(39, 77, 234)",
634
+ "static-blue-900": "rgb(59, 99, 251)",
635
+ "static-fuchsia-1000": "rgb(156, 40, 175)",
636
+ "static-fuchsia-900": "rgb(181, 57, 200)",
637
+ "static-indigo-1000": "rgb(99, 56, 238)",
638
+ "static-indigo-900": "rgb(113, 85, 250)",
639
+ "static-magenta-1000": "rgb(186, 22, 80)",
640
+ "static-magenta-900": "rgb(217, 35, 97)",
641
+ "static-red-1000": "rgb(183, 40, 24)",
642
+ "static-red-900": "rgb(215, 50, 32)",
630
643
  "static-white-focus-indicator-color": "rgb(255, 255, 255)",
631
644
  "static-white-text-color": "rgb(255, 255, 255)",
632
645
  "static-white-track-color": "rgba(255, 255, 255, 0.17)",
@@ -740,6 +753,8 @@
740
753
  "background-layer-1-color": "rgb(27, 27, 27)",
741
754
  "background-layer-2-color": "rgb(34, 34, 34)",
742
755
  "background-pasteboard-color": "rgb(17, 17, 17)",
756
+ "bar-panel-gripper-color": "rgb(50, 50, 50)",
757
+ "bar-panel-gripper-color-drag": "rgb(219, 219, 219)",
743
758
  "black": "rgb(0, 0, 0)",
744
759
  "blue-100": "rgb(14, 23, 63)",
745
760
  "blue-1000": "rgb(105, 149, 254)",
@@ -1297,6 +1312,7 @@
1297
1312
  "seafoam-background-color-default": "rgb(8, 134, 112)",
1298
1313
  "seafoam-subtle-background-color-default": "rgb(0, 50, 44)",
1299
1314
  "seafoam-visual-color": "rgb(8, 134, 112)",
1315
+ "select-box-selected-border-color": "rgb(219, 219, 219)",
1300
1316
  "silver-100": "rgb(26, 26, 26)",
1301
1317
  "silver-1000": "rgb(152, 152, 152)",
1302
1318
  "silver-1100": "rgb(169, 169, 169)",
@@ -1322,6 +1338,16 @@
1322
1338
  "static-black-text-color": "rgb(0, 0, 0)",
1323
1339
  "static-black-track-color": "rgba(0, 0, 0, 0.15)",
1324
1340
  "static-black-track-indicator-color": "rgba(0, 0, 0, 0.93)",
1341
+ "static-blue-1000": "rgb(39, 77, 234)",
1342
+ "static-blue-900": "rgb(59, 99, 251)",
1343
+ "static-fuchsia-1000": "rgb(156, 40, 175)",
1344
+ "static-fuchsia-900": "rgb(181, 57, 200)",
1345
+ "static-indigo-1000": "rgb(99, 56, 238)",
1346
+ "static-indigo-900": "rgb(113, 85, 250)",
1347
+ "static-magenta-1000": "rgb(186, 22, 80)",
1348
+ "static-magenta-900": "rgb(217, 35, 97)",
1349
+ "static-red-1000": "rgb(183, 40, 24)",
1350
+ "static-red-900": "rgb(215, 50, 32)",
1325
1351
  "static-white-focus-indicator-color": "rgb(255, 255, 255)",
1326
1352
  "static-white-text-color": "rgb(255, 255, 255)",
1327
1353
  "static-white-track-color": "rgba(255, 255, 255, 0.17)",
@@ -1421,6 +1447,16 @@
1421
1447
  "static-black-text-color": "rgb(0, 0, 0)",
1422
1448
  "static-black-track-color": "rgba(0, 0, 0, 0.15)",
1423
1449
  "static-black-track-indicator-color": "rgba(0, 0, 0, 0.93)",
1450
+ "static-blue-1000": "rgb(39, 77, 234)",
1451
+ "static-blue-900": "rgb(59, 99, 251)",
1452
+ "static-fuchsia-1000": "rgb(156, 40, 175)",
1453
+ "static-fuchsia-900": "rgb(181, 57, 200)",
1454
+ "static-indigo-1000": "rgb(99, 56, 238)",
1455
+ "static-indigo-900": "rgb(113, 85, 250)",
1456
+ "static-magenta-1000": "rgb(186, 22, 80)",
1457
+ "static-magenta-900": "rgb(217, 35, 97)",
1458
+ "static-red-1000": "rgb(183, 40, 24)",
1459
+ "static-red-900": "rgb(215, 50, 32)",
1424
1460
  "static-white-focus-indicator-color": "rgb(255, 255, 255)",
1425
1461
  "static-white-text-color": "rgb(255, 255, 255)",
1426
1462
  "static-white-track-color": "rgba(255, 255, 255, 0.17)",
@@ -1573,7 +1609,19 @@
1573
1609
  "background-opacity-down": "0.1",
1574
1610
  "background-opacity-hover": "0.1",
1575
1611
  "background-opacity-key-focus": "0.1",
1612
+ "bar-panel-maximum-width": "72px",
1613
+ "bar-panel-minimum-width": "40px",
1614
+ "bar-panel-spacing-extra-spacious": "20px",
1615
+ "bar-panel-width": "56px",
1576
1616
  "body-cjk-line-height": "1.7",
1617
+ "body-cjk-size-l": "16px",
1618
+ "body-cjk-size-m": "14px",
1619
+ "body-cjk-size-s": "12px",
1620
+ "body-cjk-size-xl": "18px",
1621
+ "body-cjk-size-xs": "11px",
1622
+ "body-cjk-size-xxl": "20px",
1623
+ "body-cjk-size-xxs": "10px",
1624
+ "body-cjk-size-xxxl": "22px",
1577
1625
  "body-line-height": "1.5",
1578
1626
  "body-margin-multiplier": "0.75",
1579
1627
  "body-size-l": "18px",
@@ -1582,6 +1630,7 @@
1582
1630
  "body-size-xl": "20px",
1583
1631
  "body-size-xs": "12px",
1584
1632
  "body-size-xxl": "22px",
1633
+ "body-size-xxs": "11px",
1585
1634
  "body-size-xxxl": "25px",
1586
1635
  "border-width-100": "1px",
1587
1636
  "border-width-200": "2px",
@@ -1651,7 +1700,6 @@
1651
1700
  "chevron-icon-size-500": "16px",
1652
1701
  "chevron-icon-size-600": "18px",
1653
1702
  "chevron-icon-size-75": "10px",
1654
- "cjk-letter-spacing": "0.05em",
1655
1703
  "cjk-line-height-100": "1.5",
1656
1704
  "cjk-line-height-200": "1.7",
1657
1705
  "coach-indicator-collapsed-gap": "2px",
@@ -1958,9 +2006,12 @@
1958
2006
  "font-size-100": "14px",
1959
2007
  "font-size-1000": "40px",
1960
2008
  "font-size-1100": "45px",
1961
- "font-size-1200": "50px",
1962
- "font-size-1300": "60px",
2009
+ "font-size-1200": "51px",
2010
+ "font-size-1300": "58px",
2011
+ "font-size-1400": "65px",
2012
+ "font-size-1500": "73px",
1963
2013
  "font-size-200": "16px",
2014
+ "font-size-25": "10px",
1964
2015
  "font-size-300": "18px",
1965
2016
  "font-size-400": "20px",
1966
2017
  "font-size-50": "11px",
@@ -1970,6 +2021,8 @@
1970
2021
  "font-size-75": "12px",
1971
2022
  "font-size-800": "32px",
1972
2023
  "font-size-900": "36px",
2024
+ "gradient-stop-2-genai": 0.3333,
2025
+ "gradient-stop-2-premium": 0.6666,
1973
2026
  "heading-cjk-line-height": "1.5",
1974
2027
  "heading-cjk-size-l": "25px",
1975
2028
  "heading-cjk-size-m": "20px",
@@ -1978,7 +2031,7 @@
1978
2031
  "heading-cjk-size-xs": "16px",
1979
2032
  "heading-cjk-size-xxl": "36px",
1980
2033
  "heading-cjk-size-xxs": "14px",
1981
- "heading-cjk-size-xxxl": "60px",
2034
+ "heading-cjk-size-xxxl": "58px",
1982
2035
  "heading-line-height": "1.3",
1983
2036
  "heading-margin-bottom-multiplier": "0.25",
1984
2037
  "heading-margin-top-multiplier": "0.88888889",
@@ -1989,7 +2042,7 @@
1989
2042
  "heading-size-xs": "16px",
1990
2043
  "heading-size-xxl": "45px",
1991
2044
  "heading-size-xxs": "14px",
1992
- "heading-size-xxxl": "60px",
2045
+ "heading-size-xxxl": "58px",
1993
2046
  "help-text-to-component": "0px",
1994
2047
  "help-text-top-to-workflow-icon-extra-large": "11px",
1995
2048
  "help-text-top-to-workflow-icon-large": "9px",
@@ -2118,8 +2171,32 @@
2118
2171
  "radio-button-top-to-control-large": "12px",
2119
2172
  "radio-button-top-to-control-medium": "9px",
2120
2173
  "radio-button-top-to-control-small": "6px",
2174
+ "rating-bottom-to-content-area-medium": "6px",
2175
+ "rating-bottom-to-content-area-small": "4px",
2176
+ "rating-edge-to-content-area-medium": "6px",
2177
+ "rating-edge-to-content-area-small": "4px",
2178
+ "rating-height-medium": "32px",
2179
+ "rating-height-small": "24px",
2121
2180
  "rating-indicator-to-icon": "4px",
2122
2181
  "rating-indicator-width": "18px",
2182
+ "rating-top-to-content-area-medium": "6px",
2183
+ "rating-top-to-content-area-small": "4px",
2184
+ "rating-width-medium": "128px",
2185
+ "rating-width-small": "104px",
2186
+ "segmented-control-item-height": "32px",
2187
+ "segmented-control-selection-border-width": "2px",
2188
+ "select-box-edge-to-checkbox": "12px",
2189
+ "select-box-horizontal-end-to-content": "32px",
2190
+ "select-box-horizontal-illustration-to-label": "10px",
2191
+ "select-box-horizontal-label-to-description": "2px",
2192
+ "select-box-horizontal-minimum-height": "80px",
2193
+ "select-box-horizontal-start-to-content": "24px",
2194
+ "select-box-horizontal-top-to-content": "16px",
2195
+ "select-box-horizontal-width": "368px",
2196
+ "select-box-top-to-checkbox": "4px",
2197
+ "select-box-vertical-edge-to-content": "24px",
2198
+ "select-box-vertical-height": "170px",
2199
+ "select-box-vertical-illustration-to-label": "8px",
2123
2200
  "side-focus-indicator": "4px",
2124
2201
  "side-label-character-count-to-field": "12px",
2125
2202
  "side-label-character-count-top-margin-extra-large": "0px",
@@ -2145,19 +2222,42 @@
2145
2222
  "slider-control-height-large": "18px",
2146
2223
  "slider-control-height-medium": "16px",
2147
2224
  "slider-control-height-small": "14px",
2148
- "slider-control-to-field-label-extra-large": "14px",
2149
- "slider-control-to-field-label-large": "11px",
2150
- "slider-control-to-field-label-medium": "8px",
2151
- "slider-control-to-field-label-small": "5px",
2225
+ "slider-control-to-field-label-editable-extra-large": "-20px",
2226
+ "slider-control-to-field-label-editable-large": "-16px",
2227
+ "slider-control-to-field-label-editable-medium": "-12px",
2228
+ "slider-control-to-field-label-editable-small": "-4px",
2229
+ "slider-control-to-field-label-extra-large": "-20px",
2230
+ "slider-control-to-field-label-large": "-16px",
2231
+ "slider-control-to-field-label-medium": "-12px",
2232
+ "slider-control-to-field-label-side-extra-large": "24px",
2233
+ "slider-control-to-field-label-side-large": "20px",
2234
+ "slider-control-to-field-label-side-medium": "16px",
2235
+ "slider-control-to-field-label-side-small": "16px",
2236
+ "slider-control-to-field-label-small": "-4px",
2237
+ "slider-control-to-text-field-extra-large": "24px",
2238
+ "slider-control-to-text-field-large": "20px",
2239
+ "slider-control-to-text-field-medium": "16px",
2240
+ "slider-control-to-text-field-small": "16px",
2152
2241
  "slider-handle-border-width-down-extra-large": "8px",
2153
2242
  "slider-handle-border-width-down-large": "7px",
2154
2243
  "slider-handle-border-width-down-medium": "6px",
2155
2244
  "slider-handle-border-width-down-small": "5px",
2245
+ "slider-handle-extra-large": "24px",
2156
2246
  "slider-handle-gap": "4px",
2247
+ "slider-handle-height-precision-extra-large": "26px",
2248
+ "slider-handle-height-precision-large": "24px",
2249
+ "slider-handle-height-precision-medium": "22px",
2250
+ "slider-handle-height-precision-small": "20px",
2251
+ "slider-handle-large": "22px",
2252
+ "slider-handle-medium": "20px",
2253
+ "slider-handle-precision-width": "6px",
2157
2254
  "slider-handle-size-extra-large": "20px",
2158
2255
  "slider-handle-size-large": "18px",
2159
2256
  "slider-handle-size-medium": "16px",
2160
2257
  "slider-handle-size-small": "14px",
2258
+ "slider-handle-small": "18px",
2259
+ "slider-track-height-large": "16px",
2260
+ "slider-track-height-medium": "4px",
2161
2261
  "slider-track-thickness": "2px",
2162
2262
  "spacing-100": "8px",
2163
2263
  "spacing-1000": "96px",