@adobe/spectrum-component-api-schemas 1.0.1 → 2.0.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @adobe/spectrum-component-api-schemas
 
+## 2.0.0
+
+### Major Changes
+
+- [#581](https://github.com/adobe/spectrum-tokens/pull/581) [`163fe7c`](https://github.com/adobe/spectrum-tokens/commit/163fe7c13bb00c639d202195a398126b6c25b58f) Thanks [@GarthDB](https://github.com/GarthDB)! - feat(component-schemas): add S2 Batch 2 components with breaking changes
+  - Add 6 new component schemas (coach-indicator, in-field-progress-button, etc.)
+  - Update avatar, badge, and checkbox components with breaking changes
+  - Expand size options and add new interaction states
+  - Major version bump required due to breaking schema changes
+
+## 1.0.2
+
+### Patch Changes
+
+- [#545](https://github.com/adobe/spectrum-tokens/pull/545) [`ebc79f6`](https://github.com/adobe/spectrum-tokens/commit/ebc79f6f91bce28a64cddfc2cc5548ddcf30389d) Thanks [@GarthDB](https://github.com/GarthDB)! - Fixed a typo where meter had `valueLable` instead of `valueLabel`.
+
 ## 1.0.1
 
 ### Patch Changes

package/moon.yml

@@ -8,7 +8,7 @@
 # OF ANY KIND, either express or implied. See the License for the specific language
 # governing permissions and limitations under the License.
 $schema: "https://moonrepo.dev/schemas/project.json"
-type: library
+layer: library
 fileGroups:
   schemas:
     - "schemas/**/*.{yaml,yml,json}"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adobe/spectrum-component-api-schemas",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "description": "",
   "type": "module",
   "main": "index.js",

package/schemas/components/avatar.json

@@ -11,21 +11,34 @@
   "properties": {
     "size": {
       "type": "number",
-      "enum": [50, 75, 100, 200, 300, 400, 500, 600, 700],
-      "default": 100
+      "enum": [
+        50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200,
+        1300, 1400, 1500
+      ],
+      "default": 500
     },
     "image": {
       "type": "string",
-      "enum": ["text", "image"],
-      "default": "image"
+      "enum": [
+        "user image",
+        "gradient image",
+        "gradient",
+        "guest image",
+        "initials"
+      ],
+      "default": "user image"
     },
     "isDisabled": {
       "type": "boolean",
       "default": false
     },
+    "showStroke": {
+      "type": "boolean",
+      "default": false
+    },
     "state": {
       "type": "string",
-      "enum": ["default", "hover", "down", "keyboard focus"],
+      "enum": ["default", "down", "keyboard focus"],
       "default": "default"
     }
   }

package/schemas/components/badge.json

@@ -28,9 +28,28 @@
         "magenta",
         "fuchsia",
         "purple",
-        "seafoam"
+        "seafoam",
+        "accent",
+        "notice",
+        "gray",
+        "red",
+        "orange",
+        "chartreuse",
+        "celery",
+        "green",
+        "cyan",
+        "blue",
+        "pink",
+        "turquoise",
+        "brown",
+        "cinnamon",
+        "silver"
       ]
     },
+    "style": {
+      "type": "string",
+      "enum": ["bold", "subtle", "outline"]
+    },
     "fixed": {
       "type": "string",
       "enum": ["none", "top", "right", "bottom", "left"],

package/schemas/components/checkbox.json

@@ -39,10 +39,7 @@
       "type": "boolean",
       "default": false
     },
-    "isReadOnly": {
-      "type": "boolean",
-      "default": false
-    },
+
     "state": {
       "type": "string",
       "enum": ["default", "hover", "down", "keyboard focus"],

package/schemas/components/coach-indicator.json

@@ -0,0 +1,34 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/component.json",
+  "$id": "https://opensource.adobe.com/spectrum-tokens/schemas/components/coach-indicator.json",
+  "title": "Coach indicator",
+  "description": "Coach indicators help guide users through interfaces by highlighting important areas or features during onboarding and feature discovery.",
+  "meta": {
+    "category": "feedback",
+    "documentationUrl": "https://spectrum.adobe.com/page/coach-indicator/"
+  },
+  "type": "object",
+  "properties": {
+    "cornerRounding": {
+      "type": "string",
+      "enum": [
+        "none",
+        "corner-radius-75",
+        "corner-radius-100",
+        "corner-radius-200",
+        "corner-radius-300",
+        "corner-radius-400",
+        "corner-radius-500",
+        "corner-radius-600",
+        "corner-radius-700",
+        "corner-radius-800",
+        "full"
+      ]
+    },
+    "staticColor": {
+      "type": "string",
+      "enum": ["white"],
+      "description": "If not set to white, the coach indicator uses the default color."
+    }
+  }
+}

package/schemas/components/in-field-progress-button.json

@@ -0,0 +1,31 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/component.json",
+  "$id": "https://opensource.adobe.com/spectrum-tokens/schemas/components/in-field-progress-button.json",
+  "title": "In field progress button",
+  "description": "In field progress buttons provide interactive controls within form fields for actions like clearing, adding, or disclosing additional content.",
+  "meta": {
+    "category": "actions",
+    "documentationUrl": "https://spectrum.adobe.com/page/in-field-progress-button/"
+  },
+  "type": "object",
+  "properties": {
+    "size": {
+      "type": "string",
+      "enum": ["s", "m", "l", "xl"],
+      "default": "m"
+    },
+    "state": {
+      "type": "string",
+      "enum": ["default", "hover", "down", "keyboard focus"],
+      "default": "default"
+    },
+    "style": {
+      "type": "string",
+      "enum": ["disclosure", "clear", "dash", "add"]
+    },
+    "isQuiet": {
+      "type": "boolean",
+      "default": false
+    }
+  }
+}

package/schemas/components/in-field-progress-circle.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/component.json",
+  "$id": "https://opensource.adobe.com/spectrum-tokens/schemas/components/in-field-progress-circle.json",
+  "title": "In field progress circle",
+  "description": "In field progress circles indicate progress for loading states within form fields and input areas.",
+  "meta": {
+    "category": "feedback",
+    "documentationUrl": "https://spectrum.adobe.com/page/in-field-progress-circle/"
+  },
+  "type": "object",
+  "properties": {
+    "size": {
+      "type": "string",
+      "enum": ["s", "m", "l", "xl"],
+      "default": "m"
+    },
+    "staticColor": {
+      "type": "string",
+      "enum": ["white", "black"]
+    }
+  }
+}

package/schemas/components/meter.json

@@ -17,7 +17,7 @@
     "label": {
       "type": "string"
     },
-    "valueLable": {
+    "valueLabel": {
       "type": "string"
     },
     "width": {

package/schemas/components/opacity-checkerboard.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/component.json",
+  "$id": "https://opensource.adobe.com/spectrum-tokens/schemas/components/opacity-checkerboard.json",
+  "title": "Opacity Checkerboard",
+  "description": "Opacity checkerboards provide a visual pattern background used in color swatches and UI elements to indicate transparency or when no color is selected.",
+  "meta": {
+    "category": "status",
+    "documentationUrl": "https://spectrum.adobe.com/page/opacity-checkerboard/"
+  },
+  "type": "object",
+  "properties": {
+    "verticalSize": {
+      "type": "number",
+      "enum": [16, 32, 64, 128, 256]
+    },
+    "horizontalSize": {
+      "type": "number",
+      "enum": [24, 40]
+    }
+  }
+}

package/schemas/components/radio-button.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/component.json",
+  "$id": "https://opensource.adobe.com/spectrum-tokens/schemas/components/radio-button.json",
+  "title": "Radio button",
+  "description": "Radio buttons allow users to select a single option from a list of mutually exclusive options.",
+  "meta": {
+    "category": "inputs",
+    "documentationUrl": "https://spectrum.adobe.com/page/radio-button/"
+  },
+  "type": "object",
+  "properties": {
+    "state": {
+      "type": "string",
+      "enum": ["default", "hover", "down", "keyboard focus"],
+      "default": "default"
+    },
+    "isSelected": {
+      "type": "boolean",
+      "default": false
+    },
+    "isEmphasized": {
+      "type": "boolean",
+      "default": false
+    },
+    "label": {
+      "type": "boolean",
+      "default": true
+    }
+  }
+}

package/schemas/components/thumbnail.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/component.json",
+  "$id": "https://opensource.adobe.com/spectrum-tokens/schemas/components/thumbnail.json",
+  "title": "Thumbnail",
+  "description": "Thumbnails are small representations of images or content used for previews and navigation in galleries, lists, and media collections.",
+  "meta": {
+    "category": "navigation",
+    "documentationUrl": "https://spectrum.adobe.com/page/thumbnail/"
+  },
+  "type": "object",
+  "properties": {
+    "size": {
+      "type": "number",
+      "enum": [50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000]
+    },
+    "state": {
+      "type": "string",
+      "enum": ["default", "disabled"],
+      "default": "default"
+    }
+  }
+}

package/test/performance.test.js

@@ -63,10 +63,10 @@ test("getSchemaFile should complete within reasonable time", async (t) => {
   const end = performance.now();
   const duration = end - start;
 
-  // Should complete within 50ms
+  // Should complete within 200ms (increased for CI environment stability)
   t.true(
-    duration < 50,
-    `getSchemaFile took ${duration.toFixed(2)}ms, expected < 100ms`,
+    duration < 200,
+    `getSchemaFile took ${duration.toFixed(2)}ms, expected < 200ms`,
   );
   t.truthy(schema);
 });