@adobe/spectrum-tokens 13.0.0-beta.3 → 13.0.0-beta.30

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 (98) hide show
  1. package/CHANGELOG.md +1601 -0
  2. package/README.md +4 -0
  3. package/dist/json/drover.json +872 -510
  4. package/dist/json/variables.json +10193 -6337
  5. package/index.js +52 -0
  6. package/moon.yml +3 -2
  7. package/package.json +9 -6
  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 +25 -0
  62. package/schemas/token-types/color-set.json +69 -0
  63. package/schemas/token-types/color.json +25 -0
  64. package/schemas/token-types/dimension.json +25 -0
  65. package/schemas/token-types/font-family.json +25 -0
  66. package/schemas/token-types/font-size.json +25 -0
  67. package/schemas/token-types/font-style.json +25 -0
  68. package/schemas/token-types/font-weight.json +25 -0
  69. package/schemas/token-types/multiplier.json +25 -0
  70. package/schemas/token-types/opacity.json +25 -0
  71. package/schemas/token-types/scale-set.json +60 -0
  72. package/schemas/token-types/set.json +22 -0
  73. package/schemas/token-types/system-set.json +82 -0
  74. package/schemas/token-types/text-transform.json +25 -0
  75. package/schemas/token-types/token.json +27 -0
  76. package/src/color-aliases.json +634 -133
  77. package/src/color-component.json +61 -17
  78. package/src/color-palette.json +3038 -414
  79. package/src/icons.json +18 -0
  80. package/src/layout-component.json +2877 -324
  81. package/src/layout.json +802 -171
  82. package/src/semantic-color-palette.json +100 -0
  83. package/src/typography.json +285 -0
  84. package/tasks/addIds.js +1 -1
  85. package/tasks/buildManifest.js +1 -1
  86. package/tasks/buildSpectrumTokens.js +1 -1
  87. package/tasks/deprecateExpress.js +1 -1
  88. package/tasks/diff.js +3 -3
  89. package/tasks/lib/augmentExpressTokens.js +1 -1
  90. package/test/checkId.test.js +24 -38
  91. package/test/checkManifest.test.js +1 -1
  92. package/test/checkUniqueTokenNames.js +32 -0
  93. package/test/componentSchemaValidator.test.js +74 -0
  94. package/test/deprecateExpress.test.js +1 -1
  95. package/test/drover.test.js +1 -1
  96. package/test/schemaValidator.test.js +1 -1
  97. package/test/schemaValidators/alias.test.js +41 -0
  98. package/test/tokenSchemaValidator.test.js +97 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,1606 @@
1
1
  # @adobe/spectrum-tokens
2
2
 
3
+ ## 13.0.0-beta.30
4
+
5
+ ### Minor Changes
6
+
7
+ - [#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
8
+
9
+ ## Token Diff
10
+
11
+ _Tokens added (10):_
12
+
13
+ - `standard-dialog-body-font-size`
14
+ - `standard-dialog-maximum-width-large`
15
+ - `standard-dialog-maximum-width-medium`
16
+ - `standard-dialog-maximum-width-small`
17
+ - `standard-dialog-minimum-width`
18
+ - `standard-dialog-title-font-size`
19
+ - `status-light-text-to-visual-100`
20
+ - `status-light-text-to-visual-200`
21
+ - `status-light-text-to-visual-300`
22
+ - `status-light-text-to-visual-75`
23
+
24
+ _Token values updated (10):_
25
+
26
+ - `alert-banner-to-top-workflow-icon`
27
+ - `alert-banner-top-to-workflow-icon`
28
+ - `status-light-dot-size-extra-large`
29
+ - `status-light-dot-size-large`
30
+ - `status-light-dot-size-medium`
31
+ - `status-light-top-to-dot-extra-large`
32
+ - `status-light-top-to-dot-large`
33
+ - `status-light-top-to-dot-medium`
34
+ - `status-light-top-to-dot-small`
35
+ - `status-light-dot-size-small`
36
+
37
+ ## 13.0.0-beta.29
38
+
39
+ ### Minor Changes
40
+
41
+ - [#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.
42
+
43
+ These values are updated based on the new workflow icon size.
44
+
45
+ ## Token Diff
46
+
47
+ _Token values updated (4):_
48
+
49
+ - `component-pill-edge-to-visual-only-100`
50
+ - `component-pill-edge-to-visual-only-200`
51
+ - `component-pill-edge-to-visual-only-300`
52
+ - `component-pill-edge-to-visual-only-75`
53
+
54
+ - [#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)
55
+
56
+ ## Token Diff
57
+
58
+ _Newly deprecated tokens (2):_
59
+
60
+ - `color-loupe-drop-shadow-color`
61
+ - `drop-shadow-color`
62
+
63
+ ## 13.0.0-beta.28
64
+
65
+ ### Patch Changes
66
+
67
+ - 1150331: Removed duplicate tokens from src files.
68
+
69
+ ## 13.0.0-beta.27
70
+
71
+ ### Minor Changes
72
+
73
+ - 3236495: Updated coach mark tokens for both desktop and mobile
74
+
75
+ ## Token Diff
76
+
77
+ _Tokens added (6):_
78
+
79
+ - `coach-mark-body-font-size`
80
+ - `coach-mark-pagination-body-font-size`
81
+ - `coach-mark-title-font-size`
82
+
83
+ _Newly deprecated tokens (3):_
84
+
85
+ - `coach-mark-body-size`
86
+ - `coach-mark-pagination-body-size`
87
+ - `coach-mark-title-size`
88
+
89
+ ## 13.0.0-beta.26
90
+
91
+ ### Minor Changes
92
+
93
+ - b59fa8f: Updated alert dialog tokens
94
+
95
+ ## Token Diff
96
+
97
+ _Tokens added (4):_
98
+
99
+ - `alert-dialog-description-font-size`
100
+ - `alert-dialog-description-size`
101
+ - `alert-dialog-title-font-size`
102
+ - `alert-dialog-title-size`
103
+
104
+ _Newly deprecated tokens (2):_
105
+
106
+ - `alert-dialog-description-size`
107
+ - `alert-dialog-title-size`
108
+
109
+ ## 13.0.0-beta.25
110
+
111
+ ### Minor Changes
112
+
113
+ - e79ddd6: S2 Combo box, In-field button and In-field progress circle updates
114
+
115
+ ## Motivation and context
116
+
117
+ These changes occurred as a result of scaling things for S2 design language and experiences.
118
+
119
+ ## Token Diff
120
+
121
+ _Tokens added (15):_
122
+
123
+ - `combo-box-visual-to-field-button`
124
+ - `combo-box-visual-to-field-button-extra-large`
125
+ - `combo-box-visual-to-field-button-large`
126
+ - `combo-box-visual-to-field-button-medium`
127
+ - `combo-box-visual-to-field-button-quiet`
128
+ - `combo-box-visual-to-field-button-small`
129
+ - `in-field-button-edge-to-fill-extra-large`
130
+ - `in-field-button-edge-to-fill-large`
131
+ - `in-field-button-edge-to-fill-medium`
132
+ - `in-field-button-edge-to-fill-small`
133
+ - `in-field-progress-circle-edge-to-fill`
134
+ - `in-field-progress-circle-size-100`
135
+ - `in-field-progress-circle-size-200`
136
+ - `in-field-progress-circle-size-300`
137
+ - `in-field-progress-circle-size-75`
138
+
139
+ _Newly deprecated tokens (6):_
140
+
141
+ - `combo-box-quiet-minimum-width-multiplier`
142
+ - `combo-box-visual-to-field-button-small`
143
+ - `combo-box-visual-to-field-button-medium`
144
+ - `combo-box-visual-to-field-button-large`
145
+ - `combo-box-visual-to-field-button-extra-large`
146
+ - `in-field-button-edge-to-fill`
147
+
148
+ - e79ddd6: S2 Color loupe tokens update
149
+
150
+ ## Design Motivation
151
+
152
+ These changes occurred as a result of scaling things for S2 design language and experiences.
153
+
154
+ ## Token Diff
155
+
156
+ _Newly deprecated tokens (2):_
157
+
158
+ - `color-loupe-drop-shadow-blur`
159
+ - `color-loupe-drop-shadow-y`
160
+
161
+ ## 13.0.0-beta.24
162
+
163
+ ### Major Changes
164
+
165
+ - 1c8f7ab: Renamed previous drop shadow tokens from S1 and pointed them to the new `100` S2 drop shadow tokens
166
+ Added new drop shadow tokens, `100`, `200`, `emphasized-default`, `emphasized-hover`, `elevated`.
167
+
168
+ ## Design Motivation
169
+
170
+ These tokens reflect the updates to drop tokens foundations in Spectrum 2, allowing more options and flexibility of usage in containers
171
+
172
+ ## Token Diff
173
+
174
+ _Tokens added (24):_
175
+
176
+ - `drop-shadow-blur`
177
+ - `drop-shadow-blur-100`
178
+ - `drop-shadow-blur-200`
179
+ - `drop-shadow-color`
180
+ - `drop-shadow-color-100`
181
+ - `drop-shadow-color-200`
182
+ - `drop-shadow-elevated-blur`
183
+ - `drop-shadow-elevated-color`
184
+ - `drop-shadow-elevated-x`
185
+ - `drop-shadow-elevated-y`
186
+ - `drop-shadow-emphasized-default-blur`
187
+ - `drop-shadow-emphasized-default-color`
188
+ - `drop-shadow-emphasized-default-x`
189
+ - `drop-shadow-emphasized-default-y`
190
+ - `drop-shadow-emphasized-hover-blur`
191
+ - `drop-shadow-emphasized-hover-color`
192
+ - `drop-shadow-emphasized-hover-x`
193
+ - `drop-shadow-emphasized-hover-y`
194
+ - `drop-shadow-x`
195
+ - `drop-shadow-x-100`
196
+ - `drop-shadow-x-200`
197
+ - `drop-shadow-y`
198
+ - `drop-shadow-y-100`
199
+ - `drop-shadow-y-200`
200
+
201
+ _Tokens deleted (2):_
202
+
203
+ - `drop-shadow-blur`
204
+ - `drop-shadow-y`
205
+
206
+ _Token values updated (2):_
207
+
208
+ - `color-handle-drop-shadow-color`
209
+ - `drop-shadow-color`
210
+
211
+ ### Minor Changes
212
+
213
+ - 3230aba: Updated and added S2 drop shadow tokens
214
+
215
+ ## Design Motivation
216
+
217
+ These changes occurred as a result of scaling things for S2 design language and experiences.
218
+
219
+ ## Token Diff
220
+
221
+ _Tokens added (7):_
222
+
223
+ - `field-default-width-extra-large`
224
+ - `field-default-width-large`
225
+ - `field-default-width-medium`
226
+ - `field-default-width-small`
227
+ - `tag-minimum-width-large`
228
+ - `tag-minimum-width-medium`
229
+ - `tag-minimum-width-small`
230
+
231
+ _Token values updated (4):_
232
+
233
+ - `field-top-to-progress-circle-extra-large`
234
+ - `field-top-to-progress-circle-large`
235
+ - `field-top-to-progress-circle-medium`
236
+ - `field-top-to-progress-circle-small`
237
+
238
+ _Newly Deprecated Tokens (4):_
239
+
240
+ - `field-width-extra-large`
241
+ - `field-width-large`
242
+ - `field-width-medium`
243
+ - `field-width-small`
244
+
245
+ ## 13.0.0-beta.23
246
+
247
+ ### Patch Changes
248
+
249
+ - 936f608: Fixed misnamed accordion token.
250
+
251
+ ## Token Diff
252
+
253
+ _Tokens added (1):_
254
+
255
+ - `accordion-top-to-text-spacious-small`
256
+
257
+ _Newly deprecated token (1):_
258
+
259
+ - `accordion-small-top-to-text-spacious`
260
+
261
+ ## 13.0.0-beta.22
262
+
263
+ ### Minor Changes
264
+
265
+ - c42448c: Updated and added alert dialog tokens for both desktop and mobile.
266
+
267
+ ## Design Motivation
268
+
269
+ 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.
270
+
271
+ Title is a new typography style for Spectrum 2, and has a default `title-color` token.
272
+
273
+ ## Token Diff
274
+
275
+ _Tokens added (2):_
276
+
277
+ - `alert-banner-top-to-alert-icon`
278
+ - `title-color`
279
+
280
+ _Token values updated (2):_
281
+
282
+ - `alert-dialog-description-size`
283
+ - `alert-dialog-title-size`
284
+
285
+ - 46a801c: Added tokens for S2 title color
286
+
287
+ ## 13.0.0-beta.21
288
+
289
+ ### Minor Changes
290
+
291
+ - d71bea1: S2 Opacity checkerboard non-color token updates
292
+
293
+ ## Design Motivation
294
+
295
+ These changes occurred as a result of scaling things for S2 design language and experiences.
296
+
297
+ ## Token Diff
298
+
299
+ _Tokens added (2):_
300
+
301
+ - `opacity-checkerboard-square-size-medium`
302
+ - `opacity-checkerboard-square-size-small`
303
+
304
+ _Newly deprecated token (1):_
305
+
306
+ - `opacity-checkerboard-square-size`
307
+
308
+ ## 13.0.0-beta.20
309
+
310
+ ### Minor Changes
311
+
312
+ - fb61f17: Added Title typography tokens
313
+
314
+ ## Design Motivation
315
+
316
+ 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.
317
+
318
+ ## Token Diff
319
+
320
+ _Tokens added (45):_
321
+
322
+ - `title-cjk-emphasized-font-style`
323
+ - `title-cjk-emphasized-font-weight`
324
+ - `title-cjk-font-family`
325
+ - `title-cjk-font-style`
326
+ - `title-cjk-font-weight`
327
+ - `title-cjk-line-height`
328
+ - `title-cjk-size-l`
329
+ - `title-cjk-size-m`
330
+ - `title-cjk-size-s`
331
+ - `title-cjk-size-xl`
332
+ - `title-cjk-size-xs`
333
+ - `title-cjk-size-xxl`
334
+ - `title-cjk-size-xxxl`
335
+ - `title-cjk-strong-emphasized-font-style`
336
+ - `title-cjk-strong-emphasized-font-weight`
337
+ - `title-cjk-strong-font-style`
338
+ - `title-cjk-strong-font-weight`
339
+ - `title-line-height`
340
+ - `title-margin-bottom-multiplier`
341
+ - `title-margin-top-multiplier`
342
+ - `title-sans-serif-emphasized-font-style`
343
+ - `title-sans-serif-emphasized-font-weight`
344
+ - `title-sans-serif-font-family`
345
+ - `title-sans-serif-font-style`
346
+ - `title-sans-serif-font-weight`
347
+ - `title-sans-serif-strong-emphasized-font-style`
348
+ - `title-sans-serif-strong-emphasized-font-weight`
349
+ - `title-sans-serif-strong-font-style`
350
+ - `title-sans-serif-strong-font-weight`
351
+ - `title-serif-emphasized-font-style`
352
+ - `title-serif-emphasized-font-weight`
353
+ - `title-serif-font-family`
354
+ - `title-serif-font-style`
355
+ - `title-serif-font-weight`
356
+ - `title-serif-strong-emphasized-font-style`
357
+ - `title-serif-strong-emphasized-font-weight`
358
+ - `title-serif-strong-font-style`
359
+ - `title-serif-strong-font-weight`
360
+ - `title-size-l`
361
+ - `title-size-m`
362
+ - `title-size-s`
363
+ - `title-size-xl`
364
+ - `title-size-xs`
365
+ - `title-size-xxl`
366
+ - `title-size-xxxl`
367
+
368
+ ## 13.0.0-beta.19
369
+
370
+ ### Minor Changes
371
+
372
+ - 723d3b0: Updated, added, and deprecated tokens for text field and text area.
373
+
374
+ ## Design Motivation
375
+
376
+ Updating text field and text area for Spectrum 2.
377
+
378
+ ## Token Diff
379
+
380
+ _Tokens added (4):_
381
+
382
+ - `field-width-small`
383
+ - `field-width-medium`
384
+ - `field-width-large`
385
+ - `field-width-extra-large`
386
+
387
+ _Updated token values (4):_
388
+
389
+ - `side-label-character-count-top-margin-small`
390
+ - `side-label-character-count-top-margin-medium`
391
+ - `side-label-character-count-top-margin-large`
392
+ - `side-label-character-count-top-margin-extra-large`
393
+
394
+ _Newly deprecated tokens (8):_
395
+
396
+ - `field-width`
397
+ - `field-edge-to-text-quiet`
398
+ - `field-edge-to-border-quiet`
399
+ - `field-edge-to-alert-icon-quiet`
400
+ - `field-edge-to-validation-icon-quiet`
401
+ - `field-label-to-component-quiet-small`
402
+ - `field-label-to-component-quiet-medium`
403
+ - `field-label-to-component-quiet-large`
404
+ - `field-label-to-component-quiet-extra-large`
405
+ - `character-count-to-field-quiet-small`
406
+ - `character-count-to-field-quiet-medium`
407
+ - `character-count-to-field-quiet-large`
408
+ - `character-count-to-field-quiet-extra-large`
409
+
410
+ - 66b1edf: Updated color of color-area-border-color token from gray.900 to gray.1000 in both light and dark sets.
411
+
412
+ ## Design motivation
413
+
414
+ These changes occurred as a result of scaling things for S2 design language and experiences.
415
+
416
+ ## Token Diff
417
+
418
+ _Token value updated (1):_
419
+
420
+ - `color-area-border-color`
421
+
422
+ - 7b5f18b: Update alert banner for Spectrum 2
423
+
424
+ ## Design Motivation
425
+
426
+ These changes occurred as a result of scaling things for S2 design language and experiences.
427
+
428
+ ## Token Diff
429
+
430
+ _Token values updated (5):_
431
+
432
+ - `alert-banner-bottom-to-text`
433
+ - `alert-banner-minimum-height`
434
+ - `alert-banner-top-to-text`
435
+ - `alert-banner-top-to-workflow-icon`
436
+ - `search-field-minimum-width-multiplier`
437
+
438
+ - 4a84fdd: Spectrum 2 Toast Tokens
439
+
440
+ ## Design motivation
441
+
442
+ Updated the `color-area-border-rounding` token type from spacing to borderRadius and adjusted value referenced, desktop and mobile scale.
443
+
444
+ These changes occurred as a result of scaling things for S2 design language and experiences.
445
+
446
+ ## Token Diff
447
+
448
+ _Token values updated (5):_
449
+
450
+ - `toast-height`
451
+ - `toast-top-to-workflow-icon`
452
+ - `toast-top-to-text`
453
+ - `toast-bottom-to-text`
454
+ - `color-area-border-rounding`
455
+
456
+ ## 13.0.0-beta.18
457
+
458
+ ### Minor Changes
459
+
460
+ - 940bd78: Updated background aliases in dark theme; added new non-semantic colors
461
+
462
+ ## Design Motivation
463
+
464
+ 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.
465
+ 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.
466
+
467
+ ## Token Diff
468
+
469
+ _Tokens added (10):_
470
+
471
+ - `brown-background-color-default`
472
+ - `brown-visual-color`
473
+ - `cinnamon-background-color-default`
474
+ - `cinnamon-visual-color`
475
+ - `pink-background-color-default`
476
+ - `pink-visual-color`
477
+ - `silver-background-color-default`
478
+ - `silver-visual-color`
479
+ - `turquoise-background-color-default`
480
+ - `turquoise-visual-color`
481
+
482
+ _Token values updated (27):_
483
+
484
+ - `accent-background-color-default`
485
+ - `accent-background-color-down`
486
+ - `accent-background-color-hover`
487
+ - `accent-background-color-key-focus`
488
+ - `celery-background-color-default`
489
+ - `chartreuse-background-color-default`
490
+ - `gray-background-color-default`
491
+ - `informative-background-color-default`
492
+ - `informative-background-color-down`
493
+ - `informative-background-color-hover`
494
+ - `informative-background-color-key-focus`
495
+ - `negative-background-color-default`
496
+ - `negative-background-color-down`
497
+ - `negative-background-color-hover`
498
+ - `negative-background-color-key-focus`
499
+ - `neutral-subdued-background-color-default`
500
+ - `neutral-subdued-background-color-down`
501
+ - `neutral-subdued-background-color-hover`
502
+ - `neutral-subdued-background-color-key-focus`
503
+ - `notice-background-color-default`
504
+ - `orange-background-color-default`
505
+ - `positive-background-color-default`
506
+ - `positive-background-color-down`
507
+ - `positive-background-color-hover`
508
+ - `positive-background-color-key-focus`
509
+ - `table-selected-row-background-color`
510
+ - `yellow-background-color-default`
511
+
512
+ ## 13.0.0-beta.17
513
+
514
+ ### Minor Changes
515
+
516
+ - 9072ae7: `color-slider-border-color` token was updated to reference `gray-1000` instead of `gray-90`0 in both light and dark themes.
517
+ - 912e307: Updated `color-slider-border-rounding` token to use 7px instead of 4px in desktop only.
518
+ This token value update is the same value used by alias token: `corner-radius-medium-size-small`.
519
+
520
+ ## Design Motivation
521
+
522
+ S2 color slider design changes.
523
+
524
+ ## Token Diff
525
+
526
+ _Token values updated (2):_
527
+
528
+ - `color-slider-border-color`
529
+ - `color-slider-border-rounding`
530
+
531
+ ## 13.0.0-beta.16
532
+
533
+ ### Minor Changes
534
+
535
+ - 80a3fec: New non-color tokens for S2 tag component added to both desktop and mobile layout.component sets.
536
+
537
+ ## Design Motivation
538
+
539
+ New values for tag component for S2.
540
+
541
+ ## Token Diff
542
+
543
+ _Tokens added (9):_
544
+
545
+ - `tag-edge-to-clear-icon-large`
546
+ - `tag-edge-to-clear-icon-medium`
547
+ - `tag-edge-to-clear-icon-small`
548
+ - `tag-label-clear-icon-large`
549
+ - `tag-label-to-clear-icon-large`
550
+ - `tag-label-to-clear-icon-medium`
551
+ - `tag-label-to-clear-icon-small`
552
+ - `tag-maximum-width-multiplier`
553
+ - `tag-minimum-width-multiplier`
554
+
555
+ ## 13.0.0-beta.15
556
+
557
+ ### Minor Changes
558
+
559
+ - c7c1d81: Added new semantic color aliases to Tokens Studio, in the S2 color tokens, alias sets for both light and dark themes.
560
+ - 4b78009: Updated values and added new tokens for Switch.
561
+
562
+ ## Design Motivation
563
+
564
+ New negative-subdued background tokens were needed for negative and not selected tag components.
565
+
566
+ Added new tokens: `switch-handle-size-_` and `switch-handle-selected-size-_` for both desktop and mobile.
567
+ Update token values on: `switch-control-width-_` and `switch-control-height-_` for both desktop and mobile.
568
+
569
+ 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.
570
+
571
+ ## Token Diff
572
+
573
+ _Tokens added (12):_
574
+
575
+ - `negative-subdued-background-color-default`
576
+ - `negative-subdued-background-color-down`
577
+ - `negative-subdued-background-color-hover`
578
+ - `negative-subdued-background-color-key-focus`
579
+ - `switch-handle-selected-size-extra-large`
580
+ - `switch-handle-selected-size-large`
581
+ - `switch-handle-selected-size-medium`
582
+ - `switch-handle-selected-size-small`
583
+ - `switch-handle-size-extra-large`
584
+ - `switch-handle-size-large`
585
+ - `switch-handle-size-medium`
586
+ - `switch-handle-size-small`
587
+
588
+ _Token values updated (8):_
589
+
590
+ - `switch-control-height-extra-large`
591
+ - `switch-control-height-large`
592
+ - `switch-control-height-medium`
593
+ - `switch-control-height-small`
594
+ - `switch-control-width-extra-large`
595
+ - `switch-control-width-large`
596
+ - `switch-control-width-medium`
597
+ - `switch-control-width-small`
598
+
599
+ ## 13.0.0-beta.14
600
+
601
+ ### Minor Changes
602
+
603
+ - f004b0c: The tokens listed in the diff below had identical values between sets and so were merged to single values to simplify the data.
604
+
605
+ ## Token Diff
606
+
607
+ _Tokens values updated (46):_
608
+
609
+ - `accordion-disclosure-indicator-to-text`
610
+ - `accordion-edge-to-disclosure-indicator`
611
+ - `accordion-edge-to-text`
612
+ - `accordion-focus-indicator-gap`
613
+ - `accordion-top-to-text-compact-medium`
614
+ - `accordion-top-to-text-compact-small`
615
+ - `action-button-edge-to-hold-icon-extra-small`
616
+ - `action-button-edge-to-hold-icon-small`
617
+ - `asterisk-icon-size-75`
618
+ - `background-base-color`
619
+ - `background-layer-1-color`
620
+ - `color-area-border-rounding`
621
+ - `corner-radius-0`
622
+ - `corner-radius-100`
623
+ - `corner-radius-1000`
624
+ - `corner-radius-200`
625
+ - `corner-radius-300`
626
+ - `corner-radius-400`
627
+ - `corner-radius-500`
628
+ - `corner-radius-600`
629
+ - `corner-radius-700`
630
+ - `corner-radius-75`
631
+ - `corner-radius-800`
632
+ - `corner-radius-extra-large-default`
633
+ - `corner-radius-full`
634
+ - `corner-radius-large-default`
635
+ - `corner-radius-medium-default`
636
+ - `corner-radius-medium-size-extra-large`
637
+ - `corner-radius-medium-size-extra-small`
638
+ - `corner-radius-medium-size-large`
639
+ - `corner-radius-medium-size-medium`
640
+ - `corner-radius-medium-size-small`
641
+ - `corner-radius-none`
642
+ - `corner-radius-small-default`
643
+ - `corner-radius-small-size-extra-large`
644
+ - `corner-radius-small-size-large`
645
+ - `corner-radius-small-size-medium`
646
+ - `corner-radius-small-size-small`
647
+ - `drop-shadow-x`
648
+ - `field-label-top-margin-extra-large`
649
+ - `field-label-top-margin-large`
650
+ - `field-label-top-margin-medium`
651
+ - `field-label-top-margin-small`
652
+ - `gray-background-color-default`
653
+ - `status-light-dot-size-small`
654
+ - `table-edge-to-content`
655
+
656
+ ## 13.0.0-beta.13
657
+
658
+ ### Minor Changes
659
+
660
+ - ef600c4: ## Design Motivation
661
+
662
+ - The updated tooltip component in Spectrum 2 has a larger, slightly rounded tip
663
+ - Added tokens for horizontal and vertical orientation
664
+
665
+ ## Tokens Diff
666
+
667
+ _Tokens added (3):_
668
+
669
+ - `divider-horizontal-minimum-width`
670
+ - `divider-vertical-minimum-height`
671
+ - `tooltip-tip-corner-radius`
672
+
673
+ _Token values updated (2):_
674
+
675
+ - `tooltip-tip-height`
676
+ - `tooltip-tip-width`
677
+
678
+ ## 13.0.0-beta.12
679
+
680
+ ### Minor Changes
681
+
682
+ - c87d743: Updates to spacing tokens for the S2 field label component include:
683
+
684
+ 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.
685
+
686
+ Token: field-label-top-margin-[medium, large, extra-large]. All values were updated to reflect 0px for both desktop and mobile scales
687
+
688
+ ## Design Motivation
689
+
690
+ These changes occurred as a result of updates to the field label component for S2.
691
+
692
+ ## Token Diff
693
+
694
+ _Token values updated (4):_
695
+
696
+ - `field-label-top-margin-extra-large`
697
+ - `field-label-top-margin-large`
698
+ - `field-label-top-margin-medium`
699
+ - `field-label-top-to-asterisk-extra-large`
700
+
701
+ ## Schema Diff
702
+
703
+ Adds missing schema information for `corner-radius-1000`. Also added `schemas/token-types/multiplier.json` to the `scale-set` schema.
704
+
705
+ ## 13.0.0-beta.11
706
+
707
+ ### Minor Changes
708
+
709
+ - 3c6303a: Updated text-to-visual-300 mobile value from 11px to 10px.
710
+
711
+ ## Design Motivation
712
+
713
+ To better follow our logarithmic scale rounding principle.
714
+
715
+ ## Token Diff
716
+
717
+ _Token values updated (1):_
718
+
719
+ - `text-to-visual-300`
720
+
721
+ - 6579966: existing corner-radius tokens, adding net-new global corner radius tokens, and introducing new alias names that point to these global values.
722
+
723
+ ## Design Motivation
724
+
725
+ More on Spectrum 2 rounding: https://s2.spectrum.corp.adobe.com/page/object-styles/#rounding
726
+
727
+ 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.
728
+
729
+ ## Token Diff
730
+
731
+ _Tokens added (23):_
732
+
733
+ - `corner-radius-0`
734
+ - `corner-radius-300`
735
+ - `corner-radius-400`
736
+ - `corner-radius-500`
737
+ - `corner-radius-600`
738
+ - `corner-radius-700`
739
+ - `corner-radius-800`
740
+ - `corner-radius-1000`
741
+ - `corner-radius-extra-large-default`
742
+ - `corner-radius-full`
743
+ - `corner-radius-large-default`
744
+ - `corner-radius-medium-default`
745
+ - `corner-radius-medium-size-extra-small`
746
+ - `corner-radius-medium-size-small`
747
+ - `corner-radius-medium-size-medium`
748
+ - `corner-radius-medium-size-large`
749
+ - `corner-radius-medium-size-extra-large`
750
+ - `corner-radius-none`
751
+ - `corner-radius-small-default`
752
+ - `corner-radius-small-size-small`
753
+ - `corner-radius-small-size-medium`
754
+ - `corner-radius-small-size-large`
755
+ - `corner-radius-small-size-extra-large`
756
+
757
+ _Token values updated (3):_
758
+
759
+ - `corner-radius-75`
760
+ - `corner-radius-100`
761
+ - `corner-radius-200`
762
+
763
+ ## 13.0.0-beta.10
764
+
765
+ ### Minor Changes
766
+
767
+ - 23d9085: Updated desktop and mobile values for component-edge-to-visual-only tokens.
768
+
769
+ Spacing changed due to new workflow icon sizes.
770
+
771
+ ## Token Diff
772
+
773
+ _Token values updated (5):_
774
+
775
+ - `component-edge-to-visual-only-100`
776
+ - `component-edge-to-visual-only-200`
777
+ - `component-edge-to-visual-only-300`
778
+ - `component-edge-to-visual-only-50`
779
+ - `component-edge-to-visual-only-75`
780
+
781
+ - c5430b7: Updated help-text-top-to-workflow-icon-_ token values to point to component-top-to-workflow-icon-_ tokens
782
+
783
+ ## Token Diff
784
+
785
+ _Newly deprecated tokens (4):_
786
+
787
+ - `help-text-top-to-workflow-icon-extra-large`: use `component-edge-to-visual-only-300`
788
+ - `help-text-top-to-workflow-icon-large`: use `component-edge-to-visual-only-200`
789
+ - `help-text-top-to-workflow-icon-medium`: use `component-edge-to-visual-only-100`
790
+ - `help-text-top-to-workflow-icon-small`: use `component-edge-to-visual-only-75`
791
+
792
+ ## 13.0.0-beta.9
793
+
794
+ ### Minor Changes
795
+
796
+ - cf09c84: Updated workflow-icon-size-50, 75, 100, 200, 300 with Spectrum 2 values in mobile and desktop.
797
+ Updated component-top-to-workflow and text-to-visual padding.
798
+ Added 3 new non-color tokens for S2 component downstates in Tokens Studio.
799
+
800
+ ## Design Motivation
801
+
802
+ Spectrum 2 icons have a different workflow icon sizing with base sizes 20 px (desktop), 24 px (mobile).
803
+
804
+ Updated padding values due to new workflow icon sizes in S2.
805
+
806
+ 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.
807
+
808
+ ## Tokens Diff
809
+
810
+ _Tokens added (3):_
811
+
812
+ - `component-size-difference-down`
813
+ - `component-size-minimum-perspective-down`
814
+ - `component-size-width-ratio-down`
815
+
816
+ _Token values updated (15):_
817
+
818
+ - `component-top-to-workflow-icon-100`
819
+ - `component-top-to-workflow-icon-200`
820
+ - `component-top-to-workflow-icon-300`
821
+ - `component-top-to-workflow-icon-50`
822
+ - `component-top-to-workflow-icon-75`
823
+ - `text-to-visual-100`
824
+ - `text-to-visual-200`
825
+ - `text-to-visual-300`
826
+ - `text-to-visual-50`
827
+ - `text-to-visual-75`
828
+ - `workflow-icon-size-100`
829
+ - `workflow-icon-size-200`
830
+ - `workflow-icon-size-300`
831
+ - `workflow-icon-size-50`
832
+ - `workflow-icon-size-75`
833
+
834
+ ## 13.0.0-beta.8
835
+
836
+ ### Minor Changes
837
+
838
+ - 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).
839
+
840
+ ## Design Motivation
841
+
842
+ 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.
843
+
844
+ ## Token Diff
845
+
846
+ _Tokens added (2):_
847
+
848
+ - `background-elevated-color`
849
+ - `background-pasteboard-color`
850
+
851
+ _Token values updated (1):_
852
+
853
+ - `background-base-color`
854
+
855
+ ## 13.0.0-beta.7
856
+
857
+ ### Minor Changes
858
+
859
+ - 4853f76: Added schema to all tokens and fixed values that didn't meet schema requirements
860
+
861
+ ## Token Diff
862
+
863
+ _Token values updated (328):_
864
+
865
+ - `accent-background-color-default`
866
+ - `accent-background-color-down`
867
+ - `accent-background-color-hover`
868
+ - `accent-background-color-key-focus`
869
+ - `accent-color-100`
870
+ - `accent-color-1000`
871
+ - `accent-color-1100`
872
+ - `accent-color-1200`
873
+ - `accent-color-1300`
874
+ - `accent-color-1400`
875
+ - `accent-color-200`
876
+ - `accent-color-300`
877
+ - `accent-color-400`
878
+ - `accent-color-500`
879
+ - `accent-color-600`
880
+ - `accent-color-700`
881
+ - `accent-color-800`
882
+ - `accent-color-900`
883
+ - `accent-content-color-default`
884
+ - `accent-content-color-down`
885
+ - `accent-content-color-hover`
886
+ - `accent-content-color-key-focus`
887
+ - `accent-content-color-selected`
888
+ - `accent-visual-color`
889
+ - `blue-100`
890
+ - `blue-1000`
891
+ - `blue-1100`
892
+ - `blue-1200`
893
+ - `blue-1300`
894
+ - `blue-1400`
895
+ - `blue-200`
896
+ - `blue-300`
897
+ - `blue-400`
898
+ - `blue-500`
899
+ - `blue-600`
900
+ - `blue-700`
901
+ - `blue-800`
902
+ - `blue-900`
903
+ - `blue-background-color-default`
904
+ - `blue-visual-color`
905
+ - `celery-100`
906
+ - `celery-1000`
907
+ - `celery-1100`
908
+ - `celery-1200`
909
+ - `celery-1300`
910
+ - `celery-1400`
911
+ - `celery-200`
912
+ - `celery-300`
913
+ - `celery-400`
914
+ - `celery-500`
915
+ - `celery-600`
916
+ - `celery-700`
917
+ - `celery-800`
918
+ - `celery-900`
919
+ - `celery-background-color-default`
920
+ - `celery-visual-color`
921
+ - `chartreuse-100`
922
+ - `chartreuse-1000`
923
+ - `chartreuse-1100`
924
+ - `chartreuse-1200`
925
+ - `chartreuse-1300`
926
+ - `chartreuse-1400`
927
+ - `chartreuse-200`
928
+ - `chartreuse-300`
929
+ - `chartreuse-400`
930
+ - `chartreuse-500`
931
+ - `chartreuse-600`
932
+ - `chartreuse-700`
933
+ - `chartreuse-800`
934
+ - `chartreuse-900`
935
+ - `chartreuse-background-color-default`
936
+ - `chartreuse-visual-color`
937
+ - `contextual-help-body-size`
938
+ - `cyan-100`
939
+ - `cyan-1000`
940
+ - `cyan-1100`
941
+ - `cyan-1200`
942
+ - `cyan-1300`
943
+ - `cyan-1400`
944
+ - `cyan-200`
945
+ - `cyan-300`
946
+ - `cyan-400`
947
+ - `cyan-500`
948
+ - `cyan-600`
949
+ - `cyan-700`
950
+ - `cyan-800`
951
+ - `cyan-900`
952
+ - `cyan-background-color-default`
953
+ - `cyan-visual-color`
954
+ - `drop-zone-background-color`
955
+ - `focus-indicator-color`
956
+ - `fuchsia-100`
957
+ - `fuchsia-1000`
958
+ - `fuchsia-1100`
959
+ - `fuchsia-1200`
960
+ - `fuchsia-1300`
961
+ - `fuchsia-1400`
962
+ - `fuchsia-200`
963
+ - `fuchsia-300`
964
+ - `fuchsia-400`
965
+ - `fuchsia-500`
966
+ - `fuchsia-600`
967
+ - `fuchsia-700`
968
+ - `fuchsia-800`
969
+ - `fuchsia-900`
970
+ - `fuchsia-background-color-default`
971
+ - `fuchsia-visual-color`
972
+ - `green-100`
973
+ - `green-1000`
974
+ - `green-1100`
975
+ - `green-1200`
976
+ - `green-1300`
977
+ - `green-1400`
978
+ - `green-200`
979
+ - `green-300`
980
+ - `green-400`
981
+ - `green-500`
982
+ - `green-600`
983
+ - `green-700`
984
+ - `green-800`
985
+ - `green-900`
986
+ - `green-background-color-default`
987
+ - `green-visual-color`
988
+ - `icon-color-blue-primary-default`
989
+ - `icon-color-green-primary-default`
990
+ - `icon-color-red-primary-default`
991
+ - `icon-color-yellow-primary-default`
992
+ - `indigo-100`
993
+ - `indigo-1000`
994
+ - `indigo-1100`
995
+ - `indigo-1200`
996
+ - `indigo-1300`
997
+ - `indigo-1400`
998
+ - `indigo-200`
999
+ - `indigo-300`
1000
+ - `indigo-400`
1001
+ - `indigo-500`
1002
+ - `indigo-600`
1003
+ - `indigo-700`
1004
+ - `indigo-800`
1005
+ - `indigo-900`
1006
+ - `indigo-background-color-default`
1007
+ - `indigo-visual-color`
1008
+ - `informative-background-color-default`
1009
+ - `informative-background-color-down`
1010
+ - `informative-background-color-hover`
1011
+ - `informative-background-color-key-focus`
1012
+ - `informative-color-100`
1013
+ - `informative-color-1000`
1014
+ - `informative-color-1100`
1015
+ - `informative-color-1200`
1016
+ - `informative-color-1300`
1017
+ - `informative-color-1400`
1018
+ - `informative-color-200`
1019
+ - `informative-color-300`
1020
+ - `informative-color-400`
1021
+ - `informative-color-500`
1022
+ - `informative-color-600`
1023
+ - `informative-color-700`
1024
+ - `informative-color-800`
1025
+ - `informative-color-900`
1026
+ - `informative-visual-color`
1027
+ - `magenta-100`
1028
+ - `magenta-1000`
1029
+ - `magenta-1100`
1030
+ - `magenta-1200`
1031
+ - `magenta-1300`
1032
+ - `magenta-1400`
1033
+ - `magenta-200`
1034
+ - `magenta-300`
1035
+ - `magenta-400`
1036
+ - `magenta-500`
1037
+ - `magenta-600`
1038
+ - `magenta-700`
1039
+ - `magenta-800`
1040
+ - `magenta-900`
1041
+ - `magenta-background-color-default`
1042
+ - `magenta-visual-color`
1043
+ - `navigational-indicator-top-to-back-icon-extra-large`
1044
+ - `navigational-indicator-top-to-back-icon-large`
1045
+ - `navigational-indicator-top-to-back-icon-medium`
1046
+ - `navigational-indicator-top-to-back-icon-small`
1047
+ - `negative-background-color-default`
1048
+ - `negative-background-color-down`
1049
+ - `negative-background-color-hover`
1050
+ - `negative-background-color-key-focus`
1051
+ - `negative-border-color-default`
1052
+ - `negative-border-color-down`
1053
+ - `negative-border-color-focus`
1054
+ - `negative-border-color-focus-hover`
1055
+ - `negative-border-color-hover`
1056
+ - `negative-border-color-key-focus`
1057
+ - `negative-color-100`
1058
+ - `negative-color-1000`
1059
+ - `negative-color-1100`
1060
+ - `negative-color-1200`
1061
+ - `negative-color-1300`
1062
+ - `negative-color-1400`
1063
+ - `negative-color-200`
1064
+ - `negative-color-300`
1065
+ - `negative-color-400`
1066
+ - `negative-color-500`
1067
+ - `negative-color-600`
1068
+ - `negative-color-700`
1069
+ - `negative-color-800`
1070
+ - `negative-color-900`
1071
+ - `negative-content-color-default`
1072
+ - `negative-content-color-down`
1073
+ - `negative-content-color-hover`
1074
+ - `negative-content-color-key-focus`
1075
+ - `negative-visual-color`
1076
+ - `notice-background-color-default`
1077
+ - `notice-color-100`
1078
+ - `notice-color-1000`
1079
+ - `notice-color-1100`
1080
+ - `notice-color-1200`
1081
+ - `notice-color-1300`
1082
+ - `notice-color-1400`
1083
+ - `notice-color-200`
1084
+ - `notice-color-300`
1085
+ - `notice-color-400`
1086
+ - `notice-color-500`
1087
+ - `notice-color-600`
1088
+ - `notice-color-700`
1089
+ - `notice-color-800`
1090
+ - `notice-color-900`
1091
+ - `notice-visual-color`
1092
+ - `orange-100`
1093
+ - `orange-1000`
1094
+ - `orange-1100`
1095
+ - `orange-1200`
1096
+ - `orange-1300`
1097
+ - `orange-1400`
1098
+ - `orange-200`
1099
+ - `orange-300`
1100
+ - `orange-400`
1101
+ - `orange-500`
1102
+ - `orange-600`
1103
+ - `orange-700`
1104
+ - `orange-800`
1105
+ - `orange-900`
1106
+ - `orange-background-color-default`
1107
+ - `orange-visual-color`
1108
+ - `positive-background-color-default`
1109
+ - `positive-background-color-down`
1110
+ - `positive-background-color-hover`
1111
+ - `positive-background-color-key-focus`
1112
+ - `positive-color-100`
1113
+ - `positive-color-1000`
1114
+ - `positive-color-1100`
1115
+ - `positive-color-1200`
1116
+ - `positive-color-1300`
1117
+ - `positive-color-1400`
1118
+ - `positive-color-200`
1119
+ - `positive-color-300`
1120
+ - `positive-color-400`
1121
+ - `positive-color-500`
1122
+ - `positive-color-600`
1123
+ - `positive-color-700`
1124
+ - `positive-color-800`
1125
+ - `positive-color-900`
1126
+ - `positive-visual-color`
1127
+ - `purple-100`
1128
+ - `purple-1000`
1129
+ - `purple-1100`
1130
+ - `purple-1200`
1131
+ - `purple-1300`
1132
+ - `purple-1400`
1133
+ - `purple-200`
1134
+ - `purple-300`
1135
+ - `purple-400`
1136
+ - `purple-500`
1137
+ - `purple-600`
1138
+ - `purple-700`
1139
+ - `purple-800`
1140
+ - `purple-900`
1141
+ - `purple-background-color-default`
1142
+ - `purple-visual-color`
1143
+ - `red-100`
1144
+ - `red-1000`
1145
+ - `red-1100`
1146
+ - `red-1200`
1147
+ - `red-1300`
1148
+ - `red-1400`
1149
+ - `red-200`
1150
+ - `red-300`
1151
+ - `red-400`
1152
+ - `red-500`
1153
+ - `red-600`
1154
+ - `red-700`
1155
+ - `red-800`
1156
+ - `red-900`
1157
+ - `red-background-color-default`
1158
+ - `red-visual-color`
1159
+ - `seafoam-100`
1160
+ - `seafoam-1000`
1161
+ - `seafoam-1100`
1162
+ - `seafoam-1200`
1163
+ - `seafoam-1300`
1164
+ - `seafoam-1400`
1165
+ - `seafoam-200`
1166
+ - `seafoam-300`
1167
+ - `seafoam-400`
1168
+ - `seafoam-500`
1169
+ - `seafoam-600`
1170
+ - `seafoam-700`
1171
+ - `seafoam-800`
1172
+ - `seafoam-900`
1173
+ - `seafoam-background-color-default`
1174
+ - `seafoam-visual-color`
1175
+ - `side-navigation-item-to-header`
1176
+ - `table-selected-row-background-color`
1177
+ - `yellow-100`
1178
+ - `yellow-1000`
1179
+ - `yellow-1100`
1180
+ - `yellow-1200`
1181
+ - `yellow-1300`
1182
+ - `yellow-1400`
1183
+ - `yellow-200`
1184
+ - `yellow-300`
1185
+ - `yellow-400`
1186
+ - `yellow-500`
1187
+ - `yellow-600`
1188
+ - `yellow-700`
1189
+ - `yellow-800`
1190
+ - `yellow-900`
1191
+ - `yellow-background-color-default`
1192
+ - `yellow-visual-color`
1193
+
1194
+ ## 13.0.0-beta.6
1195
+
1196
+ ### Minor Changes
1197
+
1198
+ - 6d1c661: Added new Spectrum 2 color tokens for both light and dark themes:
1199
+
1200
+ Cinnamon 100 to 1600
1201
+
1202
+ ## Design Motivation
1203
+
1204
+ 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.
1205
+
1206
+ ## Token Diff
1207
+
1208
+ _Tokens added (17):_
1209
+
1210
+ - `cinnamon-100`
1211
+ - `cinnamon-200`
1212
+ - `cinnamon-300`
1213
+ - `cinnamon-400`
1214
+ - `cinnamon-500`
1215
+ - `cinnamon-600`
1216
+ - `cinnamon-700`
1217
+ - `cinnamon-800`
1218
+ - `cinnamon-900`
1219
+ - `cinnamon-1000`
1220
+ - `cinnamon-1100`
1221
+ - `cinnamon-1200`
1222
+ - `cinnamon-1300`
1223
+ - `cinnamon-1400`
1224
+ - `cinnamon-1500`
1225
+ - `cinnamon-1600`
1226
+
1227
+ - 91d7e95: Fixed bug in the light theme value for notice-background-color-default, from notice-color-800 to notice-color-600
1228
+
1229
+ ## Design Motivation
1230
+
1231
+ 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
1232
+
1233
+ ## Token Diff
1234
+
1235
+ _Token values updated (1):_
1236
+
1237
+ - `notice-background-color-default`: `light`: `notice-color-800` -> `notice-color-600`
1238
+
1239
+ ## 13.0.0-beta.5
1240
+
1241
+ ### Major Changes
1242
+
1243
+ - 0af2674: feat: new color values for spectrum2
1244
+
1245
+ ## Design Motivation
1246
+
1247
+ This update addresses several improvements:
1248
+
1249
+ fuchsia, seafoam: all values shifted to make room for new colors, pink and turquoise
1250
+ all other colors: certain values were updated to address accessibility contrast requirements against Spectrum 2 background layer colors
1251
+
1252
+ ## Token Diff
1253
+
1254
+ <details><summary><strong>Token values updated (246):</strong></summary>
1255
+
1256
+ - `accent-background-color-default`
1257
+ - `accent-background-color-down`
1258
+ - `accent-background-color-hover`
1259
+ - `accent-background-color-key-focus`
1260
+ - `accent-color-1000`
1261
+ - `accent-color-200`
1262
+ - `accent-color-300`
1263
+ - `accent-color-400`
1264
+ - `accent-color-500`
1265
+ - `accent-color-600`
1266
+ - `accent-color-700`
1267
+ - `accent-color-800`
1268
+ - `accent-color-900`
1269
+ - `accent-content-color-default`
1270
+ - `accent-content-color-down`
1271
+ - `accent-content-color-hover`
1272
+ - `accent-content-color-key-focus`
1273
+ - `accent-content-color-selected`
1274
+ - `accent-visual-color`
1275
+ - `blue-1000`
1276
+ - `blue-200`
1277
+ - `blue-300`
1278
+ - `blue-400`
1279
+ - `blue-500`
1280
+ - `blue-600`
1281
+ - `blue-700`
1282
+ - `blue-800`
1283
+ - `blue-900`
1284
+ - `blue-background-color-default`
1285
+ - `blue-visual-color`
1286
+ - `celery-1000`
1287
+ - `celery-200`
1288
+ - `celery-300`
1289
+ - `celery-400`
1290
+ - `celery-500`
1291
+ - `celery-600`
1292
+ - `celery-700`
1293
+ - `celery-800`
1294
+ - `celery-900`
1295
+ - `celery-background-color-default`
1296
+ - `celery-visual-color`
1297
+ - `chartreuse-1000`
1298
+ - `chartreuse-200`
1299
+ - `chartreuse-300`
1300
+ - `chartreuse-400`
1301
+ - `chartreuse-500`
1302
+ - `chartreuse-600`
1303
+ - `chartreuse-700`
1304
+ - `chartreuse-800`
1305
+ - `chartreuse-900`
1306
+ - `chartreuse-background-color-default`
1307
+ - `chartreuse-visual-color`
1308
+ - `cyan-1000`
1309
+ - `cyan-300`
1310
+ - `cyan-400`
1311
+ - `cyan-500`
1312
+ - `cyan-600`
1313
+ - `cyan-700`
1314
+ - `cyan-800`
1315
+ - `cyan-900`
1316
+ - `cyan-background-color-default`
1317
+ - `cyan-visual-color`
1318
+ - `drop-zone-background-color`
1319
+ - `focus-indicator-color`
1320
+ - `fuchsia-100`
1321
+ - `fuchsia-1000`
1322
+ - `fuchsia-1100`
1323
+ - `fuchsia-1200`
1324
+ - `fuchsia-1300`
1325
+ - `fuchsia-1400`
1326
+ - `fuchsia-1500`
1327
+ - `fuchsia-1600`
1328
+ - `fuchsia-200`
1329
+ - `fuchsia-300`
1330
+ - `fuchsia-400`
1331
+ - `fuchsia-500`
1332
+ - `fuchsia-600`
1333
+ - `fuchsia-700`
1334
+ - `fuchsia-800`
1335
+ - `fuchsia-900`
1336
+ - `fuchsia-background-color-default`
1337
+ - `fuchsia-visual-color`
1338
+ - `green-100`
1339
+ - `green-1000`
1340
+ - `green-200`
1341
+ - `green-300`
1342
+ - `green-400`
1343
+ - `green-500`
1344
+ - `green-600`
1345
+ - `green-700`
1346
+ - `green-800`
1347
+ - `green-900`
1348
+ - `green-background-color-default`
1349
+ - `green-visual-color`
1350
+ - `icon-color-blue-primary-default`
1351
+ - `icon-color-green-primary-default`
1352
+ - `icon-color-red-primary-default`
1353
+ - `icon-color-yellow-primary-default`
1354
+ - `indigo-1000`
1355
+ - `indigo-300`
1356
+ - `indigo-400`
1357
+ - `indigo-500`
1358
+ - `indigo-600`
1359
+ - `indigo-700`
1360
+ - `indigo-800`
1361
+ - `indigo-900`
1362
+ - `indigo-background-color-default`
1363
+ - `indigo-visual-color`
1364
+ - `informative-background-color-default`
1365
+ - `informative-background-color-down`
1366
+ - `informative-background-color-hover`
1367
+ - `informative-background-color-key-focus`
1368
+ - `informative-color-1000`
1369
+ - `informative-color-200`
1370
+ - `informative-color-300`
1371
+ - `informative-color-400`
1372
+ - `informative-color-500`
1373
+ - `informative-color-600`
1374
+ - `informative-color-700`
1375
+ - `informative-color-800`
1376
+ - `informative-color-900`
1377
+ - `informative-visual-color`
1378
+ - `magenta-100`
1379
+ - `magenta-1000`
1380
+ - `magenta-1100`
1381
+ - `magenta-1200`
1382
+ - `magenta-1300`
1383
+ - `magenta-1400`
1384
+ - `magenta-200`
1385
+ - `magenta-300`
1386
+ - `magenta-400`
1387
+ - `magenta-500`
1388
+ - `magenta-600`
1389
+ - `magenta-700`
1390
+ - `magenta-800`
1391
+ - `magenta-900`
1392
+ - `magenta-background-color-default`
1393
+ - `magenta-visual-color`
1394
+ - `negative-background-color-default`
1395
+ - `negative-background-color-down`
1396
+ - `negative-background-color-hover`
1397
+ - `negative-background-color-key-focus`
1398
+ - `negative-border-color-default`
1399
+ - `negative-border-color-focus`
1400
+ - `negative-border-color-hover`
1401
+ - `negative-border-color-key-focus`
1402
+ - `negative-color-1000`
1403
+ - `negative-color-200`
1404
+ - `negative-color-300`
1405
+ - `negative-color-400`
1406
+ - `negative-color-500`
1407
+ - `negative-color-600`
1408
+ - `negative-color-700`
1409
+ - `negative-color-800`
1410
+ - `negative-color-900`
1411
+ - `negative-content-color-default`
1412
+ - `negative-content-color-down`
1413
+ - `negative-content-color-hover`
1414
+ - `negative-content-color-key-focus`
1415
+ - `negative-visual-color`
1416
+ - `notice-background-color-default`
1417
+ - `notice-color-1000`
1418
+ - `notice-color-200`
1419
+ - `notice-color-400`
1420
+ - `notice-color-500`
1421
+ - `notice-color-600`
1422
+ - `notice-color-700`
1423
+ - `notice-color-800`
1424
+ - `notice-color-900`
1425
+ - `notice-visual-color`
1426
+ - `orange-1000`
1427
+ - `orange-200`
1428
+ - `orange-400`
1429
+ - `orange-500`
1430
+ - `orange-600`
1431
+ - `orange-700`
1432
+ - `orange-800`
1433
+ - `orange-900`
1434
+ - `orange-background-color-default`
1435
+ - `orange-visual-color`
1436
+ - `positive-background-color-default`
1437
+ - `positive-background-color-down`
1438
+ - `positive-background-color-hover`
1439
+ - `positive-background-color-key-focus`
1440
+ - `positive-color-100`
1441
+ - `positive-color-1000`
1442
+ - `positive-color-200`
1443
+ - `positive-color-300`
1444
+ - `positive-color-400`
1445
+ - `positive-color-500`
1446
+ - `positive-color-600`
1447
+ - `positive-color-700`
1448
+ - `positive-color-800`
1449
+ - `positive-color-900`
1450
+ - `positive-visual-color`
1451
+ - `purple-1000`
1452
+ - `purple-200`
1453
+ - `purple-300`
1454
+ - `purple-400`
1455
+ - `purple-500`
1456
+ - `purple-600`
1457
+ - `purple-700`
1458
+ - `purple-800`
1459
+ - `purple-900`
1460
+ - `purple-background-color-default`
1461
+ - `purple-visual-color`
1462
+ - `red-1000`
1463
+ - `red-200`
1464
+ - `red-300`
1465
+ - `red-400`
1466
+ - `red-500`
1467
+ - `red-600`
1468
+ - `red-700`
1469
+ - `red-800`
1470
+ - `red-900`
1471
+ - `red-background-color-default`
1472
+ - `red-visual-color`
1473
+ - `seafoam-100`
1474
+ - `seafoam-1000`
1475
+ - `seafoam-1100`
1476
+ - `seafoam-1200`
1477
+ - `seafoam-1300`
1478
+ - `seafoam-1400`
1479
+ - `seafoam-1500`
1480
+ - `seafoam-1600`
1481
+ - `seafoam-200`
1482
+ - `seafoam-300`
1483
+ - `seafoam-400`
1484
+ - `seafoam-500`
1485
+ - `seafoam-600`
1486
+ - `seafoam-700`
1487
+ - `seafoam-800`
1488
+ - `seafoam-900`
1489
+ - `seafoam-background-color-default`
1490
+ - `seafoam-visual-color`
1491
+ - `table-selected-row-background-color`
1492
+ - `yellow-1000`
1493
+ - `yellow-300`
1494
+ - `yellow-400`
1495
+ - `yellow-500`
1496
+ - `yellow-600`
1497
+ - `yellow-700`
1498
+ - `yellow-800`
1499
+ - `yellow-900`
1500
+ - `yellow-background-color-default`
1501
+ - `yellow-visual-color`
1502
+
1503
+ </details>
1504
+
1505
+ ### Minor Changes
1506
+
1507
+ - 7b5ec24: feat: add new color tokens
1508
+
1509
+ ## Design Motivation
1510
+
1511
+ Added new colors due to needs from Premiere Pro. The additional colors will also help when creating new data vis color palettes for Spectrum 2.
1512
+
1513
+ ## Token Diff
1514
+
1515
+ <details><summary><strong>Tokens added (64):</strong></summary>
1516
+
1517
+ - `brown-100`
1518
+ - `brown-1000`
1519
+ - `brown-1100`
1520
+ - `brown-1200`
1521
+ - `brown-1300`
1522
+ - `brown-1400`
1523
+ - `brown-1500`
1524
+ - `brown-1600`
1525
+ - `brown-200`
1526
+ - `brown-300`
1527
+ - `brown-400`
1528
+ - `brown-500`
1529
+ - `brown-600`
1530
+ - `brown-700`
1531
+ - `brown-800`
1532
+ - `brown-900`
1533
+ - `pink-100`
1534
+ - `pink-1000`
1535
+ - `pink-1100`
1536
+ - `pink-1200`
1537
+ - `pink-1300`
1538
+ - `pink-1400`
1539
+ - `pink-1500`
1540
+ - `pink-1600`
1541
+ - `pink-200`
1542
+ - `pink-300`
1543
+ - `pink-400`
1544
+ - `pink-500`
1545
+ - `pink-600`
1546
+ - `pink-700`
1547
+ - `pink-800`
1548
+ - `pink-900`
1549
+ - `silver-100`
1550
+ - `silver-1000`
1551
+ - `silver-1100`
1552
+ - `silver-1200`
1553
+ - `silver-1300`
1554
+ - `silver-1400`
1555
+ - `silver-1500`
1556
+ - `silver-1600`
1557
+ - `silver-200`
1558
+ - `silver-300`
1559
+ - `silver-400`
1560
+ - `silver-500`
1561
+ - `silver-600`
1562
+ - `silver-700`
1563
+ - `silver-800`
1564
+ - `silver-900`
1565
+ - `turquoise-100`
1566
+ - `turquoise-1000`
1567
+ - `turquoise-1100`
1568
+ - `turquoise-1200`
1569
+ - `turquoise-1300`
1570
+ - `turquoise-1400`
1571
+ - `turquoise-1500`
1572
+ - `turquoise-1600`
1573
+ - `turquoise-200`
1574
+ - `turquoise-300`
1575
+ - `turquoise-400`
1576
+ - `turquoise-500`
1577
+ - `turquoise-600`
1578
+ - `turquoise-700`
1579
+ - `turquoise-800`
1580
+ - `turquoise-900`
1581
+
1582
+ </details>
1583
+
1584
+ ## 13.0.0-beta.4
1585
+
1586
+ ### Major Changes
1587
+
1588
+ - a08dced: A handful of values transitioned from being defined per-set to being constants; set values are deprecated and root values are defined.
1589
+
1590
+ ## Token Diff
1591
+
1592
+ _Token values updated (5):_
1593
+
1594
+ - `neutral-background-color-default`: changed from a color-set to a single value of a reference of `gray-800`
1595
+ - `neutral-background-color-down`: changed from a color-set to a single value of a reference of `gray-900`
1596
+ - `neutral-background-color-hover`: changed from a color-set to a single value of a reference of `gray-900`
1597
+ - `neutral-background-color-key-focus`: changed from a color-set to a single value of a reference of `gray-900`
1598
+ - `notice-background-color-default`: changed from a color-set to a single value of a reference of `notice-color-800`
1599
+
1600
+ ### Patch Changes
1601
+
1602
+ - c0a10b4: fix: rgb used instead of rgba for a couple tokens
1603
+
3
1604
  ## 13.0.0-beta.3
4
1605
 
5
1606
  ### Patch Changes