@coinbase/cds-web 9.2.0 → 9.2.2

package/CHANGELOG.md

@@ -8,6 +8,18 @@ All notable changes to this project will be documented in this file.
 
 <!-- template-start -->
 
+## 9.2.2 (6/10/2026 PST)
+
+#### 🐞 Fixes
+
+- Fix: custom Switch sizes now center in the background track correctly. [[#750](https://github.com/coinbase/cds/pull/750)]
+
+## 9.2.1 (6/9/2026 PST)
+
+#### 🐞 Fixes
+
+- Fix: add tabbed-chips to exports in web/mobile packages.
+
 ## 9.2.0 (5/28/2026 PST)
 
 #### 🚀 Updates

package/dts/alpha/index.d.ts

@@ -2,4 +2,5 @@ export * from './combobox';
 export * from './data-card';
 export * from './select';
 export * from './select-chip';
+export * from './tabbed-chips';
 //# sourceMappingURL=index.d.ts.map

package/dts/alpha/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/alpha/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/alpha/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC"}

package/dts/alpha/tabbed-chips/index.d.ts

@@ -0,0 +1,2 @@
+export * from './TabbedChips';
+//# sourceMappingURL=index.d.ts.map

package/dts/alpha/tabbed-chips/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/alpha/tabbed-chips/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/dts/controls/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/controls/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAUjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE3D;;;GAGG;AACH,eAAO,MAAM,gBAAgB;IAC3B,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;CAErB,CAAC;AA2BX,MAAM,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,CAAC,GAAG;IACvD;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,eAAe,GACvC,mBAAmB,CAAC,OAAO,gBAAgB,CAAC,GAAG;IAC7C;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AA6FJ,eAAO,MAAM,MAAM;;;;;;;;;;;IA9GjB;;OAEG;mBACY,SAAS,CAAC,KAAK;;IAvC9B,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;;IAsC3B;;;;;;;OAOG;eACQ,KAAK,CAAC,SAAS;0CA8FW,CAAC"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/controls/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAUjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE3D;;;GAGG;AACH,eAAO,MAAM,gBAAgB;IAC3B,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;CAErB,CAAC;AA6BX,MAAM,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,CAAC,GAAG;IACvD;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,eAAe,GACvC,mBAAmB,CAAC,OAAO,gBAAgB,CAAC,GAAG;IAC7C;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AA+FJ,eAAO,MAAM,MAAM;;;;;;;;;;;IAhHjB;;OAEG;mBACY,SAAS,CAAC,KAAK;;IAzC9B,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;;IAwC3B;;;;;;;OAOG;eACQ,KAAK,CAAC,SAAS;0CAgGW,CAAC"}

package/esm/alpha/index.js

@@ -1,4 +1,5 @@
 export * from './combobox';
 export * from './data-card';
 export * from './select';
-export * from './select-chip';
+export * from './select-chip';
+export * from './tabbed-chips';

package/esm/alpha/tabbed-chips/index.js

@@ -0,0 +1 @@
+export * from './TabbedChips';

package/esm/controls/Switch.css

@@ -1,2 +1,2 @@
 @layer cds{.trackCss-t1fng8qd{width:var(--controlSize-switchWidth);height:var(--controlSize-switchHeight);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;padding:1px;-webkit-transition: border-color, background-color 0.2s linear;transition: border-color, background-color 0.2s linear;}.trackCss-t1fng8qd[data-filled='true']{-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;}
-.thumbCss-t1l9xlcf{width:var(--controlSize-switchThumbSize);height:var(--controlSize-switchThumbSize);border:0.5px solid var(--color-bgLine);position:absolute;top:1px;left:1px;}}
+.thumbCss-t1l9xlcf{width:var(--controlSize-switchThumbSize);height:var(--controlSize-switchThumbSize);border:0.5px solid var(--color-bgLine);position:absolute;top:calc((var(--controlSize-switchHeight) - var(--controlSize-switchThumbSize)) / 2);left:calc((var(--controlSize-switchHeight) - var(--controlSize-switchThumbSize)) / 2);}}

package/esm/controls/Switch.js

@@ -36,7 +36,9 @@ const thumbCss = "thumbCss-t1l9xlcf";
 const MotionBox = motion(Box);
 const thumbMotionVariants = {
   checked: {
-    x: "calc(var(--controlSize-switchWidth) - var(--controlSize-switchThumbSize) - 2px)"
+    // Travel = trackWidth - 2*inset - thumbSize, which simplifies to
+    // trackWidth - trackHeight when the thumb is centered with equal insets.
+    x: "calc(var(--controlSize-switchWidth) - var(--controlSize-switchHeight))"
   },
   unchecked: {
     x: 0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-web",
-  "version": "9.2.0",
+  "version": "9.2.2",
   "description": "Coinbase Design System - Web",
   "repository": {
     "type": "git",
@@ -44,6 +44,10 @@
       "types": "./dts/alpha/select-chip/index.d.ts",
       "default": "./esm/alpha/select-chip/index.js"
     },
+    "./alpha/tabbed-chips": {
+      "types": "./dts/alpha/tabbed-chips/index.d.ts",
+      "default": "./esm/alpha/tabbed-chips/index.js"
+    },
     "./animation": {
       "types": "./dts/animation/index.d.ts",
       "default": "./esm/animation/index.js"
@@ -215,9 +219,9 @@
     "react-dom": "^18.0.0 || ~19.1.2"
   },
   "dependencies": {
-    "@coinbase/cds-common": "^9.2.0",
-    "@coinbase/cds-icons": "^5.18.0",
-    "@coinbase/cds-illustrations": "^4.40.1",
+    "@coinbase/cds-common": "^9.2.2",
+    "@coinbase/cds-icons": "^5.19.0",
+    "@coinbase/cds-illustrations": "^4.41.0",
     "@coinbase/cds-lottie-files": "^3.3.4",
     "@coinbase/cds-utils": "^2.3.5",
     "@floating-ui/react-dom": "^2.1.1",