@adobe/spectrum-design-data 0.1.0 → 0.3.0

package/components/tree-view.json

@@ -0,0 +1,393 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
+  "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/tree-view.json",
+  "specVersion": "1.0.0-draft",
+  "name": "tree-view",
+  "displayName": "Tree view",
+  "description": "A tree view provides users with a way to navigate nested hierarchical information.",
+  "meta": {
+    "category": "navigation",
+    "documentationUrl": "https://spectrum.adobe.com/page/tree-view/"
+  },
+  "options": {
+    "size": {
+      "type": "string",
+      "default": "m",
+      "values": [
+        {
+          "value": "s"
+        },
+        {
+          "value": "m"
+        },
+        {
+          "value": "l"
+        },
+        {
+          "value": "xl"
+        }
+      ]
+    },
+    "isDetached": {
+      "type": "boolean",
+      "default": false
+    },
+    "isEmphasized": {
+      "type": "boolean",
+      "default": false
+    },
+    "showDragIcon": {
+      "type": "boolean",
+      "default": false
+    },
+    "selectionMode": {
+      "type": "string",
+      "default": "multiple",
+      "values": [
+        {
+          "value": "single"
+        },
+        {
+          "value": "multiple"
+        }
+      ]
+    },
+    "selectionStyle": {
+      "type": "string",
+      "default": "checkbox",
+      "values": [
+        {
+          "value": "checkbox"
+        },
+        {
+          "value": "highlight"
+        }
+      ]
+    },
+    "selectionBehavior": {
+      "type": "string",
+      "default": "toggle",
+      "values": [
+        {
+          "value": "toggle"
+        },
+        {
+          "value": "replace"
+        }
+      ]
+    }
+  },
+  "states": [
+    {
+      "name": "hover",
+      "trigger": "interaction"
+    },
+    {
+      "name": "down",
+      "trigger": "interaction"
+    },
+    {
+      "name": "keyboard-focus",
+      "trigger": "interaction"
+    }
+  ],
+  "lifecycle": {
+    "introduced": "1.0.0-draft"
+  },
+  "tokenBindings": [
+    {
+      "token": "workflow-icon-size-100",
+      "context": "Icon"
+    },
+    {
+      "token": "tree-view-minimum-height",
+      "context": "Height (minimum)"
+    },
+    {
+      "token": "tree-view-minimum-width",
+      "context": "Width (minimum)"
+    },
+    {
+      "token": "corner-radius-medium-default",
+      "context": "Rounding"
+    },
+    {
+      "token": "tree-view-disclosure-indicator-height",
+      "context": "Spacing (disclosure indicator)"
+    },
+    {
+      "token": "tree-view-disclosure-indicator-width",
+      "context": "Spacing (disclosure indicator)"
+    },
+    {
+      "token": "tree-view-edge-to-checkbox",
+      "context": "Spacing (edge to checkbox, checkbox)"
+    },
+    {
+      "token": "tree-view-edge-to-drag-handle",
+      "context": "Spacing (edge to drag handle, drag handle)"
+    },
+    {
+      "token": "tree-view-drag-handle-to-checkbox",
+      "context": "Spacing (drag handle to checkbox, drag handle + checkbox)"
+    },
+    {
+      "token": "text-to-visual-100",
+      "context": "Spacing (context area to label)"
+    },
+    {
+      "token": "component-edge-to-text-100",
+      "context": "Spacing (label to edge)"
+    },
+    {
+      "token": "tree-view-label-to-action-area",
+      "context": "Spacing (label to action area)"
+    },
+    {
+      "token": "tree-view-end-edge-to-action-area",
+      "context": "Spacing (edge to action area, action button 1 + action button 2)"
+    },
+    {
+      "token": "tree-view-level-increment",
+      "context": "Spacing (indentation)"
+    },
+    {
+      "token": "vertical-align-items",
+      "context": "Spacing (vertical)"
+    },
+    {
+      "token": "stack-item-minimum-padding-vertical",
+      "context": "Spacing (vertical)"
+    },
+    {
+      "token": "border-width-100",
+      "context": "Border width (selected, highlight)"
+    },
+    {
+      "token": "focus-indicator-thickness",
+      "context": "Focus "
+    },
+    {
+      "token": "focus-indicator-gap",
+      "context": "Focus (drag handle)"
+    },
+    {
+      "token": "component-height-200",
+      "context": "Height"
+    },
+    {
+      "token": "stack-item-minimum-vertical-padding",
+      "context": "Spacing (vertical)"
+    },
+    {
+      "token": "stack-item-item-to-item",
+      "context": "Spacing (vertically, between tree view items)"
+    },
+    {
+      "token": "tree-view-item-to-header",
+      "context": "Spacing (vertically, between tree view item and tree view header)"
+    },
+    {
+      "token": "tree-view-header-to-item",
+      "context": "Spacing (vertically, between tree view item and tree view header)"
+    },
+    {
+      "token": "stack-item-header-to-item",
+      "context": "Spacing (vertically, between tree view item and tree view header)"
+    },
+    {
+      "token": "stack-item-background-color-hover",
+      "context": "Background (not selected)"
+    },
+    {
+      "token": "stack-item-background-color-down",
+      "context": "Background (not selected)"
+    },
+    {
+      "token": "stack-item-background-color-key-focus",
+      "context": "Background (not selected)"
+    },
+    {
+      "token": "tree-view-selected-row-background-default",
+      "context": "Background (selected, checkbox)"
+    },
+    {
+      "token": "tree-view-selected-row-background-hover",
+      "context": "Background (selected, checkbox)"
+    },
+    {
+      "token": "stack-item-selected-background-color-default",
+      "context": "Background (selected, checkbox)"
+    },
+    {
+      "token": "stack-item-selected-background-color-hover",
+      "context": "Background (selected, checkbox)"
+    },
+    {
+      "token": "stack-item-selected-background-color-down",
+      "context": "Background (selected, checkbox)"
+    },
+    {
+      "token": "stack-item-selected-background-color-key-focus",
+      "context": "Background (selected, checkbox)"
+    },
+    {
+      "token": "tree-view-selected-row-background-color-emphasized",
+      "context": "Background (selected, emphasized)"
+    },
+    {
+      "token": "tree-view-selected-row-background-opacity-emphasized-hover",
+      "context": "Background (selected, emphasized)"
+    },
+    {
+      "token": "stack-item-selected-background-color-highlight",
+      "context": "Background (selected + highlight)"
+    },
+    {
+      "token": "stack-item-selected-background-opacity-highlight-hover",
+      "context": "Background (selected + highlight)"
+    },
+    {
+      "token": "accent-content-color-selected",
+      "context": "Border (selected + highlight)"
+    },
+    {
+      "token": "neutral-subdued-content-color-default",
+      "context": "Label and icon (non-selected)"
+    },
+    {
+      "token": "neutral-subdued-content-color-hover",
+      "context": "Label and icon (non-selected)"
+    },
+    {
+      "token": "neutral-subdued-content-color-down",
+      "context": "Label and icon (non-selected)"
+    },
+    {
+      "token": "neutral-subdued-content-color-key-focus",
+      "context": "Label and icon (non-selected)"
+    },
+    {
+      "token": "neutral-content-color-default",
+      "context": "Label and icon (selected, checkbox and highlight)"
+    },
+    {
+      "token": "neutral-content-color-hover",
+      "context": "Label and icon (selected, checkbox and highlight)"
+    },
+    {
+      "token": "neutral-content-color-down",
+      "context": "Label and icon (selected, checkbox and highlight)"
+    },
+    {
+      "token": "neutral-content-color-key-focus",
+      "context": "Label and icon (selected, checkbox and highlight)"
+    },
+    {
+      "token": "disabled-content-color",
+      "context": "Label and icon (disabled)"
+    },
+    {
+      "token": "focus-indicator-color",
+      "context": "Focus indicator"
+    },
+    {
+      "token": "title-content-color",
+      "context": "Label and icon"
+    },
+    {
+      "token": "default-font-family",
+      "context": "Text (tree view item)"
+    },
+    {
+      "token": "regular-font-weight",
+      "context": "Text (tree view item)"
+    },
+    {
+      "token": "default-font-style",
+      "context": "Text (tree view item)"
+    },
+    {
+      "token": "font-size-100",
+      "context": "Text (tree view item)"
+    },
+    {
+      "token": "line-height-100",
+      "context": "Text (tree view item)"
+    },
+    {
+      "token": "cjk-line-height-100",
+      "context": "Text (tree view item)"
+    },
+    {
+      "token": "bold-font-weight",
+      "context": "Text (tree view title)"
+    },
+    {
+      "token": "thumbnail-size-75",
+      "context": "Size"
+    },
+    {
+      "token": "thumbnail-size-300",
+      "context": "Size"
+    },
+    {
+      "token": "thumbnail-size-1000",
+      "context": "Size"
+    },
+    {
+      "token": "thumbnail-corner-radius",
+      "context": "Rounding (default)"
+    },
+    {
+      "token": "spacing-75",
+      "context": "Opacity checkerboard (layer)"
+    },
+    {
+      "token": "corner-radius-0",
+      "context": "Rounding (layer)"
+    },
+    {
+      "token": "thumbnail-border-color",
+      "context": "Border (default)"
+    },
+    {
+      "token": "thumbnail-border-opacity",
+      "context": "Border (default)"
+    },
+    {
+      "token": "gray-500",
+      "context": "Border (layer)"
+    },
+    {
+      "token": "opacity-checkerboard-square-light",
+      "context": "Checkerboard colors "
+    },
+    {
+      "token": "opacity-checkerboard-square-dark",
+      "context": "Checkerboard colors "
+    },
+    {
+      "token": "thumbnail-opacity-disabled",
+      "context": "Disabled"
+    }
+  ],
+  "accessibility": {
+    "role": "tree",
+    "intents": ["navigate", "select", "expand"],
+    "focusable": true,
+    "keyboardIntents": ["navigate-items", "expand", "collapse", "activate"],
+    "wcag": [
+      {
+        "criterion": "2.1.1",
+        "level": "A",
+        "title": "Keyboard"
+      },
+      {
+        "criterion": "4.1.2",
+        "level": "A",
+        "title": "Name, Role, Value"
+      }
+    ]
+  }
+}

package/fields/alignment.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "alignment",
+  "description": "Horizontal alignment of a text-align token. Corresponds to the CSS text-align axis.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/alignments.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 25
+  },
+  "scope": "typography",
+  "required": false,
+  "valueType": "string"
+}

package/fields/anatomy.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "anatomy",
+  "description": "Visible named part of a component (e.g. handle, icon, label, track). Refers to a specific sub-element, not a styling surface.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/anatomy-terms.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 4
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/color-scheme.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "colorScheme",
+  "description": "Theme / appearance mode set. Controls which color scheme a token applies to (e.g. light, dark, wireframe). Drives cascade resolution.",
+  "kind": "mode-set",
+  "registry": null,
+  "validation": "strict",
+  "serialization": {
+    "position": 13
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/colorFamily.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "colorFamily",
+  "description": "Hue family of a color token (e.g. blue, gray, celery, accent). Used on color palette and semantic color tokens. Paired with scaleIndex for ramp tokens (e.g. colorFamily=blue + scaleIndex=100 → blue-100).",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/color-families.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 17
+  },
+  "scope": "color",
+  "required": false,
+  "valueType": "string"
+}

package/fields/component.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "component",
+  "description": "Component scope — the UI component this token belongs to (e.g. button, checkbox, slider).",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/components.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 1
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/contrast.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "contrast",
+  "description": "Contrast level mode set (e.g. regular, high). Drives cascade resolution.",
+  "kind": "mode-set",
+  "registry": null,
+  "validation": "strict",
+  "serialization": {
+    "position": 15
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/density.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "density",
+  "description": "Space density within or around component parts (e.g. spacious, compact). Distinct from the `scale` mode set.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/densities.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 10
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/easing.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "easing",
+  "description": "Easing curve identifier for a motion token (e.g. ease-in, ease-out, standard). Registry is provisional until motion tokens are added to the foundation.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/easing-curves.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 22
+  },
+  "scope": "motion",
+  "required": false,
+  "valueType": "string"
+}

package/fields/family.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "family",
+  "description": "Type family of a typography token (e.g. sans-serif, serif, cjk, code). Used to distinguish tokens that apply to different script or display contexts.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/typography-families.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 18
+  },
+  "scope": "typography",
+  "required": false,
+  "valueType": "string"
+}

package/fields/motionRole.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "motionRole",
+  "description": "Semantic role of a motion token — the interaction pattern it governs (e.g. enter, exit, transition, emphasis). Registry is provisional until motion tokens are added to the foundation.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/motion-roles.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 21
+  },
+  "scope": "motion",
+  "required": false,
+  "valueType": "string"
+}

package/fields/object.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "object",
+  "description": "Styling surface being targeted (e.g. background, border, edge, visual). Refers to what is being styled, not the property value.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/token-objects.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 5
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/orientation.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "orientation",
+  "description": "Direction or layout axis (e.g. vertical, horizontal).",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/orientations.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 7
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/position.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "position",
+  "description": "Location relative to another object or edge (e.g. top, bottom, start, end, affixed).",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/positions.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 8
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/property.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "property",
+  "description": "The stylistic attribute being defined (e.g. color, width, padding, gap). The only required field on every name object.",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/property-terms.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 6
+  },
+  "scope": null,
+  "required": true,
+  "valueType": "string"
+}

package/fields/scale.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "scale",
+  "description": "Platform density scale mode set (e.g. desktop, mobile). Drives cascade resolution.",
+  "kind": "mode-set",
+  "registry": null,
+  "validation": "strict",
+  "serialization": {
+    "position": 14
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}

package/fields/scaleIndex.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "scaleIndex",
+  "description": "Numeric scale index appended at the end of the serialized name (e.g., 100, 200, 900). Used by foundational scale tokens for spacing, color palette, font sizes, border widths, corner radii, and drop-shadow values.",
+  "kind": "numeric",
+  "registry": null,
+  "validation": "none",
+  "serialization": {
+    "position": 99
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "integer"
+}

package/fields/shape.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/field.schema.json",
+  "specVersion": "1.0.0-draft",
+  "name": "shape",
+  "description": "Overall component shape qualifier (e.g. uniform, rounded).",
+  "kind": "semantic",
+  "registry": "packages/design-data/registry/shapes.json",
+  "validation": "advisory",
+  "serialization": {
+    "position": 11
+  },
+  "scope": null,
+  "required": false,
+  "valueType": "string"
+}