@adobe/design-data-spec 0.4.0 → 0.5.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 (81) hide show
  1. package/components/accordion.json +431 -1
  2. package/components/action-bar.json +183 -1
  3. package/components/action-button.json +407 -1
  4. package/components/action-group.json +15 -1
  5. package/components/alert-banner.json +79 -1
  6. package/components/alert-dialog.json +107 -1
  7. package/components/avatar-group.json +115 -1
  8. package/components/avatar.json +131 -1
  9. package/components/badge.json +430 -1
  10. package/components/breadcrumbs.json +175 -1
  11. package/components/button-group.json +11 -1
  12. package/components/button.json +466 -8
  13. package/components/cards.json +483 -1
  14. package/components/checkbox-group.json +2 -1
  15. package/components/checkbox.json +243 -1
  16. package/components/close-button.json +123 -1
  17. package/components/coach-indicator.json +39 -1
  18. package/components/coach-mark.json +103 -1
  19. package/components/color-area.json +39 -1
  20. package/components/color-handle.json +51 -1
  21. package/components/color-loupe.json +55 -1
  22. package/components/color-slider.json +43 -1
  23. package/components/color-wheel.json +35 -1
  24. package/components/combo-box.json +387 -1
  25. package/components/contextual-help.json +83 -1
  26. package/components/date-picker.json +279 -1
  27. package/components/divider.json +47 -1
  28. package/components/drop-zone.json +167 -1
  29. package/components/field-label.json +147 -1
  30. package/components/help-text.json +147 -1
  31. package/components/illustrated-message.json +107 -1
  32. package/components/in-field-progress-circle.json +55 -1
  33. package/components/in-line-alert.json +155 -1
  34. package/components/link.json +91 -1
  35. package/components/list-view.json +263 -1
  36. package/components/menu.json +467 -1
  37. package/components/meter.json +115 -1
  38. package/components/number-field.json +399 -1
  39. package/components/opacity-checkerboard.json +19 -1
  40. package/components/picker.json +431 -1
  41. package/components/popover.json +51 -1
  42. package/components/progress-bar.json +115 -1
  43. package/components/progress-circle.json +55 -1
  44. package/components/radio-button.json +243 -1
  45. package/components/radio-group.json +2 -1
  46. package/components/rating.json +99 -1
  47. package/components/search-field.json +235 -1
  48. package/components/segmented-control.json +135 -1
  49. package/components/select-box.json +187 -1
  50. package/components/side-navigation.json +223 -1
  51. package/components/slider.json +279 -1
  52. package/components/standard-dialog.json +99 -1
  53. package/components/status-light.json +219 -1
  54. package/components/steplist.json +215 -1
  55. package/components/swatch-group.json +15 -1
  56. package/components/swatch.json +136 -2
  57. package/components/switch.json +251 -1
  58. package/components/table.json +271 -1
  59. package/components/tabs.json +151 -1
  60. package/components/tag-field.json +151 -1
  61. package/components/tag-group.json +19 -1
  62. package/components/tag.json +323 -1
  63. package/components/takeover-dialog.json +35 -1
  64. package/components/text-area.json +383 -1
  65. package/components/text-field.json +411 -1
  66. package/components/thumbnail.json +83 -1
  67. package/components/title.json +39 -0
  68. package/components/toast.json +99 -1
  69. package/components/tooltip.json +87 -1
  70. package/components/tree-view.json +279 -1
  71. package/conformance/invalid/SPEC-027/dataset.json +25 -0
  72. package/conformance/invalid/SPEC-027/expected-errors.json +10 -0
  73. package/conformance/valid/token-bindings.json +27 -0
  74. package/package.json +1 -1
  75. package/rules/rules.yaml +9 -0
  76. package/schemas/component.schema.json +22 -0
  77. package/schemas/token.schema.json +27 -0
  78. package/spec/agent-surface.md +39 -9
  79. package/spec/component-format.md +41 -16
  80. package/spec/token-format.md +18 -0
  81. package/src/validate.js +27 -3
@@ -52,5 +52,219 @@
52
52
  },
53
53
  "lifecycle": {
54
54
  "introduced": "1.0.0-draft"
55
- }
55
+ },
56
+ "tokenBindings": [
57
+ {
58
+ "token": "steplist-step-default-width-small",
59
+ "context": "Width small (default)"
60
+ },
61
+ {
62
+ "token": "steplist-step-default-width-medium",
63
+ "context": "Width small (default)"
64
+ },
65
+ {
66
+ "token": "steplist-step-default-width-large",
67
+ "context": "Width small (default)"
68
+ },
69
+ {
70
+ "token": "steplist-step-default-width-extra-large",
71
+ "context": "Width small (default)"
72
+ },
73
+ {
74
+ "token": "steplist-step-default-height-small",
75
+ "context": "Height small (default)"
76
+ },
77
+ {
78
+ "token": "steplist-step-default-height-medium",
79
+ "context": "Height small (default)"
80
+ },
81
+ {
82
+ "token": "steplist-step-default-height-large",
83
+ "context": "Height small (default)"
84
+ },
85
+ {
86
+ "token": "steplist-step-default-height-extra-large",
87
+ "context": "Height small (default)"
88
+ },
89
+ {
90
+ "token": "steplist-step-to-track-size-small",
91
+ "context": "Spacing (step to track)"
92
+ },
93
+ {
94
+ "token": "steplist-step-to-track-size-medium",
95
+ "context": "Spacing (step to track)"
96
+ },
97
+ {
98
+ "token": "steplist-step-to-track-size-large",
99
+ "context": "Spacing (step to track)"
100
+ },
101
+ {
102
+ "token": "steplist-step-to-track-size-extra-large",
103
+ "context": "Spacing (step to track)"
104
+ },
105
+ {
106
+ "token": "steplist-bottom-to-text",
107
+ "context": "Text adjustment"
108
+ },
109
+ {
110
+ "token": "border-width-200",
111
+ "context": "Visual border"
112
+ },
113
+ {
114
+ "token": "text-to-visual-75",
115
+ "context": "Spacing (text to visual)"
116
+ },
117
+ {
118
+ "token": "text-to-visual-100",
119
+ "context": "Spacing (text to visual)"
120
+ },
121
+ {
122
+ "token": "text-to-visual-200",
123
+ "context": "Spacing (text to visual)"
124
+ },
125
+ {
126
+ "token": "text-to-visual-300",
127
+ "context": "Spacing (text to visual)"
128
+ },
129
+ {
130
+ "token": "steplist-visual-size-small",
131
+ "context": "Visual size"
132
+ },
133
+ {
134
+ "token": "steplist-visual-size-medium",
135
+ "context": "Visual size"
136
+ },
137
+ {
138
+ "token": "steplist-visual-size-large",
139
+ "context": "Visual size"
140
+ },
141
+ {
142
+ "token": "steplist-visual-size-extra-large",
143
+ "context": "Visual size"
144
+ },
145
+ {
146
+ "token": "steplist-track-thickness-thickness",
147
+ "context": "Steplist track thickness"
148
+ },
149
+ {
150
+ "token": "neutral-subdued-content-color-default",
151
+ "context": "Step text"
152
+ },
153
+ {
154
+ "token": "neutral-subdued-content-color-hover",
155
+ "context": "Step text"
156
+ },
157
+ {
158
+ "token": "neutral-subdued-content-color-key-focus",
159
+ "context": "Step text"
160
+ },
161
+ {
162
+ "token": "neutral-content-color-default",
163
+ "context": "Step text"
164
+ },
165
+ {
166
+ "token": "neutral-content-color-key-focus",
167
+ "context": "Step text"
168
+ },
169
+ {
170
+ "token": "accent-content-color-default",
171
+ "context": "Step text"
172
+ },
173
+ {
174
+ "token": "accent-content-color-key-focus",
175
+ "context": "Step text"
176
+ },
177
+ {
178
+ "token": "neutral-subdued-background-color-default",
179
+ "context": "Step visual"
180
+ },
181
+ {
182
+ "token": "neutral-subdued-background-color-hover",
183
+ "context": "Step visual"
184
+ },
185
+ {
186
+ "token": "neutral-subdued-background-color-key-focus",
187
+ "context": "Step visual"
188
+ },
189
+ {
190
+ "token": "neutral-background-color-default",
191
+ "context": "Step visual"
192
+ },
193
+ {
194
+ "token": "neutral-background-color-key-focus",
195
+ "context": "Step visual"
196
+ },
197
+ {
198
+ "token": "neutral-visual-color",
199
+ "context": "Step visual"
200
+ },
201
+ {
202
+ "token": "accent-background-color-default",
203
+ "context": "Step visual"
204
+ },
205
+ {
206
+ "token": "accent-background-color-key-focus",
207
+ "context": "Step visual"
208
+ },
209
+ {
210
+ "token": "accent-background-color-hover",
211
+ "context": "Step visual"
212
+ },
213
+ {
214
+ "token": "gray-25",
215
+ "context": "Step visual text"
216
+ },
217
+ {
218
+ "token": "white",
219
+ "context": "Step visual text"
220
+ },
221
+ {
222
+ "token": "accent-visual-color",
223
+ "context": "Steplist track"
224
+ },
225
+ {
226
+ "token": "disabled-content-color",
227
+ "context": "Disabled"
228
+ },
229
+ {
230
+ "token": "disabled-background-color",
231
+ "context": "Disabled"
232
+ },
233
+ {
234
+ "token": "default-font-family",
235
+ "context": "Label"
236
+ },
237
+ {
238
+ "token": "regular-font-weight",
239
+ "context": "Label"
240
+ },
241
+ {
242
+ "token": "default-font-style",
243
+ "context": "Label"
244
+ },
245
+ {
246
+ "token": "font-size-75",
247
+ "context": "Label"
248
+ },
249
+ {
250
+ "token": "font-size-100",
251
+ "context": "Label"
252
+ },
253
+ {
254
+ "token": "font-size-200",
255
+ "context": "Label"
256
+ },
257
+ {
258
+ "token": "font-size-300",
259
+ "context": "Label"
260
+ },
261
+ {
262
+ "token": "line-height-100",
263
+ "context": "Label"
264
+ },
265
+ {
266
+ "token": "cjk-line-height-100",
267
+ "context": "Label"
268
+ }
269
+ ]
56
270
  }
@@ -44,5 +44,19 @@
44
44
  },
45
45
  "lifecycle": {
46
46
  "introduced": "1.0.0-draft"
47
- }
47
+ },
48
+ "tokenBindings": [
49
+ {
50
+ "token": "swatch-group-spacing-spacious",
51
+ "context": "Spacing (spacious)"
52
+ },
53
+ {
54
+ "token": "swatch-group-border-color",
55
+ "context": "Border"
56
+ },
57
+ {
58
+ "token": "swatch-group-border-opacity",
59
+ "context": "Border"
60
+ }
61
+ ]
48
62
  }
@@ -4,7 +4,7 @@
4
4
  "specVersion": "1.0.0-draft",
5
5
  "name": "swatch",
6
6
  "displayName": "Swatch",
7
- "description": "A swatch shows a small sample of a fill such as a color, gradient, texture, or material that is intended to be applied to an object.",
7
+ "description": "A swatch shows a small sample of a fill \u2014 such as a color, gradient, texture, or material \u2014 that is intended to be applied to an object.",
8
8
  "meta": {
9
9
  "category": "inputs",
10
10
  "documentationUrl": "https://spectrum.adobe.com/page/swatch/"
@@ -55,5 +55,139 @@
55
55
  ],
56
56
  "lifecycle": {
57
57
  "introduced": "1.0.0-draft"
58
- }
58
+ },
59
+ "tokenBindings": [
60
+ {
61
+ "token": "swatch-size-extra-small",
62
+ "context": "Size (square)"
63
+ },
64
+ {
65
+ "token": "swatch-size-small",
66
+ "context": "Size (square)"
67
+ },
68
+ {
69
+ "token": "swatch-size-medium",
70
+ "context": "Size (square)"
71
+ },
72
+ {
73
+ "token": "swatch-size-large",
74
+ "context": "Size (square)"
75
+ },
76
+ {
77
+ "token": "swatch-rectangle-width-multiplier",
78
+ "context": "Width (rectangle)"
79
+ },
80
+ {
81
+ "token": "corner-radius-75",
82
+ "context": "Rounding"
83
+ },
84
+ {
85
+ "token": "border-width-100",
86
+ "context": "Border"
87
+ },
88
+ {
89
+ "token": "border-width-200",
90
+ "context": "Border and inner border (selected)"
91
+ },
92
+ {
93
+ "token": "workflow-icon-size-50",
94
+ "context": "Disabled icon asset"
95
+ },
96
+ {
97
+ "token": "workflow-icon-size-75",
98
+ "context": "Disabled icon asset"
99
+ },
100
+ {
101
+ "token": "workflow-icon-size-100",
102
+ "context": "Disabled icon asset"
103
+ },
104
+ {
105
+ "token": "workflow-icon-size-200",
106
+ "context": "Disabled icon asset"
107
+ },
108
+ {
109
+ "token": "swatch-slash-thickness-extra-small",
110
+ "context": "Slash thickness (empty)"
111
+ },
112
+ {
113
+ "token": "swatch-slash-thickness-small",
114
+ "context": "Slash thickness (empty)"
115
+ },
116
+ {
117
+ "token": "swatch-slash-thickness-medium",
118
+ "context": "Slash thickness (empty)"
119
+ },
120
+ {
121
+ "token": "swatch-slash-thickness-large",
122
+ "context": "Slash thickness (empty)"
123
+ },
124
+ {
125
+ "token": "focus-indicator-thickness",
126
+ "context": "Focus ring"
127
+ },
128
+ {
129
+ "token": "focus-indicator-gap",
130
+ "context": "Focus ring"
131
+ },
132
+ {
133
+ "token": "spacing-75",
134
+ "context": "Spacing (Tooltip to Swatch)"
135
+ },
136
+ {
137
+ "token": "swatch-border-color",
138
+ "context": "Border"
139
+ },
140
+ {
141
+ "token": "swatch-border-opacity",
142
+ "context": "Border"
143
+ },
144
+ {
145
+ "token": "gray-1000",
146
+ "context": "Border and inner border (selected)"
147
+ },
148
+ {
149
+ "token": "gray-25",
150
+ "context": "Border and inner border (selected)"
151
+ },
152
+ {
153
+ "token": "swatch-disabled-icon-border-color",
154
+ "context": "Disabled icon"
155
+ },
156
+ {
157
+ "token": "swatch-disabled-icon-border-opacity",
158
+ "context": "Disabled icon"
159
+ },
160
+ {
161
+ "token": "white",
162
+ "context": "Disabled icon"
163
+ },
164
+ {
165
+ "token": "negative-visual-color",
166
+ "context": "Slash"
167
+ },
168
+ {
169
+ "token": "neutral-content-color-default",
170
+ "context": "Dash UI icon"
171
+ },
172
+ {
173
+ "token": "gray-100",
174
+ "context": "Add \u201cbutton\u201d background"
175
+ },
176
+ {
177
+ "token": "gray-200",
178
+ "context": "Add \u201cbutton\u201d background"
179
+ },
180
+ {
181
+ "token": "focus-indicator-color",
182
+ "context": "Focus ring"
183
+ },
184
+ {
185
+ "token": "spacing-50",
186
+ "context": "Spacing (compact)"
187
+ },
188
+ {
189
+ "token": "spacing-100",
190
+ "context": "Spacing (spacious)"
191
+ }
192
+ ]
59
193
  }
@@ -51,5 +51,255 @@
51
51
  ],
52
52
  "lifecycle": {
53
53
  "introduced": "1.0.0-draft"
54
- }
54
+ },
55
+ "tokenBindings": [
56
+ {
57
+ "token": "component-height-75",
58
+ "context": "Minimum height"
59
+ },
60
+ {
61
+ "token": "component-height-100",
62
+ "context": "Minimum height"
63
+ },
64
+ {
65
+ "token": "component-height-200",
66
+ "context": "Minimum height"
67
+ },
68
+ {
69
+ "token": "component-height-300",
70
+ "context": "Minimum height"
71
+ },
72
+ {
73
+ "token": "corner-radius-full",
74
+ "context": "Rounding"
75
+ },
76
+ {
77
+ "token": "switch-control-width-small",
78
+ "context": "Track (size)"
79
+ },
80
+ {
81
+ "token": "switch-control-width-medium",
82
+ "context": "Track (size)"
83
+ },
84
+ {
85
+ "token": "switch-control-width-large",
86
+ "context": "Track (size)"
87
+ },
88
+ {
89
+ "token": "switch-control-width-extra-large",
90
+ "context": "Track (size)"
91
+ },
92
+ {
93
+ "token": "switch-control-height-small",
94
+ "context": "Track (size)"
95
+ },
96
+ {
97
+ "token": "switch-control-height-medium",
98
+ "context": "Track (size)"
99
+ },
100
+ {
101
+ "token": "switch-control-height-large",
102
+ "context": "Track (size)"
103
+ },
104
+ {
105
+ "token": "switch-control-height-extra-large",
106
+ "context": "Track (size)"
107
+ },
108
+ {
109
+ "token": "border-width-200",
110
+ "context": "Track (border)"
111
+ },
112
+ {
113
+ "token": "switch-handle-size-small",
114
+ "context": "Handle (size)"
115
+ },
116
+ {
117
+ "token": "switch-handle-size-medium",
118
+ "context": "Handle (size)"
119
+ },
120
+ {
121
+ "token": "switch-handle-size-large",
122
+ "context": "Handle (size)"
123
+ },
124
+ {
125
+ "token": "switch-handle-size-extra-large",
126
+ "context": "Handle (size)"
127
+ },
128
+ {
129
+ "token": "switch-handle-selected-size-small",
130
+ "context": "Handle (size)"
131
+ },
132
+ {
133
+ "token": "switch-handle-selected-size-medium",
134
+ "context": "Handle (size)"
135
+ },
136
+ {
137
+ "token": "switch-handle-selected-size-large",
138
+ "context": "Handle (size)"
139
+ },
140
+ {
141
+ "token": "switch-handle-selected-size-extra-large",
142
+ "context": "Handle (size)"
143
+ },
144
+ {
145
+ "token": "text-to-control-75",
146
+ "context": "Spacing (control to label)"
147
+ },
148
+ {
149
+ "token": "text-to-control-100",
150
+ "context": "Spacing (control to label)"
151
+ },
152
+ {
153
+ "token": "text-to-control-200",
154
+ "context": "Spacing (control to label)"
155
+ },
156
+ {
157
+ "token": "text-to-control-300",
158
+ "context": "Spacing (control to label)"
159
+ },
160
+ {
161
+ "token": "switch-top-to-control-small",
162
+ "context": "Spacing (top edge to control)"
163
+ },
164
+ {
165
+ "token": "switch-top-to-control-medium",
166
+ "context": "Spacing (top edge to control)"
167
+ },
168
+ {
169
+ "token": "switch-top-to-control-large",
170
+ "context": "Spacing (top edge to control)"
171
+ },
172
+ {
173
+ "token": "switch-top-to-control-extra-large",
174
+ "context": "Spacing (top edge to control)"
175
+ },
176
+ {
177
+ "token": "component-top-to-text-75",
178
+ "context": "Spacing (top/bottom edge to label)"
179
+ },
180
+ {
181
+ "token": "component-top-to-text-100",
182
+ "context": "Spacing (top/bottom edge to label)"
183
+ },
184
+ {
185
+ "token": "component-top-to-text-200",
186
+ "context": "Spacing (top/bottom edge to label)"
187
+ },
188
+ {
189
+ "token": "component-top-to-text-300",
190
+ "context": "Spacing (top/bottom edge to label)"
191
+ },
192
+ {
193
+ "token": "component-bottom-to-text-75",
194
+ "context": "Spacing (top/bottom edge to label)"
195
+ },
196
+ {
197
+ "token": "component-bottom-to-text-100",
198
+ "context": "Spacing (top/bottom edge to label)"
199
+ },
200
+ {
201
+ "token": "component-bottom-to-text-200",
202
+ "context": "Spacing (top/bottom edge to label)"
203
+ },
204
+ {
205
+ "token": "component-bottom-to-text-300",
206
+ "context": "Spacing (top/bottom edge to label)"
207
+ },
208
+ {
209
+ "token": "focus-indicator-thickness",
210
+ "context": "Focus indicator"
211
+ },
212
+ {
213
+ "token": "focus-indicator-gap",
214
+ "context": "Focus indicator"
215
+ },
216
+ {
217
+ "token": "component-size-difference-down",
218
+ "context": "Component size (down)"
219
+ },
220
+ {
221
+ "token": "component-size-width-ratio-down",
222
+ "context": "Component size (down)"
223
+ },
224
+ {
225
+ "token": "component-size-minimum-perspective-down",
226
+ "context": "Component size (down)"
227
+ },
228
+ {
229
+ "token": "font-size-75",
230
+ "context": "Font size"
231
+ },
232
+ {
233
+ "token": "font-size-100",
234
+ "context": "Font size"
235
+ },
236
+ {
237
+ "token": "font-size-200",
238
+ "context": "Font size"
239
+ },
240
+ {
241
+ "token": "font-size-300",
242
+ "context": "Font size"
243
+ },
244
+ {
245
+ "token": "default-font-family",
246
+ "context": "Font size"
247
+ },
248
+ {
249
+ "token": "regular-font-weight",
250
+ "context": "Font size"
251
+ },
252
+ {
253
+ "token": "line-height-100",
254
+ "context": "Font size"
255
+ },
256
+ {
257
+ "token": "cjk-line-height-100",
258
+ "context": "Font size"
259
+ },
260
+ {
261
+ "token": "neutral-content-color-default",
262
+ "context": "Label"
263
+ },
264
+ {
265
+ "token": "neutral-content-color-hover",
266
+ "context": "Label"
267
+ },
268
+ {
269
+ "token": "neutral-content-color-down",
270
+ "context": "Label"
271
+ },
272
+ {
273
+ "token": "neutral-content-color-key-focus",
274
+ "context": "Label"
275
+ },
276
+ {
277
+ "token": "gray-25",
278
+ "context": "Control"
279
+ },
280
+ {
281
+ "token": "accent-content-color-default",
282
+ "context": "Control (selected, emphasized)"
283
+ },
284
+ {
285
+ "token": "accent-content-color-hover",
286
+ "context": "Control (selected, emphasized)"
287
+ },
288
+ {
289
+ "token": "accent-content-color-down",
290
+ "context": "Control (selected, emphasized)"
291
+ },
292
+ {
293
+ "token": "accent-content-color-key-focus",
294
+ "context": "Control (selected, emphasized)"
295
+ },
296
+ {
297
+ "token": "disabled-content-color",
298
+ "context": "Label (disabled)"
299
+ },
300
+ {
301
+ "token": "focus-indicator-color",
302
+ "context": "Focus indicator"
303
+ }
304
+ ]
55
305
  }