@adobe/design-data-spec 0.3.0 → 0.5.0

package/components/standard-dialog.json

@@ -0,0 +1,151 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
+  "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/standard-dialog.json",
+  "specVersion": "1.0.0-draft",
+  "name": "standard-dialog",
+  "displayName": "Standard dialog",
+  "description": "Standard dialogs display important information that users need to acknowledge. They appear over the interface and block further interactions until an action is selected.",
+  "meta": {
+    "category": "feedback",
+    "documentationUrl": "https://spectrum.adobe.com/page/standard-dialog/"
+  },
+  "options": {
+    "title": {
+      "type": "string"
+    },
+    "description": {
+      "type": "string"
+    },
+    "hideImage": {
+      "type": "boolean",
+      "default": false,
+      "description": "Optional image to display in dialog."
+    },
+    "size": {
+      "type": "string",
+      "enum": ["s", "m", "l"],
+      "default": "m"
+    },
+    "hideCloseButton": {
+      "type": "boolean",
+      "default": false
+    },
+    "footerContent": {
+      "type": "string",
+      "description": "Optional footer content to display in the dialog footer like a checkbox."
+    },
+    "primaryActionLabel": {
+      "type": "string"
+    },
+    "secondaryActionLabel": {
+      "type": "string",
+      "description": "If undefined, this button does not appear."
+    },
+    "cancelActionLabel": {
+      "type": "string",
+      "default": "cancel",
+      "description": "If undefined, this button does not appear."
+    }
+  },
+  "lifecycle": {
+    "introduced": "1.0.0-draft"
+  },
+  "tokenBindings": [
+    {
+      "token": "standard-dialog-maximum-width-small",
+      "context": "Maximum width"
+    },
+    {
+      "token": "standard-dialog-maximum-width-medium",
+      "context": "Maximum width"
+    },
+    {
+      "token": "standard-dialog-maximum-width-large",
+      "context": "Maximum width"
+    },
+    {
+      "token": "standard-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": "spacing-300",
+      "context": "Spacing (title to description)"
+    },
+    {
+      "token": "spacing-200",
+      "context": "Spacing (edge to close button)"
+    },
+    {
+      "token": "background-color-layer2",
+      "context": "Background"
+    },
+    {
+      "token": "overlay-color",
+      "context": "Overlay"
+    },
+    {
+      "token": "overlay-opacity",
+      "context": "Overlay"
+    },
+    {
+      "token": "title-sans-serif-font-family",
+      "context": "Title"
+    },
+    {
+      "token": "title-sans-serif-font-weight",
+      "context": "Title"
+    },
+    {
+      "token": "title-sans-serif-font-style",
+      "context": "Title"
+    },
+    {
+      "token": "standard-dialog-title-font-size",
+      "context": "Title"
+    },
+    {
+      "token": "title-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": "standard-dialog-body-font-size",
+      "context": "Description"
+    },
+    {
+      "token": "line-height-200",
+      "context": "Description"
+    },
+    {
+      "token": "body-color",
+      "context": "Description"
+    }
+  ]
+}

package/components/standard-panel.json

@@ -0,0 +1,53 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
+  "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/standard-panel.json",
+  "specVersion": "1.0.0-draft",
+  "name": "standard-panel",
+  "displayName": "Standard Panel",
+  "description": "Standard Panels provide a flexible container for grouping related content and actions.",
+  "meta": {
+    "category": "containers",
+    "documentationUrl": "https://spectrum.adobe.com/page/standard-panel/"
+  },
+  "options": {
+    "container": {
+      "type": "string",
+      "enum": ["anchored", "floating", "dragged"],
+      "default": "anchored"
+    },
+    "label": {
+      "type": "string"
+    },
+    "description": {
+      "type": "string"
+    },
+    "value": {
+      "type": "string"
+    },
+    "density": {
+      "type": "string",
+      "enum": ["compact", "regular", "spacious"],
+      "default": "regular"
+    },
+    "style": {
+      "type": "string",
+      "enum": ["primary", "secondary"],
+      "default": "primary"
+    },
+    "hideGripper": {
+      "type": "boolean",
+      "default": false
+    },
+    "hideCloseButton": {
+      "type": "boolean",
+      "default": false
+    },
+    "hideDivider": {
+      "type": "boolean",
+      "default": false
+    }
+  },
+  "lifecycle": {
+    "introduced": "1.0.0-draft"
+  }
+}

package/components/status-light.json

@@ -0,0 +1,272 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/component.schema.json",
+  "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/components/status-light.json",
+  "specVersion": "1.0.0-draft",
+  "name": "status-light",
+  "displayName": "Status light",
+  "description": "Status lights describe the condition of an entity. They can be used to convey semantic meaning, such as statuses and categories.",
+  "meta": {
+    "category": "status",
+    "documentationUrl": "https://spectrum.adobe.com/page/status-light/"
+  },
+  "options": {
+    "label": {
+      "type": "string"
+    },
+    "variant": {
+      "type": "string",
+      "enum": [
+        "informative",
+        "neutral",
+        "positive",
+        "notice",
+        "negative",
+        "indigo",
+        "celery",
+        "chartreuse",
+        "yellow",
+        "magenta",
+        "fuchsia",
+        "purple",
+        "seafoam",
+        "pink",
+        "turquoise",
+        "cinnamon",
+        "brown",
+        "silver",
+        "gray",
+        "red",
+        "orange",
+        "green",
+        "cyan"
+      ],
+      "default": "informative"
+    },
+    "size": {
+      "type": "string",
+      "enum": ["s", "m", "l", "xl"],
+      "default": "m"
+    }
+  },
+  "lifecycle": {
+    "introduced": "1.0.0-draft"
+  },
+  "tokenBindings": [
+    {
+      "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": "status-light-dot-size-small",
+      "context": "Dot size"
+    },
+    {
+      "token": "status-light-dot-size-medium",
+      "context": "Dot size"
+    },
+    {
+      "token": "status-light-dot-size-large",
+      "context": "Dot size"
+    },
+    {
+      "token": "status-light-dot-extra-large",
+      "context": "Dot size"
+    },
+    {
+      "token": "status-light-text-to-visual-75",
+      "context": "Spacing (dot to label) "
+    },
+    {
+      "token": "status-light-text-to-visual-100",
+      "context": "Spacing (dot to label) "
+    },
+    {
+      "token": "status-light-text-to-visual-200",
+      "context": "Spacing (dot to label) "
+    },
+    {
+      "token": "status-light-text-to-visual-300",
+      "context": "Spacing (dot to label) "
+    },
+    {
+      "token": "status-light-top-to-dot-small",
+      "context": "Spacing (top edge to dot) "
+    },
+    {
+      "token": "status-light-top-to-dot-medium",
+      "context": "Spacing (top edge to dot) "
+    },
+    {
+      "token": "status-light-top-to-dot-large",
+      "context": "Spacing (top edge to dot) "
+    },
+    {
+      "token": "status-light-top-to-dot-extra-large",
+      "context": "Spacing (top edge to dot) "
+    },
+    {
+      "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": "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"
+    },
+    {
+      "token": "informative-visual-color",
+      "context": "Semantic (Dot) "
+    },
+    {
+      "token": "neutral-visual-color",
+      "context": "Semantic (Dot) "
+    },
+    {
+      "token": "positive-visual-color",
+      "context": "Semantic (Dot) "
+    },
+    {
+      "token": "notice-visual-color",
+      "context": "Semantic (Dot) "
+    },
+    {
+      "token": "negative-visual-color",
+      "context": "Semantic (Dot) "
+    },
+    {
+      "token": "celery-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "chartreuse-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "cyan-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "fuchsia-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "purple-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "magenta-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "indigo-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "seafoam-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "yellow-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "pink-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "turquoise-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "cinnamon-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "brown-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "silver-visual-color",
+      "context": "Non-semantic (Dot)  "
+    },
+    {
+      "token": "gray-600",
+      "context": "Label"
+    },
+    {
+      "token": "neutral-content-color-default",
+      "context": "Label"
+    }
+  ]
+}