@adobe/spectrum-design-data 0.9.0 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/package.json +1 -1
  2. package/registry/anatomy-terms.json +1 -0
  3. package/registry/property-terms.json +25 -0
  4. package/registry/variants.json +7 -0
  5. package/tokens/color-aliases.tokens.json +54 -27
  6. package/tokens/layout-component.tokens.json +3 -1
  7. package/tokens/layout.tokens.json +24 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adobe/spectrum-design-data",
3
- "version": "0.9.0",
3
+ "version": "0.11.0",
4
4
  "description": "Spectrum design tokens in cascade format — the canonical source of truth for @adobe/spectrum-tokens",
5
5
  "type": "module",
6
6
  "repository": {
package/registry/anatomy-terms.json CHANGED
@@ -636,6 +636,7 @@
636
636
  {
637
637
  "id": "tab-item",
638
638
  "label": "Tab Item",
639
+ "aliases": ["tab"],
639
640
  "description": "Individual tab button within a tabs component",
640
641
  "usedIn": ["tokens", "s2-docs"]
641
642
  },
package/registry/property-terms.json CHANGED
@@ -28,6 +28,16 @@
28
28
  "label": "Icon Color",
29
29
  "description": "Foreground color of an icon"
30
30
  },
31
+ {
32
+ "id": "content-color",
33
+ "label": "Content Color",
34
+ "description": "Color of a component's content area"
35
+ },
36
+ {
37
+ "id": "visual-color",
38
+ "label": "Visual Color",
39
+ "description": "Color of a component's visible graphic (visual) area"
40
+ },
31
41
  {
32
42
  "id": "shadow-color",
33
43
  "label": "Shadow Color",
@@ -248,6 +258,21 @@
248
258
  "label": "Maximum Width",
249
259
  "description": "CSS max-width constraint (design-system abstraction)"
250
260
  },
261
+ {
262
+ "id": "width-multiplier",
263
+ "label": "Width Multiplier",
264
+ "description": "Unitless ratio used at the implementation level to derive a width from another dimension (design-system abstraction; design-data has no calc(), reuses the multiplier value schema shared with line-height/margin)"
265
+ },
266
+ {
267
+ "id": "minimum-width-multiplier",
268
+ "label": "Minimum Width Multiplier",
269
+ "description": "Unitless ratio used at the implementation level to derive a minimum width from another dimension (design-system abstraction; design-data has no calc(), reuses the multiplier value schema shared with line-height/margin)"
270
+ },
271
+ {
272
+ "id": "maximum-width-multiplier",
273
+ "label": "Maximum Width Multiplier",
274
+ "description": "Unitless ratio used at the implementation level to derive a maximum width from another dimension (design-system abstraction; design-data has no calc(), reuses the multiplier value schema shared with line-height/margin)"
275
+ },
251
276
  {
252
277
  "id": "thickness",
253
278
  "label": "Thickness",
package/registry/variants.json CHANGED
@@ -31,6 +31,13 @@
31
31
  "category": "emphasis",
32
32
  "usedIn": ["component-schemas"]
33
33
  },
34
+ {
35
+ "id": "quiet",
36
+ "label": "Quiet",
37
+ "description": "Reduced-visual-weight emphasis variant (e.g. no visible border/background until interaction)",
38
+ "category": "emphasis",
39
+ "usedIn": ["tokens"]
40
+ },
34
41
  {
35
42
  "id": "positive",
36
43
  "label": "Positive",
package/tokens/color-aliases.tokens.json CHANGED
@@ -1,10 +1,11 @@
1
1
  [
2
2
  {
3
3
  "name": {
4
+ "colorRole": "accent",
4
5
  "property": "background-color",
5
6
  "state": "default",
6
7
  "colorScheme": "light",
7
- "variant": "accent"
8
+ "legacyKey": "accent-background-color-default"
8
9
  },
9
10
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
10
11
  "$ref": "90d82778-1cbb-47c0-aab9-b6e38a9cdc54",
@@ -14,10 +15,11 @@
14
15
  },
15
16
  {
16
17
  "name": {
18
+ "colorRole": "accent",
17
19
  "property": "background-color",
18
20
  "state": "default",
19
21
  "colorScheme": "dark",
20
- "variant": "accent"
22
+ "legacyKey": "accent-background-color-default"
21
23
  },
22
24
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
23
25
  "$ref": "87a2c8f0-54fd-4939-8f42-3124fde1e49e",
@@ -27,10 +29,11 @@
27
29
  },
28
30
  {
29
31
  "name": {
32
+ "colorRole": "accent",
30
33
  "property": "background-color",
31
34
  "state": "default",
32
35
  "colorScheme": "wireframe",
33
- "variant": "accent"
36
+ "legacyKey": "accent-background-color-default"
34
37
  },
35
38
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
36
39
  "$ref": "90d82778-1cbb-47c0-aab9-b6e38a9cdc54",
@@ -40,10 +43,11 @@
40
43
  },
41
44
  {
42
45
  "name": {
46
+ "colorRole": "accent",
43
47
  "property": "background-color",
44
48
  "state": "down",
45
49
  "colorScheme": "light",
46
- "variant": "accent"
50
+ "legacyKey": "accent-background-color-down"
47
51
  },
48
52
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
49
53
  "$ref": "9bf3fa2f-75d3-44d3-ae30-d88893665366",
@@ -53,10 +57,11 @@
53
57
  },
54
58
  {
55
59
  "name": {
60
+ "colorRole": "accent",
56
61
  "property": "background-color",
57
62
  "state": "down",
58
63
  "colorScheme": "dark",
59
- "variant": "accent"
64
+ "legacyKey": "accent-background-color-down"
60
65
  },
61
66
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
62
67
  "$ref": "a8fbe39b-db6d-4bb4-a7c5-8a235060d2ae",
@@ -66,10 +71,11 @@
66
71
  },
67
72
  {
68
73
  "name": {
74
+ "colorRole": "accent",
69
75
  "property": "background-color",
70
76
  "state": "down",
71
77
  "colorScheme": "wireframe",
72
- "variant": "accent"
78
+ "legacyKey": "accent-background-color-down"
73
79
  },
74
80
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
75
81
  "$ref": "9bf3fa2f-75d3-44d3-ae30-d88893665366",
@@ -79,10 +85,11 @@
79
85
  },
80
86
  {
81
87
  "name": {
88
+ "colorRole": "accent",
82
89
  "property": "background-color",
83
90
  "state": "hover",
84
91
  "colorScheme": "light",
85
- "variant": "accent"
92
+ "legacyKey": "accent-background-color-hover"
86
93
  },
87
94
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
88
95
  "$ref": "9bf3fa2f-75d3-44d3-ae30-d88893665366",
@@ -92,10 +99,11 @@
92
99
  },
93
100
  {
94
101
  "name": {
102
+ "colorRole": "accent",
95
103
  "property": "background-color",
96
104
  "state": "hover",
97
105
  "colorScheme": "dark",
98
- "variant": "accent"
106
+ "legacyKey": "accent-background-color-hover"
99
107
  },
100
108
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
101
109
  "$ref": "a8fbe39b-db6d-4bb4-a7c5-8a235060d2ae",
@@ -105,10 +113,11 @@
105
113
  },
106
114
  {
107
115
  "name": {
116
+ "colorRole": "accent",
108
117
  "property": "background-color",
109
118
  "state": "hover",
110
119
  "colorScheme": "wireframe",
111
- "variant": "accent"
120
+ "legacyKey": "accent-background-color-hover"
112
121
  },
113
122
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
114
123
  "$ref": "9bf3fa2f-75d3-44d3-ae30-d88893665366",
@@ -118,7 +127,8 @@
118
127
  },
119
128
  {
120
129
  "name": {
121
- "property": "accent-background-color",
130
+ "colorRole": "accent",
131
+ "property": "background-color",
122
132
  "state": "key-focus",
123
133
  "colorScheme": "light",
124
134
  "legacyKey": "accent-background-color-key-focus"
@@ -131,7 +141,8 @@
131
141
  },
132
142
  {
133
143
  "name": {
134
- "property": "accent-background-color",
144
+ "colorRole": "accent",
145
+ "property": "background-color",
135
146
  "state": "key-focus",
136
147
  "colorScheme": "dark",
137
148
  "legacyKey": "accent-background-color-key-focus"
@@ -144,7 +155,8 @@
144
155
  },
145
156
  {
146
157
  "name": {
147
- "property": "accent-background-color",
158
+ "colorRole": "accent",
159
+ "property": "background-color",
148
160
  "state": "key-focus",
149
161
  "colorScheme": "wireframe",
150
162
  "legacyKey": "accent-background-color-key-focus"
@@ -157,8 +169,10 @@
157
169
  },
158
170
  {
159
171
  "name": {
160
- "property": "accent-content-color",
161
- "state": "default"
172
+ "colorRole": "accent",
173
+ "property": "content-color",
174
+ "state": "default",
175
+ "legacyKey": "accent-content-color-default"
162
176
  },
163
177
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
164
178
  "$ref": "90d82778-1cbb-47c0-aab9-b6e38a9cdc54",
@@ -166,8 +180,10 @@
166
180
  },
167
181
  {
168
182
  "name": {
169
- "property": "accent-content-color",
170
- "state": "down"
183
+ "colorRole": "accent",
184
+ "property": "content-color",
185
+ "state": "down",
186
+ "legacyKey": "accent-content-color-down"
171
187
  },
172
188
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
173
189
  "$ref": "9bf3fa2f-75d3-44d3-ae30-d88893665366",
@@ -175,8 +191,10 @@
175
191
  },
176
192
  {
177
193
  "name": {
178
- "property": "accent-content-color",
179
- "state": "hover"
194
+ "colorRole": "accent",
195
+ "property": "content-color",
196
+ "state": "hover",
197
+ "legacyKey": "accent-content-color-hover"
180
198
  },
181
199
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
182
200
  "$ref": "9bf3fa2f-75d3-44d3-ae30-d88893665366",
@@ -184,7 +202,8 @@
184
202
  },
185
203
  {
186
204
  "name": {
187
- "property": "accent-content-color",
205
+ "colorRole": "accent",
206
+ "property": "content-color",
188
207
  "state": "key-focus",
189
208
  "legacyKey": "accent-content-color-key-focus"
190
209
  },
@@ -194,8 +213,10 @@
194
213
  },
195
214
  {
196
215
  "name": {
197
- "property": "accent-content-color",
198
- "state": "selected"
216
+ "colorRole": "accent",
217
+ "property": "content-color",
218
+ "state": "selected",
219
+ "legacyKey": "accent-content-color-selected"
199
220
  },
200
221
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
201
222
  "$ref": "25d3b2d2-e7d5-4686-95ff-bfaaddc14ff1",
@@ -203,8 +224,10 @@
203
224
  },
204
225
  {
205
226
  "name": {
206
- "property": "accent-visual-color",
207
- "colorScheme": "light"
227
+ "colorRole": "accent",
228
+ "property": "visual-color",
229
+ "colorScheme": "light",
230
+ "legacyKey": "accent-visual-color"
208
231
  },
209
232
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
210
233
  "$ref": "87a2c8f0-54fd-4939-8f42-3124fde1e49e",
@@ -214,8 +237,10 @@
214
237
  },
215
238
  {
216
239
  "name": {
217
- "property": "accent-visual-color",
218
- "colorScheme": "dark"
240
+ "colorRole": "accent",
241
+ "property": "visual-color",
242
+ "colorScheme": "dark",
243
+ "legacyKey": "accent-visual-color"
219
244
  },
220
245
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
221
246
  "$ref": "90d82778-1cbb-47c0-aab9-b6e38a9cdc54",
@@ -225,8 +250,10 @@
225
250
  },
226
251
  {
227
252
  "name": {
228
- "property": "accent-visual-color",
229
- "colorScheme": "wireframe"
253
+ "colorRole": "accent",
254
+ "property": "visual-color",
255
+ "colorScheme": "wireframe",
256
+ "legacyKey": "accent-visual-color"
230
257
  },
231
258
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
232
259
  "$ref": "87a2c8f0-54fd-4939-8f42-3124fde1e49e",
package/tokens/layout-component.tokens.json CHANGED
@@ -5968,7 +5968,9 @@
5968
5968
  {
5969
5969
  "name": {
5970
5970
  "component": "combo-box",
5971
- "property": "quiet-minimum-width-multiplier"
5971
+ "variant": "quiet",
5972
+ "property": "minimum-width-multiplier",
5973
+ "legacyKey": "combo-box-quiet-minimum-width-multiplier"
5972
5974
  },
5973
5975
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/multiplier.json",
5974
5976
  "value": 2,
package/tokens/layout.tokens.json CHANGED
@@ -5603,7 +5603,12 @@
5603
5603
  },
5604
5604
  {
5605
5605
  "name": {
5606
- "property": "tab-gap-horizontal-extra-large"
5606
+ "component": "tabs",
5607
+ "anatomy": "tab-item",
5608
+ "property": "gap",
5609
+ "orientation": "horizontal",
5610
+ "size": "xl",
5611
+ "legacyKey": "tab-gap-horizontal-extra-large"
5607
5612
  },
5608
5613
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
5609
5614
  "$ref": "b6d0b881-d25e-452c-9069-c18745d21f33",
@@ -5612,7 +5617,12 @@
5612
5617
  },
5613
5618
  {
5614
5619
  "name": {
5615
- "property": "tab-gap-horizontal-large"
5620
+ "component": "tabs",
5621
+ "anatomy": "tab-item",
5622
+ "property": "gap",
5623
+ "orientation": "horizontal",
5624
+ "size": "l",
5625
+ "legacyKey": "tab-gap-horizontal-large"
5616
5626
  },
5617
5627
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
5618
5628
  "$ref": "490b4010-1561-4b12-8cbb-cdb4b650ba74",
@@ -5621,7 +5631,12 @@
5621
5631
  },
5622
5632
  {
5623
5633
  "name": {
5624
- "property": "tab-gap-horizontal-medium"
5634
+ "component": "tabs",
5635
+ "anatomy": "tab-item",
5636
+ "property": "gap",
5637
+ "orientation": "horizontal",
5638
+ "size": "m",
5639
+ "legacyKey": "tab-gap-horizontal-medium"
5625
5640
  },
5626
5641
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
5627
5642
  "$ref": "ec565065-0820-460f-9a1b-b81911c48cb5",
@@ -5630,7 +5645,12 @@
5630
5645
  },
5631
5646
  {
5632
5647
  "name": {
5633
- "property": "tab-gap-horizontal-small"
5648
+ "component": "tabs",
5649
+ "anatomy": "tab-item",
5650
+ "property": "gap",
5651
+ "orientation": "horizontal",
5652
+ "size": "s",
5653
+ "legacyKey": "tab-gap-horizontal-small"
5634
5654
  },
5635
5655
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
5636
5656
  "$ref": "b352f0f0-5843-4c65-8357-625b938ccaa0",