@adobe/design-data-spec 0.4.0 → 0.5.0

package/components/action-button.json

@@ -71,5 +71,411 @@
   ],
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "component-height-50",
+      "context": "Height"
+    },
+    {
+      "token": "component-height-75",
+      "context": "Height"
+    },
+    {
+      "token": "component-height-100",
+      "context": "Height"
+    },
+    {
+      "token": "component-height-200",
+      "context": "Height"
+    },
+    {
+      "token": "component-height-300",
+      "context": "Height"
+    },
+    {
+      "token": "component-size-difference-down",
+      "context": "Component size (down)"
+    },
+    {
+      "token": "component-size-width-ratio-down",
+      "context": "Component size (down)"
+    },
+    {
+      "token": "component-size-minimum-perspective-down",
+      "context": "Component size (down)"
+    },
+    {
+      "token": "corner-radius-medium-size-extra-small",
+      "context": "Rounding"
+    },
+    {
+      "token": "corner-radius-medium-size-small",
+      "context": "Rounding"
+    },
+    {
+      "token": "corner-radius-medium-size-medium",
+      "context": "Rounding"
+    },
+    {
+      "token": "corner-radius-medium-size-large",
+      "context": "Rounding"
+    },
+    {
+      "token": "corner-radius-medium-size-extra-large",
+      "context": "Rounding"
+    },
+    {
+      "token": "workflow-icon-size-50",
+      "context": "Icon"
+    },
+    {
+      "token": "workflow-icon-size-75",
+      "context": "Icon"
+    },
+    {
+      "token": "workflow-icon-size-100",
+      "context": "Icon"
+    },
+    {
+      "token": "workflow-icon-size-200",
+      "context": "Icon"
+    },
+    {
+      "token": "workflow-icon-size-300",
+      "context": "Icon"
+    },
+    {
+      "token": "text-to-visual-50",
+      "context": "Spacing (icon to label)"
+    },
+    {
+      "token": "text-to-visual-75",
+      "context": "Spacing (icon to label)"
+    },
+    {
+      "token": "text-to-visual-100",
+      "context": "Spacing (icon to label)"
+    },
+    {
+      "token": "text-to-visual-200",
+      "context": "Spacing (icon to label)"
+    },
+    {
+      "token": "text-to-visual-300",
+      "context": "Spacing (icon to label)"
+    },
+    {
+      "token": "component-edge-to-visual-50",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-visual-75",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-visual-100",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-visual-200",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-visual-300",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-text-50",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-text-75",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-text-100",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-text-200",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-text-300",
+      "context": "Spacing (start/end edges)"
+    },
+    {
+      "token": "component-edge-to-visual-only-50",
+      "context": "Spacing (start/end edges, icon only)"
+    },
+    {
+      "token": "component-edge-to-visual-only-75",
+      "context": "Spacing (start/end edges, icon only)"
+    },
+    {
+      "token": "component-edge-to-visual-only-100",
+      "context": "Spacing (start/end edges, icon only)"
+    },
+    {
+      "token": "component-edge-to-visual-only-200",
+      "context": "Spacing (start/end edges, icon only)"
+    },
+    {
+      "token": "component-edge-to-visual-only-300",
+      "context": "Spacing (start/end edges, icon only)"
+    },
+    {
+      "token": "component-top-to-workflow-icon-50",
+      "context": "Spacing (top edge to icon)"
+    },
+    {
+      "token": "component-top-to-workflow-icon-75",
+      "context": "Spacing (top edge to icon)"
+    },
+    {
+      "token": "component-top-to-workflow-icon-100",
+      "context": "Spacing (top edge to icon)"
+    },
+    {
+      "token": "component-top-to-workflow-icon-200",
+      "context": "Spacing (top edge to icon)"
+    },
+    {
+      "token": "component-top-to-workflow-icon-300",
+      "context": "Spacing (top edge to icon)"
+    },
+    {
+      "token": "component-top-to-text-50",
+      "context": "Spacing (top edge to label)"
+    },
+    {
+      "token": "component-top-to-text-75",
+      "context": "Spacing (top edge to label)"
+    },
+    {
+      "token": "component-top-to-text-100",
+      "context": "Spacing (top edge to label)"
+    },
+    {
+      "token": "component-top-to-text-200",
+      "context": "Spacing (top edge to label)"
+    },
+    {
+      "token": "component-top-to-text-300",
+      "context": "Spacing (top edge to label)"
+    },
+    {
+      "token": "focus-indicator-thickness",
+      "context": "Focus ring"
+    },
+    {
+      "token": "focus-indicator-gap",
+      "context": "Focus ring"
+    },
+    {
+      "token": "action-button-edge-to-hold-icon-extra-small",
+      "context": "Spacing (edge to hold icon)"
+    },
+    {
+      "token": "action-button-edge-to-hold-icon-small",
+      "context": "Spacing (edge to hold icon)"
+    },
+    {
+      "token": "action-button-edge-to-hold-icon-medium",
+      "context": "Spacing (edge to hold icon)"
+    },
+    {
+      "token": "action-button-edge-to-hold-icon-large",
+      "context": "Spacing (edge to hold icon)"
+    },
+    {
+      "token": "action-button-edge-to-hold-icon-extra-large",
+      "context": "Spacing (edge to hold icon)"
+    },
+    {
+      "token": "default-font-family",
+      "context": "Label"
+    },
+    {
+      "token": "medium-font-weight",
+      "context": "Label"
+    },
+    {
+      "token": "default-font-style",
+      "context": "Label"
+    },
+    {
+      "token": "font-size-50",
+      "context": "Label"
+    },
+    {
+      "token": "font-size-75",
+      "context": "Label"
+    },
+    {
+      "token": "font-size-100",
+      "context": "Label"
+    },
+    {
+      "token": "font-size-200",
+      "context": "Label"
+    },
+    {
+      "token": "font-size-300",
+      "context": "Label"
+    },
+    {
+      "token": "line-height-100",
+      "context": "Label"
+    },
+    {
+      "token": "cjk-line-height-100",
+      "context": "Label"
+    },
+    {
+      "token": "gray-100",
+      "context": "Background "
+    },
+    {
+      "token": "gray-200",
+      "context": "Background "
+    },
+    {
+      "token": "neutral-content-color-default",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "neutral-content-color-hover",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "neutral-content-color-down",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "neutral-content-color-key-focus",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "neutral-background-color-selected-default",
+      "context": "Background (selected, non emphasized)"
+    },
+    {
+      "token": "neutral-background-color-selected-hover",
+      "context": "Background (selected, non emphasized)"
+    },
+    {
+      "token": "neutral-background-color-selected-down",
+      "context": "Background (selected, non emphasized)"
+    },
+    {
+      "token": "neutral-background-color-selected-key-focus",
+      "context": "Background (selected, non emphasized)"
+    },
+    {
+      "token": "gray-25",
+      "context": "Label, icon, and hold icon (selected, non emphasized)"
+    },
+    {
+      "token": "accent-background-color-default",
+      "context": "Background (selected, emphasized)"
+    },
+    {
+      "token": "accent-background-color-hover",
+      "context": "Background (selected, emphasized)"
+    },
+    {
+      "token": "accent-background-color-down",
+      "context": "Background (selected, emphasized)"
+    },
+    {
+      "token": "accent-background-color-key-focus",
+      "context": "Background (selected, emphasized)"
+    },
+    {
+      "token": "white",
+      "context": "Label, icon, and hold icon (selected, emphasized)"
+    },
+    {
+      "token": "disabled-background-color",
+      "context": "Background (disabled)"
+    },
+    {
+      "token": "disabled-content-color",
+      "context": "Label, icon, and hold icon (disabled)"
+    },
+    {
+      "token": "focus-indicator-color",
+      "context": "Focus ring"
+    },
+    {
+      "token": "transparent-white-100",
+      "context": "Background "
+    },
+    {
+      "token": "transparent-white-200",
+      "context": "Background "
+    },
+    {
+      "token": "transparent-white-800",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "transparent-white-900",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "black",
+      "context": "Label, icon, and hold icon (selected, white)"
+    },
+    {
+      "token": "disabled-static-white-background-color",
+      "context": "Background (disabled, white)"
+    },
+    {
+      "token": "transparent-white-25",
+      "context": "Background (disabled, white)"
+    },
+    {
+      "token": "disabled-static-white-content-color",
+      "context": "Label, icon, and hold icon (disabled, white)"
+    },
+    {
+      "token": "static-white-focus-indicator-color",
+      "context": "Focus ring (white)"
+    },
+    {
+      "token": "transparent-black-100",
+      "context": "Background "
+    },
+    {
+      "token": "transparent-black-200",
+      "context": "Background "
+    },
+    {
+      "token": "transparent-black-800",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "transparent-black-900",
+      "context": "Label, icon, and hold icon"
+    },
+    {
+      "token": "disabled-static-black-background-color",
+      "context": "Background (disabled, black)"
+    },
+    {
+      "token": "transparent-black-25",
+      "context": "Background (disabled, black)"
+    },
+    {
+      "token": "disabled-static-black-content-color",
+      "context": "Label, icon, and hold icon (disabled, black)"
+    },
+    {
+      "token": "static-black-focus-indicator-color",
+      "context": "Focus ring (black)"
+    }
+  ]
 }

package/components/action-group.json

@@ -64,5 +64,19 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "spacing-75",
+      "context": "Spacing (horizontal, regular)"
+    },
+    {
+      "token": "spacing-100",
+      "context": "Spacing (horizontal, regular)"
+    },
+    {
+      "token": "spacing-50",
+      "context": "Spacing (horizontal, compact)"
+    }
+  ]
 }

package/components/alert-banner.json

@@ -29,5 +29,83 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "workflow-icon-size-100",
+      "context": "Icon asset"
+    },
+    {
+      "token": "alert-banner-minimum-height",
+      "context": "Height"
+    },
+    {
+      "token": "alert-banner-width",
+      "context": "Width"
+    },
+    {
+      "token": "text-to-visual-300",
+      "context": "Spacing (icon to text)"
+    },
+    {
+      "token": "spacing-300",
+      "context": "Spacing (start edge to text and icon)"
+    },
+    {
+      "token": "spacing-100",
+      "context": "Spacing (close button to end edge)"
+    },
+    {
+      "token": "spacing-200",
+      "context": "Spacing (close button to end edge)"
+    },
+    {
+      "token": "alert-banner-top-to-workflow-icon",
+      "context": "Spacing (top/bottom edge to icon)"
+    },
+    {
+      "token": "alert-banner-top-to-text",
+      "context": "Spacing (top/bottom edge to text)"
+    },
+    {
+      "token": "alert-banner-bottom-to-text",
+      "context": "Spacing (top/bottom edge to text)"
+    },
+    {
+      "token": "neutral-subdued-background-color-default",
+      "context": "Background"
+    },
+    {
+      "token": "informative-background-color-default",
+      "context": "Background"
+    },
+    {
+      "token": "negative-background-color-default",
+      "context": "Background"
+    },
+    {
+      "token": "default-font-family",
+      "context": "Text"
+    },
+    {
+      "token": "regular-font-weight",
+      "context": "Text"
+    },
+    {
+      "token": "default-font-style",
+      "context": "Text"
+    },
+    {
+      "token": "font-size-100",
+      "context": "Text"
+    },
+    {
+      "token": "line-height-100",
+      "context": "Text"
+    },
+    {
+      "token": "cjk-line-height-100",
+      "context": "Text"
+    }
+  ]
 }

package/components/alert-dialog.json

@@ -42,5 +42,111 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "heading-sans-serif-font-family",
+      "context": "Title"
+    },
+    {
+      "token": "heading-sans-serif-font-weight",
+      "context": "Title"
+    },
+    {
+      "token": "heading-sans-serif-font-style",
+      "context": "Title"
+    },
+    {
+      "token": "alert-dialog-title-font-size",
+      "context": "Title"
+    },
+    {
+      "token": "heading-line-height",
+      "context": "Title"
+    },
+    {
+      "token": "heading-color",
+      "context": "Title"
+    },
+    {
+      "token": "body-sans-serif-font-family",
+      "context": "Description"
+    },
+    {
+      "token": "body-sans-serif-font-weight",
+      "context": "Description"
+    },
+    {
+      "token": "body-sans-serif-font-style",
+      "context": "Description"
+    },
+    {
+      "token": "alert-dialog-body-font-size",
+      "context": "Description"
+    },
+    {
+      "token": "line-height-200",
+      "context": "Description"
+    },
+    {
+      "token": "body-color",
+      "context": "Description"
+    },
+    {
+      "token": "alert-dialog-maximum-width",
+      "context": "Maximum width"
+    },
+    {
+      "token": "alert-dialog-minimum-width",
+      "context": "Minimum width"
+    },
+    {
+      "token": "corner-radius-extra-large-default",
+      "context": "Rounding"
+    },
+    {
+      "token": "spacing-500",
+      "context": "Spacing (edge to content)"
+    },
+    {
+      "token": "spacing-400",
+      "context": "Spacing (edge to content)"
+    },
+    {
+      "token": "alert-dialog-top-to-alert-icon",
+      "context": "Icon asset (error and warning variants)"
+    },
+    {
+      "token": "spacing-300",
+      "context": "Spacing (title to description)"
+    },
+    {
+      "token": "workflow-icon-size-100",
+      "context": "Icon (error and warning variants)"
+    },
+    {
+      "token": "spacing-100",
+      "context": "Minimum spacing (title to icon)"
+    },
+    {
+      "token": "background-color-layer2",
+      "context": "Background"
+    },
+    {
+      "token": "overlay-color",
+      "context": "Overlay"
+    },
+    {
+      "token": "overlay-opacity",
+      "context": "Overlay"
+    },
+    {
+      "token": "notice-visual-color",
+      "context": "Icon (warning variant)"
+    },
+    {
+      "token": "negative-visual-color",
+      "context": "Icon (error variant)"
+    }
+  ]
 }