@coinbase/cds-mobile-visualization 3.7.0 → 3.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dts/chart/PeriodSelector.d.ts.map +1 -1
  3. package/esm/chart/PeriodSelector.js +3 -4
  4. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -8,6 +8,12 @@ All notable changes to this project will be documented in this file.
8
8
 
9
9
  <!-- template-start -->
10
10
 
11
+ ## 3.8.0 (5/8/2026 PST)
12
+
13
+ #### 🚀 Updates
14
+
15
+ - Feat: support active color on Tabs. [[#669](https://github.com/coinbase/cds/pull/669)]
16
+
11
17
  ## 3.7.0 (4/20/2026 PST)
12
18
 
13
19
  #### 🚀 Updates
package/dts/chart/PeriodSelector.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PeriodSelector.d.ts","sourceRoot":"","sources":["../../src/chart/PeriodSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,EAAc,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGhE,OAAO,EAEL,KAAK,kBAAkB,EAEvB,KAAK,wBAAwB,EAC9B,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAQ,KAAK,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAG3E,eAAO,MAAM,6BAA6B,GAAI,wDAK3C,wBAAwB,wDAmD1B,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,aAAa,GAAG;IAClD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,qBAAqB,CAAC;AAStD,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;IAxBvB;;;OAGG;YACK,MAAM;IACd;;OAEG;cACO,OAAO;IACjB;;OAEG;YACK,GAAG;+BAyCZ,CAAC;AASF,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,CAAC;AAErD;;;GAGG;AACH,eAAO,MAAM,cAAc;;YA9Hd,CAAC;WAGZ,CAAC;uBAGE,CAAC;;8BAkJL,CAAC"}
1
+ {"version":3,"file":"PeriodSelector.d.ts","sourceRoot":"","sources":["../../src/chart/PeriodSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,EAAc,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGhE,OAAO,EAEL,KAAK,kBAAkB,EAEvB,KAAK,wBAAwB,EAC9B,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAQ,KAAK,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAG3E,eAAO,MAAM,6BAA6B,GAAI,wDAK3C,wBAAwB,wDAmD1B,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,aAAa,GAAG;IAClD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,qBAAqB,CAAC;AAStD,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;IAxBvB;;;OAGG;YACK,MAAM;IACd;;OAEG;cACO,OAAO;IACjB;;OAEG;YACK,GAAG;+BAyCZ,CAAC;AAQF,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,CAAC;AAErD;;;GAGG;AACH,eAAO,MAAM,cAAc;;YA7Hd,CAAC;WAGZ,CAAC;uBAGE,CAAC;;8BAmJL,CAAC"}
package/esm/chart/PeriodSelector.js CHANGED
@@ -1,5 +1,5 @@
1
1
  const _excluded = ["color", "label", "font", "hideDot", "style"],
2
- _excluded2 = ["background", "activeBackground", "width", "justifyContent", "TabComponent", "TabsActiveIndicatorComponent"];
2
+ _excluded2 = ["background", "activeBackground", "activeColor", "width", "justifyContent", "TabComponent", "TabsActiveIndicatorComponent"];
3
3
  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); }
4
4
  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; }
5
5
  import React, { forwardRef, memo, useMemo } from 'react';
@@ -107,11 +107,8 @@ export const LiveTabLabel = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref2, re
107
107
  }))]
108
108
  });
109
109
  }));
110
-
111
- // Custom tab component with primary color for active state
112
110
  const PeriodSelectorTab = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/_jsx(SegmentedTab, _extends({
113
111
  ref: ref,
114
- activeColor: "fgPrimary",
115
112
  font: "label1"
116
113
  }, props))));
117
114
  /**
@@ -122,6 +119,7 @@ export const PeriodSelector = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref3,
122
119
  let {
123
120
  background = 'transparent',
124
121
  activeBackground = 'bgPrimaryWash',
122
+ activeColor = 'fgPrimary',
125
123
  width = '100%',
126
124
  justifyContent = 'space-between',
127
125
  TabComponent = PeriodSelectorTab,
@@ -133,6 +131,7 @@ export const PeriodSelector = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref3,
133
131
  TabComponent: TabComponent,
134
132
  TabsActiveIndicatorComponent: TabsActiveIndicatorComponent,
135
133
  activeBackground: activeBackground,
134
+ activeColor: activeColor,
136
135
  background: background,
137
136
  justifyContent: justifyContent,
138
137
  width: width
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@coinbase/cds-mobile-visualization",
3
- "version": "3.7.0",
3
+ "version": "3.8.0",
4
4
  "description": "Coinbase Design System - Mobile Visualization Native",
5
5
  "repository": {
6
6
  "type": "git",
@@ -36,9 +36,9 @@
36
36
  "CHANGELOG"
37
37
  ],
38
38
  "peerDependencies": {
39
- "@coinbase/cds-common": "^8.66.0",
39
+ "@coinbase/cds-common": "^8.70.0",
40
40
  "@coinbase/cds-lottie-files": "^3.3.4",
41
- "@coinbase/cds-mobile": "^8.66.0",
41
+ "@coinbase/cds-mobile": "^8.70.0",
42
42
  "@coinbase/cds-utils": "^2.3.5",
43
43
  "@shopify/react-native-skia": "^1.12.4 || ^2.0.0",
44
44
  "react": "^18.3.1",
@@ -57,9 +57,9 @@
57
57
  "@babel/preset-env": "^7.28.0",
58
58
  "@babel/preset-react": "^7.27.1",
59
59
  "@babel/preset-typescript": "^7.27.1",
60
- "@coinbase/cds-common": "^8.66.0",
60
+ "@coinbase/cds-common": "^8.70.0",
61
61
  "@coinbase/cds-lottie-files": "^3.3.4",
62
- "@coinbase/cds-mobile": "^8.66.0",
62
+ "@coinbase/cds-mobile": "^8.70.0",
63
63
  "@coinbase/cds-utils": "^2.3.5",
64
64
  "@shopify/react-native-skia": "1.12.4",
65
65
  "@types/react": "^18.3.12",