@adobe/spectrum-design-data 3.7.0 → 3.8.0

package/components/radio-button.json

@@ -38,11 +38,51 @@
   "options": {
     "isSelected": { "type": "boolean", "default": false },
     "isEmphasized": { "type": "boolean", "default": false },
+    "isDisabled": { "type": "boolean", "default": false },
+    "size": {
+      "type": "string",
+      "default": "m",
+      "values": [
+        { "value": "s" },
+        { "value": "m" },
+        { "value": "l" },
+        { "value": "xl" }
+      ]
+    },
     "label": {
       "type": "string",
       "description": "The text displayed next to a radio button."
     }
   },
+  "anatomy": [
+    {
+      "name": "container",
+      "description": "Row that holds the control and the label.",
+      "required": true,
+      "contains": ["control", "label"]
+    },
+    {
+      "name": "control",
+      "description": "Circle that holds the selection indicator. Unselected it is drawn as a ring; selected it is filled.",
+      "required": true,
+      "contains": ["selection-indicator"]
+    },
+    {
+      "name": "selection-indicator",
+      "description": "Dot at the center of the control, shown while the radio button is selected."
+    },
+    { "name": "label", "description": "Text label." },
+    {
+      "name": "focus-indicator",
+      "description": "Outline drawn outside the control for keyboard focus.",
+      "presentIn": ["keyboard-focus"]
+    }
+  ],
+  "anatomyReview": {
+    "status": "reviewed",
+    "reviewedIn": "1.0.0-draft",
+    "notes": "Figma draws the selected state as a 6px inner border around a 4px white dot; modeled as a filled control with a selection-indicator dot, which renders the same. focus-indicator is state-only."
+  },
   "states": [
     { "name": "hover", "trigger": "interaction" },
     { "name": "down", "trigger": "interaction" },
@@ -52,15 +92,15 @@
   "tokenBindings": [
     {
       "token": "neutral-content-color-selected-default",
-      "context": "S2 Control (selected, non emphasized)"
+      "context": "Control (selected, non emphasized)"
     },
     {
       "token": "neutral-content-color-selected-hover",
-      "context": "S2 Control (selected, non emphasized)"
+      "context": "Control (selected, non emphasized)"
     },
     {
       "token": "neutral-content-color-selected-key-focus",
-      "context": "S2 Control (selected, non emphasized)"
+      "context": "Control (selected, non emphasized)"
     }
   ],
   "accessibility": {

package/components/switch.json

@@ -105,7 +105,42 @@
     },
     "isEmphasized": { "type": "boolean", "default": false },
     "isDisabled": { "type": "boolean", "default": false },
-    "isReadOnly": { "type": "boolean", "default": false }
+    "isReadOnly": {
+      "type": "boolean",
+      "default": false,
+      "description": "Behavior only: the switch keeps its default or selected appearance and does not respond to hover or press. No distinct read-only visual is defined in Figma (Web POC), react-spectrum S2, or Spectrum Web Components 1st-gen."
+    },
+    "hideLabel": { "type": "boolean", "default": false }
+  },
+  "anatomy": [
+    {
+      "name": "container",
+      "description": "Row that holds the track and the label.",
+      "required": true,
+      "contains": ["track", "label"]
+    },
+    {
+      "name": "track",
+      "description": "Pill-shaped background. Its border is drawn while the switch is off. Holds the handle.",
+      "required": true,
+      "contains": ["handle"]
+    },
+    {
+      "name": "handle",
+      "description": "Circle that sits at the start of the track when off and at the end when on.",
+      "required": true
+    },
+    { "name": "label", "description": "Text label." },
+    {
+      "name": "focus-indicator",
+      "description": "Outline drawn outside the track for keyboard focus.",
+      "presentIn": ["keyboard-focus"]
+    }
+  ],
+  "anatomyReview": {
+    "status": "reviewed",
+    "reviewedIn": "1.0.0-draft",
+    "notes": "control removed (a grouping with no style of its own); its size moved to track, which now holds the handle. focus-indicator is state-only."
   },
   "states": [
     { "name": "hover", "trigger": "interaction" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adobe/spectrum-design-data",
-  "version": "3.7.0",
+  "version": "3.8.0",
   "description": "Spectrum design tokens in cascade format — the canonical source of truth for @adobe/spectrum-tokens",
   "type": "module",
   "repository": {
@@ -20,6 +20,7 @@
     "./package.json": "./package.json",
     "./tokens/*": "./tokens/*.tokens.json",
     "./components/*": "./components/*.json",
+    "./changelog/*": "./changelog/*.json",
     "./fields/*": "./fields/*.json",
     "./mode-sets/*": "./mode-sets/*.json",
     "./guidelines/*": "./guidelines/*.json",
@@ -53,6 +54,7 @@
   "files": [
     "tokens/",
     "components/",
+    "changelog/",
     "fields/",
     "mode-sets/",
     "guidelines/",
@@ -63,7 +65,7 @@
   "devDependencies": {
     "ajv": "^8.12.0",
     "ajv-formats": "^3.0.1",
-    "@adobe/design-data-spec": "4.8.0"
+    "@adobe/design-data-spec": "4.9.0"
   },
   "scripts": {}
 }

package/registry/anatomy-terms.json

@@ -211,6 +211,18 @@
       "description": "Check or confirmation icon element within a component",
       "usedIn": ["tokens"]
     },
+    {
+      "id": "box",
+      "label": "Box",
+      "description": "Rounded square that holds a mark (e.g., a checkbox)",
+      "usedIn": ["component-schemas"]
+    },
+    {
+      "id": "dash",
+      "label": "Dash",
+      "description": "Short horizontal bar icon element, e.g. the indeterminate mark of a checkbox",
+      "usedIn": ["component-schemas"]
+    },
     {
       "id": "stepper",
       "label": "Stepper",
@@ -241,17 +253,10 @@
       "description": "Heading text element within a component section",
       "usedIn": ["tokens", "s2-docs"]
     },
-    {
-      "id": "focus-ring",
-      "label": "Focus Ring",
-      "description": "Visible ring drawn around a focused component for accessibility",
-      "usedIn": ["tokens"],
-      "standaloneScope": true
-    },
     {
       "id": "focus-indicator",
       "label": "Focus Indicator",
-      "description": "Visual indicator showing keyboard focus state on a component",
+      "description": "Visual indicator showing keyboard focus state on a component. Named for its intent, not its shape: it may be a ring or a side indicator. Its tokens are focus-indicator color, gap and thickness.",
       "usedIn": ["tokens"],
       "standaloneScope": true
     },

package/registry/token-terminology.json

@@ -458,7 +458,7 @@
     {
       "id": "focus-ring",
       "label": "Focus Ring",
-      "description": "Visual indication of interactive keyboard focus on any UI element",
+      "description": "Shared style class for the ring-shaped focus indicator, built from the focus-indicator tokens (color, gap, thickness). Not a token anatomy; tokens use focus-indicator.",
       "usedIn": ["tokens", "taxonomy"],
       "definition": {
         "superordinate": "structure",

package/tokens/layout.tokens.json

@@ -5769,8 +5769,9 @@
   },
   {
     "name": {
-      "anatomy": "focus-ring",
-      "property": "gap"
+      "anatomy": "focus-indicator",
+      "property": "gap",
+      "legacyKey": "focus-ring-gap"
     },
     "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/token-types/alias.json",
     "$ref": "1b06f6e2-d9be-4934-b3da-bed75986d104",