@adobe/spectrum-tokens 13.0.0-beta.41 → 13.0.0-beta.42

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @adobe/spectrum-tokens
 
+## 13.0.0-beta.42
+
+### Minor Changes
+
+- [#382](https://github.com/adobe/spectrum-tokens/pull/382) [`2af3850`](https://github.com/adobe/spectrum-tokens/commit/2af3850a554812fd9c1b3e6fd902a746c9ac42c7) Thanks [@nabuhasan](https://github.com/nabuhasan)! - Updated S2 swatch tokens and added swatch-group tokens in S2 Color and S2 Non-color data sets, respectively.
+
+  ## Design Motivation
+
+  Swatch and swatch group components are being formalized as Spectrum 2 components. These tokens define the design data needed for implementation. Changes include updated corner rounding, colors and spacing for spacious density.
+
+  For more information, [view Jira ticket](https://jira.corp.adobe.com/browse/SDS-13497).
+
+  ## Token Diff
+
+  _Tokens added (3):_
+
+  - `swatch-group-spacing-spacious`
+  - `swatch-group-border-opacity`
+  - `swatch-group-border-color`
+
+  _Tokens values updated (3):_
+
+  - `swatch-border-color`: `gray-900` -> `gray-1000`
+  - `swatch-border-opacity`: `0.51` -> `0.42`
+  - `swatch-disabled-icon-border-opacity`: `0.51` -> `0.42`
+
 ## 13.0.0-beta.41
 
 ### Minor Changes

package/dist/json/drover.json

@@ -608,8 +608,9 @@
       "static-white-text-color": "rgb(255, 255, 255)",
       "static-white-track-color": "rgba(255, 255, 255, 0.17)",
       "static-white-track-indicator-color": "rgba(255, 255, 255, 0.94)",
-      "swatch-border-color": "rgb(19, 19, 19)",
+      "swatch-border-color": "rgb(0, 0, 0)",
       "swatch-disabled-icon-border-color": "rgb(0, 0, 0)",
+      "swatch-group-border-color": "rgb(0, 0, 0)",
       "table-row-hover-color": "rgb(19, 19, 19)",
       "table-selected-row-background-color": "rgb(59, 99, 251)",
       "table-selected-row-background-color-non-emphasized": "rgb(41, 41, 41)",
@@ -1277,8 +1278,9 @@
       "static-white-text-color": "rgb(255, 255, 255)",
       "static-white-track-color": "rgba(255, 255, 255, 0.17)",
       "static-white-track-indicator-color": "rgba(255, 255, 255, 0.94)",
-      "swatch-border-color": "rgb(242, 242, 242)",
+      "swatch-border-color": "rgb(255, 255, 255)",
       "swatch-disabled-icon-border-color": "rgb(0, 0, 0)",
+      "swatch-group-border-color": "rgb(255, 255, 255)",
       "table-row-hover-color": "rgb(242, 242, 242)",
       "table-selected-row-background-color": "rgb(52, 91, 248)",
       "table-selected-row-background-color-non-emphasized": "rgb(219, 219, 219)",
@@ -2100,8 +2102,10 @@
     "status-light-top-to-dot-large": "14px",
     "status-light-top-to-dot-medium": "11px",
     "status-light-top-to-dot-small": "8px",
-    "swatch-border-opacity": "0.51",
-    "swatch-disabled-icon-border-opacity": "0.51",
+    "swatch-border-opacity": "0.42",
+    "swatch-disabled-icon-border-opacity": "0.42",
+    "swatch-group-border-opacity": "0.2",
+    "swatch-group-spacing-spacious": "6px",
     "swatch-size-extra-small": "16px",
     "swatch-size-large": "40px",
     "swatch-size-medium": "32px",

package/dist/json/variables.json

@@ -4933,25 +4933,25 @@
     "uuid": "a1cbc282-1376-48d1-b8bb-92f10aef7c6f"
   },
   "swatch-border-color": {
-    "ref": "{gray-900}",
+    "ref": "{gray-1000}",
     "sets": {
-      "light": {
-        "value": "rgb(19, 19, 19)",
-        "uuid": "59093f0d-98b7-4659-bea6-3248ad20e96c"
-      },
       "dark": {
-        "value": "rgb(242, 242, 242)",
-        "uuid": "90d25d68-afb1-4b2a-9dba-3fe22d44976f"
+        "value": "rgb(255, 255, 255)",
+        "uuid": "5ce8c477-ae6e-427a-ac5c-79d15c8056ab"
+      },
+      "light": {
+        "value": "rgb(0, 0, 0)",
+        "uuid": "457fbeb8-56cd-4f3c-9950-f5e01f83f07c"
       },
       "wireframe": {
-        "value": "rgb(72, 110, 194)",
-        "uuid": "93fb6cac-b190-4a5a-951f-f5dc4c0d5978"
+        "value": "rgb(8, 12, 22)",
+        "uuid": "e804baf9-ae2c-4574-96d9-10cd5253fe47"
       }
     },
     "uuid": "7da5157d-7f25-405b-8de0-f3669565fb48"
   },
   "swatch-border-opacity": {
-    "value": "0.51",
+    "value": "0.42",
     "uuid": "0e397a80-cf33-44ed-8b7d-1abaf4426bf5"
   },
   "swatch-disabled-icon-border-color": {
@@ -4960,7 +4960,7 @@
     "uuid": "c49cd7ae-7657-458b-871a-6b4f28bca535"
   },
   "swatch-disabled-icon-border-opacity": {
-    "value": "0.51",
+    "value": "0.42",
     "uuid": "cdbba3b6-cb51-4fec-88f0-273d4bb59a18"
   },
   "thumbnail-border-color": {
@@ -5757,6 +5757,24 @@
     },
     "uuid": "bfd387b8-0ce0-45ff-8d66-fc5de2f4900c"
   },
+  "swatch-group-border-color": {
+    "ref": "{gray-1000}",
+    "sets": {
+      "dark": {
+        "value": "rgb(255, 255, 255)",
+        "uuid": "5ce8c477-ae6e-427a-ac5c-79d15c8056ab"
+      },
+      "light": {
+        "value": "rgb(0, 0, 0)",
+        "uuid": "457fbeb8-56cd-4f3c-9950-f5e01f83f07c"
+      },
+      "wireframe": {
+        "value": "rgb(8, 12, 22)",
+        "uuid": "e804baf9-ae2c-4574-96d9-10cd5253fe47"
+      }
+    },
+    "uuid": "08b8d06a-5475-47bf-ad2e-9f52ee07345a"
+  },
   "white": {
     "value": "rgb(255, 255, 255)",
     "uuid": "9b799da8-2130-417e-b7ee-5e1154a89837"
@@ -21077,6 +21095,14 @@
     },
     "uuid": "66540ddb-ec74-487f-8e09-a37b436694b5"
   },
+  "swatch-group-spacing-spacious": {
+    "value": "6px",
+    "uuid": "b80ef303-eae7-498f-b172-73a098be0f0b"
+  },
+  "swatch-group-border-opacity": {
+    "value": "0.2",
+    "uuid": "19968846-dad0-42eb-b6a8-af65f3a910ff"
+  },
   "corner-radius-0": {
     "value": "0px",
     "uuid": "bb9d8350-b1fb-4496-9c22-6ec9647ff117"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adobe/spectrum-tokens",
-  "version": "13.0.0-beta.41",
+  "version": "13.0.0-beta.42",
   "description": "Design tokens for Spectrum, Adobe's design system",
   "type": "module",
   "main": "index.js",

package/src/color-component.json

@@ -2,13 +2,13 @@
   "swatch-border-color": {
     "component": "swatch",
     "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
-    "value": "{gray-900}",
+    "value": "{gray-1000}",
     "uuid": "7da5157d-7f25-405b-8de0-f3669565fb48"
   },
   "swatch-border-opacity": {
     "component": "swatch",
     "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/opacity.json",
-    "value": "0.51",
+    "value": "0.42",
     "uuid": "0e397a80-cf33-44ed-8b7d-1abaf4426bf5"
   },
   "swatch-disabled-icon-border-color": {
@@ -20,7 +20,7 @@
   "swatch-disabled-icon-border-opacity": {
     "component": "swatch",
     "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/opacity.json",
-    "value": "0.51",
+    "value": "0.42",
     "uuid": "cdbba3b6-cb51-4fec-88f0-273d4bb59a18"
   },
   "thumbnail-border-color": {
@@ -405,5 +405,11 @@
     "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
     "value": "{blue-800}",
     "uuid": "bfd387b8-0ce0-45ff-8d66-fc5de2f4900c"
+  },
+  "swatch-group-border-color": {
+    "component": "swatch-group",
+    "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
+    "value": "{gray-1000}",
+    "uuid": "08b8d06a-5475-47bf-ad2e-9f52ee07345a"
   }
 }

package/src/layout-component.json

@@ -8549,5 +8549,17 @@
     "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json",
     "value": "{font-size-100}",
     "uuid": "66540ddb-ec74-487f-8e09-a37b436694b5"
+  },
+  "swatch-group-spacing-spacious": {
+    "component": "swatch-group",
+    "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json",
+    "value": "6px",
+    "uuid": "b80ef303-eae7-498f-b172-73a098be0f0b"
+  },
+  "swatch-group-border-opacity": {
+    "component": "swatch-group",
+    "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/opacity.json",
+    "value": "0.2",
+    "uuid": "19968846-dad0-42eb-b6a8-af65f3a910ff"
   }
 }