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

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 (16) hide show
  1. package/CHANGELOG.md +310 -0
  2. package/dist/json/drover.json +157 -94
  3. package/dist/json/variables.json +2157 -592
  4. package/index.js +8 -0
  5. package/package.json +3 -3
  6. package/schemas/token-types/gradient-stop.json +27 -0
  7. package/schemas/token-types/text-align.json +27 -0
  8. package/src/color-aliases.json +334 -41
  9. package/src/color-component.json +4 -14
  10. package/src/color-palette.json +19 -19
  11. package/src/icons.json +74 -1
  12. package/src/layout-component.json +428 -55
  13. package/src/layout.json +6 -1
  14. package/src/semantic-color-palette.json +67 -12
  15. package/test/checkComponentProps.js +1 -0
  16. package/test/checkSetsUnique.js +54 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,315 @@
1
1
  # @adobe/spectrum-tokens
2
2
 
3
+ ## 13.0.0-beta.47
4
+
5
+ ### Minor Changes
6
+
7
+ - [`75a573b`](https://github.com/adobe/spectrum-tokens/commit/75a573bcbb7b71ecdf5f246682755de24dae5afc) Thanks [@GarthDB](https://github.com/GarthDB)! - S2 subtle and visual colors update
8
+ Updated S2 Table tokens
9
+
10
+ <details><summary>Tokens added (42):</summary>
11
+
12
+ - `illustrated-message-maximum-width`
13
+ - `side-focus-indicator`
14
+ - `table-row-bottom-to-text-extra-large`
15
+ - `table-row-bottom-to-text-extra-large-regular`
16
+ - `table-row-bottom-to-text-large`
17
+ - `table-row-bottom-to-text-large-regular`
18
+ - `table-row-bottom-to-text-medium`
19
+ - `table-row-bottom-to-text-medium-regular`
20
+ - `table-row-bottom-to-text-small`
21
+ - `table-row-bottom-to-text-small-regular`
22
+ - `table-row-checkbox-to-top-extra-large`
23
+ - `table-row-checkbox-to-top-extra-large-regular`
24
+ - `table-row-checkbox-to-top-large`
25
+ - `table-row-checkbox-to-top-large-regular`
26
+ - `table-row-checkbox-to-top-medium`
27
+ - `table-row-checkbox-to-top-medium-regular`
28
+ - `table-row-checkbox-to-top-small`
29
+ - `table-row-checkbox-to-top-small-regular`
30
+ - `table-row-height-extra-large`
31
+ - `table-row-height-extra-large-regular`
32
+ - `table-row-height-large`
33
+ - `table-row-height-large-regular`
34
+ - `table-row-height-medium`
35
+ - `table-row-height-medium-regular`
36
+ - `table-row-height-small`
37
+ - `table-row-height-small-regular`
38
+ - `table-row-top-to-text-extra-large`
39
+ - `table-row-top-to-text-extra-large-regular`
40
+ - `table-row-top-to-text-large`
41
+ - `table-row-top-to-text-large-regular`
42
+ - `table-row-top-to-text-medium`
43
+ - `table-row-top-to-text-medium-regular`
44
+ - `table-row-top-to-text-small`
45
+ - `table-row-top-to-text-small-regular`
46
+ - `table-thumbnail-to-top-minimum-extra-large`
47
+ - `table-thumbnail-to-top-minimum-extra-large-regular`
48
+ - `table-thumbnail-to-top-minimum-large`
49
+ - `table-thumbnail-to-top-minimum-large-regular`
50
+ - `table-thumbnail-to-top-minimum-medium`
51
+ - `table-thumbnail-to-top-minimum-medium-regular`
52
+ - `table-thumbnail-to-top-minimum-small`
53
+ - `table-thumbnail-to-top-minimum-small-regular`
54
+
55
+ </details>
56
+
57
+ <details><summary>Tokens updated (101):</summary>
58
+
59
+ - `informative-subtle-background-color-default`
60
+ - light: `blue-200` -> `informative-color-200`
61
+ - dark: `blue-200` -> `informative-color-300`
62
+ - `positive-subtle-background-color-default`
63
+ - light: `green-200` -> `positive-color-200`
64
+ - dark: `green-200` -> `positive-color-300`
65
+ - `notice-subtle-background-color-default`
66
+ - light: `orange-200` -> `notice-color-200`
67
+ - dark: `orange-200` -> `notice-color-300`
68
+ - `negative-subtle-background-color-default`
69
+ - light: `red-200` -> `negative-color-200`
70
+ - dark: `red-200` -> `negative-color-300`
71
+ - `table-column-header-row-top-to-text-medium`
72
+ - desktop: `7px` -> `6px`
73
+ - `table-row-height-small-regular`
74
+ - desktop: `32px` -> `table-row-height-small`
75
+ - mobile: `40px` -> `table-row-height-small`
76
+ - `table-row-height-medium-regular`
77
+ - desktop: `40px` -> `table-row-height-medium`
78
+ - mobile: `50px` -> `table-row-height-medium`
79
+ - `table-row-height-large-regular`
80
+ - desktop: `48px` -> `table-row-height-large`
81
+ - mobile: `60px` -> `table-row-height-large`
82
+ - `table-row-height-extra-large-regular`
83
+ - desktop: `56px` -> `table-row-height-extra-large`
84
+ - mobile: `70px` -> `table-row-height-extra-large`
85
+ - `table-row-top-to-text-small-regular`
86
+ - desktop: `8px` -> `table-row-top-to-text-small`
87
+ - mobile: `10px` -> `table-row-top-to-text-small`
88
+ - `table-row-top-to-text-medium-regular`
89
+ - desktop: `11px` -> `table-row-top-to-text-medium`
90
+ - mobile: `14px` -> `table-row-top-to-text-medium`
91
+ - `table-row-top-to-text-large-regular`
92
+ - desktop: `14px` -> `table-row-top-to-text-large`
93
+ - mobile: `18px` -> `table-row-top-to-text-large`
94
+ - `table-row-top-to-text-extra-large-regular`
95
+ - desktop: `17px` -> `table-row-top-to-text-extra-large`
96
+ - mobile: `21px` -> `table-row-top-to-text-extra-large`
97
+ - `table-row-bottom-to-text-small-regular`
98
+ - desktop: `9px` -> `table-row-bottom-to-text-small`
99
+ - mobile: `11px` -> `table-row-bottom-to-text-small`
100
+ - `table-row-bottom-to-text-medium-regular`
101
+ - desktop: `12px` -> `table-row-bottom-to-text-medium`
102
+ - mobile: `15px` -> `table-row-bottom-to-text-medium`
103
+ - `table-row-bottom-to-text-large-regular`
104
+ - desktop: `14px` -> `table-row-bottom-to-text-large`
105
+ - mobile: `18px` -> `table-row-bottom-to-text-large`
106
+ - `table-row-bottom-to-text-extra-large-regular`
107
+ - desktop: `17px` -> `table-row-bottom-to-text-extra-large`
108
+ - mobile: `22px` -> `table-row-bottom-to-text-extra-large`
109
+ - `table-row-top-to-text-medium-spacious`
110
+ - mobile: `18px` -> `16px`
111
+ - `table-header-row-checkbox-to-top-medium`
112
+ - desktop: `9px` -> `8px`
113
+ - mobile: `13px` -> `11px`
114
+ - `table-row-checkbox-to-top-small-regular`
115
+ - desktop: `10px` -> `table-row-checkbox-to-top-small`
116
+ - mobile: `14px` -> `table-row-checkbox-to-top-small`
117
+ - `table-row-checkbox-to-top-medium-compact`
118
+ - desktop: `9px` -> `8px`
119
+ - mobile: `13px` -> `11px`
120
+ - `table-row-checkbox-to-top-medium-regular`
121
+ - desktop: `13px` -> `table-row-checkbox-to-top-medium`
122
+ - mobile: `18px` -> `table-row-checkbox-to-top-medium`
123
+ - `table-row-checkbox-to-top-medium-spacious`
124
+ - desktop: `17px` -> `16px`
125
+ - mobile: `23px` -> `21px`
126
+ - `table-row-checkbox-to-top-large-regular`
127
+ - desktop: `16px` -> `table-row-checkbox-to-top-large`
128
+ - mobile: `22px` -> `table-row-checkbox-to-top-large`
129
+ - `table-row-checkbox-to-top-extra-large-regular`
130
+ - desktop: `19px` -> `table-row-checkbox-to-top-extra-large`
131
+ - mobile: `26px` -> `table-row-checkbox-to-top-extra-large`
132
+ - `table-thumbnail-to-top-minimum-small-regular`
133
+ - desktop: `5px` -> `table-thumbnail-to-top-minimum-small`
134
+ - mobile: `6px` -> `table-thumbnail-to-top-minimum-small`
135
+ - `table-thumbnail-to-top-minimum-medium-regular`
136
+ - desktop: `7px` -> `table-thumbnail-to-top-minimum-medium`
137
+ - mobile: `9px` -> `table-thumbnail-to-top-minimum-medium`
138
+ - `table-thumbnail-to-top-minimum-large-regular`
139
+ - desktop: `8px` -> `table-thumbnail-to-top-minimum-large`
140
+ - mobile: `10px` -> `table-thumbnail-to-top-minimum-large`
141
+ - `table-thumbnail-to-top-minimum-extra-large-regular`
142
+ - desktop: `8px` -> `table-thumbnail-to-top-minimum-extra-large`
143
+ - mobile: `10px` -> `table-thumbnail-to-top-minimum-extra-large`
144
+ - `blue-800`
145
+ - dark: `rgb(69, 110, 254)` -> `rgb(64, 105, 253)`
146
+ - `red-800`
147
+ - dark: `rgb(230, 54, 35)` -> `rgb(223, 52, 34)`
148
+ - `orange-800`
149
+ - dark: `rgb(205, 86, 0)` -> `rgb(199, 82, 0)`
150
+ - `yellow-800`
151
+ - dark: `rgb(169, 110, 0)` -> `rgb(164, 106, 0)`
152
+ - `chartreuse-800`
153
+ - dark: `rgb(109, 131, 0)` -> `rgb(106, 127, 0)`
154
+ - `celery-800`
155
+ - dark: `rgb(69, 138, 19)` -> `rgb(66, 134, 18)`
156
+ - `green-800`
157
+ - dark: `rgb(6, 140, 82)` -> `rgb(6, 136, 80)`
158
+ - `seafoam-800`
159
+ - dark: `rgb(8, 138, 116)` -> `rgb(8, 134, 112)`
160
+ - `cyan-800`
161
+ - dark: `rgb(15, 128, 194)` -> `rgb(13, 125, 186)`
162
+ - `indigo-800`
163
+ - dark: `rgb(119, 97, 252)` -> `rgb(116, 91, 252)`
164
+ - `purple-800`
165
+ - dark: `rgb(161, 84, 229)` -> `rgb(157, 78, 228)`
166
+ - `fuchsia-800`
167
+ - dark: `rgb(192, 64, 212)` -> `rgb(186, 60, 206)`
168
+ - `magenta-800`
169
+ - dark: `rgb(231, 41, 105)` -> `rgb(224, 38, 101)`
170
+ - `pink-800`
171
+ - dark: `rgb(220, 47, 156)` -> `rgb(213, 45, 151)`
172
+ - `turquoise-800`
173
+ - dark: `rgb(9, 135, 147)` -> `rgb(9, 131, 142)`
174
+ - `brown-800`
175
+ - dark: `rgb(148, 118, 73)` -> `rgb(143, 114, 69)`
176
+ - `silver-800`
177
+ - dark: `rgb(123, 123, 123)` -> `rgb(118, 118, 118)`
178
+ - `cinnamon-800`
179
+ - dark: `rgb(179, 103, 64)` -> `rgb(176, 98, 59)`
180
+ - `accent-background-color-default`
181
+ - dark: `accent-color-700` -> `accent-color-800`
182
+ - `accent-background-color-hover`
183
+ - dark: `accent-color-600` -> `accent-color-700`
184
+ - `accent-background-color-down`
185
+ - dark: `accent-color-600` -> `accent-color-700`
186
+ - `accent-background-color-key-focus`
187
+ - dark: `accent-color-600` -> `accent-color-700`
188
+ - `informative-background-color-default`
189
+ - dark: `informative-color-700` -> `informative-color-800`
190
+ - `informative-background-color-hover`
191
+ - dark: `informative-color-600` -> `informative-color-700`
192
+ - `informative-background-color-down`
193
+ - dark: `informative-color-600` -> `informative-color-700`
194
+ - `informative-background-color-key-focus`
195
+ - dark: `informative-color-600` -> `informative-color-700`
196
+ - `negative-background-color-default`
197
+ - dark: `negative-color-700` -> `negative-color-800`
198
+ - `negative-background-color-hover`
199
+ - dark: `negative-color-600` -> `negative-color-700`
200
+ - `negative-background-color-down`
201
+ - dark: `negative-color-600` -> `negative-color-700`
202
+ - `negative-background-color-key-focus`
203
+ - dark: `negative-color-600` -> `negative-color-700`
204
+ - `positive-background-color-default`
205
+ - dark: `positive-color-700` -> `positive-color-800`
206
+ - `positive-background-color-hover`
207
+ - dark: `positive-color-600` -> `positive-color-700`
208
+ - `positive-background-color-down`
209
+ - dark: `positive-color-600` -> `positive-color-700`
210
+ - `positive-background-color-key-focus`
211
+ - dark: `positive-color-600` -> `positive-color-700`
212
+ - `red-background-color-default`
213
+ - dark: `red-700` -> `red-800`
214
+ - `green-background-color-default`
215
+ - dark: `green-700` -> `green-800`
216
+ - `seafoam-background-color-default`
217
+ - dark: `seafoam-700` -> `seafoam-800`
218
+ - `cyan-background-color-default`
219
+ - dark: `cyan-700` -> `cyan-800`
220
+ - `blue-background-color-default`
221
+ - dark: `blue-700` -> `blue-800`
222
+ - `indigo-background-color-default`
223
+ - dark: `indigo-700` -> `indigo-800`
224
+ - `purple-background-color-default`
225
+ - dark: `purple-700` -> `purple-800`
226
+ - `fuchsia-background-color-default`
227
+ - dark: `fuchsia-700` -> `fuchsia-800`
228
+ - `magenta-background-color-default`
229
+ - dark: `magenta-700` -> `magenta-800`
230
+ - `negative-visual-color`
231
+ - dark: `negative-color-700` -> `negative-color-900`
232
+ - `notice-visual-color`
233
+ - light: `notice-color-700` -> `notice-color-800`
234
+ - `positive-visual-color`
235
+ - light: `positive-color-700` -> `positive-color-800`
236
+ - dark: `positive-color-800` -> `positive-color-900`
237
+ - `brown-background-color-default`
238
+ - dark: `brown-700` -> `brown-800`
239
+ - `cinnamon-background-color-default`
240
+ - dark: `cinnamon-700` -> `cinnamon-800`
241
+ - `pink-background-color-default`
242
+ - dark: `pink-700` -> `pink-800`
243
+ - `silver-background-color-default`
244
+ - dark: `silver-700` -> `silver-800`
245
+ - `turquoise-background-color-default`
246
+ - dark: `turquoise-700` -> `turquoise-800`
247
+ - `neutral-subtle-background-color-default`
248
+ - light: `gray-100` -> `gray-100`
249
+ - dark: `gray-100` -> `gray-300`
250
+ - `accent-subtle-background-color-default`
251
+ - light: `rgba(0, 0, 0, 0.2)` -> `accent-color-200`
252
+ - dark: `rgba(0, 0, 0, 0.6)` -> `accent-color-300`
253
+ - `gray-subtle-background-color-default`
254
+ - light: `rgba(0, 0, 0, 0.2)` -> `gray-100`
255
+ - dark: `rgba(0, 0, 0, 0.6)` -> `gray-300`
256
+ - `blue-subtle-background-color-default`
257
+ - light: `rgba(0, 0, 0, 0.2)` -> `blue-200`
258
+ - dark: `rgba(0, 0, 0, 0.6)` -> `blue-300`
259
+ - `green-subtle-background-color-default`
260
+ - light: `rgba(0, 0, 0, 0.2)` -> `green-200`
261
+ - dark: `rgba(0, 0, 0, 0.6)` -> `green-300`
262
+ - `orange-subtle-background-color-default`
263
+ - light: `rgba(0, 0, 0, 0.2)` -> `orange-200`
264
+ - dark: `rgba(0, 0, 0, 0.6)` -> `orange-300`
265
+ - `red-subtle-background-color-default`
266
+ - light: `rgba(0, 0, 0, 0.2)` -> `red-200`
267
+ - dark: `rgba(0, 0, 0, 0.6)` -> `red-300`
268
+ - `brown-subtle-background-color-default`
269
+ - light: `rgba(0, 0, 0, 0.2)` -> `brown-200`
270
+ - dark: `rgba(0, 0, 0, 0.6)` -> `brown-300`
271
+ - `cinnamon-subtle-background-color-default`
272
+ - light: `rgba(0, 0, 0, 0.2)` -> `cinnamon-200`
273
+ - dark: `rgba(0, 0, 0, 0.6)` -> `cinnamon-300`
274
+ - `celery-subtle-background-color-default`
275
+ - light: `rgba(0, 0, 0, 0.2)` -> `celery-200`
276
+ - dark: `rgba(0, 0, 0, 0.6)` -> `celery-300`
277
+ - `chartreuse-subtle-background-color-default`
278
+ - light: `rgba(0, 0, 0, 0.2)` -> `chartreuse-200`
279
+ - dark: `rgba(0, 0, 0, 0.6)` -> `chartreuse-300`
280
+ - `cyan-subtle-background-color-default`
281
+ - light: `rgba(0, 0, 0, 0.2)` -> `cyan-200`
282
+ - dark: `rgba(0, 0, 0, 0.6)` -> `cyan-300`
283
+ - `fuchsia-subtle-background-color-default`
284
+ - light: `rgba(0, 0, 0, 0.2)` -> `fuchsia-200`
285
+ - dark: `rgba(0, 0, 0, 0.6)` -> `fuchsia-300`
286
+ - `indigo-subtle-background-color-default`
287
+ - light: `rgba(0, 0, 0, 0.2)` -> `indigo-200`
288
+ - dark: `rgba(0, 0, 0, 0.6)` -> `indigo-300`
289
+ - `magenta-subtle-background-color-default`
290
+ - light: `rgba(0, 0, 0, 0.2)` -> `magenta-200`
291
+ - dark: `rgba(0, 0, 0, 0.6)` -> `magenta-300`
292
+ - `pink-subtle-background-color-default`
293
+ - light: `rgba(0, 0, 0, 0.2)` -> `pink-200`
294
+ - dark: `rgba(0, 0, 0, 0.6)` -> `pink-300`
295
+ - `purple-subtle-background-color-default`
296
+ - light: `rgba(0, 0, 0, 0.2)` -> `purple-200`
297
+ - dark: `rgba(0, 0, 0, 0.6)` -> `purple-300`
298
+ - `seafoam-subtle-background-color-default`
299
+ - light: `rgba(0, 0, 0, 0.2)` -> `seafoam-200`
300
+ - dark: `rgba(0, 0, 0, 0.6)` -> `seafoam-300`
301
+ - `silver-subtle-background-color-default`
302
+ - light: `rgba(0, 0, 0, 0.2)` -> `silver-200`
303
+ - dark: `rgba(0, 0, 0, 0.6)` -> `silver-300`
304
+ - `turquoise-subtle-background-color-default`
305
+ - light: `rgba(0, 0, 0, 0.2)` -> `turquoise-200`
306
+ - dark: `rgba(0, 0, 0, 0.6)` -> `turquoise-300`
307
+ - `yellow-subtle-background-color-default`
308
+ - light: `rgba(0, 0, 0, 0.2)` -> `yellow-200`
309
+ - dark: `rgba(0, 0, 0, 0.6)` -> `yellow-300`
310
+
311
+ </details>
312
+
3
313
  ## 13.0.0-beta.46
4
314
 
5
315
  ### Minor Changes