@adobe/spectrum-design-data 0.13.0 → 0.14.1
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.
- package/components/accordion.json +1 -41
- package/components/action-bar.json +6 -6
- package/components/alert-dialog.json +2 -2
- package/components/avatar.json +4 -7
- package/components/badge.json +1 -1
- package/components/bar-panel.json +1 -1
- package/components/card-horizontal.json +1 -1
- package/components/card.json +1 -1
- package/components/cards.json +8 -20
- package/components/collection-card.json +1 -1
- package/components/color-control.json +1 -1
- package/components/contextual-help.json +0 -2
- package/components/date-field.json +1 -1
- package/components/date-picker.json +2 -4
- package/components/double-calendar.json +1 -1
- package/components/drop-zone.json +2 -2
- package/components/field.json +1 -1
- package/components/floating-action-button.json +1 -1
- package/components/form-item.json +1 -1
- package/components/help-text.json +1 -1
- package/components/in-field-button.json +1 -1
- package/components/list-view.json +5 -4
- package/components/menu.json +1 -1
- package/components/number-field.json +0 -1
- package/components/rating.json +2 -2
- package/components/search-field.json +0 -1
- package/components/segmented-text-field.json +1 -1
- package/components/select-box.json +1 -1
- package/components/side-navigation.json +3 -3
- package/components/single-calendar.json +1 -1
- package/components/slider.json +9 -10
- package/components/stack-item.json +1 -1
- package/components/standard-dialog.json +1 -1
- package/components/status-light.json +1 -1
- package/components/steplist.json +1 -1
- package/components/table.json +5 -5
- package/components/tabs.json +0 -8
- package/components/tag.json +4 -4
- package/components/takeover-dialog.json +1 -1
- package/components/time-field.json +1 -1
- package/components/tree-view.json +0 -4
- package/components/triple-calendar.json +1 -1
- package/components/user-card.json +1 -1
- package/package.json +1 -1
|
@@ -417,47 +417,7 @@
|
|
|
417
417
|
{ "token": "accordion-top-to-text-regular-large", "context": "S" },
|
|
418
418
|
{ "token": "accordion-bottom-to-text-regular-large", "context": "S" },
|
|
419
419
|
{ "token": "accordion-top-to-text-regular-extra-large", "context": "S" },
|
|
420
|
-
{ "token": "accordion-bottom-to-text-regular-extra-large", "context": "S" }
|
|
421
|
-
{
|
|
422
|
-
"token": "field-top-to-disclosure-icon-75-compact",
|
|
423
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
424
|
-
},
|
|
425
|
-
{
|
|
426
|
-
"token": "field-top-to-disclosure-icon-75-regular",
|
|
427
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
428
|
-
},
|
|
429
|
-
{
|
|
430
|
-
"token": "field-top-to-disclosure-icon-75-spacious",
|
|
431
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
432
|
-
},
|
|
433
|
-
{
|
|
434
|
-
"token": "field-top-to-disclosure-icon-100-compact",
|
|
435
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
436
|
-
},
|
|
437
|
-
{
|
|
438
|
-
"token": "field-top-to-disclosure-icon-200-compact",
|
|
439
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
440
|
-
},
|
|
441
|
-
{
|
|
442
|
-
"token": "field-top-to-disclosure-icon-200-regular",
|
|
443
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
444
|
-
},
|
|
445
|
-
{
|
|
446
|
-
"token": "field-top-to-disclosure-icon-200-spacious",
|
|
447
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
448
|
-
},
|
|
449
|
-
{
|
|
450
|
-
"token": "field-top-to-disclosure-icon-300-compact",
|
|
451
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
452
|
-
},
|
|
453
|
-
{
|
|
454
|
-
"token": "field-top-to-disclosure-icon-300-regular",
|
|
455
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
456
|
-
},
|
|
457
|
-
{
|
|
458
|
-
"token": "field-top-to-disclosure-icon-300-spacious",
|
|
459
|
-
"context": "Spacing (top/bottom to disclosure icon)"
|
|
460
|
-
}
|
|
420
|
+
{ "token": "accordion-bottom-to-text-regular-extra-large", "context": "S" }
|
|
461
421
|
],
|
|
462
422
|
"accessibility": {
|
|
463
423
|
"intents": ["expand"],
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
"context": "Spacing (padding)"
|
|
84
84
|
},
|
|
85
85
|
{
|
|
86
|
-
"token": "action-bar-label-to-action-
|
|
86
|
+
"token": "action-bar-label-to-action-group-area",
|
|
87
87
|
"context": "Spacing (label to action button group)"
|
|
88
88
|
},
|
|
89
89
|
{
|
|
@@ -99,7 +99,7 @@
|
|
|
99
99
|
"token": "neutral-content-color-default",
|
|
100
100
|
"context": "Background (emphasized)"
|
|
101
101
|
},
|
|
102
|
-
{ "token": "action-bar-border", "context": "Border" },
|
|
102
|
+
{ "token": "action-bar-border-color", "context": "Border" },
|
|
103
103
|
{ "token": "drop-shadow-elevated-color", "context": "Drop shadow" },
|
|
104
104
|
{ "token": "drop-shadow-elevated-x", "context": "Drop shadow" },
|
|
105
105
|
{ "token": "drop-shadow-elevated-y", "context": "Drop shadow" },
|
|
@@ -113,19 +113,19 @@
|
|
|
113
113
|
{ "token": "accent-background-color-key-focus", "context": "Background" },
|
|
114
114
|
{ "token": "white", "context": "Icon and Clear icon" },
|
|
115
115
|
{
|
|
116
|
-
"token": "neutral-
|
|
116
|
+
"token": "neutral-background-color-selected-default",
|
|
117
117
|
"context": "Background"
|
|
118
118
|
},
|
|
119
119
|
{
|
|
120
|
-
"token": "neutral-
|
|
120
|
+
"token": "neutral-background-color-selected-hover",
|
|
121
121
|
"context": "Background"
|
|
122
122
|
},
|
|
123
123
|
{
|
|
124
|
-
"token": "neutral-
|
|
124
|
+
"token": "neutral-background-color-selected-down",
|
|
125
125
|
"context": "Background"
|
|
126
126
|
},
|
|
127
127
|
{
|
|
128
|
-
"token": "neutral-
|
|
128
|
+
"token": "neutral-background-color-selected-key-focus",
|
|
129
129
|
"context": "Background"
|
|
130
130
|
},
|
|
131
131
|
{ "token": "gray-25", "context": "Icon and Clear icon" },
|
|
@@ -95,7 +95,7 @@
|
|
|
95
95
|
{ "token": "body-sans-serif-font-family", "context": "Description" },
|
|
96
96
|
{ "token": "body-sans-serif-font-weight", "context": "Description" },
|
|
97
97
|
{ "token": "body-sans-serif-font-style", "context": "Description" },
|
|
98
|
-
{ "token": "alert-dialog-
|
|
98
|
+
{ "token": "alert-dialog-description-font-size", "context": "Description" },
|
|
99
99
|
{ "token": "line-height-200", "context": "Description" },
|
|
100
100
|
{ "token": "body-color", "context": "Description" },
|
|
101
101
|
{ "token": "alert-dialog-maximum-width", "context": "Maximum width" },
|
|
@@ -113,7 +113,7 @@
|
|
|
113
113
|
"context": "Icon (error and warning variants)"
|
|
114
114
|
},
|
|
115
115
|
{ "token": "spacing-100", "context": "Minimum spacing (title to icon)" },
|
|
116
|
-
{ "token": "background-color
|
|
116
|
+
{ "token": "background-layer-2-color", "context": "Background" },
|
|
117
117
|
{ "token": "overlay-color", "context": "Overlay" },
|
|
118
118
|
{ "token": "overlay-opacity", "context": "Overlay" },
|
|
119
119
|
{ "token": "notice-visual-color", "context": "Icon (warning variant)" },
|
package/components/avatar.json
CHANGED
|
@@ -113,15 +113,12 @@
|
|
|
113
113
|
{ "token": "avatar-size-1300", "context": "Size" },
|
|
114
114
|
{ "token": "avatar-size-1400", "context": "Size" },
|
|
115
115
|
{ "token": "avatar-size-1500", "context": "Size" },
|
|
116
|
-
{ "token": "avatar-border-
|
|
116
|
+
{ "token": "avatar-border-width", "context": "Border" },
|
|
117
117
|
{ "token": "focus-indicator-thickness", "context": "Focus indicator" },
|
|
118
118
|
{ "token": "focus-indicator-gap", "context": "Focus indicator" },
|
|
119
|
-
{ "token": "
|
|
120
|
-
{ "token": "
|
|
121
|
-
{ "token": "
|
|
122
|
-
{ "token": "static-[color]-600", "context": "66% " },
|
|
123
|
-
{ "token": "avatar-gradient-stop-3", "context": "100% " },
|
|
124
|
-
{ "token": "static-[color]-800", "context": "100% " },
|
|
119
|
+
{ "token": "gradient-stop-1-avatar", "context": "0% " },
|
|
120
|
+
{ "token": "gradient-stop-2-avatar", "context": "66% " },
|
|
121
|
+
{ "token": "gradient-stop-3-avatar", "context": "100% " },
|
|
125
122
|
{ "token": "gradient-angle", "context": "Top-left to bottom-right" },
|
|
126
123
|
{ "token": "default-font-family", "context": "Text (List view item)" },
|
|
127
124
|
{ "token": "extra-bold-font-weight", "context": "Text (List view item)" },
|
package/components/badge.json
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A panel anchored to an edge, exposing a draggable gripper for resizing.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "containers",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/bar-panel/"
|
|
11
11
|
},
|
|
12
12
|
"anatomy": [{ "name": "gripper" }],
|
|
13
13
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A card variant laid out horizontally, pairing a preview with content side by side.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "containers",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/card-horizontal/"
|
|
11
11
|
},
|
|
12
12
|
"states": [{ "name": "default" }],
|
|
13
13
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
package/components/card.json
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A single card surface used to group related content and actions; the base of the cards family (cards.json documents the group).",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "containers",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/card/"
|
|
11
11
|
},
|
|
12
12
|
"anatomy": [{ "name": "selection" }, { "name": "well" }],
|
|
13
13
|
"states": [{ "name": "default" }],
|
package/components/cards.json
CHANGED
|
@@ -173,7 +173,7 @@
|
|
|
173
173
|
{ "token": "focus-indicator-color", "context": "Focus ring" },
|
|
174
174
|
{ "token": "disabled-background-color", "context": "Disabled" },
|
|
175
175
|
{ "token": "opacity-disabled", "context": "Disabled" },
|
|
176
|
-
{ "token": "card-background-color
|
|
176
|
+
{ "token": "card-background-loading-color", "context": "Loading" },
|
|
177
177
|
{
|
|
178
178
|
"token": "card-minimum-height-extra-small",
|
|
179
179
|
"context": "Height (minimum)"
|
|
@@ -198,7 +198,7 @@
|
|
|
198
198
|
"context": "Selection checkbox "
|
|
199
199
|
},
|
|
200
200
|
{
|
|
201
|
-
"token": "card-selection-background-size-extra",
|
|
201
|
+
"token": "card-selection-background-size-extra-large",
|
|
202
202
|
"context": "Selection checkbox "
|
|
203
203
|
},
|
|
204
204
|
{
|
|
@@ -268,23 +268,23 @@
|
|
|
268
268
|
"context": "Height (minimum), default variant"
|
|
269
269
|
},
|
|
270
270
|
{
|
|
271
|
-
"token": "collection-card-
|
|
271
|
+
"token": "collection-card-minimum-height-hero-extra-small",
|
|
272
272
|
"context": "Height (minimum), hero image variant"
|
|
273
273
|
},
|
|
274
274
|
{
|
|
275
|
-
"token": "collection-card-
|
|
275
|
+
"token": "collection-card-minimum-height-hero-small",
|
|
276
276
|
"context": "Height (minimum), hero image variant"
|
|
277
277
|
},
|
|
278
278
|
{
|
|
279
|
-
"token": "collection-card-
|
|
279
|
+
"token": "collection-card-minimum-height-hero-medium",
|
|
280
280
|
"context": "Height (minimum), hero image variant"
|
|
281
281
|
},
|
|
282
282
|
{
|
|
283
|
-
"token": "collection-card-
|
|
283
|
+
"token": "collection-card-minimum-height-hero-large",
|
|
284
284
|
"context": "Height (minimum), hero image variant"
|
|
285
285
|
},
|
|
286
286
|
{
|
|
287
|
-
"token": "collection-card-
|
|
287
|
+
"token": "collection-card-minimum-height-hero-extra-large",
|
|
288
288
|
"context": "Height (minimum), hero image variant"
|
|
289
289
|
},
|
|
290
290
|
{ "token": "spacing-100", "context": "Spacing (header to footer)" },
|
|
@@ -314,7 +314,7 @@
|
|
|
314
314
|
"context": "Height (minimum), default variant"
|
|
315
315
|
},
|
|
316
316
|
{
|
|
317
|
-
"token": "user-
|
|
317
|
+
"token": "user-card-minimum-height-extra-large",
|
|
318
318
|
"context": "Height (minimum), default variant"
|
|
319
319
|
},
|
|
320
320
|
{
|
|
@@ -367,25 +367,13 @@
|
|
|
367
367
|
"token": "border-width-100",
|
|
368
368
|
"context": "Stroke width (secondary, dark)"
|
|
369
369
|
},
|
|
370
|
-
{
|
|
371
|
-
"token": "horizontal-card-edge-to-content-default",
|
|
372
|
-
"context": "Spacing"
|
|
373
|
-
},
|
|
374
370
|
{
|
|
375
371
|
"token": "popover-border-color",
|
|
376
372
|
"context": "Border (Secondary, Light theme)"
|
|
377
373
|
},
|
|
378
|
-
{
|
|
379
|
-
"token": "horizontal-card-edge-to-content-compact",
|
|
380
|
-
"context": "Spacing (top/side/bottom edge to content)"
|
|
381
|
-
},
|
|
382
374
|
{
|
|
383
375
|
"token": "horizontal-card-edge-to-content-regular",
|
|
384
376
|
"context": "Spacing (top/side/bottom edge to content)"
|
|
385
|
-
},
|
|
386
|
-
{
|
|
387
|
-
"token": "horizontal-card-edge-to-content-spacious",
|
|
388
|
-
"context": "Spacing (top/side/bottom edge to content)"
|
|
389
377
|
}
|
|
390
378
|
],
|
|
391
379
|
"accessibility": {
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A card variant representing a collection of items rather than a single asset.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "containers",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/collection-card/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "Shared interactive control (slider/area) underlying color-picker components.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/color-control/"
|
|
11
11
|
},
|
|
12
12
|
"anatomy": [{ "name": "track" }],
|
|
13
13
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
@@ -96,8 +96,6 @@
|
|
|
96
96
|
],
|
|
97
97
|
"lifecycle": { "introduced": "1.0.0-draft" },
|
|
98
98
|
"tokenBindings": [
|
|
99
|
-
{ "token": "xs-s", "context": "Components" },
|
|
100
|
-
{ "token": "s-m", "context": "Components" },
|
|
101
99
|
{ "token": "contextual-help-minimum-width", "context": "Minimum width" },
|
|
102
100
|
{ "token": "corner-radius-large-default", "context": "Rounding" },
|
|
103
101
|
{
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A field for entering a date value.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/date-field/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -234,7 +234,7 @@
|
|
|
234
234
|
},
|
|
235
235
|
"lifecycle": { "introduced": "1.0.0-draft" },
|
|
236
236
|
"tokenBindings": [
|
|
237
|
-
{ "token": "
|
|
237
|
+
{ "token": "popover-gap", "context": "Spacing (open)" },
|
|
238
238
|
{
|
|
239
239
|
"token": "single-calendar-popover-minimum-width",
|
|
240
240
|
"context": "Width (minimum)"
|
|
@@ -308,13 +308,11 @@
|
|
|
308
308
|
"token": "neutral-content-color-key-focus",
|
|
309
309
|
"context": "In field button colors "
|
|
310
310
|
},
|
|
311
|
-
{ "token": "disabled-color-content", "context": "In field button colors " },
|
|
312
311
|
{ "token": "gray-200", "context": "In field button colors " },
|
|
313
312
|
{
|
|
314
|
-
"token": "background-
|
|
313
|
+
"token": "disabled-background-color",
|
|
315
314
|
"context": "In field button colors "
|
|
316
315
|
},
|
|
317
|
-
{ "token": "disabled-background-color", "context": "Disabled" },
|
|
318
316
|
{
|
|
319
317
|
"token": "default-font-family",
|
|
320
318
|
"context": "Label, value, help text, and error message"
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A date-picker calendar variant displaying two consecutive months.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/double-calendar/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -156,7 +156,7 @@
|
|
|
156
156
|
{ "token": "default-font-size", "context": "Title area and body area" },
|
|
157
157
|
{ "token": "font-size-300", "context": "Title area and body area" },
|
|
158
158
|
{ "token": "line-height-100", "context": "Title area and body area" },
|
|
159
|
-
{ "token": "
|
|
159
|
+
{ "token": "gray-300", "context": "Border color" },
|
|
160
160
|
{
|
|
161
161
|
"token": "neutral-content-color-default",
|
|
162
162
|
"context": "Illustration color"
|
|
@@ -177,7 +177,7 @@
|
|
|
177
177
|
"context": "Border and background color (empty, hover)"
|
|
178
178
|
},
|
|
179
179
|
{
|
|
180
|
-
"token": "drop-zone-background-color-opacity-
|
|
180
|
+
"token": "drop-zone-background-color-opacity-filled",
|
|
181
181
|
"context": "Border, background, and text area color (filled, hover)"
|
|
182
182
|
},
|
|
183
183
|
{
|
package/components/field.json
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "Shared layout primitive underlying labeled form fields (text field, picker, etc.).",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/field/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A circular button that floats above content to surface a primary action.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "actions",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/floating-action-button/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "Layout wrapper pairing a form field with its label and helper text.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/form-item/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A button embedded inside a field's input area, such as a clear or disclosure action.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/in-field-button/"
|
|
11
11
|
},
|
|
12
12
|
"anatomy": [{ "name": "fill" }],
|
|
13
13
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
@@ -200,8 +200,6 @@
|
|
|
200
200
|
],
|
|
201
201
|
"lifecycle": { "introduced": "1.0.0-draft" },
|
|
202
202
|
"tokenBindings": [
|
|
203
|
-
{ "token": "(multi-select", "context": "Variants" },
|
|
204
|
-
{ "token": "multi-select)", "context": "Variants" },
|
|
205
203
|
{ "token": "workflow-icon-size-100", "context": "Icon size" },
|
|
206
204
|
{ "token": "list-view-minimum-height", "context": "Component height" },
|
|
207
205
|
{ "token": "list-view-minimum-width", "context": "Component width" },
|
|
@@ -271,8 +269,11 @@
|
|
|
271
269
|
"token": "component-edge-to-text-100",
|
|
272
270
|
"context": "Spacing (horizontal)"
|
|
273
271
|
},
|
|
274
|
-
{ "token": "top-to-text-100", "context": "Spacing (vertical)" },
|
|
275
|
-
{
|
|
272
|
+
{ "token": "component-top-to-text-100", "context": "Spacing (vertical)" },
|
|
273
|
+
{
|
|
274
|
+
"token": "component-bottom-to-text-100",
|
|
275
|
+
"context": "Spacing (vertical)"
|
|
276
|
+
},
|
|
276
277
|
{
|
|
277
278
|
"token": "component-top-to-workflow-icon-100",
|
|
278
279
|
"context": "Spacing (vertical)"
|
package/components/menu.json
CHANGED
|
@@ -491,7 +491,7 @@
|
|
|
491
491
|
{ "token": "menu-item-background-color-hover", "context": "Background" },
|
|
492
492
|
{ "token": "menu-item-background-color-down", "context": "Background" },
|
|
493
493
|
{
|
|
494
|
-
"token": "menu-item-background-color-
|
|
494
|
+
"token": "menu-item-background-color-keyboard-focus",
|
|
495
495
|
"context": "Background"
|
|
496
496
|
},
|
|
497
497
|
{ "token": "menu-item-background-color-disabled", "context": "Background" },
|
package/components/rating.json
CHANGED
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
],
|
|
79
79
|
"lifecycle": { "introduced": "1.0.0-draft" },
|
|
80
80
|
"tokenBindings": [
|
|
81
|
-
{ "token": "
|
|
81
|
+
{ "token": "workflow-icon-size-75", "context": "Layout" },
|
|
82
82
|
{ "token": "workflow-icon-size-100", "context": "Layout" },
|
|
83
83
|
{ "token": "rating-width-small", "context": "Width" },
|
|
84
84
|
{ "token": "rating-width-medium", "context": "Width" },
|
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
{ "token": "corner-radius-medium-size-small", "context": "Rounding" },
|
|
88
88
|
{ "token": "corner-radius-medium-size-medium", "context": "Rounding" },
|
|
89
89
|
{ "token": "focus-indicator-thickness", "context": "Focus ring" },
|
|
90
|
-
{ "token": "focus-indicator-
|
|
90
|
+
{ "token": "focus-indicator-gap", "context": "Focus ring" },
|
|
91
91
|
{
|
|
92
92
|
"token": "rating-top-to-content-area-small",
|
|
93
93
|
"context": "Spacing (padding)"
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A text field split into discrete segments, such as for structured input.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/segmented-text-field/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -179,7 +179,7 @@
|
|
|
179
179
|
"context": "Illustration color"
|
|
180
180
|
},
|
|
181
181
|
{ "token": "neutral-content-color-hover", "context": "Illustration color" },
|
|
182
|
-
{ "token": "
|
|
182
|
+
{ "token": "neutral-content-color-focus", "context": "Illustration color" },
|
|
183
183
|
{
|
|
184
184
|
"token": "select-box-selected-border-color",
|
|
185
185
|
"context": "Border (selected)"
|
|
@@ -194,11 +194,11 @@
|
|
|
194
194
|
"context": "Spacing (multi-level, no icon, start edge to content)"
|
|
195
195
|
},
|
|
196
196
|
{
|
|
197
|
-
"token": "side-navigation-with-icon-
|
|
197
|
+
"token": "side-navigation-second-level-with-icon-edge-to-indicator",
|
|
198
198
|
"context": "Spacing (multi-level, no icon, start edge to content)"
|
|
199
199
|
},
|
|
200
200
|
{
|
|
201
|
-
"token": "side-navigation-with-icon-
|
|
201
|
+
"token": "side-navigation-third-level-with-icon-edge-to-indicator",
|
|
202
202
|
"context": "Spacing (multi-level, no icon, start edge to content)"
|
|
203
203
|
},
|
|
204
204
|
{
|
|
@@ -226,7 +226,7 @@
|
|
|
226
226
|
"context": "Spacing (text to trailing accessory area)"
|
|
227
227
|
},
|
|
228
228
|
{
|
|
229
|
-
"token": "navigation-trailing-accessory-area-to-edge",
|
|
229
|
+
"token": "side-navigation-trailing-accessory-area-to-edge",
|
|
230
230
|
"context": "Spacing (single-level, end to content)"
|
|
231
231
|
},
|
|
232
232
|
{
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A date-picker calendar variant displaying a single month.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/single-calendar/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
package/components/slider.json
CHANGED
|
@@ -181,22 +181,22 @@
|
|
|
181
181
|
{ "token": "slider-handle-large", "context": "Handle (size)" },
|
|
182
182
|
{ "token": "slider-handle-extra-large", "context": "Handle (size)" },
|
|
183
183
|
{
|
|
184
|
-
"token": "slider-
|
|
184
|
+
"token": "slider-handle-height-precision-small",
|
|
185
185
|
"context": "Handle (size)"
|
|
186
186
|
},
|
|
187
187
|
{
|
|
188
|
-
"token": "slider-
|
|
188
|
+
"token": "slider-handle-height-precision-medium",
|
|
189
189
|
"context": "Handle (size)"
|
|
190
190
|
},
|
|
191
191
|
{
|
|
192
|
-
"token": "slider-
|
|
192
|
+
"token": "slider-handle-height-precision-large",
|
|
193
193
|
"context": "Handle (size)"
|
|
194
194
|
},
|
|
195
195
|
{
|
|
196
|
-
"token": "slider-
|
|
196
|
+
"token": "slider-handle-height-precision-extra-large",
|
|
197
197
|
"context": "Handle (size)"
|
|
198
198
|
},
|
|
199
|
-
{ "token": "slider-precision-
|
|
199
|
+
{ "token": "slider-handle-precision-width", "context": "Handle (size)" },
|
|
200
200
|
{ "token": "border-width-200", "context": "Handle (border)" },
|
|
201
201
|
{ "token": "focus-indicator-thickness", "context": "Focus ring" },
|
|
202
202
|
{ "token": "focus-indicator-gap", "context": "Focus ring" },
|
|
@@ -265,19 +265,19 @@
|
|
|
265
265
|
"context": "Spacing (field label to slider control)"
|
|
266
266
|
},
|
|
267
267
|
{
|
|
268
|
-
"token": "slider-control-to-
|
|
268
|
+
"token": "slider-control-to-field-label-side-small",
|
|
269
269
|
"context": "Spacing (field label to slider control)"
|
|
270
270
|
},
|
|
271
271
|
{
|
|
272
|
-
"token": "slider-control-to-
|
|
272
|
+
"token": "slider-control-to-field-label-side-medium",
|
|
273
273
|
"context": "Spacing (field label to slider control)"
|
|
274
274
|
},
|
|
275
275
|
{
|
|
276
|
-
"token": "slider-control-to-
|
|
276
|
+
"token": "slider-control-to-field-label-side-large",
|
|
277
277
|
"context": "Spacing (field label to slider control)"
|
|
278
278
|
},
|
|
279
279
|
{
|
|
280
|
-
"token": "slider-control-to-
|
|
280
|
+
"token": "slider-control-to-field-label-side-extra-large",
|
|
281
281
|
"context": "Spacing (field label to slider control)"
|
|
282
282
|
},
|
|
283
283
|
{
|
|
@@ -297,7 +297,6 @@
|
|
|
297
297
|
"context": "Spacing (slider to field)"
|
|
298
298
|
},
|
|
299
299
|
{ "token": "neutral-subdued-content-color-default", "context": "Value" },
|
|
300
|
-
{ "token": "alias-track-default", "context": "Track" },
|
|
301
300
|
{ "token": "gray-700", "context": "Track" },
|
|
302
301
|
{ "token": "accent-content-color-default", "context": "Track" },
|
|
303
302
|
{ "token": "gray-800", "context": "Handle" },
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A single row primitive used by list-like containers such as list-view and tree-view.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "containers",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/stack-item/"
|
|
11
11
|
},
|
|
12
12
|
"states": [
|
|
13
13
|
{ "name": "down", "trigger": "interaction" },
|
|
@@ -132,7 +132,7 @@
|
|
|
132
132
|
{ "token": "spacing-400", "context": "Spacing (edge to content)" },
|
|
133
133
|
{ "token": "spacing-300", "context": "Spacing (title to description)" },
|
|
134
134
|
{ "token": "spacing-200", "context": "Spacing (edge to close button)" },
|
|
135
|
-
{ "token": "background-color
|
|
135
|
+
{ "token": "background-layer-2-color", "context": "Background" },
|
|
136
136
|
{ "token": "overlay-color", "context": "Overlay" },
|
|
137
137
|
{ "token": "overlay-opacity", "context": "Overlay" },
|
|
138
138
|
{ "token": "title-sans-serif-font-family", "context": "Title" },
|
|
@@ -117,7 +117,7 @@
|
|
|
117
117
|
{ "token": "status-light-dot-size-small", "context": "Dot size" },
|
|
118
118
|
{ "token": "status-light-dot-size-medium", "context": "Dot size" },
|
|
119
119
|
{ "token": "status-light-dot-size-large", "context": "Dot size" },
|
|
120
|
-
{ "token": "status-light-dot-extra-large", "context": "Dot size" },
|
|
120
|
+
{ "token": "status-light-dot-size-extra-large", "context": "Dot size" },
|
|
121
121
|
{
|
|
122
122
|
"token": "status-light-text-to-visual-75",
|
|
123
123
|
"context": "Spacing (dot to label) "
|
package/components/steplist.json
CHANGED
|
@@ -156,7 +156,7 @@
|
|
|
156
156
|
{ "token": "steplist-visual-size-large", "context": "Visual size" },
|
|
157
157
|
{ "token": "steplist-visual-size-extra-large", "context": "Visual size" },
|
|
158
158
|
{
|
|
159
|
-
"token": "steplist-track-thickness-
|
|
159
|
+
"token": "steplist-track-thickness-medium",
|
|
160
160
|
"context": "Steplist track thickness"
|
|
161
161
|
},
|
|
162
162
|
{
|
package/components/table.json
CHANGED
|
@@ -215,7 +215,7 @@
|
|
|
215
215
|
],
|
|
216
216
|
"lifecycle": { "introduced": "1.0.0-draft" },
|
|
217
217
|
"tokenBindings": [
|
|
218
|
-
{ "token": "chevron-100", "context": "Header icons" },
|
|
218
|
+
{ "token": "chevron-icon-size-100", "context": "Header icons" },
|
|
219
219
|
{
|
|
220
220
|
"token": "corner-radius-medium-size-extra-small",
|
|
221
221
|
"context": "Note: desktop 6px, mobile 6px;"
|
|
@@ -337,15 +337,15 @@
|
|
|
337
337
|
"context": "Row: selected, checkbox & highlight"
|
|
338
338
|
},
|
|
339
339
|
{
|
|
340
|
-
"token": "neutral-content-color-
|
|
340
|
+
"token": "neutral-content-color-hover",
|
|
341
341
|
"context": "Row: selected, checkbox & highlight"
|
|
342
342
|
},
|
|
343
343
|
{
|
|
344
|
-
"token": "neutral-content-color-
|
|
344
|
+
"token": "neutral-content-color-down",
|
|
345
345
|
"context": "Row: selected, checkbox & highlight"
|
|
346
346
|
},
|
|
347
347
|
{
|
|
348
|
-
"token": "neutral-content-color-
|
|
348
|
+
"token": "neutral-content-color-key-focus",
|
|
349
349
|
"context": "Row: selected, checkbox & highlight"
|
|
350
350
|
},
|
|
351
351
|
{
|
|
@@ -408,7 +408,7 @@
|
|
|
408
408
|
{ "token": "cjk-line-height-100", "context": "Column header and row" },
|
|
409
409
|
{ "token": "regular-font-weight", "context": "Column header and row" },
|
|
410
410
|
{
|
|
411
|
-
"token": "table-row-hover-color
|
|
411
|
+
"token": "table-row-hover-color",
|
|
412
412
|
"context": "S1 Row (not selected, hover)"
|
|
413
413
|
},
|
|
414
414
|
{
|
package/components/tabs.json
CHANGED
|
@@ -133,14 +133,6 @@
|
|
|
133
133
|
"token": "tab-item-top-to-workflow-icon-medium",
|
|
134
134
|
"context": "Spacing (top/bottom to edge, workflow icon only)"
|
|
135
135
|
},
|
|
136
|
-
{
|
|
137
|
-
"token": "tab-item-side-to-workflow-icon-compact-medium",
|
|
138
|
-
"context": "Spacing (side to edge, workflow icon only)"
|
|
139
|
-
},
|
|
140
|
-
{
|
|
141
|
-
"token": "tab-item-side-to-workflow-icon-medium",
|
|
142
|
-
"context": "Spacing (side to edge, workflow icon only)"
|
|
143
|
-
},
|
|
144
136
|
{ "token": "spacing-100", "context": "Spacing (edge to edge)" },
|
|
145
137
|
{
|
|
146
138
|
"token": "tab-item-top-to-text-compact-medium",
|
package/components/tag.json
CHANGED
|
@@ -236,19 +236,19 @@
|
|
|
236
236
|
{ "token": "accent-background-color-key-focus", "context": "Background" },
|
|
237
237
|
{ "token": "white", "context": "Icon and Clear icon" },
|
|
238
238
|
{
|
|
239
|
-
"token": "neutral-
|
|
239
|
+
"token": "neutral-background-color-selected-default",
|
|
240
240
|
"context": "Background"
|
|
241
241
|
},
|
|
242
242
|
{
|
|
243
|
-
"token": "neutral-
|
|
243
|
+
"token": "neutral-background-color-selected-hover",
|
|
244
244
|
"context": "Background"
|
|
245
245
|
},
|
|
246
246
|
{
|
|
247
|
-
"token": "neutral-
|
|
247
|
+
"token": "neutral-background-color-selected-down",
|
|
248
248
|
"context": "Background"
|
|
249
249
|
},
|
|
250
250
|
{
|
|
251
|
-
"token": "neutral-
|
|
251
|
+
"token": "neutral-background-color-selected-key-focus",
|
|
252
252
|
"context": "Background"
|
|
253
253
|
},
|
|
254
254
|
{ "token": "gray-25", "context": "Icon and Clear icon" },
|
|
@@ -101,7 +101,7 @@
|
|
|
101
101
|
"token": "corner-radius-extra-large-default",
|
|
102
102
|
"context": "Rounding (dialog option)"
|
|
103
103
|
},
|
|
104
|
-
{ "token": "background-color
|
|
104
|
+
{ "token": "background-layer-2-color", "context": "Background" },
|
|
105
105
|
{ "token": "overlay-color", "context": "Overlay" },
|
|
106
106
|
{ "token": "overlay-opacity", "context": "Overlay" },
|
|
107
107
|
{ "token": "heading-color", "context": "Title" }
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A field for entering a time value.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/time-field/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -239,10 +239,6 @@
|
|
|
239
239
|
{ "token": "focus-indicator-thickness", "context": "Focus " },
|
|
240
240
|
{ "token": "focus-indicator-gap", "context": "Focus (drag handle)" },
|
|
241
241
|
{ "token": "component-height-200", "context": "Height" },
|
|
242
|
-
{
|
|
243
|
-
"token": "stack-item-minimum-vertical-padding",
|
|
244
|
-
"context": "Spacing (vertical)"
|
|
245
|
-
},
|
|
246
242
|
{
|
|
247
243
|
"token": "stack-item-item-to-item",
|
|
248
244
|
"context": "Spacing (vertically, between tree view items)"
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A date-picker calendar variant displaying three consecutive months.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "inputs",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/triple-calendar/"
|
|
11
11
|
},
|
|
12
12
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
|
13
13
|
}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"description": "A card variant surfacing a user's identity (avatar, name) alongside supporting content.",
|
|
8
8
|
"meta": {
|
|
9
9
|
"category": "containers",
|
|
10
|
-
"documentationUrl": "https://spectrum.adobe.com/"
|
|
10
|
+
"documentationUrl": "https://spectrum.adobe.com/page/user-card/"
|
|
11
11
|
},
|
|
12
12
|
"anatomy": [{ "name": "title" }],
|
|
13
13
|
"lifecycle": { "introduced": "1.0.0-draft" }
|
package/package.json
CHANGED