@coinbase/cds-mobile 9.16.0 → 9.17.1

package/CHANGELOG.md

@@ -8,6 +8,18 @@ All notable changes to this project will be documented in this file.
 
 <!-- template-start -->
 
+## 9.17.1 (8/17/2026 PST)
+
+#### 🐞 Fixes
+
+- Fix: restore Select field press target after chrome padding adjustments in tshirt size work.
+
+## 9.17.0 (8/14/2026 PST)
+
+#### 🚀 Updates
+
+- Feat: support charts gradients for bars. [[#844](https://github.com/coinbase/cds/pull/844)]
+
 ## 9.16.0 (8/13/2026 PST)
 
 #### 🚀 Updates

package/dts/alpha/select/DefaultSelectControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultSelectControl.d.ts","sourceRoot":"","sources":["../../../src/alpha/select/DefaultSelectControl.tsx"],"names":[],"mappings":"AACA,OAAO,EAA6B,gBAAgB,EAAkB,MAAM,cAAc,CAAC;AAe3F,OAAO,KAAK,EAAE,kBAAkB,EAA4B,UAAU,EAAE,MAAM,UAAU,CAAC;AAuBzF,KAAK,6BAA6B,GAAG,CACnC,IAAI,SAAS,UAAU,EACvB,iBAAiB,SAAS,MAAM,GAAG,MAAM,EAEzC,KAAK,EAAE,kBAAkB,CAAC,IAAI,EAAE,iBAAiB,CAAC,GAAG;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC;CAC9D,KACE,KAAK,CAAC,YAAY,CAAC;AAExB,eAAO,MAAM,6BAA6B,wCACvC,IAAI,SAAS,UAAU,EAAE,iBAAiB,SAAS,MAAM,4fAuCvD,kBAAkB,CAAC,IAAI,EAAE,iBAAiB,CAAC,GAAG;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC;CAC9D,8CAsbF,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAoC,6BAA6B,CAAC"}
+{"version":3,"file":"DefaultSelectControl.d.ts","sourceRoot":"","sources":["../../../src/alpha/select/DefaultSelectControl.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,gBAAgB,EAAkB,MAAM,cAAc,CAAC;AAehF,OAAO,KAAK,EAAE,kBAAkB,EAA4B,UAAU,EAAE,MAAM,UAAU,CAAC;AAuBzF,KAAK,6BAA6B,GAAG,CACnC,IAAI,SAAS,UAAU,EACvB,iBAAiB,SAAS,MAAM,GAAG,MAAM,EAEzC,KAAK,EAAE,kBAAkB,CAAC,IAAI,EAAE,iBAAiB,CAAC,GAAG;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC;CAC9D,KACE,KAAK,CAAC,YAAY,CAAC;AAExB,eAAO,MAAM,6BAA6B,wCACvC,IAAI,SAAS,UAAU,EAAE,iBAAiB,SAAS,MAAM,4fAuCvD,kBAAkB,CAAC,IAAI,EAAE,iBAAiB,CAAC,GAAG;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC;CAC9D,8CAwbF,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAoC,6BAA6B,CAAC"}

package/dts/controls/InputStack.d.ts

@@ -76,6 +76,12 @@ export type InputStackBaseProps = SharedProps & {
    * @default 'bg'
    */
   inputBackground?: ThemeVars.Color;
+  /**
+   * Press handler for the bordered field chrome only (not the label or helper).
+   * Use for trigger-style controls so padding on the field remains tappable.
+   * Do not use for text fields — the native input must stay the focus target.
+   */
+  onFieldPress?: () => void;
 };
 export type InputStackProps = Omit<BoxProps, 'width' | 'height' | 'borderRadius'> &
   InputStackBaseProps & {

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

@@ -1 +1 @@
-{"version":3,"file":"InputStack.d.ts","sourceRoot":"","sources":["../../src/controls/InputStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAoB,MAAM,cAAc,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAGjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2CAA2C,CAAC;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAK1E,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAK5D,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG;IAC9C;;;;;OAKG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;SAGK;IACL,KAAK,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC1B;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;IAChC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IAC3C,yEAAyE;IACzE,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,uHAAuH;IACvH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,sEAAsE;IACtE,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,mHAAmH;IACnH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iCAAiC;IACjC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iGAAiG;IACjG,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,qDAAqD;IACrD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,wEAAwE;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oCAAoC;IACpC,WAAW,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IAC/D,oDAAoD;IACpD,kBAAkB,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IACtE;;;OAGG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACpC;;;OAGG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,QAAQ,GAAG,cAAc,CAAC,GAC/E,mBAAmB,GAAG;IACpB,MAAM,CAAC,EAAE;QACP,6BAA6B;QAC7B,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,yCAAyC;QACzC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACtC,yBAAyB;QACzB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KAC9B,CAAC;CACH,CAAC;AAWJ,eAAO,MAAM,UAAU,6CAqLrB,CAAC"}
+{"version":3,"file":"InputStack.d.ts","sourceRoot":"","sources":["../../src/controls/InputStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAoB,MAAM,cAAc,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAGjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2CAA2C,CAAC;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAK1E,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAM5D,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG;IAC9C;;;;;OAKG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;SAGK;IACL,KAAK,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC1B;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;IAChC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IAC3C,yEAAyE;IACzE,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,uHAAuH;IACvH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,sEAAsE;IACtE,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,mHAAmH;IACnH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iCAAiC;IACjC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iGAAiG;IACjG,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,qDAAqD;IACrD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,wEAAwE;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oCAAoC;IACpC,WAAW,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IAC/D,oDAAoD;IACpD,kBAAkB,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IACtE;;;OAGG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACpC;;;OAGG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAClC;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,QAAQ,GAAG,cAAc,CAAC,GAC/E,mBAAmB,GAAG;IACpB,MAAM,CAAC,EAAE;QACP,6BAA6B;QAC7B,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,yCAAyC;QACzC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACtC,yBAAyB;QACzB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KAC9B,CAAC;CACH,CAAC;AAWJ,eAAO,MAAM,UAAU,6CAyMrB,CAAC"}

package/dts/visualizations/chart/scrubber/ScrubberProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScrubberProvider.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/ScrubberProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAOpD,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI9E,MAAM,MAAM,qBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,iBAAiB,CAAC,CAAC,GAAG;IAC3F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAChE,CAAC;AAwKF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAM5D,CAAC"}
+{"version":3,"file":"ScrubberProvider.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/ScrubberProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAOpD,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI9E,MAAM,MAAM,qBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,iBAAiB,CAAC,CAAC,GAAG;IAC3F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAChE,CAAC;AA4KF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAM5D,CAAC"}

package/dts/visualizations/chart/utils/bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bar.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/utils/bar.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"bar.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/utils/bar.ts"],"names":[],"mappings":"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"}

package/dts/visualizations/chart/utils/gradient.d.ts

@@ -97,6 +97,15 @@ export declare const evaluateGradientAtValue: (
   dataValue: number,
   scale: SerializableScale | ChartScaleFunction,
 ) => string | undefined;
+/**
+ * Evaluates the opacity at a specific data value based on gradient stops.
+ * Returns undefined when no stops define opacity.
+ */
+export declare const evaluateGradientOpacityAtValue: (
+  stops: GradientStop[],
+  dataValue: number,
+  scale: SerializableScale | ChartScaleFunction,
+) => number | undefined;
 /**
  * Determines the baseline value for the gradient area by finding the value
  * within the axis bounds that is closest to the target baseline.

package/dts/visualizations/chart/utils/gradient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gradient.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/utils/gradient.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,EAEL,KAAK,kBAAkB,EAGvB,KAAK,iBAAiB,EACvB,MAAM,SAAS,CAAC;AAEjB;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;OAGG;IACH,KAAK,EAAE,YAAY,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,YAAY,EAAE,CAAC,CAAC;CAClE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,GAC1B,UAAU,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,EAC1C,QAAQ,oBAAoB,KAC3B,GAAG,GAAG,GAER,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAC3B,OAAO,YAAY,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,YAAY,EAAE,CAAC,EAChE,QAAQ,UAAU,KACjB,YAAY,EAKd,CAAC;AAiEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,QAAQ,MAAM,EAAE,SAAS,MAAM,KAAG,MAGrE,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,iBAAiB,GAC5B,UAAU,kBAAkB,EAC5B,QAAQ,kBAAkB,EAC1B,QAAQ,kBAAkB,EAC1B,QAAQ,oBAAoB,KAC3B,YAAY,EAAE,GAAG,SAsBnB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,uBAAuB,GAClC,OAAO,YAAY,EAAE,EACrB,WAAW,MAAM,EACjB,OAAO,iBAAiB,GAAG,kBAAkB,KAC5C,MAAM,GAAG,SAyFX,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GAAI,YAAY,UAAU,EAAE,WAAU,MAAU,KAAG,MAc1E,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,cAAc,GACzB,YAAY,UAAU,EACtB,eAAe,MAAM,EACrB,MAAM,MAAM,EACZ,aAAa,MAAM,EACnB,iBAAiB,MAAM,EACvB,OAAM,GAAG,GAAG,GAAS,KACpB,kBA0BF,CAAC"}
+{"version":3,"file":"gradient.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/utils/gradient.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,EAEL,KAAK,kBAAkB,EAGvB,KAAK,iBAAiB,EACvB,MAAM,SAAS,CAAC;AAEjB;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;OAGG;IACH,KAAK,EAAE,YAAY,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,YAAY,EAAE,CAAC,CAAC;CAClE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,GAC1B,UAAU,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,EAC1C,QAAQ,oBAAoB,KAC3B,GAAG,GAAG,GAER,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAC3B,OAAO,YAAY,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,YAAY,EAAE,CAAC,EAChE,QAAQ,UAAU,KACjB,YAAY,EAKd,CAAC;AAiEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,QAAQ,MAAM,EAAE,SAAS,MAAM,KAAG,MAGrE,CAAC;AAiGF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,iBAAiB,GAC5B,UAAU,kBAAkB,EAC5B,QAAQ,kBAAkB,EAC1B,QAAQ,kBAAkB,EAC1B,QAAQ,oBAAoB,KAC3B,YAAY,EAAE,GAAG,SAsBnB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,uBAAuB,GAClC,OAAO,YAAY,EAAE,EACrB,WAAW,MAAM,EACjB,OAAO,iBAAiB,GAAG,kBAAkB,KAC5C,MAAM,GAAG,SAUX,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,8BAA8B,GACzC,OAAO,YAAY,EAAE,EACrB,WAAW,MAAM,EACjB,OAAO,iBAAiB,GAAG,kBAAkB,KAC5C,MAAM,GAAG,SAgBX,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GAAI,YAAY,UAAU,EAAE,WAAU,MAAU,KAAG,MAc1E,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,cAAc,GACzB,YAAY,UAAU,EACtB,eAAe,MAAM,EACrB,MAAM,MAAM,EACZ,aAAa,MAAM,EACnB,iBAAiB,MAAM,EACvB,OAAM,GAAG,GAAG,GAAS,KACpB,kBA0BF,CAAC"}

package/esm/alpha/select/DefaultSelectControl.js

@@ -2,7 +2,7 @@ const _excluded = ["ref", "type", "options", "value", "onChange", "open", "place
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 import { memo, useCallback, useMemo } from 'react';
-import { Pressable, TouchableOpacity } from 'react-native';
+import { TouchableOpacity } from 'react-native';
 import { useInputVariant } from '@coinbase/cds-common/hooks/useInputVariant';
 import { InputChip } from '../../chips/InputChip';
 import { HelperText } from '../../controls/HelperText';
@@ -266,6 +266,7 @@ export const DefaultSelectControlComponent = /*#__PURE__*/memo(_ref => {
     disabled: disabled,
     onBlur: onBlur != null ? onBlur : undefined,
     onFocus: onFocus != null ? onFocus : undefined,
+    activeOpacity: 1,
     onPress: handleToggleOpen,
     style: [{
       flexGrow: 1
@@ -315,21 +316,17 @@ export const DefaultSelectControlComponent = /*#__PURE__*/memo(_ref => {
       })
     })
   }), [ref, accessibilityHint, computedControlAccessibilityLabel, disabled, onBlur, onFocus, styles == null ? void 0 : styles.controlInputNode, styles == null ? void 0 : styles.controlStartNode, styles == null ? void 0 : styles.controlValueNode, startNode, insideHorizontalLabel, insideVerticalLabel, inlineLabelNode, valueAlignment, valueNode, contentNode, handleToggleOpen]);
-  const endNode = useMemo(() => /*#__PURE__*/_jsx(Pressable, {
-    accessible: customEndNode ? true : false,
-    disabled: disabled,
-    onPress: handleToggleOpen,
-    children: /*#__PURE__*/_jsx(HStack, {
-      alignItems: "center",
-      flexGrow: 1,
-      paddingStart: 2,
-      style: styles == null ? void 0 : styles.controlEndNode,
-      children: customEndNode ? customEndNode : /*#__PURE__*/_jsx(AnimatedCaret, {
-        color: "fg",
-        rotate: open ? 0 : 180
-      })
+  const endNode = useMemo(() => /*#__PURE__*/_jsx(HStack, {
+    alignItems: "center",
+    alignSelf: "stretch",
+    flexShrink: 0,
+    paddingStart: 2,
+    style: styles == null ? void 0 : styles.controlEndNode,
+    children: customEndNode ? customEndNode : /*#__PURE__*/_jsx(AnimatedCaret, {
+      color: "fg",
+      rotate: open ? 0 : 180
     })
-  }), [styles == null ? void 0 : styles.controlEndNode, disabled, customEndNode, open, handleToggleOpen]);
+  }), [styles == null ? void 0 : styles.controlEndNode, customEndNode, open]);
   const inputStackStyles = useMemo(() => {
     let verticalSpace;
     if (insideVerticalLabel) {
@@ -370,6 +367,8 @@ export const DefaultSelectControlComponent = /*#__PURE__*/memo(_ref => {
       input: inputStackStyles
     },
     variant: variant
-  }, props));
+  }, props, {
+    onFieldPress: handleToggleOpen
+  }));
 });
 export const DefaultSelectControl = DefaultSelectControlComponent;

package/esm/controls/InputStack.js

@@ -1,4 +1,4 @@
-const _excluded = ["width", "prependNode", "endNode", "appendNode", "startNode", "disabled", "inputNode", "helperTextNode", "borderStyle", "variant", "labelNode", "testID", "borderRadius", "borderFocusedStyle", "focused", "enableColorSurge", "labelVariant", "inputBackground", "borderWidth", "focusedBorderWidth", "styles", "style"];
+const _excluded = ["width", "prependNode", "endNode", "appendNode", "startNode", "disabled", "inputNode", "helperTextNode", "borderStyle", "variant", "labelNode", "testID", "borderRadius", "borderFocusedStyle", "focused", "enableColorSurge", "labelVariant", "inputBackground", "borderWidth", "focusedBorderWidth", "onFieldPress", "styles", "style"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 import React, { memo, useMemo } from 'react';
@@ -11,7 +11,8 @@ import { useTheme } from '../hooks/useTheme';
 import { HStack } from '../layout/HStack';
 import { VStack } from '../layout/VStack';
 import { ColorSurge } from '../motion/ColorSurge';
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Pressable } from '../system/Pressable';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const variantColorMap = {
   primary: 'fgPrimary',
   positive: 'fgPositive',
@@ -44,6 +45,7 @@ export const InputStack = /*#__PURE__*/memo(function InputStack(_props) {
       inputBackground = 'bg',
       borderWidth = 100,
       focusedBorderWidth = borderWidth,
+      onFieldPress,
       styles,
       style
     } = mergedProps,
@@ -99,6 +101,26 @@ export const InputStack = /*#__PURE__*/memo(function InputStack(_props) {
   const rootStyles = useMemo(() => [style, styles == null ? void 0 : styles.root], [style, styles == null ? void 0 : styles.root]);
   const inputContainerStyles = useMemo(() => [staticStyles.inputAreaContainerStyle, styles == null ? void 0 : styles.inputContainer], [styles == null ? void 0 : styles.inputContainer]);
   const combinedInputAreaStyles = useMemo(() => [inputAreaStyles, styles == null ? void 0 : styles.input], [inputAreaStyles, styles == null ? void 0 : styles.input]);
+  const inputArea = /*#__PURE__*/_jsxs(Animated.View, {
+    onLayout: onInputAreaLayout,
+    style: combinedInputAreaStyles,
+    testID: testID && testID + "-input-area",
+    children: [focused && enableColorSurge && /*#__PURE__*/_jsx(ColorSurge, {
+      background: variant ? variantColorMap[variant] : undefined
+    }), !!startNode && /*#__PURE__*/_jsx(_Fragment, {
+      children: startNode
+    }), !!labelNode && labelVariant === 'inside' ?
+    /*#__PURE__*/
+    // A stacked inside label tightens its top/bottom spacing so the label + input still
+    // fit the same natural field height an outside label produces.
+    _jsxs(VStack, {
+      flexGrow: 1,
+      paddingY: 0.75,
+      children: [labelNode, inputNode]
+    }) : inputNode, !!endNode && /*#__PURE__*/_jsx(_Fragment, {
+      children: endNode
+    })]
+  });
   return /*#__PURE__*/_jsxs(VStack, _extends({
     gap: inputStackGap,
     opacity: disabled ? accessibleOpacityDisabled : 1,
@@ -115,26 +137,17 @@ export const InputStack = /*#__PURE__*/memo(function InputStack(_props) {
         style: inputContainerStyles,
         children: [focused && /*#__PURE__*/_jsx(Animated.View, {
           style: borderFocusedStyles
-        }), /*#__PURE__*/_jsxs(Animated.View, {
-          onLayout: onInputAreaLayout,
-          style: combinedInputAreaStyles,
-          testID: testID && testID + "-input-area",
-          children: [focused && enableColorSurge && /*#__PURE__*/_jsx(ColorSurge, {
-            background: variant ? variantColorMap[variant] : undefined
-          }), !!startNode && /*#__PURE__*/_jsx(_Fragment, {
-            children: startNode
-          }), !!labelNode && labelVariant === 'inside' ?
-          /*#__PURE__*/
-          // A stacked inside label tightens its top/bottom spacing so the label + input still
-          // fit the same natural field height an outside label produces.
-          _jsxs(VStack, {
-            flexGrow: 1,
-            paddingY: 0.75,
-            children: [labelNode, inputNode]
-          }) : inputNode, !!endNode && /*#__PURE__*/_jsx(_Fragment, {
-            children: endNode
-          })]
-        })]
+        }), onFieldPress ? /*#__PURE__*/_jsx(Pressable, {
+          noScaleOnPress: true,
+          accessible: false,
+          background: "transparent",
+          borderColor: "transparent",
+          borderWidth: 0,
+          disabled: disabled,
+          flexGrow: 1,
+          onPress: onFieldPress,
+          children: inputArea
+        }) : inputArea]
       }), !!appendNode && /*#__PURE__*/_jsx(_Fragment, {
         children: appendNode
       })]

package/esm/visualizations/chart/scrubber/ScrubberProvider.js

@@ -99,6 +99,8 @@ const EnabledScrubberProvider = _ref => {
       pan.failOffsetX([-15, 15]);
     }
     return pan.onStart(function onStart(event) {
+      'worklet';
+
       runOnJS(handleStartEndHaptics)();
 
       // Android does not trigger onUpdate when the gesture starts. This achieves consistent behavior across both iOS and Android
@@ -110,15 +112,21 @@ const EnabledScrubberProvider = _ref => {
         }
       }
     }).onUpdate(function onUpdate(event) {
+      'worklet';
+
       const pointerPosition = categoryAxisIsX ? event.x : event.y;
       const newScrubberPosition = getDataIndexFromPosition(pointerPosition);
       if (newScrubberPosition !== scrubberPosition.value) {
         scrubberPosition.value = newScrubberPosition;
       }
     }).onEnd(function onEnd() {
+      'worklet';
+
       runOnJS(handleStartEndHaptics)();
       scrubberPosition.value = undefined;
     }).onTouchesCancelled(function onTouchesCancelled() {
+      'worklet';
+
       scrubberPosition.value = undefined;
     });
   }, [allowOverflowGestures, handleStartEndHaptics, getDataIndexFromPosition, categoryAxisIsX, scrubberPosition]);

package/esm/visualizations/chart/utils/bar.js

@@ -2,7 +2,7 @@ const _excluded = ["staggerDelay"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 import { defaultAxisId as fallbackAxisId } from './axis';
-import { evaluateGradientAtValue } from './gradient';
+import { evaluateGradientAtValue, evaluateGradientOpacityAtValue } from './gradient';
 import { defaultTransition } from './transition';
 
 /**
@@ -827,6 +827,7 @@ export function getBars(params) {
     const valuePos = Math.min(edgeBottom, edgeTop);
     if (length <= 0) return;
     let barFill = s.color || defaultFill;
+    let barFillOpacity = defaultFillOpacity;
     const seriesGradientConfig = seriesGradients.find(g => (g == null ? void 0 : g.seriesId) === s.id);
     if (seriesGradientConfig && originalValue !== null && originalValue !== undefined) {
       var _seriesGradientConfig;
@@ -841,6 +842,10 @@ export function getBars(params) {
       if (evaluatedColor) {
         barFill = evaluatedColor;
       }
+      const evaluatedOpacity = evaluateGradientOpacityAtValue(seriesGradientConfig.stops, evalValue, seriesGradientConfig.scale);
+      if (evaluatedOpacity !== undefined) {
+        barFillOpacity = defaultFillOpacity !== undefined ? defaultFillOpacity * evaluatedOpacity : evaluatedOpacity;
+      }
     }
     allBars.push({
       seriesId: s.id,
@@ -848,6 +853,7 @@ export function getBars(params) {
       length,
       dataValue: value,
       fill: barFill,
+      fillOpacity: barFillOpacity,
       roundTop,
       roundBottom,
       shouldApplyGap,
@@ -897,7 +903,7 @@ export function getBars(params) {
     dataY: layout === 'vertical' ? bar.dataValue : categoryValue,
     origin: barOrigins[i],
     borderRadius,
-    fillOpacity: defaultFillOpacity,
+    fillOpacity: bar.fillOpacity,
     stroke: defaultStroke,
     strokeWidth: defaultStrokeWidth,
     minSize: initialBarMinSizes[i],

package/esm/visualizations/chart/utils/gradient.js

@@ -90,6 +90,86 @@ export const getColorWithOpacity = (color1, opacity) => {
   return "rgba(" + c[0] * 255 + ", " + c[1] * 255 + ", " + c[2] * 255 + ", " + opacity + ")";
 };
 
+/**
+ * Returns stop indices and blend progress for a data value.
+ * When startIndex === endIndex, use that stop directly; otherwise blend with t.
+ */
+const getGradientStopInterpolation = (stops, dataValue, scale) => {
+  'worklet';
+
+  if (stops.length === 0) return;
+
+  // Determine range based on scale type
+  let rangeMin;
+  let rangeMax;
+  if (isSerializableScale(scale)) {
+    // SerializableScale has range as [number, number]
+    [rangeMin, rangeMax] = scale.range;
+  } else {
+    // ChartScaleFunction has range() method
+    const scaleRange = scale.range();
+    [rangeMin, rangeMax] = Array.isArray(scaleRange) ? scaleRange : [scaleRange, scaleRange]; // fallback for band scales
+  }
+  const rangeSpan = Math.abs(rangeMax - rangeMin);
+  if (rangeSpan === 0) return [0, 0, 0];
+
+  // Map dataValue through scale to get position
+  let dataPosition;
+  if (isSerializableScale(scale)) {
+    dataPosition = applySerializableScale(dataValue, scale);
+  } else {
+    const result = scale(dataValue);
+    if (result === undefined) return [0, 0, 0];
+    dataPosition = result;
+  }
+
+  // Normalize to 0-1 based on range
+  const normalizedValue = Math.max(0, Math.min(1, Math.abs(dataPosition - rangeMin) / rangeSpan));
+
+  // Map stop offsets through scale and normalize to 0-1
+  const positions = stops.map(stop => {
+    let stopPosition;
+    if (isSerializableScale(scale)) {
+      stopPosition = applySerializableScale(stop.offset, scale);
+    } else {
+      const result = scale(stop.offset);
+      if (result === undefined) return 0;
+      stopPosition = result;
+    }
+    return Math.max(0, Math.min(1, Math.abs(stopPosition - rangeMin) / rangeSpan));
+  });
+
+  // Find which segment we're in
+  if (normalizedValue < positions[0]) return [0, 0, 0];
+  const lastIndex = stops.length - 1;
+  if (normalizedValue >= positions[lastIndex]) return [lastIndex, lastIndex, 0];
+
+  // Check if dataValue matches any stop offset exactly (for hard transitions)
+  for (let i = 0; i < stops.length; i++) {
+    if (dataValue === stops[i].offset) {
+      // Found exact match - check if there are multiple stops at this offset (hard transition)
+      // Use the LAST stop at this offset for hard transitions
+      let lastIndexAtOffset = i;
+      while (lastIndexAtOffset + 1 < stops.length && stops[lastIndexAtOffset + 1].offset === stops[i].offset) {
+        lastIndexAtOffset++;
+      }
+      return [lastIndexAtOffset, lastIndexAtOffset, 0];
+    }
+  }
+
+  // Find the segment to interpolate between
+  for (let i = 0; i < positions.length - 1; i++) {
+    if (normalizedValue >= positions[i] && normalizedValue <= positions[i + 1]) {
+      const segmentStart = positions[i];
+      const segmentEnd = positions[i + 1];
+      if (segmentEnd === segmentStart) return [i, i, 0];
+      const t = (normalizedValue - segmentStart) / (segmentEnd - segmentStart);
+      return [i, i + 1, t];
+    }
+  }
+  return [0, 0, 0];
+};
+
 /**
  * Creates a gradient configuration for SVG components.
  * Processes a GradientDefinition into a renderable GradientConfig.
@@ -157,82 +237,33 @@ export const getGradientConfig = (gradient, xScale, yScale, layout) => {
 export const evaluateGradientAtValue = (stops, dataValue, scale) => {
   'worklet';
 
-  if (stops.length === 0) return;
-
-  // Determine range based on scale type
-  let rangeMin;
-  let rangeMax;
-  if (isSerializableScale(scale)) {
-    // SerializableScale has range as [number, number]
-    [rangeMin, rangeMax] = scale.range;
-  } else {
-    // ChartScaleFunction has range() method
-    const scaleRange = scale.range();
-    [rangeMin, rangeMax] = Array.isArray(scaleRange) ? scaleRange : [scaleRange, scaleRange]; // fallback for band scales
-  }
-  const rangeSpan = Math.abs(rangeMax - rangeMin);
-  if (rangeSpan === 0) return stops[0].color;
-
-  // Map dataValue through scale to get position
-  let dataPosition;
-  if (isSerializableScale(scale)) {
-    dataPosition = applySerializableScale(dataValue, scale);
-  } else {
-    const result = scale(dataValue);
-    if (result === undefined) return stops[0].color;
-    dataPosition = result;
-  }
-
-  // Normalize to 0-1 based on range
-  const normalizedValue = Math.max(0, Math.min(1, Math.abs(dataPosition - rangeMin) / rangeSpan));
-
-  // Map stop offsets through scale and normalize to 0-1
-  const positions = stops.map(stop => {
-    let stopPosition;
-    if (isSerializableScale(scale)) {
-      stopPosition = applySerializableScale(stop.offset, scale);
-    } else {
-      const result = scale(stop.offset);
-      if (result === undefined) return 0;
-      stopPosition = result;
-    }
-    return Math.max(0, Math.min(1, Math.abs(stopPosition - rangeMin) / rangeSpan));
-  });
-
-  // Find which segment we're in
-  if (normalizedValue < positions[0]) {
-    return stops[0].color;
-  }
-  if (normalizedValue >= positions[positions.length - 1]) {
-    return stops[stops.length - 1].color;
-  }
+  const interpolation = getGradientStopInterpolation(stops, dataValue, scale);
+  if (!interpolation) return;
+  const [startIndex, endIndex, t] = interpolation;
+  if (startIndex === endIndex) return stops[startIndex].color;
+  return interpolateColor(stops[startIndex].color, stops[endIndex].color, t);
+};
 
-  // Check if dataValue matches any stop offset exactly (for hard transitions)
-  for (let i = 0; i < stops.length; i++) {
-    if (dataValue === stops[i].offset) {
-      // Found exact match - check if there are multiple stops at this offset (hard transition)
-      // Use the LAST color at this offset for hard transitions
-      let lastIndexAtOffset = i;
-      while (lastIndexAtOffset + 1 < stops.length && stops[lastIndexAtOffset + 1].offset === stops[i].offset) {
-        lastIndexAtOffset++;
-      }
-      return stops[lastIndexAtOffset].color;
-    }
-  }
+/**
+ * Evaluates the opacity at a specific data value based on gradient stops.
+ * Returns undefined when no stops define opacity.
+ */
+export const evaluateGradientOpacityAtValue = (stops, dataValue, scale) => {
+  'worklet';
 
-  // Find the segment to interpolate between
-  for (let i = 0; i < positions.length - 1; i++) {
-    if (normalizedValue >= positions[i] && normalizedValue <= positions[i + 1]) {
-      const segmentStart = positions[i];
-      const segmentEnd = positions[i + 1];
-      if (segmentEnd === segmentStart) {
-        return stops[i].color;
-      }
-      const t = (normalizedValue - segmentStart) / (segmentEnd - segmentStart);
-      return interpolateColor(stops[i].color, stops[i + 1].color, t);
-    }
-  }
-  return stops[0].color;
+  var _stops$startIndex$opa, _stops$endIndex$opaci;
+  if (stops.length === 0) return;
+  if (stops.every(stop => {
+    var _stop$opacity2;
+    return ((_stop$opacity2 = stop.opacity) != null ? _stop$opacity2 : 1) === 1;
+  })) return;
+  const interpolation = getGradientStopInterpolation(stops, dataValue, scale);
+  if (!interpolation) return;
+  const [startIndex, endIndex, t] = interpolation;
+  const startOpacity = (_stops$startIndex$opa = stops[startIndex].opacity) != null ? _stops$startIndex$opa : 1;
+  if (startIndex === endIndex) return startOpacity;
+  const endOpacity = (_stops$endIndex$opaci = stops[endIndex].opacity) != null ? _stops$endIndex$opaci : 1;
+  return startOpacity + (endOpacity - startOpacity) * t;
 };
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-mobile",
-  "version": "9.16.0",
+  "version": "9.17.1",
   "description": "Coinbase Design System - Mobile",
   "repository": {
     "type": "git",
@@ -218,7 +218,7 @@
     "react-native-worklets": "0.5.2"
   },
   "dependencies": {
-    "@coinbase/cds-common": "^9.16.0",
+    "@coinbase/cds-common": "^9.17.1",
     "@coinbase/cds-icons": "^5.21.0",
     "@coinbase/cds-illustrations": "^4.48.0",
     "@coinbase/cds-lottie-files": "^3.3.4",