@adobe/spectrum-design-data 0.11.0 → 0.13.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 (39) hide show
  1. package/components/action-bar.json +2 -1
  2. package/components/avatar.json +2 -1
  3. package/components/bar-panel.json +14 -0
  4. package/components/card-horizontal.json +14 -0
  5. package/components/card.json +15 -0
  6. package/components/coach-mark.json +5 -1
  7. package/components/collection-card.json +13 -0
  8. package/components/color-control.json +14 -0
  9. package/components/combo-box.json +20 -4
  10. package/components/date-field.json +13 -0
  11. package/components/double-calendar.json +13 -0
  12. package/components/field.json +13 -0
  13. package/components/floating-action-button.json +13 -0
  14. package/components/form-item.json +13 -0
  15. package/components/in-field-button.json +14 -0
  16. package/components/menu.json +3 -1
  17. package/components/segmented-text-field.json +13 -0
  18. package/components/select-box.json +2 -1
  19. package/components/side-navigation.json +2 -1
  20. package/components/single-calendar.json +13 -0
  21. package/components/slider.json +4 -1
  22. package/components/stack-item.json +23 -0
  23. package/components/status-light.json +2 -1
  24. package/components/steplist.json +2 -1
  25. package/components/swatch.json +9 -1
  26. package/components/table.json +2 -1
  27. package/components/time-field.json +13 -0
  28. package/components/tree-view.json +7 -2
  29. package/components/triple-calendar.json +13 -0
  30. package/components/user-card.json +14 -0
  31. package/fields/referenceScaleIndex.json +16 -0
  32. package/package.json +1 -1
  33. package/registry/property-terms.json +2 -2
  34. package/tokens/color-aliases.tokens.json +607 -293
  35. package/tokens/color-component.tokens.json +99 -40
  36. package/tokens/layout-component.tokens.json +1023 -600
  37. package/tokens/layout.tokens.json +305 -128
  38. package/tokens/semantic-color-palette.tokens.json +260 -88
  39. package/tokens/typography.tokens.json +144 -72
@@ -62,7 +62,8 @@
62
62
  {
63
63
  "name": "item-counter",
64
64
  "description": "Badge showing a count of items or actions."
65
- }
65
+ },
66
+ { "name": "counter" }
66
67
  ],
67
68
  "lifecycle": { "introduced": "1.0.0-draft" },
68
69
  "tokenBindings": [
@@ -91,7 +91,8 @@
91
91
  },
92
92
  "states": [
93
93
  { "name": "down", "trigger": "interaction" },
94
- { "name": "keyboard-focus", "trigger": "interaction" }
94
+ { "name": "keyboard-focus", "trigger": "interaction" },
95
+ { "name": "disabled", "trigger": "prop" }
95
96
  ],
96
97
  "lifecycle": { "introduced": "1.0.0-draft" },
97
98
  "tokenBindings": [
@@ -0,0 +1,14 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/bar-panel.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "bar-panel",
6
+ "displayName": "Bar panel",
7
+ "description": "A panel anchored to an edge, exposing a draggable gripper for resizing.",
8
+ "meta": {
9
+ "category": "containers",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "anatomy": [{ "name": "gripper" }],
13
+ "lifecycle": { "introduced": "1.0.0-draft" }
14
+ }
@@ -0,0 +1,14 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/card-horizontal.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "card-horizontal",
6
+ "displayName": "Horizontal card",
7
+ "description": "A card variant laid out horizontally, pairing a preview with content side by side.",
8
+ "meta": {
9
+ "category": "containers",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "states": [{ "name": "default" }],
13
+ "lifecycle": { "introduced": "1.0.0-draft" }
14
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/card.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "card",
6
+ "displayName": "Card",
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
+ "meta": {
9
+ "category": "containers",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "anatomy": [{ "name": "selection" }, { "name": "well" }],
13
+ "states": [{ "name": "default" }],
14
+ "lifecycle": { "introduced": "1.0.0-draft" }
15
+ }
@@ -115,7 +115,11 @@
115
115
  {
116
116
  "name": "pagination-text",
117
117
  "description": "Text indicating step position (e.g. '2 of 5')."
118
- }
118
+ },
119
+ { "name": "body" },
120
+ { "name": "media" },
121
+ { "name": "pagination" },
122
+ { "name": "title" }
119
123
  ],
120
124
  "lifecycle": { "introduced": "1.0.0-draft" },
121
125
  "tokenBindings": [
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/collection-card.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "collection-card",
6
+ "displayName": "Collection card",
7
+ "description": "A card variant representing a collection of items rather than a single asset.",
8
+ "meta": {
9
+ "category": "containers",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,14 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/color-control.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "color-control",
6
+ "displayName": "Color control",
7
+ "description": "Shared interactive control (slider/area) underlying color-picker components.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "anatomy": [{ "name": "track" }],
13
+ "lifecycle": { "introduced": "1.0.0-draft" }
14
+ }
@@ -213,10 +213,26 @@
213
213
  "errorMessage": { "type": "string" }
214
214
  },
215
215
  "states": [
216
- { "name": "hover-(text-area)", "trigger": "prop" },
217
- { "name": "hover-(button-area)", "trigger": "prop" },
218
- { "name": "focus-+-hover", "trigger": "prop" },
219
- { "name": "focus-+-not-hover", "trigger": "prop" },
216
+ {
217
+ "name": "hover-text-area",
218
+ "trigger": "prop",
219
+ "description": "Hover scoped to the text-entry anatomy part, distinct from hover over the field button."
220
+ },
221
+ {
222
+ "name": "hover-button-area",
223
+ "trigger": "prop",
224
+ "description": "Hover scoped to the field button anatomy part, distinct from hover over the text-entry area."
225
+ },
226
+ {
227
+ "name": "focus-hover",
228
+ "trigger": "prop",
229
+ "description": "Combined focus and hover, when the field is focused and the pointer is also over it."
230
+ },
231
+ {
232
+ "name": "focus-not-hover",
233
+ "trigger": "prop",
234
+ "description": "Focus without hover, when the field is focused but the pointer is not over it."
235
+ },
220
236
  { "name": "keyboard-focus", "trigger": "interaction" }
221
237
  ],
222
238
  "lifecycle": { "introduced": "1.0.0-draft" },
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/date-field.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "date-field",
6
+ "displayName": "Date field",
7
+ "description": "A field for entering a date value.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/double-calendar.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "double-calendar",
6
+ "displayName": "Double calendar",
7
+ "description": "A date-picker calendar variant displaying two consecutive months.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/field.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "field",
6
+ "displayName": "Field",
7
+ "description": "Shared layout primitive underlying labeled form fields (text field, picker, etc.).",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/floating-action-button.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "floating-action-button",
6
+ "displayName": "Floating action button",
7
+ "description": "A circular button that floats above content to surface a primary action.",
8
+ "meta": {
9
+ "category": "actions",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/form-item.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "form-item",
6
+ "displayName": "Form item",
7
+ "description": "Layout wrapper pairing a form field with its label and helper text.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,14 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/in-field-button.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "in-field-button",
6
+ "displayName": "In-field button",
7
+ "description": "A button embedded inside a field's input area, such as a clear or disclosure action.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "anatomy": [{ "name": "fill" }],
13
+ "lifecycle": { "introduced": "1.0.0-draft" }
14
+ }
@@ -210,7 +210,9 @@
210
210
  "states": [
211
211
  { "name": "hover", "trigger": "interaction" },
212
212
  { "name": "down", "trigger": "interaction" },
213
- { "name": "keyboard-focus", "trigger": "interaction" }
213
+ { "name": "keyboard-focus", "trigger": "interaction" },
214
+ { "name": "default", "trigger": "prop" },
215
+ { "name": "disabled", "trigger": "prop" }
214
216
  ],
215
217
  "lifecycle": { "introduced": "1.0.0-draft" },
216
218
  "tokenBindings": [
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/segmented-text-field.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "segmented-text-field",
6
+ "displayName": "Segmented text field",
7
+ "description": "A text field split into discrete segments, such as for structured input.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -104,7 +104,8 @@
104
104
  "states": [
105
105
  { "name": "down", "trigger": "interaction" },
106
106
  { "name": "hover", "trigger": "interaction" },
107
- { "name": "keyboard-focus", "trigger": "interaction" }
107
+ { "name": "keyboard-focus", "trigger": "interaction" },
108
+ { "name": "selected", "trigger": "interaction" }
108
109
  ],
109
110
  "lifecycle": { "introduced": "1.0.0-draft" },
110
111
  "tokenBindings": [
@@ -137,7 +137,8 @@
137
137
  {
138
138
  "name": "trailing-accessory-area",
139
139
  "description": "Trailing area for accessory content such as counts or actions."
140
- }
140
+ },
141
+ { "name": "indicator" }
141
142
  ],
142
143
  "states": [
143
144
  { "name": "hover", "trigger": "interaction" },
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/single-calendar.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "single-calendar",
6
+ "displayName": "Single calendar",
7
+ "description": "A date-picker calendar variant displaying a single month.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -139,7 +139,10 @@
139
139
  {
140
140
  "name": "text-field",
141
141
  "description": "Editable numeric value field."
142
- }
142
+ },
143
+ { "name": "handle" },
144
+ { "name": "track" },
145
+ { "name": "control" }
143
146
  ],
144
147
  "states": [
145
148
  { "name": "hover", "trigger": "interaction" },
@@ -0,0 +1,23 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/stack-item.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "stack-item",
6
+ "displayName": "Stack item",
7
+ "description": "A single row primitive used by list-like containers such as list-view and tree-view.",
8
+ "meta": {
9
+ "category": "containers",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "states": [
13
+ { "name": "down", "trigger": "interaction" },
14
+ { "name": "hover", "trigger": "interaction" },
15
+ { "name": "key-focus", "trigger": "interaction" },
16
+ { "name": "selected", "trigger": "interaction" },
17
+ { "name": "selected-default", "trigger": "interaction" },
18
+ { "name": "selected-down", "trigger": "interaction" },
19
+ { "name": "selected-hover", "trigger": "interaction" },
20
+ { "name": "selected-keyboard-focus", "trigger": "interaction" }
21
+ ],
22
+ "lifecycle": { "introduced": "1.0.0-draft" }
23
+ }
@@ -105,7 +105,8 @@
105
105
  {
106
106
  "name": "visual-300",
107
107
  "description": "Severity dot, 300 size variant."
108
- }
108
+ },
109
+ { "name": "dot" }
109
110
  ],
110
111
  "lifecycle": { "introduced": "1.0.0-draft" },
111
112
  "tokenBindings": [
@@ -92,7 +92,8 @@
92
92
  {
93
93
  "name": "track-size",
94
94
  "description": "The connecting track between steps."
95
- }
95
+ },
96
+ { "name": "track" }
96
97
  ],
97
98
  "lifecycle": { "introduced": "1.0.0-draft" },
98
99
  "tokenBindings": [
@@ -76,10 +76,18 @@
76
76
  "isSelected": { "type": "boolean", "default": false },
77
77
  "isDisabled": { "type": "boolean", "default": false }
78
78
  },
79
+ "anatomy": [
80
+ {
81
+ "name": "slash",
82
+ "description": "Diagonal slash indicating an empty or \"none\" swatch."
83
+ },
84
+ { "name": "icon" }
85
+ ],
79
86
  "states": [
80
87
  { "name": "hover", "trigger": "interaction" },
81
88
  { "name": "down", "trigger": "interaction" },
82
- { "name": "keyboard-focus", "trigger": "interaction" }
89
+ { "name": "keyboard-focus", "trigger": "interaction" },
90
+ { "name": "disabled", "trigger": "prop" }
83
91
  ],
84
92
  "lifecycle": { "introduced": "1.0.0-draft" },
85
93
  "tokenBindings": [
@@ -210,7 +210,8 @@
210
210
  {
211
211
  "name": "header-row-checkbox",
212
212
  "description": "Select-all checkbox within the column header row."
213
- }
213
+ },
214
+ { "name": "section-header" }
214
215
  ],
215
216
  "lifecycle": { "introduced": "1.0.0-draft" },
216
217
  "tokenBindings": [
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/time-field.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "time-field",
6
+ "displayName": "Time field",
7
+ "description": "A field for entering a time value.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -169,12 +169,17 @@
169
169
  {
170
170
  "name": "action-area",
171
171
  "description": "Trailing area containing item actions."
172
- }
172
+ },
173
+ { "name": "row" }
173
174
  ],
174
175
  "states": [
176
+ { "name": "default", "description": "Resting base state." },
175
177
  { "name": "hover", "trigger": "interaction" },
176
178
  { "name": "down", "trigger": "interaction" },
177
- { "name": "keyboard-focus", "trigger": "interaction" }
179
+ { "name": "keyboard-focus", "trigger": "interaction" },
180
+ { "name": "selected", "trigger": "interaction" },
181
+ { "name": "selected-default", "trigger": "interaction" },
182
+ { "name": "selected-hover", "trigger": "interaction" }
178
183
  ],
179
184
  "lifecycle": { "introduced": "1.0.0-draft" },
180
185
  "tokenBindings": [
@@ -0,0 +1,13 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/triple-calendar.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "triple-calendar",
6
+ "displayName": "Triple calendar",
7
+ "description": "A date-picker calendar variant displaying three consecutive months.",
8
+ "meta": {
9
+ "category": "inputs",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "lifecycle": { "introduced": "1.0.0-draft" }
13
+ }
@@ -0,0 +1,14 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
3
+ "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/user-card.json",
4
+ "specVersion": "1.0.0-draft",
5
+ "name": "user-card",
6
+ "displayName": "User card",
7
+ "description": "A card variant surfacing a user's identity (avatar, name) alongside supporting content.",
8
+ "meta": {
9
+ "category": "containers",
10
+ "documentationUrl": "https://spectrum.adobe.com/"
11
+ },
12
+ "anatomy": [{ "name": "title" }],
13
+ "lifecycle": { "introduced": "1.0.0-draft" }
14
+ }
@@ -0,0 +1,16 @@
1
+ {
2
+ "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
3
+ "specVersion": "1.0.0-draft",
4
+ "name": "referenceScaleIndex",
5
+ "description": "Numeric index referencing a step in ANOTHER scale that this token corresponds to (e.g. a line-height paired with font-size tier N), distinct from scaleIndex (this token's own ramp position).",
6
+ "kind": "numeric",
7
+ "registry": null,
8
+ "validation": "none",
9
+ "serialization": {
10
+ "position": 98
11
+ },
12
+ "scope": null,
13
+ "required": false,
14
+ "valueType": "integer",
15
+ "excludeFromLegacyKey": true
16
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adobe/spectrum-design-data",
3
- "version": "0.11.0",
3
+ "version": "0.13.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": {
@@ -134,8 +134,8 @@
134
134
  "description": "Border or stroke thickness"
135
135
  },
136
136
  {
137
- "id": "border-radius",
138
- "label": "Border Radius",
137
+ "id": "corner-radius",
138
+ "label": "Corner Radius",
139
139
  "description": "Corner rounding radius"
140
140
  },
141
141
  {