@adobe/spectrum-tokens 13.0.0-beta.5 → 13.0.0-beta.50

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 (104) hide show
  1. package/CHANGELOG.md +2374 -0
  2. package/README.md +4 -0
  3. package/dist/json/drover.json +999 -253
  4. package/dist/json/variables.json +16916 -6373
  5. package/index.js +60 -0
  6. package/moon.yml +3 -2
  7. package/package.json +12 -8
  8. package/schemas/components/action-bar.json +1 -1
  9. package/schemas/components/action-button.json +1 -1
  10. package/schemas/components/action-group.json +1 -1
  11. package/schemas/components/alert-banner.json +1 -1
  12. package/schemas/components/alert-dialog.json +1 -1
  13. package/schemas/components/avatar.json +1 -1
  14. package/schemas/components/badge.json +1 -1
  15. package/schemas/components/body.json +1 -1
  16. package/schemas/components/bottom-navigation-android.json +1 -1
  17. package/schemas/components/breadcrumbs.json +1 -1
  18. package/schemas/components/button-group.json +1 -1
  19. package/schemas/components/button.json +1 -1
  20. package/schemas/components/checkbox-group.json +1 -1
  21. package/schemas/components/checkbox.json +1 -1
  22. package/schemas/components/close-button.json +1 -1
  23. package/schemas/components/code.json +1 -1
  24. package/schemas/components/color-area.json +1 -1
  25. package/schemas/components/color-loupe.json +1 -1
  26. package/schemas/components/color-slider.json +1 -1
  27. package/schemas/components/color-wheel.json +1 -1
  28. package/schemas/components/combo-box.json +1 -1
  29. package/schemas/components/contextual-help.json +1 -1
  30. package/schemas/components/detail.json +1 -1
  31. package/schemas/components/divider.json +1 -1
  32. package/schemas/components/field-label.json +1 -1
  33. package/schemas/components/heading.json +1 -1
  34. package/schemas/components/help-text.json +1 -1
  35. package/schemas/components/in-line-alert.json +1 -1
  36. package/schemas/components/link.json +1 -1
  37. package/schemas/components/menu.json +1 -1
  38. package/schemas/components/meter.json +1 -1
  39. package/schemas/components/picker.json +1 -1
  40. package/schemas/components/popover.json +1 -1
  41. package/schemas/components/progress-bar.json +1 -1
  42. package/schemas/components/progress-circle.json +1 -1
  43. package/schemas/components/radio-group.json +1 -1
  44. package/schemas/components/rating.json +1 -1
  45. package/schemas/components/scroll-zoom-bar.json +1 -1
  46. package/schemas/components/side-navigation.json +1 -1
  47. package/schemas/components/slider.json +1 -1
  48. package/schemas/components/status-light.json +1 -1
  49. package/schemas/components/swatch-group.json +1 -1
  50. package/schemas/components/swatch.json +1 -1
  51. package/schemas/components/switch.json +1 -1
  52. package/schemas/components/tab-bar-ios.json +1 -1
  53. package/schemas/components/tabs.json +1 -1
  54. package/schemas/components/tag.json +1 -1
  55. package/schemas/components/text-area.json +1 -1
  56. package/schemas/components/text-field.json +1 -1
  57. package/schemas/components/toast.json +1 -1
  58. package/schemas/components/tooltip.json +1 -1
  59. package/schemas/components/tray.json +1 -1
  60. package/schemas/components/tree-view.json +1 -1
  61. package/schemas/token-types/alias.json +26 -0
  62. package/schemas/token-types/color-set.json +70 -0
  63. package/schemas/token-types/color.json +26 -0
  64. package/schemas/token-types/dimension.json +26 -0
  65. package/schemas/token-types/font-family.json +26 -0
  66. package/schemas/token-types/font-size.json +26 -0
  67. package/schemas/token-types/font-style.json +26 -0
  68. package/schemas/token-types/font-weight.json +26 -0
  69. package/schemas/token-types/gradient-stop.json +27 -0
  70. package/schemas/token-types/multiplier.json +26 -0
  71. package/schemas/token-types/opacity.json +26 -0
  72. package/schemas/token-types/scale-set.json +61 -0
  73. package/schemas/token-types/set.json +22 -0
  74. package/schemas/token-types/system-set.json +83 -0
  75. package/schemas/token-types/text-align.json +27 -0
  76. package/schemas/token-types/text-transform.json +26 -0
  77. package/schemas/token-types/token.json +39 -0
  78. package/src/color-aliases.json +1002 -86
  79. package/src/color-component.json +246 -22
  80. package/src/color-palette.json +2757 -512
  81. package/src/icons.json +988 -16
  82. package/src/layout-component.json +5727 -781
  83. package/src/layout.json +901 -170
  84. package/src/semantic-color-palette.json +205 -1
  85. package/src/typography.json +583 -89
  86. package/tasks/addIds.js +5 -8
  87. package/tasks/addPrivate.js +22 -0
  88. package/tasks/buildManifest.js +1 -1
  89. package/tasks/buildSpectrumTokens.js +1 -1
  90. package/tasks/deprecateExpress.js +1 -1
  91. package/tasks/diff.js +19 -5
  92. package/tasks/lib/augmentExpressTokens.js +1 -1
  93. package/test/checkComponentProps.js +29 -0
  94. package/test/checkId.test.js +24 -38
  95. package/test/checkManifest.test.js +1 -1
  96. package/test/checkPrivate.js +22 -0
  97. package/test/checkSetsUnique.js +54 -0
  98. package/test/checkUniqueTokenNames.js +32 -0
  99. package/test/componentSchemaValidator.test.js +74 -0
  100. package/test/deprecateExpress.test.js +1 -1
  101. package/test/drover.test.js +1 -1
  102. package/test/schemaValidator.test.js +1 -1
  103. package/test/schemaValidators/alias.test.js +41 -0
  104. package/test/tokenSchemaValidator.test.js +97 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,2379 @@
1
1
  # @adobe/spectrum-tokens
2
2
 
3
+ ## 13.0.0-beta.50
4
+
5
+ ### Minor Changes
6
+
7
+ - [#425](https://github.com/adobe/spectrum-tokens/pull/425) [`91f4536`](https://github.com/adobe/spectrum-tokens/commit/91f4536a416cf6c9e5b0b423bf3ead3233e808fc) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Adding S2 tokens for number field and takeover dialog components.
8
+
9
+ ## Token Diff
10
+
11
+ _Tokens added (16):_
12
+
13
+ - `in-field-stepper-to-end-extra-large`
14
+ - `in-field-stepper-to-end-large`
15
+ - `in-field-stepper-to-end-medium`
16
+ - `in-field-stepper-to-end-small`
17
+ - `number-field-minimum-width-multiplier`
18
+ - `number-field-visual-to-in-field-stepper-extra-large`
19
+ - `number-field-visual-to-in-field-stepper-large`
20
+ - `number-field-visual-to-in-field-stepper-medium`
21
+ - `number-field-visual-to-in-field-stepper-small`
22
+ - `number-field-with-stepper-minimum-width-extra-large`
23
+ - `number-field-with-stepper-minimum-width-large`
24
+ - `number-field-with-stepper-minimum-width-medium`
25
+ - `number-field-with-stepper-minimum-width-small`
26
+ - `takeover-dialog-height`
27
+ - `takeover-dialog-width`
28
+ - `window-to-edge`
29
+
30
+ ## 13.0.0-beta.49
31
+
32
+ ### Minor Changes
33
+
34
+ - [#418](https://github.com/adobe/spectrum-tokens/pull/418) [`45ed87b`](https://github.com/adobe/spectrum-tokens/commit/45ed87b43af53370f74fc46c545b4c13005f381c) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - ## Design Motivation
35
+
36
+ Made the following changes to component typography tokens for both mobile and desktop.
37
+
38
+ ## Token Diff
39
+
40
+ _Tokens added (2):_
41
+
42
+ - `heading-cjk-size-xxxxl`
43
+ - `heading-size-xxxxl`
44
+
45
+ _Tokens changed (7):_
46
+
47
+ - `heading-sans-serif-font-weight`: `bold-font-weight` -> `extra-bold-font-weight`
48
+ - `heading-cjk-heavy-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
49
+ - `heading-sans-serif-emphasized-font-weight`: `bold-font-weight` -> `extra-bold-font-weight`
50
+ - `heading-size-s`: `font-size-300` -> `font-size-400`
51
+ - `heading-size-xs`: `font-size-200` -> `font-size-300`
52
+ - `heading-cjk-size-xxxl`: `font-size-1300` -> `font-size-1200`
53
+ - `heading-cjk-size-xxl`: `font-size-900` -> `font-size-1000`
54
+
55
+ - [#422](https://github.com/adobe/spectrum-tokens/pull/422) [`4673d13`](https://github.com/adobe/spectrum-tokens/commit/4673d1383602d81484ae346dd278a28a26f5d91b) Thanks [@GarthDB](https://github.com/GarthDB)! - Added tokens for s2 detail typography
56
+
57
+ _New tokens (6)_
58
+
59
+ - `detail-cjk-size-xs`
60
+ - `detail-cjk-size-s`
61
+ - `detail-cjk-size-m`
62
+ - `detail-cjk-size-l`
63
+ - `detail-cjk-size-xl`
64
+ - `detail-size-xs`
65
+
66
+ _Updated token values (13)_
67
+
68
+ - `detail-sans-serif-font-weight`: `bold-font-weight` -> `medium-font-weight`
69
+ - `detail-serif-font-weight`: `bold-font-weight` -> `medium-font-weight`
70
+ - `detail-cjk-font-weight`: `extra-bold-font-weight` -> `bold-font-weight`
71
+ - `detail-cjk-strong-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
72
+ - `detail-sans-serif-emphasized-font-weight`: `bold-font-weight` -> `regular-font-weight`
73
+ - `detail-serif-emphasized-font-weight`: `bold-font-weight` -> `medium-font-weight`
74
+ - `detail-cjk-emphasized-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
75
+ - `detail-cjk-strong-emphasized-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
76
+ - `detail-size-xl`: `font-size-200` -> `font-size-300`
77
+ - `detail-size-l`: `font-size-100` -> `font-size-200`
78
+ - `detail-size-m`: `font-size-75` -> `font-size-100`
79
+ - `detail-size-s`: `font-size-50` -> `font-size-75`
80
+ - `detail-color`: `gray-900` -> `gray-600`
81
+
82
+ ## 13.0.0-beta.48
83
+
84
+ ### Minor Changes
85
+
86
+ - [#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:
87
+
88
+ - Letter spacing, text-align, cjk
89
+
90
+ 1. New gradient stop tokens
91
+ 1. New component tokens for bar panel, rating, segmented control, slider, select box
92
+ 1. New static color tokens
93
+
94
+ _Tokens added (51):_
95
+
96
+ - `letter-spacing`
97
+ - `text-align-start`
98
+ - `text-align-center`
99
+ - `text-align-end`
100
+ - `body-size-xxs`
101
+ - `body-cjk-size-xxxl`
102
+ - `body-cjk-size-xxl`
103
+ - `body-cjk-size-xl`
104
+ - `body-cjk-size-l`
105
+ - `body-cjk-size-m`
106
+ - `body-cjk-size-s`
107
+ - `body-cjk-size-xs`
108
+ - `body-cjk-size-xxs`
109
+ - `gradient-stop-1-genai`
110
+ - `gradient-stop-2-genai`
111
+ - `gradient-stop-3-genai`
112
+ - `gradient-stop-1-premium`
113
+ - `gradient-stop-2-premium`
114
+ - `gradient-stop-3-premium`
115
+ - `bar-panel-width`
116
+ - `bar-panel-minimum-width`
117
+ - `bar-panel-maximum-width`
118
+ - `bar-panel-spacing-extra-spacious`
119
+ - `rating-top-to-content-area-small`
120
+ - `rating-bottom-to-content-area-small`
121
+ - `rating-edge-to-content-area-small`
122
+ - `rating-top-to-content-area-medium`
123
+ - `rating-bottom-to-content-area-medium`
124
+ - `rating-edge-to-content-area-medium`
125
+ - `rating-width-small`
126
+ - `rating-height-small`
127
+ - `rating-width-medium`
128
+ - `rating-height-medium`
129
+ - `segmented-control-selection-border-width`
130
+ - `slider-handle-precision-width`
131
+ - `slider-track-height-medium`
132
+ - `slider-track-height-large`
133
+ - `segmented-control-item-height`
134
+ - `static-blue-900`
135
+ - `static-blue-1000`
136
+ - `static-fuchsia-900`
137
+ - `static-fuchsia-1000`
138
+ - `static-indigo-900`
139
+ - `static-indigo-1000`
140
+ - `static-magenta-900`
141
+ - `static-magenta-1000`
142
+ - `static-red-900`
143
+ - `static-red-1000`
144
+ - `bar-panel-gripper-color`
145
+ - `bar-panel-gripper-color-drag`
146
+ - `select-box-selected-border-color`
147
+
148
+ _Token values updated (9):_
149
+
150
+ - `font-size-1200`
151
+ - `desktop`: `50px` -> `51px`
152
+ - `font-size-1300`
153
+ - `desktop`: `60px` -> `58px`
154
+ - `cjk-letter-spacing`: `0.05em` -> `letter-spacing`
155
+ - `body-cjk-strong-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
156
+ - `body-cjk-strong-emphasized-font-weight`: `black-font-weight` -> `extra-bold-font-weight`
157
+ - `slider-control-to-field-label-small`
158
+ - `desktop`: `5px` -> `-4px`
159
+ - `mobile`: `6px` -> `-8px`
160
+ - `slider-control-to-field-label-medium`
161
+ - `desktop`: `8px` -> `-12px`
162
+ - `mobile`: `10px` -> `-16px`
163
+ - `slider-control-to-field-label-large`
164
+ - `desktop`: `11px` -> `-16px`
165
+ - `mobile`: `14px` -> `-20px`
166
+ - `slider-control-to-field-label-extra-large`
167
+ - `desktop`: `14px` -> `-20px`
168
+ - `mobile`: `17px` -> `-28px`
169
+
170
+ ## 13.0.0-beta.47
171
+
172
+ ### Minor Changes
173
+
174
+ - [`75a573b`](https://github.com/adobe/spectrum-tokens/commit/75a573bcbb7b71ecdf5f246682755de24dae5afc) Thanks [@GarthDB](https://github.com/GarthDB)! - S2 subtle and visual colors update
175
+ Updated S2 Table tokens
176
+
177
+ <details><summary>Tokens added (42):</summary>
178
+
179
+ - `illustrated-message-maximum-width`
180
+ - `side-focus-indicator`
181
+ - `table-row-bottom-to-text-extra-large`
182
+ - `table-row-bottom-to-text-extra-large-regular`
183
+ - `table-row-bottom-to-text-large`
184
+ - `table-row-bottom-to-text-large-regular`
185
+ - `table-row-bottom-to-text-medium`
186
+ - `table-row-bottom-to-text-medium-regular`
187
+ - `table-row-bottom-to-text-small`
188
+ - `table-row-bottom-to-text-small-regular`
189
+ - `table-row-checkbox-to-top-extra-large`
190
+ - `table-row-checkbox-to-top-extra-large-regular`
191
+ - `table-row-checkbox-to-top-large`
192
+ - `table-row-checkbox-to-top-large-regular`
193
+ - `table-row-checkbox-to-top-medium`
194
+ - `table-row-checkbox-to-top-medium-regular`
195
+ - `table-row-checkbox-to-top-small`
196
+ - `table-row-checkbox-to-top-small-regular`
197
+ - `table-row-height-extra-large`
198
+ - `table-row-height-extra-large-regular`
199
+ - `table-row-height-large`
200
+ - `table-row-height-large-regular`
201
+ - `table-row-height-medium`
202
+ - `table-row-height-medium-regular`
203
+ - `table-row-height-small`
204
+ - `table-row-height-small-regular`
205
+ - `table-row-top-to-text-extra-large`
206
+ - `table-row-top-to-text-extra-large-regular`
207
+ - `table-row-top-to-text-large`
208
+ - `table-row-top-to-text-large-regular`
209
+ - `table-row-top-to-text-medium`
210
+ - `table-row-top-to-text-medium-regular`
211
+ - `table-row-top-to-text-small`
212
+ - `table-row-top-to-text-small-regular`
213
+ - `table-thumbnail-to-top-minimum-extra-large`
214
+ - `table-thumbnail-to-top-minimum-extra-large-regular`
215
+ - `table-thumbnail-to-top-minimum-large`
216
+ - `table-thumbnail-to-top-minimum-large-regular`
217
+ - `table-thumbnail-to-top-minimum-medium`
218
+ - `table-thumbnail-to-top-minimum-medium-regular`
219
+ - `table-thumbnail-to-top-minimum-small`
220
+ - `table-thumbnail-to-top-minimum-small-regular`
221
+
222
+ </details>
223
+
224
+ <details><summary>Tokens updated (101):</summary>
225
+
226
+ - `informative-subtle-background-color-default`
227
+ - light: `blue-200` -> `informative-color-200`
228
+ - dark: `blue-200` -> `informative-color-300`
229
+ - `positive-subtle-background-color-default`
230
+ - light: `green-200` -> `positive-color-200`
231
+ - dark: `green-200` -> `positive-color-300`
232
+ - `notice-subtle-background-color-default`
233
+ - light: `orange-200` -> `notice-color-200`
234
+ - dark: `orange-200` -> `notice-color-300`
235
+ - `negative-subtle-background-color-default`
236
+ - light: `red-200` -> `negative-color-200`
237
+ - dark: `red-200` -> `negative-color-300`
238
+ - `table-column-header-row-top-to-text-medium`
239
+ - desktop: `7px` -> `6px`
240
+ - `table-row-height-small-regular`
241
+ - desktop: `32px` -> `table-row-height-small`
242
+ - mobile: `40px` -> `table-row-height-small`
243
+ - `table-row-height-medium-regular`
244
+ - desktop: `40px` -> `table-row-height-medium`
245
+ - mobile: `50px` -> `table-row-height-medium`
246
+ - `table-row-height-large-regular`
247
+ - desktop: `48px` -> `table-row-height-large`
248
+ - mobile: `60px` -> `table-row-height-large`
249
+ - `table-row-height-extra-large-regular`
250
+ - desktop: `56px` -> `table-row-height-extra-large`
251
+ - mobile: `70px` -> `table-row-height-extra-large`
252
+ - `table-row-top-to-text-small-regular`
253
+ - desktop: `8px` -> `table-row-top-to-text-small`
254
+ - mobile: `10px` -> `table-row-top-to-text-small`
255
+ - `table-row-top-to-text-medium-regular`
256
+ - desktop: `11px` -> `table-row-top-to-text-medium`
257
+ - mobile: `14px` -> `table-row-top-to-text-medium`
258
+ - `table-row-top-to-text-large-regular`
259
+ - desktop: `14px` -> `table-row-top-to-text-large`
260
+ - mobile: `18px` -> `table-row-top-to-text-large`
261
+ - `table-row-top-to-text-extra-large-regular`
262
+ - desktop: `17px` -> `table-row-top-to-text-extra-large`
263
+ - mobile: `21px` -> `table-row-top-to-text-extra-large`
264
+ - `table-row-bottom-to-text-small-regular`
265
+ - desktop: `9px` -> `table-row-bottom-to-text-small`
266
+ - mobile: `11px` -> `table-row-bottom-to-text-small`
267
+ - `table-row-bottom-to-text-medium-regular`
268
+ - desktop: `12px` -> `table-row-bottom-to-text-medium`
269
+ - mobile: `15px` -> `table-row-bottom-to-text-medium`
270
+ - `table-row-bottom-to-text-large-regular`
271
+ - desktop: `14px` -> `table-row-bottom-to-text-large`
272
+ - mobile: `18px` -> `table-row-bottom-to-text-large`
273
+ - `table-row-bottom-to-text-extra-large-regular`
274
+ - desktop: `17px` -> `table-row-bottom-to-text-extra-large`
275
+ - mobile: `22px` -> `table-row-bottom-to-text-extra-large`
276
+ - `table-row-top-to-text-medium-spacious`
277
+ - mobile: `18px` -> `16px`
278
+ - `table-header-row-checkbox-to-top-medium`
279
+ - desktop: `9px` -> `8px`
280
+ - mobile: `13px` -> `11px`
281
+ - `table-row-checkbox-to-top-small-regular`
282
+ - desktop: `10px` -> `table-row-checkbox-to-top-small`
283
+ - mobile: `14px` -> `table-row-checkbox-to-top-small`
284
+ - `table-row-checkbox-to-top-medium-compact`
285
+ - desktop: `9px` -> `8px`
286
+ - mobile: `13px` -> `11px`
287
+ - `table-row-checkbox-to-top-medium-regular`
288
+ - desktop: `13px` -> `table-row-checkbox-to-top-medium`
289
+ - mobile: `18px` -> `table-row-checkbox-to-top-medium`
290
+ - `table-row-checkbox-to-top-medium-spacious`
291
+ - desktop: `17px` -> `16px`
292
+ - mobile: `23px` -> `21px`
293
+ - `table-row-checkbox-to-top-large-regular`
294
+ - desktop: `16px` -> `table-row-checkbox-to-top-large`
295
+ - mobile: `22px` -> `table-row-checkbox-to-top-large`
296
+ - `table-row-checkbox-to-top-extra-large-regular`
297
+ - desktop: `19px` -> `table-row-checkbox-to-top-extra-large`
298
+ - mobile: `26px` -> `table-row-checkbox-to-top-extra-large`
299
+ - `table-thumbnail-to-top-minimum-small-regular`
300
+ - desktop: `5px` -> `table-thumbnail-to-top-minimum-small`
301
+ - mobile: `6px` -> `table-thumbnail-to-top-minimum-small`
302
+ - `table-thumbnail-to-top-minimum-medium-regular`
303
+ - desktop: `7px` -> `table-thumbnail-to-top-minimum-medium`
304
+ - mobile: `9px` -> `table-thumbnail-to-top-minimum-medium`
305
+ - `table-thumbnail-to-top-minimum-large-regular`
306
+ - desktop: `8px` -> `table-thumbnail-to-top-minimum-large`
307
+ - mobile: `10px` -> `table-thumbnail-to-top-minimum-large`
308
+ - `table-thumbnail-to-top-minimum-extra-large-regular`
309
+ - desktop: `8px` -> `table-thumbnail-to-top-minimum-extra-large`
310
+ - mobile: `10px` -> `table-thumbnail-to-top-minimum-extra-large`
311
+ - `blue-800`
312
+ - dark: `rgb(69, 110, 254)` -> `rgb(64, 105, 253)`
313
+ - `red-800`
314
+ - dark: `rgb(230, 54, 35)` -> `rgb(223, 52, 34)`
315
+ - `orange-800`
316
+ - dark: `rgb(205, 86, 0)` -> `rgb(199, 82, 0)`
317
+ - `yellow-800`
318
+ - dark: `rgb(169, 110, 0)` -> `rgb(164, 106, 0)`
319
+ - `chartreuse-800`
320
+ - dark: `rgb(109, 131, 0)` -> `rgb(106, 127, 0)`
321
+ - `celery-800`
322
+ - dark: `rgb(69, 138, 19)` -> `rgb(66, 134, 18)`
323
+ - `green-800`
324
+ - dark: `rgb(6, 140, 82)` -> `rgb(6, 136, 80)`
325
+ - `seafoam-800`
326
+ - dark: `rgb(8, 138, 116)` -> `rgb(8, 134, 112)`
327
+ - `cyan-800`
328
+ - dark: `rgb(15, 128, 194)` -> `rgb(13, 125, 186)`
329
+ - `indigo-800`
330
+ - dark: `rgb(119, 97, 252)` -> `rgb(116, 91, 252)`
331
+ - `purple-800`
332
+ - dark: `rgb(161, 84, 229)` -> `rgb(157, 78, 228)`
333
+ - `fuchsia-800`
334
+ - dark: `rgb(192, 64, 212)` -> `rgb(186, 60, 206)`
335
+ - `magenta-800`
336
+ - dark: `rgb(231, 41, 105)` -> `rgb(224, 38, 101)`
337
+ - `pink-800`
338
+ - dark: `rgb(220, 47, 156)` -> `rgb(213, 45, 151)`
339
+ - `turquoise-800`
340
+ - dark: `rgb(9, 135, 147)` -> `rgb(9, 131, 142)`
341
+ - `brown-800`
342
+ - dark: `rgb(148, 118, 73)` -> `rgb(143, 114, 69)`
343
+ - `silver-800`
344
+ - dark: `rgb(123, 123, 123)` -> `rgb(118, 118, 118)`
345
+ - `cinnamon-800`
346
+ - dark: `rgb(179, 103, 64)` -> `rgb(176, 98, 59)`
347
+ - `accent-background-color-default`
348
+ - dark: `accent-color-700` -> `accent-color-800`
349
+ - `accent-background-color-hover`
350
+ - dark: `accent-color-600` -> `accent-color-700`
351
+ - `accent-background-color-down`
352
+ - dark: `accent-color-600` -> `accent-color-700`
353
+ - `accent-background-color-key-focus`
354
+ - dark: `accent-color-600` -> `accent-color-700`
355
+ - `informative-background-color-default`
356
+ - dark: `informative-color-700` -> `informative-color-800`
357
+ - `informative-background-color-hover`
358
+ - dark: `informative-color-600` -> `informative-color-700`
359
+ - `informative-background-color-down`
360
+ - dark: `informative-color-600` -> `informative-color-700`
361
+ - `informative-background-color-key-focus`
362
+ - dark: `informative-color-600` -> `informative-color-700`
363
+ - `negative-background-color-default`
364
+ - dark: `negative-color-700` -> `negative-color-800`
365
+ - `negative-background-color-hover`
366
+ - dark: `negative-color-600` -> `negative-color-700`
367
+ - `negative-background-color-down`
368
+ - dark: `negative-color-600` -> `negative-color-700`
369
+ - `negative-background-color-key-focus`
370
+ - dark: `negative-color-600` -> `negative-color-700`
371
+ - `positive-background-color-default`
372
+ - dark: `positive-color-700` -> `positive-color-800`
373
+ - `positive-background-color-hover`
374
+ - dark: `positive-color-600` -> `positive-color-700`
375
+ - `positive-background-color-down`
376
+ - dark: `positive-color-600` -> `positive-color-700`
377
+ - `positive-background-color-key-focus`
378
+ - dark: `positive-color-600` -> `positive-color-700`
379
+ - `red-background-color-default`
380
+ - dark: `red-700` -> `red-800`
381
+ - `green-background-color-default`
382
+ - dark: `green-700` -> `green-800`
383
+ - `seafoam-background-color-default`
384
+ - dark: `seafoam-700` -> `seafoam-800`
385
+ - `cyan-background-color-default`
386
+ - dark: `cyan-700` -> `cyan-800`
387
+ - `blue-background-color-default`
388
+ - dark: `blue-700` -> `blue-800`
389
+ - `indigo-background-color-default`
390
+ - dark: `indigo-700` -> `indigo-800`
391
+ - `purple-background-color-default`
392
+ - dark: `purple-700` -> `purple-800`
393
+ - `fuchsia-background-color-default`
394
+ - dark: `fuchsia-700` -> `fuchsia-800`
395
+ - `magenta-background-color-default`
396
+ - dark: `magenta-700` -> `magenta-800`
397
+ - `negative-visual-color`
398
+ - dark: `negative-color-700` -> `negative-color-900`
399
+ - `notice-visual-color`
400
+ - light: `notice-color-700` -> `notice-color-800`
401
+ - `positive-visual-color`
402
+ - light: `positive-color-700` -> `positive-color-800`
403
+ - dark: `positive-color-800` -> `positive-color-900`
404
+ - `brown-background-color-default`
405
+ - dark: `brown-700` -> `brown-800`
406
+ - `cinnamon-background-color-default`
407
+ - dark: `cinnamon-700` -> `cinnamon-800`
408
+ - `pink-background-color-default`
409
+ - dark: `pink-700` -> `pink-800`
410
+ - `silver-background-color-default`
411
+ - dark: `silver-700` -> `silver-800`
412
+ - `turquoise-background-color-default`
413
+ - dark: `turquoise-700` -> `turquoise-800`
414
+ - `neutral-subtle-background-color-default`
415
+ - light: `gray-100` -> `gray-100`
416
+ - dark: `gray-100` -> `gray-300`
417
+ - `accent-subtle-background-color-default`
418
+ - light: `rgba(0, 0, 0, 0.2)` -> `accent-color-200`
419
+ - dark: `rgba(0, 0, 0, 0.6)` -> `accent-color-300`
420
+ - `gray-subtle-background-color-default`
421
+ - light: `rgba(0, 0, 0, 0.2)` -> `gray-100`
422
+ - dark: `rgba(0, 0, 0, 0.6)` -> `gray-300`
423
+ - `blue-subtle-background-color-default`
424
+ - light: `rgba(0, 0, 0, 0.2)` -> `blue-200`
425
+ - dark: `rgba(0, 0, 0, 0.6)` -> `blue-300`
426
+ - `green-subtle-background-color-default`
427
+ - light: `rgba(0, 0, 0, 0.2)` -> `green-200`
428
+ - dark: `rgba(0, 0, 0, 0.6)` -> `green-300`
429
+ - `orange-subtle-background-color-default`
430
+ - light: `rgba(0, 0, 0, 0.2)` -> `orange-200`
431
+ - dark: `rgba(0, 0, 0, 0.6)` -> `orange-300`
432
+ - `red-subtle-background-color-default`
433
+ - light: `rgba(0, 0, 0, 0.2)` -> `red-200`
434
+ - dark: `rgba(0, 0, 0, 0.6)` -> `red-300`
435
+ - `brown-subtle-background-color-default`
436
+ - light: `rgba(0, 0, 0, 0.2)` -> `brown-200`
437
+ - dark: `rgba(0, 0, 0, 0.6)` -> `brown-300`
438
+ - `cinnamon-subtle-background-color-default`
439
+ - light: `rgba(0, 0, 0, 0.2)` -> `cinnamon-200`
440
+ - dark: `rgba(0, 0, 0, 0.6)` -> `cinnamon-300`
441
+ - `celery-subtle-background-color-default`
442
+ - light: `rgba(0, 0, 0, 0.2)` -> `celery-200`
443
+ - dark: `rgba(0, 0, 0, 0.6)` -> `celery-300`
444
+ - `chartreuse-subtle-background-color-default`
445
+ - light: `rgba(0, 0, 0, 0.2)` -> `chartreuse-200`
446
+ - dark: `rgba(0, 0, 0, 0.6)` -> `chartreuse-300`
447
+ - `cyan-subtle-background-color-default`
448
+ - light: `rgba(0, 0, 0, 0.2)` -> `cyan-200`
449
+ - dark: `rgba(0, 0, 0, 0.6)` -> `cyan-300`
450
+ - `fuchsia-subtle-background-color-default`
451
+ - light: `rgba(0, 0, 0, 0.2)` -> `fuchsia-200`
452
+ - dark: `rgba(0, 0, 0, 0.6)` -> `fuchsia-300`
453
+ - `indigo-subtle-background-color-default`
454
+ - light: `rgba(0, 0, 0, 0.2)` -> `indigo-200`
455
+ - dark: `rgba(0, 0, 0, 0.6)` -> `indigo-300`
456
+ - `magenta-subtle-background-color-default`
457
+ - light: `rgba(0, 0, 0, 0.2)` -> `magenta-200`
458
+ - dark: `rgba(0, 0, 0, 0.6)` -> `magenta-300`
459
+ - `pink-subtle-background-color-default`
460
+ - light: `rgba(0, 0, 0, 0.2)` -> `pink-200`
461
+ - dark: `rgba(0, 0, 0, 0.6)` -> `pink-300`
462
+ - `purple-subtle-background-color-default`
463
+ - light: `rgba(0, 0, 0, 0.2)` -> `purple-200`
464
+ - dark: `rgba(0, 0, 0, 0.6)` -> `purple-300`
465
+ - `seafoam-subtle-background-color-default`
466
+ - light: `rgba(0, 0, 0, 0.2)` -> `seafoam-200`
467
+ - dark: `rgba(0, 0, 0, 0.6)` -> `seafoam-300`
468
+ - `silver-subtle-background-color-default`
469
+ - light: `rgba(0, 0, 0, 0.2)` -> `silver-200`
470
+ - dark: `rgba(0, 0, 0, 0.6)` -> `silver-300`
471
+ - `turquoise-subtle-background-color-default`
472
+ - light: `rgba(0, 0, 0, 0.2)` -> `turquoise-200`
473
+ - dark: `rgba(0, 0, 0, 0.6)` -> `turquoise-300`
474
+ - `yellow-subtle-background-color-default`
475
+ - light: `rgba(0, 0, 0, 0.2)` -> `yellow-200`
476
+ - dark: `rgba(0, 0, 0, 0.6)` -> `yellow-300`
477
+
478
+ </details>
479
+
480
+ ## 13.0.0-beta.46
481
+
482
+ ### Minor Changes
483
+
484
+ - [#396](https://github.com/adobe/spectrum-tokens/pull/396) [`4fcfe5b`](https://github.com/adobe/spectrum-tokens/commit/4fcfe5bd83214a7ca3644646bbf0f38802a20f43) Thanks [@larz0](https://github.com/larz0)! - Added brand new tokens for the S2 Standard Panel:
485
+
486
+ ## Design Motivation
487
+
488
+ Added tokens needed for the new S2 standard panel component.
489
+
490
+ ## Token Diff
491
+
492
+ _Tokens Added (12):_
493
+
494
+ - `standard-panel-width`
495
+ - `standard-panel-minimum-width`
496
+ - `standard-panel-maximum-width`
497
+ - `standard-panel-top-to-close-button-compact`
498
+ - `standard-panel-top-to-close-button-regular`
499
+ - `standard-panel-top-to-close-button-spacious`
500
+ - `standard-panel-edge-to-close-button-compact`
501
+ - `standard-panel-edge-to-close-button-regular`
502
+ - `standard-panel-edge-to-close-button-spacious`
503
+ - `standard-panel-title-font-size`
504
+ - `standard-panel-gripper-color`
505
+ - `standard-panel-gripper-color-drag`
506
+
507
+ ## 13.0.0-beta.45
508
+
509
+ ### Minor Changes
510
+
511
+ - [#390](https://github.com/adobe/spectrum-tokens/pull/390) [`cc9c304`](https://github.com/adobe/spectrum-tokens/commit/cc9c3048893058c3f01d6f1ce4688d8ab3716397) Thanks [@lynnhao](https://github.com/lynnhao)! - Updated code tokens for S2
512
+
513
+ ## Design Motivation
514
+
515
+ These code token updates include some fixes to CJK font-weights to match the Latin font-weights when possible. We added CJK size tokens for consistency with other typography style tokens. Note that the new CJK size tokens currently point to the default code font-size tokens since Source Code Pro handles Latin and CJK sizing comparably.
516
+
517
+ ## Token Diff
518
+
519
+ _Tokens added (5):_
520
+
521
+ - `code-cjk-size-l`
522
+ - `code-cjk-size-m`
523
+ - `code-cjk-size-s`
524
+ - `code-cjk-size-xl`
525
+ - `code-cjk-size-xs`
526
+
527
+ _Token values updated (2):_
528
+
529
+ - `code-cjk-strong-emphasized-font-weight`
530
+ - `code-cjk-strong-font-weight`
531
+
532
+ ## 13.0.0-beta.44
533
+
534
+ ### Minor Changes
535
+
536
+ - [#388](https://github.com/adobe/spectrum-tokens/pull/388) [`58425e6`](https://github.com/adobe/spectrum-tokens/commit/58425e67b2d4cbd716205d4d502cc823245811fe) Thanks [@lynnhao](https://github.com/lynnhao)! - Updated avatar and avatar group tokens
537
+
538
+ ## Description
539
+
540
+ - Updated avatar size tokens, including all sizes from `75` to `700`
541
+ - Added new avatar size tokens, from `800` to `1500`
542
+ - Added new avatar border thickness and color tokens
543
+ - Added avatar group size tokens, from `50` to `500`
544
+ - Added avatar group spacing tokens, from `50` to `500`
545
+
546
+ ## Motivation and context
547
+
548
+ - Avatar: added new sizes and updated existing sizes to better match other components and work across a variety of use cases.
549
+ - ⚠️ Important note: Accepting updates from this release will update the avatar sizes. The largest change in size is 8px. In some cases, you may want to relink to a new size. View the migration guide below to find the closest recommended size:
550
+
551
+ | Former avatar size | Available avatar size |
552
+ | :----------------- | :--------------------------------------- |
553
+ | size 50 (16 x 16) | size 50 (16 x 16) |
554
+ | size 75 (18 x 18) | size 50 (16 x 16) or size 75 (20 x 20) |
555
+ | size 100 (20 x 20) | size 75 (20 x 20) |
556
+ | size 200 (22 x 22) | size 75 (20 x 20) or size 100 (24 x 24) |
557
+ | size 300 (26 x 26) | size 100 (24 x 24) or size 200 (28 x 28) |
558
+ | size 400 (28 x 28) | size 200 (28 x 28) |
559
+ | size 500 (32 x 32) | size 300 (32 x 32) |
560
+ | size 600 (36 x 36) | size 400 (36 x 36) |
561
+ | size 700 (40 x 40) | size 500 (40 x 40) |
562
+ | -- | size 600 (44 x 44) |
563
+ | -- | size 700 (48 x 48) |
564
+ | -- | size 800 (52 x 52) |
565
+ | -- | size 900 (56 x 56) |
566
+ | -- | size 1000 (64 x 64) |
567
+ | -- | size 1100 (72 x 72) |
568
+ | -- | size 1200 (80 x 80) |
569
+ | -- | size 1300 (88 x 88) |
570
+ | -- | size 1400 (96 x 96) |
571
+ | -- | size 1500 (104 x 104) |
572
+
573
+ ## Token Diff
574
+
575
+ _Tokens added (24):_
576
+
577
+ - `avatar-border-color`
578
+ - `avatar-border-width`
579
+ - `avatar-group-size-100`
580
+ - `avatar-group-size-200`
581
+ - `avatar-group-size-300`
582
+ - `avatar-group-size-400`
583
+ - `avatar-group-size-50`
584
+ - `avatar-group-size-500`
585
+ - `avatar-group-size-75`
586
+ - `avatar-size-1000`
587
+ - `avatar-size-1100`
588
+ - `avatar-size-1200`
589
+ - `avatar-size-1300`
590
+ - `avatar-size-1400`
591
+ - `avatar-size-1500`
592
+ - `avatar-size-800`
593
+ - `avatar-size-900`
594
+ - `avatar-to-avatar-100`
595
+ - `avatar-to-avatar-200`
596
+ - `avatar-to-avatar-300`
597
+ - `avatar-to-avatar-400`
598
+ - `avatar-to-avatar-50`
599
+ - `avatar-to-avatar-500`
600
+ - `avatar-to-avatar-75`
601
+
602
+ _Token values updated (8):_
603
+
604
+ - `avatar-size-100`
605
+ - `avatar-size-200`
606
+ - `avatar-size-300`
607
+ - `avatar-size-400`
608
+ - `avatar-size-500`
609
+ - `avatar-size-600`
610
+ - `avatar-size-700`
611
+ - `avatar-size-75`
612
+
613
+ ## 13.0.0-beta.43
614
+
615
+ ### Minor Changes
616
+
617
+ - [#384](https://github.com/adobe/spectrum-tokens/pull/384) [`681b4b0`](https://github.com/adobe/spectrum-tokens/commit/681b4b0094d31bae4c9b1b095fa59d6448c26cab) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Added dragged drop shadow tokens that point to new 300 global drop shadow tokens
618
+
619
+ ## Design Motivation
620
+
621
+ These are new foundational drop shadow tokens that represent a higher elevation when items are dragged. The more prominent shadow also brings more visual focus to the dragged item. They will be used in the standard panel "dragged" state, as well as in future component updates, to be determined.
622
+
623
+ ## Token Diff
624
+
625
+ _Tokens added (8):_
626
+
627
+ - `drop-shadow-blur-300`
628
+ - `drop-shadow-color-300`
629
+ - `drop-shadow-dragged-blur`
630
+ - `drop-shadow-dragged-color`
631
+ - `drop-shadow-dragged-x`
632
+ - `drop-shadow-dragged-y`
633
+ - `drop-shadow-x-300`
634
+ - `drop-shadow-y-300`
635
+
636
+ ## 13.0.0-beta.42
637
+
638
+ ### Minor Changes
639
+
640
+ - [#382](https://github.com/adobe/spectrum-tokens/pull/382) [`2af3850`](https://github.com/adobe/spectrum-tokens/commit/2af3850a554812fd9c1b3e6fd902a746c9ac42c7) Thanks [@nabuhasan](https://github.com/nabuhasan)! - Updated S2 swatch tokens and added swatch-group tokens in S2 Color and S2 Non-color data sets, respectively.
641
+
642
+ ## Design Motivation
643
+
644
+ Swatch and swatch group components are being formalized as Spectrum 2 components. These tokens define the design data needed for implementation. Changes include updated corner rounding, colors and spacing for spacious density.
645
+
646
+ For more information, [view Jira ticket](https://jira.corp.adobe.com/browse/SDS-13497).
647
+
648
+ ## Token Diff
649
+
650
+ _Tokens added (3):_
651
+
652
+ - `swatch-group-spacing-spacious`
653
+ - `swatch-group-border-opacity`
654
+ - `swatch-group-border-color`
655
+
656
+ _Tokens values updated (3):_
657
+
658
+ - `swatch-border-color`: `gray-900` -> `gray-1000`
659
+ - `swatch-border-opacity`: `0.51` -> `0.42`
660
+ - `swatch-disabled-icon-border-opacity`: `0.51` -> `0.42`
661
+
662
+ ## 13.0.0-beta.41
663
+
664
+ ### Minor Changes
665
+
666
+ - [#375](https://github.com/adobe/spectrum-tokens/pull/375) [`6e3be6d`](https://github.com/adobe/spectrum-tokens/commit/6e3be6d8a458efa1752a8dd1360f03fa83f84c37) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - - [Updated thumbnail size tokens and added new tokens](https://github.com/adobe/spectrum-tokens-studio-data/pull/144)
667
+
668
+ - [Updated S2 Action bar tokens](https://github.com/adobe/spectrum-tokens-studio-data/pull/149)
669
+
670
+ ## Design Motivation
671
+
672
+ Thumbnail: updated sizes in order for opacity checkerboards to translate better in implementation.
673
+
674
+ ⚠️ Important note: Accepting updates from this release will update the thumbnail sizes. The change in size is no more than 4 px. In some cases, you may want to relink to a new size. View the migration guide below to find the closest recommended size:
675
+
676
+ | Former thumbnail size | Available thumbnail size |
677
+ | :-------------------- | :--------------------------------------- |
678
+ | size 50 (16 x 16) | size 50 (16 x 16) |
679
+ | size 75 (18 x 18) | size 75 (20 x 20) |
680
+ | size 100 (20 x 20) | size 75 (20 x 20) |
681
+ | size 200 (22 x 22) | size 100 (24 x 24) |
682
+ | size 300 (26 x 26) | size 200 (28 x 28) |
683
+ | size 400 (28 x 28) | size 200 (28 x 28) |
684
+ | size 500 (32 x 32) | size 300 (32 x 32) |
685
+ | size 600 (36 x 36) | size 400 (36 x 36) |
686
+ | size 700 (40 x 40) | size 500 (40 x 40) |
687
+ | size 800 (44 x 44) | size 600 (44 x 44) |
688
+ | size 900 (50 x 50) | size 700 (48 x 48) or size 800 (52 x 52) |
689
+ | size 1000 (56 x 56) | size 900 (56 x 56) |
690
+ | -- | size 1000 (64 x 64) |
691
+
692
+ Action bar: Updated S2 action bar (non-color) in respective desktop and mobile layout sets.
693
+
694
+ ## Token Diff
695
+
696
+ _Tokens added (8):_
697
+
698
+ - `action-bar-top-to-content-area`
699
+ - `action-bar-bottom-to-content-area`
700
+ - `action-bar-edge-to-content-area`
701
+ - `action-bar-close-button-to-counter`
702
+ - `action-bar-counter-font-size`
703
+ - `thumbnail-opacity-checkerboard-square-size`
704
+ - `thumbnail-corner-radius`
705
+ - `text-to-control-50`
706
+
707
+ _Tokens updated (2):_
708
+
709
+ - `action-bar-height`
710
+ - `action-bar-top-to-item-counter`
711
+
712
+ _Token values updated (11):_
713
+
714
+ - `thumbnail-size-75`
715
+ - `desktop`: `18px` -> `20px`
716
+ - `mobile`: `22px` -> `24px`
717
+ - `thumbnail-size-100`
718
+ - `desktop`: `20px` -> `24px`
719
+ - `mobile`: `26px` -> `28px`
720
+ - `thumbnail-size-200`
721
+ - `desktop`: `22px` -> `28px`
722
+ - `mobile`: `28px` -> `32px`
723
+ - `thumbnail-size-300`
724
+ - `desktop`: `26px` -> `32px`
725
+ - `mobile`: `32px` -> `36px`
726
+ - `thumbnail-size-400`
727
+ - `desktop`: `28px` -> `36px`
728
+ - `mobile`: `36px` -> `40px`
729
+ - `thumbnail-size-500`
730
+ - `desktop`: `32px` -> `40px`
731
+ - `mobile`: `40px` -> `44px`
732
+ - `thumbnail-size-600`
733
+ - `desktop`: `36px` -> `44px`
734
+ - `mobile`: `46px` -> `48px`
735
+ - `thumbnail-size-700`
736
+ - `desktop`: `40px` -> `48px`
737
+ - `mobile`: `50px` -> `52px`
738
+ - `thumbnail-size-800`
739
+ - `desktop`: `44px` -> `52px`
740
+ - `mobile`: `55px` -> `56px`
741
+ - `thumbnail-size-900`
742
+ - `desktop`: `50px` -> `56px`
743
+ - `mobile`: `62px` -> `64px`
744
+ - `thumbnail-size-1000`
745
+ - `desktop`: `56px` -> `64px`
746
+ - `mobile`: `70px` -> `72px`
747
+
748
+ ## 13.0.0-beta.40
749
+
750
+ ### Minor Changes
751
+
752
+ - [#373](https://github.com/adobe/spectrum-tokens/pull/373) [`e04bddf`](https://github.com/adobe/spectrum-tokens/commit/e04bddf65549c87cd314b54966fe066ae649b7f7) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - - Updated S2 accordion tokens (non-color) in respective desktop and mobile layout sets
753
+
754
+ - Added S2 meter tokens, including both color and non-color.
755
+
756
+ ## Design Motivation
757
+
758
+ - Accordion component is being formalized as a Spectrum 2 component. These net-new tokens define the design data needed for implementation. Introducing content-area-edge-to-content tokens enhances inclusivity for various design patterns. For more information, [view Jira ticket](https://jira.corp.adobe.com/browse/SDS-13435).
759
+ - Meter component is being formalized as a Spectrum 2 component. These net-new tokens define the design data needed for implementation. Introducing static tokens enables us to standardize the use of tokens across various components with indicators and tracks. This includes progress bars, progress circles, and potentially sliders in the future. For more information, [view Jira ticket](https://jira.corp.adobe.com/browse/SDS-13414).
760
+
761
+ ## Token Diff
762
+
763
+ _Tokens added (18):_
764
+
765
+ - `accordion-content-area-edge-to-content-extra-large`
766
+ - `accordion-content-area-edge-to-content-large`
767
+ - `accordion-content-area-edge-to-content-medium`
768
+ - `accordion-content-area-edge-to-content-small`
769
+ - `accordion-disclosure-indicator-to-text-extra-large`
770
+ - `accordion-disclosure-indicator-to-text-large`
771
+ - `accordion-disclosure-indicator-to-text-medium`
772
+ - `accordion-disclosure-indicator-to-text-small`
773
+ - `accordion-item-to-divider`
774
+ - `meter-thickness-extra-large`
775
+ - `meter-thickness-medium`
776
+ - `static-black-text-color`
777
+ - `static-black-track-color`
778
+ - `static-black-track-indicator-color`
779
+ - `static-white-text-color`
780
+ - `static-white-track-color`
781
+ - `static-white-track-indicator-color`
782
+ - `track-color`
783
+
784
+ _Newly deprecated tokens (2):_
785
+
786
+ - `accordion-edge-to-disclosure-indicator`
787
+ - `accordion-disclosure-indicator-to-text`
788
+
789
+ _Tokens updated (1):_
790
+
791
+ - `meter-thickness-large`
792
+
793
+ ## 13.0.0-beta.39
794
+
795
+ ### Minor Changes
796
+
797
+ - [#364](https://github.com/adobe/spectrum-tokens/pull/364) [`f96ffca`](https://github.com/adobe/spectrum-tokens/commit/f96ffca4990547f8ddc8341d141e0edc65b872d9) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Added coach-indicator s2 tokens
798
+
799
+ ## Token Diff
800
+
801
+ _Tokens added (8):_
802
+
803
+ - `coach-indicator-collapsed-gap`
804
+ - `coach-indicator-collapsed-ring-rounding-increment`
805
+ - `coach-indicator-collapsed-ring-thickness`
806
+ - `coach-indicator-color`
807
+ - `coach-indicator-expanded-gap`
808
+ - `coach-indicator-expanded-ring-rounding-increment`
809
+ - `coach-indicator-expanded-ring-thickness`
810
+ - `coach-indicator-opacity`
811
+
812
+ ## 13.0.0-beta.38
813
+
814
+ ### Minor Changes
815
+
816
+ - [#360](https://github.com/adobe/spectrum-tokens/pull/360) [`f73a0b4`](https://github.com/adobe/spectrum-tokens/commit/f73a0b40464f1c73f2d9e8f6cf97da926e392ac7) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - - Fixed token type from Sizing to Font size for contextual-help-body-size and `contextual-help-title-size`
817
+
818
+ - Renamed tokens by deprecating previous ones and creating new ones, with font in the token name
819
+ Updated value of `contextual-help-title-font-size`
820
+
821
+ Marked the the following tokens in Tokens Studio for deprecation:
822
+
823
+ - `negative-subdued-background-color-default` ( --> points to `negative-subtle-background-color-default`)
824
+ - `negative-subdued-background-color-hover`
825
+ - `negative-subdued-background-color-down`
826
+ - `negative-subdued-background-color-key-focus`
827
+
828
+ ## Design motivation
829
+
830
+ - The updated type sorts them correctly in the Tokens Studio data
831
+ - The updated value reflects the latest design for Spectrum 2, using the new title style instead of heading
832
+ - The negative-subdued tokens were deprecated because the tag "error" variant has been deprecated and are no longer needed in the system. A new "subtle" token has been added for the in-line alert use case.
833
+
834
+ ## Token diff
835
+
836
+ _Tokens added (2):_
837
+
838
+ - `contextual-help-body-font-size`
839
+ - `contextual-help-title-font-size`
840
+
841
+ _Newly deprecated Tokens (6):_
842
+
843
+ - `contextual-help-body-size`
844
+ - `contextual-help-title-size`
845
+ - `negative-subdued-background-color-default`
846
+ - `negative-subdued-background-color-hover`
847
+ - `negative-subdued-background-color-down`
848
+ - `negative-subdued-background-color-key-focus`
849
+
850
+ ## 13.0.0-beta.37
851
+
852
+ ### Minor Changes
853
+
854
+ - [#355](https://github.com/adobe/spectrum-tokens/pull/355) [`783a200`](https://github.com/adobe/spectrum-tokens/commit/783a200983efa8e1f2cc31fd40ac3ed7298bb312) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Updated tokens according to updated token spec for Spectrum 2, including new and deprecated tokens
855
+
856
+ ## Design Motivation
857
+
858
+ ### Change 1: Updated terminology to align with t-shirt sizes
859
+
860
+ Previously in S1, the breadcrumb variants were default, compact, and multiline. However, in S2, we have aligned breadcrumb to t-shirt sizes, resulting in the following changes:
861
+
862
+ - Breadcrumbs (default) -> Breadcrumbs (L)
863
+ - Breadcrumbs (compact) -> Breadcrumbs (M)
864
+ - Breadcrumbs (multiline) -> Breadcrumbs (multiline)
865
+
866
+ ### Change 2: Updated truncated menu button sizes and spacing
867
+
868
+ Other structural changes
869
+
870
+ - In S1 all variants used M sized action button – now we use S, M, L sized action buttons for respective sizes.
871
+ - In S1 all variants had same spacing 8px around chevron, now we use different spacings for all the three variants
872
+
873
+ ## Token Diff
874
+
875
+ _Tokens added (11):_
876
+
877
+ - `breadcrumbs-separator-to-bottom-text-multiline`
878
+ - `breadcrumbs-start-edge-to-text-large`
879
+ - `breadcrumbs-start-edge-to-text-medium`
880
+ - `breadcrumbs-start-edge-to-text-multiline`
881
+ - `breadcrumbs-top-to-separator-large`
882
+ - `breadcrumbs-top-to-separator-medium`
883
+ - `breadcrumbs-top-to-separator-multiline`
884
+ - `breadcrumbs-truncated-menu-to-separator`
885
+ - `breadcrumbs-text-to-separator-large`
886
+ - `breadcrumbs-text-to-separator-medium`
887
+ - `breadcrumbs-text-to-separator-multiline`
888
+
889
+ _Newly deprecated tokens (13):_
890
+
891
+ - `breadcrumbs-height`
892
+ - `breadcrumbs-height-compact`
893
+ - `breadcrumbs-top-to-text`
894
+ - `breadcrumbs-top-to-text-compact`
895
+ - `breadcrumbs-bottom-to-text`
896
+ - `breadcrumbs-bottom-to-text-compact`
897
+ - `breadcrumbs-start-edge-to-text`
898
+ - `breadcrumbs-top-to-separator-icon`
899
+ - `breadcrumbs-top-to-separator-icon-compact`
900
+ - `breadcrumbs-top-to-separator-icon-multiline`
901
+ - `breadcrumbs-separator-icon-to-bottom-text-multiline`
902
+ - `breadcrumbs-truncated-menu-to-separator-icon`
903
+ - `breadcrumbs-top-to-truncated-menu-compact`
904
+
905
+ _Token values updated (20):_
906
+
907
+ - `breadcrumbs-top-to-separator-icon-multiline`
908
+ - `breadcrumbs-top-to-text-multiline`
909
+ - `breadcrumbs-bottom-to-text-multiline`
910
+ - `breadcrumbs-height-multiline`
911
+ - `breadcrumbs-top-to-separator-icon-multiline`
912
+ - `breadcrumbs-top-to-text-multiline`
913
+ - `breadcrumbs-height`
914
+ - `breadcrumbs-height-compact`
915
+ - `breadcrumbs-truncated-menu-to-separator-icon`
916
+ - `breadcrumbs-truncated-menu-to-bottom-text`
917
+ - `breadcrumbs-bottom-to-text`
918
+ - `breadcrumbs-bottom-to-text-compact`
919
+ - `breadcrumbs-separator-icon-to-bottom-text-multiline`
920
+ - `breadcrumbs-start-edge-to-text`
921
+ - `breadcrumbs-top-to-separator-icon`
922
+ - `breadcrumbs-top-to-separator-icon-compact`
923
+ - `breadcrumbs-top-to-text`
924
+ - `breadcrumbs-top-to-text-compact`
925
+ - `breadcrumbs-top-to-truncated-menu`
926
+ - `breadcrumbs-top-to-truncated-menu-compact`
927
+
928
+ ## 13.0.0-beta.36
929
+
930
+ ### Minor Changes
931
+
932
+ - [#342](https://github.com/adobe/spectrum-tokens/pull/342) [`9da9532`](https://github.com/adobe/spectrum-tokens/commit/9da9532f1915070d289f7cce6f4e562c2565f889) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Newly defined S2 Icon colors by the Icons team were incorporated into our system. This includes updates to existing colors and new color additions. More details on icon colors can be found [in this document](https://paper.dropbox.com/doc/S2-Icon-colors-May-update--CPQCbAN3uvmfSCYV5UekAgYkAg-BqbGyRAAL87Ehoqm9WrCB) and [this Figma file](https://www.figma.com/design/KRqwJWgLuW4R7HwFUzKWiB/S2-Icon-color?node-id=0%3A1&t=jRZwm9gOH4dyLwL7-1).
933
+
934
+ ## Design motivation
935
+
936
+ Icons team defined new S2 color tokens needed for their iconography assets.
937
+
938
+ ## Token diff
939
+
940
+ _Tokens added (78):_
941
+
942
+ - `icon-color-blue-background`
943
+ - `icon-color-blue-primary-down`
944
+ - `icon-color-blue-primary-hover`
945
+ - `icon-color-brown-background`
946
+ - `icon-color-brown-primary-default`
947
+ - `icon-color-brown-primary-down`
948
+ - `icon-color-brown-primary-hover`
949
+ - `icon-color-celery-background`
950
+ - `icon-color-celery-primary-default`
951
+ - `icon-color-celery-primary-down`
952
+ - `icon-color-celery-primary-hover`
953
+ - `icon-color-chartreuse-background`
954
+ - `icon-color-chartreuse-primary-default`
955
+ - `icon-color-chartreuse-primary-down`
956
+ - `icon-color-chartreuse-primary-hover`
957
+ - `icon-color-cinnamon-background`
958
+ - `icon-color-cinnamon-primary-default`
959
+ - `icon-color-cinnamon-primary-down`
960
+ - `icon-color-cinnamon-primary-hover`
961
+ - `icon-color-cyan-background`
962
+ - `icon-color-cyan-primary-default`
963
+ - `icon-color-cyan-primary-down`
964
+ - `icon-color-cyan-primary-hover`
965
+ - `icon-color-disabled-primary`
966
+ - `icon-color-emphasized-background`
967
+ - `icon-color-fuchsia-background`
968
+ - `icon-color-fuchsia-primary-default`
969
+ - `icon-color-fuchsia-primary-down`
970
+ - `icon-color-fuchsia-primary-hover`
971
+ - `icon-color-green-background`
972
+ - `icon-color-green-primary-down`
973
+ - `icon-color-green-primary-hover`
974
+ - `icon-color-indigo-background`
975
+ - `icon-color-indigo-primary-default`
976
+ - `icon-color-indigo-primary-down`
977
+ - `icon-color-indigo-primary-hover`
978
+ - `icon-color-informative`
979
+ - `icon-color-inverse-background`
980
+ - `icon-color-magenta-background`
981
+ - `icon-color-magenta-primary-default`
982
+ - `icon-color-magenta-primary-down`
983
+ - `icon-color-magenta-primary-hover`
984
+ - `icon-color-negative`
985
+ - `icon-color-neutral`
986
+ - `icon-color-notice`
987
+ - `icon-color-orange-background`
988
+ - `icon-color-orange-primary-default`
989
+ - `icon-color-orange-primary-down`
990
+ - `icon-color-orange-primary-hover`
991
+ - `icon-color-pink-background`
992
+ - `icon-color-pink-primary-default`
993
+ - `icon-color-pink-primary-down`
994
+ - `icon-color-pink-primary-hover`
995
+ - `icon-color-positive`
996
+ - `icon-color-primary-down`
997
+ - `icon-color-primary-hover`
998
+ - `icon-color-purple-background`
999
+ - `icon-color-purple-primary-default`
1000
+ - `icon-color-purple-primary-down`
1001
+ - `icon-color-purple-primary-hover`
1002
+ - `icon-color-red-background`
1003
+ - `icon-color-red-primary-down`
1004
+ - `icon-color-red-primary-hover`
1005
+ - `icon-color-seafoam-background`
1006
+ - `icon-color-seafoam-primary-default`
1007
+ - `icon-color-seafoam-primary-down`
1008
+ - `icon-color-seafoam-primary-hover`
1009
+ - `icon-color-silver-background`
1010
+ - `icon-color-silver-primary-default`
1011
+ - `icon-color-silver-primary-down`
1012
+ - `icon-color-silver-primary-hover`
1013
+ - `icon-color-turquoise-background`
1014
+ - `icon-color-turquoise-primary-default`
1015
+ - `icon-color-turquoise-primary-down`
1016
+ - `icon-color-turquoise-primary-hover`
1017
+ - `icon-color-yellow-background`
1018
+ - `icon-color-yellow-primary-down`
1019
+ - `icon-color-yellow-primary-hover`
1020
+
1021
+ ## 13.0.0-beta.35
1022
+
1023
+ ### Minor Changes
1024
+
1025
+ - [#337](https://github.com/adobe/spectrum-tokens/pull/337) [`df2ab7e`](https://github.com/adobe/spectrum-tokens/commit/df2ab7ed77d385593342a3ced7bfded94bd8af8e) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Updated illustrated message and drop zone tokens
1026
+
1027
+ ## Design Motivation
1028
+
1029
+ - The previous tokens had the incorrect types. By fixing the type, they can reference the updated tokens that are replacing them.
1030
+ - Illustrated message now has three sizes (S, M, L) in Spectrum 2 to cover a wider range of use cases
1031
+ - Component font size tokens now specify font in the token name
1032
+
1033
+ ## Token Diff
1034
+
1035
+ _Tokens added (12):_
1036
+
1037
+ - `drop-zone-body-font-size`
1038
+ - `drop-zone-cjk-title-font-size`
1039
+ - `drop-zone-title-font-size`
1040
+ - `illustrated-message-large-body-font-size`
1041
+ - `illustrated-message-large-cjk-title-font-size`
1042
+ - `illustrated-message-large-title-font-size`
1043
+ - `illustrated-message-medium-body-font-size`
1044
+ - `illustrated-message-medium-cjk-title-font-size`
1045
+ - `illustrated-message-medium-title-font-size`
1046
+ - `illustrated-message-small-body-font-size`
1047
+ - `illustrated-message-small-cjk-title-font-size`
1048
+ - `illustrated-message-small-title-font-size`
1049
+
1050
+ _Newly deprecated tokens (6):_
1051
+
1052
+ - `drop-zone-body-size`
1053
+ - `drop-zone-cjk-title-size`
1054
+ - `drop-zone-title-size`
1055
+ - `illustrated-message-body-size`
1056
+ - `illustrated-message-cjk-title-size`
1057
+ - `illustrated-message-title-size`
1058
+
1059
+ _Token value updated (1):_
1060
+
1061
+ - `drop-zone-border-dash-gap`
1062
+
1063
+ ## 13.0.0-beta.34
1064
+
1065
+ ### Minor Changes
1066
+
1067
+ - [#334](https://github.com/adobe/spectrum-tokens/pull/334) [`4d28593`](https://github.com/adobe/spectrum-tokens/commit/4d28593c9d34414d72d78a1cc6c480d9ffdf82ce) Thanks [@nabuhasan](https://github.com/nabuhasan)! - S2 Popover tokens update
1068
+
1069
+ ## Token Diff
1070
+
1071
+ _Tokens added (3):_
1072
+
1073
+ - `popover-border-color`
1074
+ - `popover-border-opacity`
1075
+ - `popover-edge-to-content-area`
1076
+
1077
+ _Newly deprecated token (1):_
1078
+
1079
+ - `popover-top-to-content-area`
1080
+
1081
+ ## 13.0.0-beta.33
1082
+
1083
+ ### Minor Changes
1084
+
1085
+ - [#331](https://github.com/adobe/spectrum-tokens/pull/331) [`0bbfedb`](https://github.com/adobe/spectrum-tokens/commit/0bbfedb9dbb63fdd5b20e91f65b3f958a833313b) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - S2 Menu token updates
1086
+
1087
+ ## Token Diff
1088
+
1089
+ _Tokens added (23):_
1090
+
1091
+ - `link-out-icon-size-100`
1092
+ - `link-out-icon-size-200`
1093
+ - `link-out-icon-size-75`
1094
+ - `menu-item-background-color-default`
1095
+ - `menu-item-background-color-disabled`
1096
+ - `menu-item-background-color-down`
1097
+ - `menu-item-background-color-hover`
1098
+ - `menu-item-background-color-keyboard-focus`
1099
+ - `menu-item-background-opacity`
1100
+ - `menu-item-label-to-description`
1101
+ - `menu-item-label-to-description-extra-large`
1102
+ - `menu-item-label-to-description-large`
1103
+ - `menu-item-label-to-description-medium`
1104
+ - `menu-item-label-to-description-small`
1105
+ - `menu-item-top-to-thumbnail-extra-large`
1106
+ - `menu-item-top-to-thumbnail-large`
1107
+ - `menu-item-top-to-thumbnail-medium`
1108
+ - `menu-item-top-to-thumbnail-small`
1109
+ - `menu-section-header-to-description-extra-large`
1110
+ - `menu-section-header-to-description-large`
1111
+ - `menu-section-header-to-description-medium`
1112
+ - `menu-section-header-to-description-small`
1113
+ - `text-to-visual-400`
1114
+
1115
+ _Token values updated (1):_
1116
+
1117
+ - `menu-item-section-divider-height`
1118
+
1119
+ ## 13.0.0-beta.32
1120
+
1121
+ ### Minor Changes
1122
+
1123
+ - [#325](https://github.com/adobe/spectrum-tokens/pull/325) [`095248e`](https://github.com/adobe/spectrum-tokens/commit/095248e26bdd1c8b65a61f3793646bb44093c38b) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Added semantic aliases used by in-line alert.
1124
+
1125
+ ## Token Diff
1126
+
1127
+ _Tokens added (5):_
1128
+
1129
+ - `informative-subtle-background-color-default`
1130
+ - `negative-subtle-background-color-default`
1131
+ - `neutral-subtle-background-color-default`
1132
+ - `notice-subtle-background-color-default`
1133
+ - `positive-subtle-background-color-default`
1134
+
1135
+ ## 13.0.0-beta.31
1136
+
1137
+ ### Minor Changes
1138
+
1139
+ - [#327](https://github.com/adobe/spectrum-tokens/pull/327) [`3caa31d`](https://github.com/adobe/spectrum-tokens/commit/3caa31d014a3d49496422c38a93c3c7645da0373) Thanks [@GarthDB](https://github.com/GarthDB)! - Added `private` metadata to global tokens.
1140
+
1141
+ ## 13.0.0-beta.30
1142
+
1143
+ ### Minor Changes
1144
+
1145
+ - [#321](https://github.com/adobe/spectrum-tokens/pull/321) [`e392c49`](https://github.com/adobe/spectrum-tokens/commit/e392c497a4d474c9619a882ad9ab4948441712e0) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Added new Standard dialog, status light, and updated alert-banner-top-to-workflow-icon tokens
1146
+
1147
+ ## Token Diff
1148
+
1149
+ _Tokens added (10):_
1150
+
1151
+ - `standard-dialog-body-font-size`
1152
+ - `standard-dialog-maximum-width-large`
1153
+ - `standard-dialog-maximum-width-medium`
1154
+ - `standard-dialog-maximum-width-small`
1155
+ - `standard-dialog-minimum-width`
1156
+ - `standard-dialog-title-font-size`
1157
+ - `status-light-text-to-visual-100`
1158
+ - `status-light-text-to-visual-200`
1159
+ - `status-light-text-to-visual-300`
1160
+ - `status-light-text-to-visual-75`
1161
+
1162
+ _Token values updated (10):_
1163
+
1164
+ - `alert-banner-to-top-workflow-icon`
1165
+ - `alert-banner-top-to-workflow-icon`
1166
+ - `status-light-dot-size-extra-large`
1167
+ - `status-light-dot-size-large`
1168
+ - `status-light-dot-size-medium`
1169
+ - `status-light-top-to-dot-extra-large`
1170
+ - `status-light-top-to-dot-large`
1171
+ - `status-light-top-to-dot-medium`
1172
+ - `status-light-top-to-dot-small`
1173
+ - `status-light-dot-size-small`
1174
+
1175
+ ## 13.0.0-beta.29
1176
+
1177
+ ### Minor Changes
1178
+
1179
+ - [#319](https://github.com/adobe/spectrum-tokens/pull/319) [`5f962fc`](https://github.com/adobe/spectrum-tokens/commit/5f962fc864c516213db58bece2c47a74c68cc985) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - Updated values for component pill edge to visual only tokens for both desktop and mobile.
1180
+
1181
+ These values are updated based on the new workflow icon size.
1182
+
1183
+ ## Token Diff
1184
+
1185
+ _Token values updated (4):_
1186
+
1187
+ - `component-pill-edge-to-visual-only-100`
1188
+ - `component-pill-edge-to-visual-only-200`
1189
+ - `component-pill-edge-to-visual-only-300`
1190
+ - `component-pill-edge-to-visual-only-75`
1191
+
1192
+ - [#316](https://github.com/adobe/spectrum-tokens/pull/316) [`664ab0b`](https://github.com/adobe/spectrum-tokens/commit/664ab0bba68b9f4752599ed73c98b5d339414478) Thanks [@mrcjhicks](https://github.com/mrcjhicks)! - S2 Color loupe tokens update (color-only)
1193
+
1194
+ ## Token Diff
1195
+
1196
+ _Newly deprecated tokens (2):_
1197
+
1198
+ - `color-loupe-drop-shadow-color`
1199
+ - `drop-shadow-color`
1200
+
1201
+ ## 13.0.0-beta.28
1202
+
1203
+ ### Patch Changes
1204
+
1205
+ - 1150331: Removed duplicate tokens from src files.
1206
+
1207
+ ## 13.0.0-beta.27
1208
+
1209
+ ### Minor Changes
1210
+
1211
+ - 3236495: Updated coach mark tokens for both desktop and mobile
1212
+
1213
+ ## Token Diff
1214
+
1215
+ _Tokens added (6):_
1216
+
1217
+ - `coach-mark-body-font-size`
1218
+ - `coach-mark-pagination-body-font-size`
1219
+ - `coach-mark-title-font-size`
1220
+
1221
+ _Newly deprecated tokens (3):_
1222
+
1223
+ - `coach-mark-body-size`
1224
+ - `coach-mark-pagination-body-size`
1225
+ - `coach-mark-title-size`
1226
+
1227
+ ## 13.0.0-beta.26
1228
+
1229
+ ### Minor Changes
1230
+
1231
+ - b59fa8f: Updated alert dialog tokens
1232
+
1233
+ ## Token Diff
1234
+
1235
+ _Tokens added (4):_
1236
+
1237
+ - `alert-dialog-description-font-size`
1238
+ - `alert-dialog-description-size`
1239
+ - `alert-dialog-title-font-size`
1240
+ - `alert-dialog-title-size`
1241
+
1242
+ _Newly deprecated tokens (2):_
1243
+
1244
+ - `alert-dialog-description-size`
1245
+ - `alert-dialog-title-size`
1246
+
1247
+ ## 13.0.0-beta.25
1248
+
1249
+ ### Minor Changes
1250
+
1251
+ - e79ddd6: S2 Combo box, In-field button and In-field progress circle updates
1252
+
1253
+ ## Motivation and context
1254
+
1255
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1256
+
1257
+ ## Token Diff
1258
+
1259
+ _Tokens added (15):_
1260
+
1261
+ - `combo-box-visual-to-field-button`
1262
+ - `combo-box-visual-to-field-button-extra-large`
1263
+ - `combo-box-visual-to-field-button-large`
1264
+ - `combo-box-visual-to-field-button-medium`
1265
+ - `combo-box-visual-to-field-button-quiet`
1266
+ - `combo-box-visual-to-field-button-small`
1267
+ - `in-field-button-edge-to-fill-extra-large`
1268
+ - `in-field-button-edge-to-fill-large`
1269
+ - `in-field-button-edge-to-fill-medium`
1270
+ - `in-field-button-edge-to-fill-small`
1271
+ - `in-field-progress-circle-edge-to-fill`
1272
+ - `in-field-progress-circle-size-100`
1273
+ - `in-field-progress-circle-size-200`
1274
+ - `in-field-progress-circle-size-300`
1275
+ - `in-field-progress-circle-size-75`
1276
+
1277
+ _Newly deprecated tokens (6):_
1278
+
1279
+ - `combo-box-quiet-minimum-width-multiplier`
1280
+ - `combo-box-visual-to-field-button-small`
1281
+ - `combo-box-visual-to-field-button-medium`
1282
+ - `combo-box-visual-to-field-button-large`
1283
+ - `combo-box-visual-to-field-button-extra-large`
1284
+ - `in-field-button-edge-to-fill`
1285
+
1286
+ - e79ddd6: S2 Color loupe tokens update
1287
+
1288
+ ## Design Motivation
1289
+
1290
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1291
+
1292
+ ## Token Diff
1293
+
1294
+ _Newly deprecated tokens (2):_
1295
+
1296
+ - `color-loupe-drop-shadow-blur`
1297
+ - `color-loupe-drop-shadow-y`
1298
+
1299
+ ## 13.0.0-beta.24
1300
+
1301
+ ### Major Changes
1302
+
1303
+ - 1c8f7ab: Renamed previous drop shadow tokens from S1 and pointed them to the new `100` S2 drop shadow tokens
1304
+ Added new drop shadow tokens, `100`, `200`, `emphasized-default`, `emphasized-hover`, `elevated`.
1305
+
1306
+ ## Design Motivation
1307
+
1308
+ These tokens reflect the updates to drop tokens foundations in Spectrum 2, allowing more options and flexibility of usage in containers
1309
+
1310
+ ## Token Diff
1311
+
1312
+ _Tokens added (24):_
1313
+
1314
+ - `drop-shadow-blur`
1315
+ - `drop-shadow-blur-100`
1316
+ - `drop-shadow-blur-200`
1317
+ - `drop-shadow-color`
1318
+ - `drop-shadow-color-100`
1319
+ - `drop-shadow-color-200`
1320
+ - `drop-shadow-elevated-blur`
1321
+ - `drop-shadow-elevated-color`
1322
+ - `drop-shadow-elevated-x`
1323
+ - `drop-shadow-elevated-y`
1324
+ - `drop-shadow-emphasized-default-blur`
1325
+ - `drop-shadow-emphasized-default-color`
1326
+ - `drop-shadow-emphasized-default-x`
1327
+ - `drop-shadow-emphasized-default-y`
1328
+ - `drop-shadow-emphasized-hover-blur`
1329
+ - `drop-shadow-emphasized-hover-color`
1330
+ - `drop-shadow-emphasized-hover-x`
1331
+ - `drop-shadow-emphasized-hover-y`
1332
+ - `drop-shadow-x`
1333
+ - `drop-shadow-x-100`
1334
+ - `drop-shadow-x-200`
1335
+ - `drop-shadow-y`
1336
+ - `drop-shadow-y-100`
1337
+ - `drop-shadow-y-200`
1338
+
1339
+ _Tokens deleted (2):_
1340
+
1341
+ - `drop-shadow-blur`
1342
+ - `drop-shadow-y`
1343
+
1344
+ _Token values updated (2):_
1345
+
1346
+ - `color-handle-drop-shadow-color`
1347
+ - `drop-shadow-color`
1348
+
1349
+ ### Minor Changes
1350
+
1351
+ - 3230aba: Updated and added S2 drop shadow tokens
1352
+
1353
+ ## Design Motivation
1354
+
1355
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1356
+
1357
+ ## Token Diff
1358
+
1359
+ _Tokens added (7):_
1360
+
1361
+ - `field-default-width-extra-large`
1362
+ - `field-default-width-large`
1363
+ - `field-default-width-medium`
1364
+ - `field-default-width-small`
1365
+ - `tag-minimum-width-large`
1366
+ - `tag-minimum-width-medium`
1367
+ - `tag-minimum-width-small`
1368
+
1369
+ _Token values updated (4):_
1370
+
1371
+ - `field-top-to-progress-circle-extra-large`
1372
+ - `field-top-to-progress-circle-large`
1373
+ - `field-top-to-progress-circle-medium`
1374
+ - `field-top-to-progress-circle-small`
1375
+
1376
+ _Newly Deprecated Tokens (4):_
1377
+
1378
+ - `field-width-extra-large`
1379
+ - `field-width-large`
1380
+ - `field-width-medium`
1381
+ - `field-width-small`
1382
+
1383
+ ## 13.0.0-beta.23
1384
+
1385
+ ### Patch Changes
1386
+
1387
+ - 936f608: Fixed misnamed accordion token.
1388
+
1389
+ ## Token Diff
1390
+
1391
+ _Tokens added (1):_
1392
+
1393
+ - `accordion-top-to-text-spacious-small`
1394
+
1395
+ _Newly deprecated token (1):_
1396
+
1397
+ - `accordion-small-top-to-text-spacious`
1398
+
1399
+ ## 13.0.0-beta.22
1400
+
1401
+ ### Minor Changes
1402
+
1403
+ - c42448c: Updated and added alert dialog tokens for both desktop and mobile.
1404
+
1405
+ ## Design Motivation
1406
+
1407
+ Title text in alert dialog is now using the new Title typography token. Also updated the size for description text, and added a new token for top to alert icon.
1408
+
1409
+ Title is a new typography style for Spectrum 2, and has a default `title-color` token.
1410
+
1411
+ ## Token Diff
1412
+
1413
+ _Tokens added (2):_
1414
+
1415
+ - `alert-banner-top-to-alert-icon`
1416
+ - `title-color`
1417
+
1418
+ _Token values updated (2):_
1419
+
1420
+ - `alert-dialog-description-size`
1421
+ - `alert-dialog-title-size`
1422
+
1423
+ - 46a801c: Added tokens for S2 title color
1424
+
1425
+ ## 13.0.0-beta.21
1426
+
1427
+ ### Minor Changes
1428
+
1429
+ - d71bea1: S2 Opacity checkerboard non-color token updates
1430
+
1431
+ ## Design Motivation
1432
+
1433
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1434
+
1435
+ ## Token Diff
1436
+
1437
+ _Tokens added (2):_
1438
+
1439
+ - `opacity-checkerboard-square-size-medium`
1440
+ - `opacity-checkerboard-square-size-small`
1441
+
1442
+ _Newly deprecated token (1):_
1443
+
1444
+ - `opacity-checkerboard-square-size`
1445
+
1446
+ ## 13.0.0-beta.20
1447
+
1448
+ ### Minor Changes
1449
+
1450
+ - fb61f17: Added Title typography tokens
1451
+
1452
+ ## Design Motivation
1453
+
1454
+ Adding new typography styles for Title. While the Heading style is for the loudest, most broad message, there are still going to be other important items in your information hierarchy. The Title style is for text that’s communicating other need-to-know concepts. It’s often set in Bold weight, and it has a range of font sizes that can be paired with Body and Detail sizes to create visual balance. File names, cards, user names, panels, and other high-signal concepts in interfaces use the Title style.
1455
+
1456
+ ## Token Diff
1457
+
1458
+ _Tokens added (45):_
1459
+
1460
+ - `title-cjk-emphasized-font-style`
1461
+ - `title-cjk-emphasized-font-weight`
1462
+ - `title-cjk-font-family`
1463
+ - `title-cjk-font-style`
1464
+ - `title-cjk-font-weight`
1465
+ - `title-cjk-line-height`
1466
+ - `title-cjk-size-l`
1467
+ - `title-cjk-size-m`
1468
+ - `title-cjk-size-s`
1469
+ - `title-cjk-size-xl`
1470
+ - `title-cjk-size-xs`
1471
+ - `title-cjk-size-xxl`
1472
+ - `title-cjk-size-xxxl`
1473
+ - `title-cjk-strong-emphasized-font-style`
1474
+ - `title-cjk-strong-emphasized-font-weight`
1475
+ - `title-cjk-strong-font-style`
1476
+ - `title-cjk-strong-font-weight`
1477
+ - `title-line-height`
1478
+ - `title-margin-bottom-multiplier`
1479
+ - `title-margin-top-multiplier`
1480
+ - `title-sans-serif-emphasized-font-style`
1481
+ - `title-sans-serif-emphasized-font-weight`
1482
+ - `title-sans-serif-font-family`
1483
+ - `title-sans-serif-font-style`
1484
+ - `title-sans-serif-font-weight`
1485
+ - `title-sans-serif-strong-emphasized-font-style`
1486
+ - `title-sans-serif-strong-emphasized-font-weight`
1487
+ - `title-sans-serif-strong-font-style`
1488
+ - `title-sans-serif-strong-font-weight`
1489
+ - `title-serif-emphasized-font-style`
1490
+ - `title-serif-emphasized-font-weight`
1491
+ - `title-serif-font-family`
1492
+ - `title-serif-font-style`
1493
+ - `title-serif-font-weight`
1494
+ - `title-serif-strong-emphasized-font-style`
1495
+ - `title-serif-strong-emphasized-font-weight`
1496
+ - `title-serif-strong-font-style`
1497
+ - `title-serif-strong-font-weight`
1498
+ - `title-size-l`
1499
+ - `title-size-m`
1500
+ - `title-size-s`
1501
+ - `title-size-xl`
1502
+ - `title-size-xs`
1503
+ - `title-size-xxl`
1504
+ - `title-size-xxxl`
1505
+
1506
+ ## 13.0.0-beta.19
1507
+
1508
+ ### Minor Changes
1509
+
1510
+ - 723d3b0: Updated, added, and deprecated tokens for text field and text area.
1511
+
1512
+ ## Design Motivation
1513
+
1514
+ Updating text field and text area for Spectrum 2.
1515
+
1516
+ ## Token Diff
1517
+
1518
+ _Tokens added (4):_
1519
+
1520
+ - `field-width-small`
1521
+ - `field-width-medium`
1522
+ - `field-width-large`
1523
+ - `field-width-extra-large`
1524
+
1525
+ _Updated token values (4):_
1526
+
1527
+ - `side-label-character-count-top-margin-small`
1528
+ - `side-label-character-count-top-margin-medium`
1529
+ - `side-label-character-count-top-margin-large`
1530
+ - `side-label-character-count-top-margin-extra-large`
1531
+
1532
+ _Newly deprecated tokens (8):_
1533
+
1534
+ - `field-width`
1535
+ - `field-edge-to-text-quiet`
1536
+ - `field-edge-to-border-quiet`
1537
+ - `field-edge-to-alert-icon-quiet`
1538
+ - `field-edge-to-validation-icon-quiet`
1539
+ - `field-label-to-component-quiet-small`
1540
+ - `field-label-to-component-quiet-medium`
1541
+ - `field-label-to-component-quiet-large`
1542
+ - `field-label-to-component-quiet-extra-large`
1543
+ - `character-count-to-field-quiet-small`
1544
+ - `character-count-to-field-quiet-medium`
1545
+ - `character-count-to-field-quiet-large`
1546
+ - `character-count-to-field-quiet-extra-large`
1547
+
1548
+ - 66b1edf: Updated color of color-area-border-color token from gray.900 to gray.1000 in both light and dark sets.
1549
+
1550
+ ## Design motivation
1551
+
1552
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1553
+
1554
+ ## Token Diff
1555
+
1556
+ _Token value updated (1):_
1557
+
1558
+ - `color-area-border-color`
1559
+
1560
+ - 7b5f18b: Update alert banner for Spectrum 2
1561
+
1562
+ ## Design Motivation
1563
+
1564
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1565
+
1566
+ ## Token Diff
1567
+
1568
+ _Token values updated (5):_
1569
+
1570
+ - `alert-banner-bottom-to-text`
1571
+ - `alert-banner-minimum-height`
1572
+ - `alert-banner-top-to-text`
1573
+ - `alert-banner-top-to-workflow-icon`
1574
+ - `search-field-minimum-width-multiplier`
1575
+
1576
+ - 4a84fdd: Spectrum 2 Toast Tokens
1577
+
1578
+ ## Design motivation
1579
+
1580
+ Updated the `color-area-border-rounding` token type from spacing to borderRadius and adjusted value referenced, desktop and mobile scale.
1581
+
1582
+ These changes occurred as a result of scaling things for S2 design language and experiences.
1583
+
1584
+ ## Token Diff
1585
+
1586
+ _Token values updated (5):_
1587
+
1588
+ - `toast-height`
1589
+ - `toast-top-to-workflow-icon`
1590
+ - `toast-top-to-text`
1591
+ - `toast-bottom-to-text`
1592
+ - `color-area-border-rounding`
1593
+
1594
+ ## 13.0.0-beta.18
1595
+
1596
+ ### Minor Changes
1597
+
1598
+ - 940bd78: Updated background aliases in dark theme; added new non-semantic colors
1599
+
1600
+ ## Design Motivation
1601
+
1602
+ The existing background colors were updated for better consistency across semantic and non-semantic variants of the Badge component. The colors also introduce some general improved contrast in dark theme across other components using these aliases.
1603
+ The new non-semantic visual and background colors were added because new hues were introduced. These colors will be used in status light and badge components, respectively.
1604
+
1605
+ ## Token Diff
1606
+
1607
+ _Tokens added (10):_
1608
+
1609
+ - `brown-background-color-default`
1610
+ - `brown-visual-color`
1611
+ - `cinnamon-background-color-default`
1612
+ - `cinnamon-visual-color`
1613
+ - `pink-background-color-default`
1614
+ - `pink-visual-color`
1615
+ - `silver-background-color-default`
1616
+ - `silver-visual-color`
1617
+ - `turquoise-background-color-default`
1618
+ - `turquoise-visual-color`
1619
+
1620
+ _Token values updated (27):_
1621
+
1622
+ - `accent-background-color-default`
1623
+ - `accent-background-color-down`
1624
+ - `accent-background-color-hover`
1625
+ - `accent-background-color-key-focus`
1626
+ - `celery-background-color-default`
1627
+ - `chartreuse-background-color-default`
1628
+ - `gray-background-color-default`
1629
+ - `informative-background-color-default`
1630
+ - `informative-background-color-down`
1631
+ - `informative-background-color-hover`
1632
+ - `informative-background-color-key-focus`
1633
+ - `negative-background-color-default`
1634
+ - `negative-background-color-down`
1635
+ - `negative-background-color-hover`
1636
+ - `negative-background-color-key-focus`
1637
+ - `neutral-subdued-background-color-default`
1638
+ - `neutral-subdued-background-color-down`
1639
+ - `neutral-subdued-background-color-hover`
1640
+ - `neutral-subdued-background-color-key-focus`
1641
+ - `notice-background-color-default`
1642
+ - `orange-background-color-default`
1643
+ - `positive-background-color-default`
1644
+ - `positive-background-color-down`
1645
+ - `positive-background-color-hover`
1646
+ - `positive-background-color-key-focus`
1647
+ - `table-selected-row-background-color`
1648
+ - `yellow-background-color-default`
1649
+
1650
+ ## 13.0.0-beta.17
1651
+
1652
+ ### Minor Changes
1653
+
1654
+ - 9072ae7: `color-slider-border-color` token was updated to reference `gray-1000` instead of `gray-90`0 in both light and dark themes.
1655
+ - 912e307: Updated `color-slider-border-rounding` token to use 7px instead of 4px in desktop only.
1656
+ This token value update is the same value used by alias token: `corner-radius-medium-size-small`.
1657
+
1658
+ ## Design Motivation
1659
+
1660
+ S2 color slider design changes.
1661
+
1662
+ ## Token Diff
1663
+
1664
+ _Token values updated (2):_
1665
+
1666
+ - `color-slider-border-color`
1667
+ - `color-slider-border-rounding`
1668
+
1669
+ ## 13.0.0-beta.16
1670
+
1671
+ ### Minor Changes
1672
+
1673
+ - 80a3fec: New non-color tokens for S2 tag component added to both desktop and mobile layout.component sets.
1674
+
1675
+ ## Design Motivation
1676
+
1677
+ New values for tag component for S2.
1678
+
1679
+ ## Token Diff
1680
+
1681
+ _Tokens added (9):_
1682
+
1683
+ - `tag-edge-to-clear-icon-large`
1684
+ - `tag-edge-to-clear-icon-medium`
1685
+ - `tag-edge-to-clear-icon-small`
1686
+ - `tag-label-clear-icon-large`
1687
+ - `tag-label-to-clear-icon-large`
1688
+ - `tag-label-to-clear-icon-medium`
1689
+ - `tag-label-to-clear-icon-small`
1690
+ - `tag-maximum-width-multiplier`
1691
+ - `tag-minimum-width-multiplier`
1692
+
1693
+ ## 13.0.0-beta.15
1694
+
1695
+ ### Minor Changes
1696
+
1697
+ - c7c1d81: Added new semantic color aliases to Tokens Studio, in the S2 color tokens, alias sets for both light and dark themes.
1698
+ - 4b78009: Updated values and added new tokens for Switch.
1699
+
1700
+ ## Design Motivation
1701
+
1702
+ New negative-subdued background tokens were needed for negative and not selected tag components.
1703
+
1704
+ Added new tokens: `switch-handle-size-_` and `switch-handle-selected-size-_` for both desktop and mobile.
1705
+ Update token values on: `switch-control-width-_` and `switch-control-height-_` for both desktop and mobile.
1706
+
1707
+ The design for Switch in S2 has changed and now has a border when it's not selected. New handle sizes are added and control sizes have been updated.
1708
+
1709
+ ## Token Diff
1710
+
1711
+ _Tokens added (12):_
1712
+
1713
+ - `negative-subdued-background-color-default`
1714
+ - `negative-subdued-background-color-down`
1715
+ - `negative-subdued-background-color-hover`
1716
+ - `negative-subdued-background-color-key-focus`
1717
+ - `switch-handle-selected-size-extra-large`
1718
+ - `switch-handle-selected-size-large`
1719
+ - `switch-handle-selected-size-medium`
1720
+ - `switch-handle-selected-size-small`
1721
+ - `switch-handle-size-extra-large`
1722
+ - `switch-handle-size-large`
1723
+ - `switch-handle-size-medium`
1724
+ - `switch-handle-size-small`
1725
+
1726
+ _Token values updated (8):_
1727
+
1728
+ - `switch-control-height-extra-large`
1729
+ - `switch-control-height-large`
1730
+ - `switch-control-height-medium`
1731
+ - `switch-control-height-small`
1732
+ - `switch-control-width-extra-large`
1733
+ - `switch-control-width-large`
1734
+ - `switch-control-width-medium`
1735
+ - `switch-control-width-small`
1736
+
1737
+ ## 13.0.0-beta.14
1738
+
1739
+ ### Minor Changes
1740
+
1741
+ - f004b0c: The tokens listed in the diff below had identical values between sets and so were merged to single values to simplify the data.
1742
+
1743
+ ## Token Diff
1744
+
1745
+ _Tokens values updated (46):_
1746
+
1747
+ - `accordion-disclosure-indicator-to-text`
1748
+ - `accordion-edge-to-disclosure-indicator`
1749
+ - `accordion-edge-to-text`
1750
+ - `accordion-focus-indicator-gap`
1751
+ - `accordion-top-to-text-compact-medium`
1752
+ - `accordion-top-to-text-compact-small`
1753
+ - `action-button-edge-to-hold-icon-extra-small`
1754
+ - `action-button-edge-to-hold-icon-small`
1755
+ - `asterisk-icon-size-75`
1756
+ - `background-base-color`
1757
+ - `background-layer-1-color`
1758
+ - `color-area-border-rounding`
1759
+ - `corner-radius-0`
1760
+ - `corner-radius-100`
1761
+ - `corner-radius-1000`
1762
+ - `corner-radius-200`
1763
+ - `corner-radius-300`
1764
+ - `corner-radius-400`
1765
+ - `corner-radius-500`
1766
+ - `corner-radius-600`
1767
+ - `corner-radius-700`
1768
+ - `corner-radius-75`
1769
+ - `corner-radius-800`
1770
+ - `corner-radius-extra-large-default`
1771
+ - `corner-radius-full`
1772
+ - `corner-radius-large-default`
1773
+ - `corner-radius-medium-default`
1774
+ - `corner-radius-medium-size-extra-large`
1775
+ - `corner-radius-medium-size-extra-small`
1776
+ - `corner-radius-medium-size-large`
1777
+ - `corner-radius-medium-size-medium`
1778
+ - `corner-radius-medium-size-small`
1779
+ - `corner-radius-none`
1780
+ - `corner-radius-small-default`
1781
+ - `corner-radius-small-size-extra-large`
1782
+ - `corner-radius-small-size-large`
1783
+ - `corner-radius-small-size-medium`
1784
+ - `corner-radius-small-size-small`
1785
+ - `drop-shadow-x`
1786
+ - `field-label-top-margin-extra-large`
1787
+ - `field-label-top-margin-large`
1788
+ - `field-label-top-margin-medium`
1789
+ - `field-label-top-margin-small`
1790
+ - `gray-background-color-default`
1791
+ - `status-light-dot-size-small`
1792
+ - `table-edge-to-content`
1793
+
1794
+ ## 13.0.0-beta.13
1795
+
1796
+ ### Minor Changes
1797
+
1798
+ - ef600c4: ## Design Motivation
1799
+
1800
+ - The updated tooltip component in Spectrum 2 has a larger, slightly rounded tip
1801
+ - Added tokens for horizontal and vertical orientation
1802
+
1803
+ ## Tokens Diff
1804
+
1805
+ _Tokens added (3):_
1806
+
1807
+ - `divider-horizontal-minimum-width`
1808
+ - `divider-vertical-minimum-height`
1809
+ - `tooltip-tip-corner-radius`
1810
+
1811
+ _Token values updated (2):_
1812
+
1813
+ - `tooltip-tip-height`
1814
+ - `tooltip-tip-width`
1815
+
1816
+ ## 13.0.0-beta.12
1817
+
1818
+ ### Minor Changes
1819
+
1820
+ - c87d743: Updates to spacing tokens for the S2 field label component include:
1821
+
1822
+ Token: field-label-top-to-asterisk-[medium, large, extra-large]. Only value for extra-large token required updating in the desktop scale. All other sizes presented accurate values.
1823
+
1824
+ Token: field-label-top-margin-[medium, large, extra-large]. All values were updated to reflect 0px for both desktop and mobile scales
1825
+
1826
+ ## Design Motivation
1827
+
1828
+ These changes occurred as a result of updates to the field label component for S2.
1829
+
1830
+ ## Token Diff
1831
+
1832
+ _Token values updated (4):_
1833
+
1834
+ - `field-label-top-margin-extra-large`
1835
+ - `field-label-top-margin-large`
1836
+ - `field-label-top-margin-medium`
1837
+ - `field-label-top-to-asterisk-extra-large`
1838
+
1839
+ ## Schema Diff
1840
+
1841
+ Adds missing schema information for `corner-radius-1000`. Also added `schemas/token-types/multiplier.json` to the `scale-set` schema.
1842
+
1843
+ ## 13.0.0-beta.11
1844
+
1845
+ ### Minor Changes
1846
+
1847
+ - 3c6303a: Updated text-to-visual-300 mobile value from 11px to 10px.
1848
+
1849
+ ## Design Motivation
1850
+
1851
+ To better follow our logarithmic scale rounding principle.
1852
+
1853
+ ## Token Diff
1854
+
1855
+ _Token values updated (1):_
1856
+
1857
+ - `text-to-visual-300`
1858
+
1859
+ - 6579966: existing corner-radius tokens, adding net-new global corner radius tokens, and introducing new alias names that point to these global values.
1860
+
1861
+ ## Design Motivation
1862
+
1863
+ More on Spectrum 2 rounding: https://s2.spectrum.corp.adobe.com/page/object-styles/#rounding
1864
+
1865
+ In Spectrum 2, rounding also applies to the different t-shirt sized components and varies based on a Major Second logarithmic scale, rounded to whole numbers to avoid using half-pixels. This allows for components to retain a consistent and identifiable shape at all sizes. Because of this there are now component size specific tokens like corner-radius-small-size-medium or corner-radius-medium-size-extra-large to help us keep track of the nuance within t-shirt sizes.
1866
+
1867
+ ## Token Diff
1868
+
1869
+ _Tokens added (23):_
1870
+
1871
+ - `corner-radius-0`
1872
+ - `corner-radius-300`
1873
+ - `corner-radius-400`
1874
+ - `corner-radius-500`
1875
+ - `corner-radius-600`
1876
+ - `corner-radius-700`
1877
+ - `corner-radius-800`
1878
+ - `corner-radius-1000`
1879
+ - `corner-radius-extra-large-default`
1880
+ - `corner-radius-full`
1881
+ - `corner-radius-large-default`
1882
+ - `corner-radius-medium-default`
1883
+ - `corner-radius-medium-size-extra-small`
1884
+ - `corner-radius-medium-size-small`
1885
+ - `corner-radius-medium-size-medium`
1886
+ - `corner-radius-medium-size-large`
1887
+ - `corner-radius-medium-size-extra-large`
1888
+ - `corner-radius-none`
1889
+ - `corner-radius-small-default`
1890
+ - `corner-radius-small-size-small`
1891
+ - `corner-radius-small-size-medium`
1892
+ - `corner-radius-small-size-large`
1893
+ - `corner-radius-small-size-extra-large`
1894
+
1895
+ _Token values updated (3):_
1896
+
1897
+ - `corner-radius-75`
1898
+ - `corner-radius-100`
1899
+ - `corner-radius-200`
1900
+
1901
+ ## 13.0.0-beta.10
1902
+
1903
+ ### Minor Changes
1904
+
1905
+ - 23d9085: Updated desktop and mobile values for component-edge-to-visual-only tokens.
1906
+
1907
+ Spacing changed due to new workflow icon sizes.
1908
+
1909
+ ## Token Diff
1910
+
1911
+ _Token values updated (5):_
1912
+
1913
+ - `component-edge-to-visual-only-100`
1914
+ - `component-edge-to-visual-only-200`
1915
+ - `component-edge-to-visual-only-300`
1916
+ - `component-edge-to-visual-only-50`
1917
+ - `component-edge-to-visual-only-75`
1918
+
1919
+ - c5430b7: Updated help-text-top-to-workflow-icon-_ token values to point to component-top-to-workflow-icon-_ tokens
1920
+
1921
+ ## Token Diff
1922
+
1923
+ _Newly deprecated tokens (4):_
1924
+
1925
+ - `help-text-top-to-workflow-icon-extra-large`: use `component-edge-to-visual-only-300`
1926
+ - `help-text-top-to-workflow-icon-large`: use `component-edge-to-visual-only-200`
1927
+ - `help-text-top-to-workflow-icon-medium`: use `component-edge-to-visual-only-100`
1928
+ - `help-text-top-to-workflow-icon-small`: use `component-edge-to-visual-only-75`
1929
+
1930
+ ## 13.0.0-beta.9
1931
+
1932
+ ### Minor Changes
1933
+
1934
+ - cf09c84: Updated workflow-icon-size-50, 75, 100, 200, 300 with Spectrum 2 values in mobile and desktop.
1935
+ Updated component-top-to-workflow and text-to-visual padding.
1936
+ Added 3 new non-color tokens for S2 component downstates in Tokens Studio.
1937
+
1938
+ ## Design Motivation
1939
+
1940
+ Spectrum 2 icons have a different workflow icon sizing with base sizes 20 px (desktop), 24 px (mobile).
1941
+
1942
+ Updated padding values due to new workflow icon sizes in S2.
1943
+
1944
+ These tokens are used to calculate the perspective transform in CSS to achieve the effect of a component scaling down for down states in Spectrum 2. This is not applicable to all components.
1945
+
1946
+ ## Tokens Diff
1947
+
1948
+ _Tokens added (3):_
1949
+
1950
+ - `component-size-difference-down`
1951
+ - `component-size-minimum-perspective-down`
1952
+ - `component-size-width-ratio-down`
1953
+
1954
+ _Token values updated (15):_
1955
+
1956
+ - `component-top-to-workflow-icon-100`
1957
+ - `component-top-to-workflow-icon-200`
1958
+ - `component-top-to-workflow-icon-300`
1959
+ - `component-top-to-workflow-icon-50`
1960
+ - `component-top-to-workflow-icon-75`
1961
+ - `text-to-visual-100`
1962
+ - `text-to-visual-200`
1963
+ - `text-to-visual-300`
1964
+ - `text-to-visual-50`
1965
+ - `text-to-visual-75`
1966
+ - `workflow-icon-size-100`
1967
+ - `workflow-icon-size-200`
1968
+ - `workflow-icon-size-300`
1969
+ - `workflow-icon-size-50`
1970
+ - `workflow-icon-size-75`
1971
+
1972
+ ## 13.0.0-beta.8
1973
+
1974
+ ### Minor Changes
1975
+
1976
+ - 507f3c2: Added new and updating existing background layer tokens to S2 set in Tokens Studio and S2/Variables. Also reordered token organization to reflect proper usage based on [S2 guidelines](https://s2.spectrum.corp.adobe.com/page/background-layers/#editing-contexts).
1977
+
1978
+ ## Design Motivation
1979
+
1980
+ In Spectrum 2, background layers are used differently depending on the primary context of the page. We now have a full set of tokens to help users distinguish between primary purposes, editing vs browsing.
1981
+
1982
+ ## Token Diff
1983
+
1984
+ _Tokens added (2):_
1985
+
1986
+ - `background-elevated-color`
1987
+ - `background-pasteboard-color`
1988
+
1989
+ _Token values updated (1):_
1990
+
1991
+ - `background-base-color`
1992
+
1993
+ ## 13.0.0-beta.7
1994
+
1995
+ ### Minor Changes
1996
+
1997
+ - 4853f76: Added schema to all tokens and fixed values that didn't meet schema requirements
1998
+
1999
+ ## Token Diff
2000
+
2001
+ _Token values updated (328):_
2002
+
2003
+ - `accent-background-color-default`
2004
+ - `accent-background-color-down`
2005
+ - `accent-background-color-hover`
2006
+ - `accent-background-color-key-focus`
2007
+ - `accent-color-100`
2008
+ - `accent-color-1000`
2009
+ - `accent-color-1100`
2010
+ - `accent-color-1200`
2011
+ - `accent-color-1300`
2012
+ - `accent-color-1400`
2013
+ - `accent-color-200`
2014
+ - `accent-color-300`
2015
+ - `accent-color-400`
2016
+ - `accent-color-500`
2017
+ - `accent-color-600`
2018
+ - `accent-color-700`
2019
+ - `accent-color-800`
2020
+ - `accent-color-900`
2021
+ - `accent-content-color-default`
2022
+ - `accent-content-color-down`
2023
+ - `accent-content-color-hover`
2024
+ - `accent-content-color-key-focus`
2025
+ - `accent-content-color-selected`
2026
+ - `accent-visual-color`
2027
+ - `blue-100`
2028
+ - `blue-1000`
2029
+ - `blue-1100`
2030
+ - `blue-1200`
2031
+ - `blue-1300`
2032
+ - `blue-1400`
2033
+ - `blue-200`
2034
+ - `blue-300`
2035
+ - `blue-400`
2036
+ - `blue-500`
2037
+ - `blue-600`
2038
+ - `blue-700`
2039
+ - `blue-800`
2040
+ - `blue-900`
2041
+ - `blue-background-color-default`
2042
+ - `blue-visual-color`
2043
+ - `celery-100`
2044
+ - `celery-1000`
2045
+ - `celery-1100`
2046
+ - `celery-1200`
2047
+ - `celery-1300`
2048
+ - `celery-1400`
2049
+ - `celery-200`
2050
+ - `celery-300`
2051
+ - `celery-400`
2052
+ - `celery-500`
2053
+ - `celery-600`
2054
+ - `celery-700`
2055
+ - `celery-800`
2056
+ - `celery-900`
2057
+ - `celery-background-color-default`
2058
+ - `celery-visual-color`
2059
+ - `chartreuse-100`
2060
+ - `chartreuse-1000`
2061
+ - `chartreuse-1100`
2062
+ - `chartreuse-1200`
2063
+ - `chartreuse-1300`
2064
+ - `chartreuse-1400`
2065
+ - `chartreuse-200`
2066
+ - `chartreuse-300`
2067
+ - `chartreuse-400`
2068
+ - `chartreuse-500`
2069
+ - `chartreuse-600`
2070
+ - `chartreuse-700`
2071
+ - `chartreuse-800`
2072
+ - `chartreuse-900`
2073
+ - `chartreuse-background-color-default`
2074
+ - `chartreuse-visual-color`
2075
+ - `contextual-help-body-size`
2076
+ - `cyan-100`
2077
+ - `cyan-1000`
2078
+ - `cyan-1100`
2079
+ - `cyan-1200`
2080
+ - `cyan-1300`
2081
+ - `cyan-1400`
2082
+ - `cyan-200`
2083
+ - `cyan-300`
2084
+ - `cyan-400`
2085
+ - `cyan-500`
2086
+ - `cyan-600`
2087
+ - `cyan-700`
2088
+ - `cyan-800`
2089
+ - `cyan-900`
2090
+ - `cyan-background-color-default`
2091
+ - `cyan-visual-color`
2092
+ - `drop-zone-background-color`
2093
+ - `focus-indicator-color`
2094
+ - `fuchsia-100`
2095
+ - `fuchsia-1000`
2096
+ - `fuchsia-1100`
2097
+ - `fuchsia-1200`
2098
+ - `fuchsia-1300`
2099
+ - `fuchsia-1400`
2100
+ - `fuchsia-200`
2101
+ - `fuchsia-300`
2102
+ - `fuchsia-400`
2103
+ - `fuchsia-500`
2104
+ - `fuchsia-600`
2105
+ - `fuchsia-700`
2106
+ - `fuchsia-800`
2107
+ - `fuchsia-900`
2108
+ - `fuchsia-background-color-default`
2109
+ - `fuchsia-visual-color`
2110
+ - `green-100`
2111
+ - `green-1000`
2112
+ - `green-1100`
2113
+ - `green-1200`
2114
+ - `green-1300`
2115
+ - `green-1400`
2116
+ - `green-200`
2117
+ - `green-300`
2118
+ - `green-400`
2119
+ - `green-500`
2120
+ - `green-600`
2121
+ - `green-700`
2122
+ - `green-800`
2123
+ - `green-900`
2124
+ - `green-background-color-default`
2125
+ - `green-visual-color`
2126
+ - `icon-color-blue-primary-default`
2127
+ - `icon-color-green-primary-default`
2128
+ - `icon-color-red-primary-default`
2129
+ - `icon-color-yellow-primary-default`
2130
+ - `indigo-100`
2131
+ - `indigo-1000`
2132
+ - `indigo-1100`
2133
+ - `indigo-1200`
2134
+ - `indigo-1300`
2135
+ - `indigo-1400`
2136
+ - `indigo-200`
2137
+ - `indigo-300`
2138
+ - `indigo-400`
2139
+ - `indigo-500`
2140
+ - `indigo-600`
2141
+ - `indigo-700`
2142
+ - `indigo-800`
2143
+ - `indigo-900`
2144
+ - `indigo-background-color-default`
2145
+ - `indigo-visual-color`
2146
+ - `informative-background-color-default`
2147
+ - `informative-background-color-down`
2148
+ - `informative-background-color-hover`
2149
+ - `informative-background-color-key-focus`
2150
+ - `informative-color-100`
2151
+ - `informative-color-1000`
2152
+ - `informative-color-1100`
2153
+ - `informative-color-1200`
2154
+ - `informative-color-1300`
2155
+ - `informative-color-1400`
2156
+ - `informative-color-200`
2157
+ - `informative-color-300`
2158
+ - `informative-color-400`
2159
+ - `informative-color-500`
2160
+ - `informative-color-600`
2161
+ - `informative-color-700`
2162
+ - `informative-color-800`
2163
+ - `informative-color-900`
2164
+ - `informative-visual-color`
2165
+ - `magenta-100`
2166
+ - `magenta-1000`
2167
+ - `magenta-1100`
2168
+ - `magenta-1200`
2169
+ - `magenta-1300`
2170
+ - `magenta-1400`
2171
+ - `magenta-200`
2172
+ - `magenta-300`
2173
+ - `magenta-400`
2174
+ - `magenta-500`
2175
+ - `magenta-600`
2176
+ - `magenta-700`
2177
+ - `magenta-800`
2178
+ - `magenta-900`
2179
+ - `magenta-background-color-default`
2180
+ - `magenta-visual-color`
2181
+ - `navigational-indicator-top-to-back-icon-extra-large`
2182
+ - `navigational-indicator-top-to-back-icon-large`
2183
+ - `navigational-indicator-top-to-back-icon-medium`
2184
+ - `navigational-indicator-top-to-back-icon-small`
2185
+ - `negative-background-color-default`
2186
+ - `negative-background-color-down`
2187
+ - `negative-background-color-hover`
2188
+ - `negative-background-color-key-focus`
2189
+ - `negative-border-color-default`
2190
+ - `negative-border-color-down`
2191
+ - `negative-border-color-focus`
2192
+ - `negative-border-color-focus-hover`
2193
+ - `negative-border-color-hover`
2194
+ - `negative-border-color-key-focus`
2195
+ - `negative-color-100`
2196
+ - `negative-color-1000`
2197
+ - `negative-color-1100`
2198
+ - `negative-color-1200`
2199
+ - `negative-color-1300`
2200
+ - `negative-color-1400`
2201
+ - `negative-color-200`
2202
+ - `negative-color-300`
2203
+ - `negative-color-400`
2204
+ - `negative-color-500`
2205
+ - `negative-color-600`
2206
+ - `negative-color-700`
2207
+ - `negative-color-800`
2208
+ - `negative-color-900`
2209
+ - `negative-content-color-default`
2210
+ - `negative-content-color-down`
2211
+ - `negative-content-color-hover`
2212
+ - `negative-content-color-key-focus`
2213
+ - `negative-visual-color`
2214
+ - `notice-background-color-default`
2215
+ - `notice-color-100`
2216
+ - `notice-color-1000`
2217
+ - `notice-color-1100`
2218
+ - `notice-color-1200`
2219
+ - `notice-color-1300`
2220
+ - `notice-color-1400`
2221
+ - `notice-color-200`
2222
+ - `notice-color-300`
2223
+ - `notice-color-400`
2224
+ - `notice-color-500`
2225
+ - `notice-color-600`
2226
+ - `notice-color-700`
2227
+ - `notice-color-800`
2228
+ - `notice-color-900`
2229
+ - `notice-visual-color`
2230
+ - `orange-100`
2231
+ - `orange-1000`
2232
+ - `orange-1100`
2233
+ - `orange-1200`
2234
+ - `orange-1300`
2235
+ - `orange-1400`
2236
+ - `orange-200`
2237
+ - `orange-300`
2238
+ - `orange-400`
2239
+ - `orange-500`
2240
+ - `orange-600`
2241
+ - `orange-700`
2242
+ - `orange-800`
2243
+ - `orange-900`
2244
+ - `orange-background-color-default`
2245
+ - `orange-visual-color`
2246
+ - `positive-background-color-default`
2247
+ - `positive-background-color-down`
2248
+ - `positive-background-color-hover`
2249
+ - `positive-background-color-key-focus`
2250
+ - `positive-color-100`
2251
+ - `positive-color-1000`
2252
+ - `positive-color-1100`
2253
+ - `positive-color-1200`
2254
+ - `positive-color-1300`
2255
+ - `positive-color-1400`
2256
+ - `positive-color-200`
2257
+ - `positive-color-300`
2258
+ - `positive-color-400`
2259
+ - `positive-color-500`
2260
+ - `positive-color-600`
2261
+ - `positive-color-700`
2262
+ - `positive-color-800`
2263
+ - `positive-color-900`
2264
+ - `positive-visual-color`
2265
+ - `purple-100`
2266
+ - `purple-1000`
2267
+ - `purple-1100`
2268
+ - `purple-1200`
2269
+ - `purple-1300`
2270
+ - `purple-1400`
2271
+ - `purple-200`
2272
+ - `purple-300`
2273
+ - `purple-400`
2274
+ - `purple-500`
2275
+ - `purple-600`
2276
+ - `purple-700`
2277
+ - `purple-800`
2278
+ - `purple-900`
2279
+ - `purple-background-color-default`
2280
+ - `purple-visual-color`
2281
+ - `red-100`
2282
+ - `red-1000`
2283
+ - `red-1100`
2284
+ - `red-1200`
2285
+ - `red-1300`
2286
+ - `red-1400`
2287
+ - `red-200`
2288
+ - `red-300`
2289
+ - `red-400`
2290
+ - `red-500`
2291
+ - `red-600`
2292
+ - `red-700`
2293
+ - `red-800`
2294
+ - `red-900`
2295
+ - `red-background-color-default`
2296
+ - `red-visual-color`
2297
+ - `seafoam-100`
2298
+ - `seafoam-1000`
2299
+ - `seafoam-1100`
2300
+ - `seafoam-1200`
2301
+ - `seafoam-1300`
2302
+ - `seafoam-1400`
2303
+ - `seafoam-200`
2304
+ - `seafoam-300`
2305
+ - `seafoam-400`
2306
+ - `seafoam-500`
2307
+ - `seafoam-600`
2308
+ - `seafoam-700`
2309
+ - `seafoam-800`
2310
+ - `seafoam-900`
2311
+ - `seafoam-background-color-default`
2312
+ - `seafoam-visual-color`
2313
+ - `side-navigation-item-to-header`
2314
+ - `table-selected-row-background-color`
2315
+ - `yellow-100`
2316
+ - `yellow-1000`
2317
+ - `yellow-1100`
2318
+ - `yellow-1200`
2319
+ - `yellow-1300`
2320
+ - `yellow-1400`
2321
+ - `yellow-200`
2322
+ - `yellow-300`
2323
+ - `yellow-400`
2324
+ - `yellow-500`
2325
+ - `yellow-600`
2326
+ - `yellow-700`
2327
+ - `yellow-800`
2328
+ - `yellow-900`
2329
+ - `yellow-background-color-default`
2330
+ - `yellow-visual-color`
2331
+
2332
+ ## 13.0.0-beta.6
2333
+
2334
+ ### Minor Changes
2335
+
2336
+ - 6d1c661: Added new Spectrum 2 color tokens for both light and dark themes:
2337
+
2338
+ Cinnamon 100 to 1600
2339
+
2340
+ ## Design Motivation
2341
+
2342
+ This is the last new color that is a part of the new color set needed from Premiere Pro. The additional color will also help when creating new data vis color palettes for Spectrum 2.
2343
+
2344
+ ## Token Diff
2345
+
2346
+ _Tokens added (17):_
2347
+
2348
+ - `cinnamon-100`
2349
+ - `cinnamon-200`
2350
+ - `cinnamon-300`
2351
+ - `cinnamon-400`
2352
+ - `cinnamon-500`
2353
+ - `cinnamon-600`
2354
+ - `cinnamon-700`
2355
+ - `cinnamon-800`
2356
+ - `cinnamon-900`
2357
+ - `cinnamon-1000`
2358
+ - `cinnamon-1100`
2359
+ - `cinnamon-1200`
2360
+ - `cinnamon-1300`
2361
+ - `cinnamon-1400`
2362
+ - `cinnamon-1500`
2363
+ - `cinnamon-1600`
2364
+
2365
+ - 91d7e95: Fixed bug in the light theme value for notice-background-color-default, from notice-color-800 to notice-color-600
2366
+
2367
+ ## Design Motivation
2368
+
2369
+ While updating the badge component in Figma, we noticed a bug where notice-background-color-default in S2 was entered incorrectly for light theme, and should instead match the value for S1
2370
+
2371
+ ## Token Diff
2372
+
2373
+ _Token values updated (1):_
2374
+
2375
+ - `notice-background-color-default`: `light`: `notice-color-800` -> `notice-color-600`
2376
+
3
2377
  ## 13.0.0-beta.5
4
2378
 
5
2379
  ### Major Changes