@adobe/design-data-spec 0.4.0 → 0.6.0

package/components/date-picker.json

@@ -157,5 +157,283 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "component-to-calendar-popover",
+      "context": "Spacing (open)"
+    },
+    {
+      "token": "single-calendar-popover-minimum-width",
+      "context": "Width (minimum)"
+    },
+    {
+      "token": "double-calendar-popover-minimum-width",
+      "context": "Width (minimum)"
+    },
+    {
+      "token": "single-calendar-popover-minimum-height",
+      "context": "Height (minimum)"
+    },
+    {
+      "token": "double-calendar-popover-minimum-height",
+      "context": "Height (minimum)"
+    },
+    {
+      "token": "corner-radius-700",
+      "context": "Corner rounding"
+    },
+    {
+      "token": "spacing-300",
+      "context": "Spacing (start/end edge to days) "
+    },
+    {
+      "token": "spacing-400",
+      "context": "Spacing (top/bottom edge to days) "
+    },
+    {
+      "token": "spacing-700",
+      "context": "Spacing (month + year to chevron) "
+    },
+    {
+      "token": "spacing-100",
+      "context": "Spacing (between week labels) "
+    },
+    {
+      "token": "current-day-indicator-size-100",
+      "context": "Current day indicator"
+    },
+    {
+      "token": "spacing-200",
+      "context": "Spacing (between week labels and days) "
+    },
+    {
+      "token": "range-border-dash-length",
+      "context": "Range fill stroke padding"
+    },
+    {
+      "token": "range-border-dash-gap",
+      "context": "Range fill stroke padding"
+    },
+    {
+      "token": "range-border-dash-thickness",
+      "context": "Range fill stroke padding"
+    },
+    {
+      "token": "blue-900",
+      "context": "Day values "
+    },
+    {
+      "token": "white",
+      "context": "Day values "
+    },
+    {
+      "token": "blue-1000",
+      "context": "Day values "
+    },
+    {
+      "token": "focus-indicator-color",
+      "context": "Day values "
+    },
+    {
+      "token": "neutral-content-color-default",
+      "context": "Day values "
+    },
+    {
+      "token": "gray-100",
+      "context": "Day values "
+    },
+    {
+      "token": "disabled-content-color",
+      "context": "Day values "
+    },
+    {
+      "token": "negative-background-color-default",
+      "context": "Day values "
+    },
+    {
+      "token": "negative-background-color-hover",
+      "context": "Day values "
+    },
+    {
+      "token": "neutral-content-color-hover",
+      "context": "Current day"
+    },
+    {
+      "token": "strikethrough-day-thickness",
+      "context": "Strikethrough day "
+    },
+    {
+      "token": "strikethrough-day-orientation",
+      "context": "Strikethrough day "
+    },
+    {
+      "token": "blue-subtle-background-color-default",
+      "context": "Range fill color "
+    },
+    {
+      "token": "gray-25",
+      "context": "Background and border "
+    },
+    {
+      "token": "neutral-content-color-focus-hover",
+      "context": "In field button colors "
+    },
+    {
+      "token": "neutral-content-color-focus",
+      "context": "In field button colors "
+    },
+    {
+      "token": "neutral-content-color-key-focus",
+      "context": "In field button colors "
+    },
+    {
+      "token": "disabled-color-content",
+      "context": "In field button colors "
+    },
+    {
+      "token": "gray-200",
+      "context": "In field button colors "
+    },
+    {
+      "token": "background-disabled-color",
+      "context": "In field button colors "
+    },
+    {
+      "token": "disabled-background-color",
+      "context": "Disabled"
+    },
+    {
+      "token": "default-font-family",
+      "context": "Label, value, help text, and error message"
+    },
+    {
+      "token": "regular-font-weight",
+      "context": "Label, value, help text, and error message"
+    },
+    {
+      "token": "default-font-style",
+      "context": "Label, value, help text, and error message"
+    },
+    {
+      "token": "font-size-100",
+      "context": "Label, value, help text, and error message"
+    },
+    {
+      "token": "line-height-100",
+      "context": "Label, value, help text, and error message"
+    },
+    {
+      "token": "cjk-line-height-100",
+      "context": "Label, value, help text, and error message"
+    },
+    {
+      "token": "date-picker-minimum-width",
+      "context": "Width (minimum)"
+    },
+    {
+      "token": "component-height-100",
+      "context": "Height"
+    },
+    {
+      "token": "corner-radius-medium-size-medium",
+      "context": "Corner rounding "
+    },
+    {
+      "token": "component-edge-to-text-100",
+      "context": "Spacing (start edge to value) "
+    },
+    {
+      "token": "date-picker-text-to-in-field-button",
+      "context": "Spacing (value to in-field button)"
+    },
+    {
+      "token": "component-top-to-text-100",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-bottom-to-text-100",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "border-width-200",
+      "context": "Border "
+    },
+    {
+      "token": "focus-indicator-thickness",
+      "context": "Keyboard focus indicator "
+    },
+    {
+      "token": "focus-indicator-gap",
+      "context": "Keyboard focus indicator "
+    },
+    {
+      "token": "spacing-50",
+      "context": "Individual value spacing "
+    },
+    {
+      "token": "segmented-text-field-gap",
+      "context": "Spacing between values"
+    },
+    {
+      "token": "segmented-text-field-rounding",
+      "context": "Focused value rounding "
+    },
+    {
+      "token": "date-picker-visual-to-field-button",
+      "context": "Icon spacing (error)"
+    },
+    {
+      "token": "workflow-icon-size-100",
+      "context": "Alert icon size "
+    },
+    {
+      "token": "date-field-minimum-width",
+      "context": "Width (minimum)"
+    },
+    {
+      "token": "date-field-text-to-visual",
+      "context": "Spacing (value to alert icon)"
+    },
+    {
+      "token": "time-field-minimum-width",
+      "context": "Width (minimum)"
+    },
+    {
+      "token": "time-field-text-to-visual",
+      "context": "Spacing (value to alert icon)"
+    },
+    {
+      "token": "component-top-to-workflow-icon-100",
+      "context": "Spacing (top/bottom edge to alert icon)"
+    },
+    {
+      "token": "date-picker-text-to-visual",
+      "context": "Spacing (value to alert icon)"
+    },
+    {
+      "token": "negative-visual-color",
+      "context": "Alert icon (error) color"
+    },
+    {
+      "token": "negative-content-color-default",
+      "context": "Error message (error) color"
+    },
+    {
+      "token": "neutral-subdued-content-color-default",
+      "context": "Help text color "
+    },
+    {
+      "token": "triple-calendar-popover-minimum-width",
+      "context": "Popover minimum width"
+    },
+    {
+      "token": "triple-calendar-popover-minimum-height",
+      "context": "Popover minimum width"
+    },
+    {
+      "token": "spacing-500",
+      "context": "Popover minimum width"
+    }
+  ]
 }

package/components/divider.json

@@ -23,5 +23,51 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "divider-thickness-small",
+      "context": "Thickness"
+    },
+    {
+      "token": "divider-thickness-medium",
+      "context": "Thickness"
+    },
+    {
+      "token": "divider-thickness-large",
+      "context": "Thickness"
+    },
+    {
+      "token": "divider-horizontal-minimum-width",
+      "context": "Horizontal"
+    },
+    {
+      "token": "divider-vertical-minimum-height",
+      "context": "Horizontal"
+    },
+    {
+      "token": "gray-200",
+      "context": "Fill "
+    },
+    {
+      "token": "gray-800",
+      "context": "Fill "
+    },
+    {
+      "token": "transparent-white-200",
+      "context": "Fill (white)"
+    },
+    {
+      "token": "transparent-white-800",
+      "context": "Fill (white)"
+    },
+    {
+      "token": "transparent-black-200",
+      "context": "Fill (black)"
+    },
+    {
+      "token": "transparent-black-800",
+      "context": "Fill (black)"
+    }
+  ]
 }

package/components/drop-zone.json

@@ -41,5 +41,171 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "drop-zone-width",
+      "context": "Component width"
+    },
+    {
+      "token": "spacing-400",
+      "context": "Padding"
+    },
+    {
+      "token": "drop-zone-content-maximum-width",
+      "context": "Content width (maximum)"
+    },
+    {
+      "token": "border-width-200",
+      "context": "Border width and corner radius"
+    },
+    {
+      "token": "corner-radius-700",
+      "context": "Border width and corner radius"
+    },
+    {
+      "token": "drop-zone-border-dash-length",
+      "context": "Border width and corner radius"
+    },
+    {
+      "token": "drop-zone-border-dash-gap",
+      "context": "Border width and corner radius"
+    },
+    {
+      "token": "spacing-200",
+      "context": "Spacing (illustration to title area) "
+    },
+    {
+      "token": "spacing-75",
+      "context": "Spacing (title area to body area) "
+    },
+    {
+      "token": "spacing-300",
+      "context": "Spacing (body area to action) "
+    },
+    {
+      "token": "component-height-300",
+      "context": "Text area (filled, hover)"
+    },
+    {
+      "token": "component-edge-to-text-300",
+      "context": "Text area (filled, hover)"
+    },
+    {
+      "token": "component-top",
+      "context": "Text area (filled, hover)"
+    },
+    {
+      "token": "text-300",
+      "context": "Text area (filled, hover)"
+    },
+    {
+      "token": "component-bottom-to-text-300",
+      "context": "Text area (filled, hover)"
+    },
+    {
+      "token": "title-sans-serif-font-family",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "title-sans-serif-font-weight",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "title-sans-serif-font-style",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "drop-zone-title-font-size",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "drop-zone-cjk-title-font-size",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "title-line-height",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "body-sans-serif-font-family",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "body-sans-serif-font-weight",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "body-sans-serif-font-style",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "drop-zone-body-font-size",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "body-line-height",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "sans-serif-font-family",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "bold-font-weight",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "default-font-size",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "font-size-300",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "line-height-100",
+      "context": "Title area and body area"
+    },
+    {
+      "token": "grey-300",
+      "context": "Border color"
+    },
+    {
+      "token": "neutral-content-color-default",
+      "context": "Illustration color"
+    },
+    {
+      "token": "accent-content-color",
+      "context": "Illustration color"
+    },
+    {
+      "token": "heading-color",
+      "context": "Title and body color"
+    },
+    {
+      "token": "body-color",
+      "context": "Title and body color"
+    },
+    {
+      "token": "accent-visual-color",
+      "context": "Border and background color (empty, hover)"
+    },
+    {
+      "token": "drop-zone-background-color",
+      "context": "Border and background color (empty, hover)"
+    },
+    {
+      "token": "drop-zone-background-color-opacity",
+      "context": "Border and background color (empty, hover)"
+    },
+    {
+      "token": "drop-zone-background-color-opacity-indicatored",
+      "context": "Border, background, and text area color (filled, hover)"
+    },
+    {
+      "token": "white",
+      "context": "Border, background, and text area color (filled, hover)"
+    }
+  ]
 }

package/components/field-label.json

@@ -39,5 +39,151 @@
   },
   "lifecycle": {
     "introduced": "1.0.0-draft"
-  }
+  },
+  "tokenBindings": [
+    {
+      "token": "component-height-75",
+      "context": "Minimum height"
+    },
+    {
+      "token": "component-height-100",
+      "context": "Minimum height"
+    },
+    {
+      "token": "component-height-200",
+      "context": "Minimum height"
+    },
+    {
+      "token": "component-height-300",
+      "context": "Minimum height"
+    },
+    {
+      "token": "field-label-text-to-asterisk-small",
+      "context": "Spacing (label to asterisk icon)"
+    },
+    {
+      "token": "field-label-text-to-asterisk-medium",
+      "context": "Spacing (label to asterisk icon)"
+    },
+    {
+      "token": "field-label-text-to-asterisk-large",
+      "context": "Spacing (label to asterisk icon)"
+    },
+    {
+      "token": "field-label-text-to-asterisk-extra-large",
+      "context": "Spacing (label to asterisk icon)"
+    },
+    {
+      "token": "field-label-top-to-asterisk-small",
+      "context": "Spacing (top edge to asterisk icon)"
+    },
+    {
+      "token": "field-label-top-to-asterisk-medium",
+      "context": "Spacing (top edge to asterisk icon)"
+    },
+    {
+      "token": "field-label-top-to-asterisk-large",
+      "context": "Spacing (top edge to asterisk icon)"
+    },
+    {
+      "token": "field-label-top-to-asterisk-extra-large",
+      "context": "Spacing (top edge to asterisk icon)"
+    },
+    {
+      "token": "component-top-to-text-75",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-top-to-text-100",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-top-to-text-200",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-top-to-text-300",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-bottom-to-text-75",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-bottom-to-text-100",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-bottom-to-text-200",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "component-bottom-to-text-300",
+      "context": "Spacing (top/bottom edge to label)"
+    },
+    {
+      "token": "asterisk-icon-size-100",
+      "context": "Asterisk UI icon asset"
+    },
+    {
+      "token": "asterisk-icon-size-200",
+      "context": "Asterisk UI icon asset"
+    },
+    {
+      "token": "asterisk-icon-size-300",
+      "context": "Asterisk UI icon asset"
+    },
+    {
+      "token": "neutral-subdued-content-color-default",
+      "context": "Label and asterisk icon"
+    },
+    {
+      "token": "disabled-content-color",
+      "context": "Label and asterisk icon (disabled)"
+    },
+    {
+      "token": "white",
+      "context": "Label and asterisk icon (white)"
+    },
+    {
+      "token": "black",
+      "context": "Label and asterisk icon (black)"
+    },
+    {
+      "token": "default-font-family",
+      "context": "Label"
+    },
+    {
+      "token": "regular-font-weight",
+      "context": "Label"
+    },
+    {
+      "token": "default-font-style",
+      "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"
+    }
+  ]
 }