@coinbase/cds-mcp-server 8.66.2 → 8.68.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 (16) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/mcp-docs/mobile/components/PageFooter.txt +23 -0
  3. package/mcp-docs/mobile/guides/_v9MobileInstallCommands.txt +9 -0
  4. package/mcp-docs/mobile/guides/_v9MobilePeerDependencies.txt +15 -0
  5. package/mcp-docs/mobile/guides/_v9WebInstallCommands.txt +9 -0
  6. package/mcp-docs/mobile/guides/_v9WebPeerDependencies.txt +5 -0
  7. package/mcp-docs/mobile/guides/v9-migration-guide.txt +348 -0
  8. package/mcp-docs/mobile/routes.txt +5 -0
  9. package/mcp-docs/web/components/PageFooter.txt +23 -0
  10. package/mcp-docs/web/guides/_v9MobileInstallCommands.txt +9 -0
  11. package/mcp-docs/web/guides/_v9MobilePeerDependencies.txt +15 -0
  12. package/mcp-docs/web/guides/_v9WebInstallCommands.txt +9 -0
  13. package/mcp-docs/web/guides/_v9WebPeerDependencies.txt +5 -0
  14. package/mcp-docs/web/guides/v9-migration-guide.txt +348 -0
  15. package/mcp-docs/web/routes.txt +5 -0
  16. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -8,6 +8,14 @@ All notable changes to this project will be documented in this file.
8
8
 
9
9
  <!-- template-start -->
10
10
 
11
+ ## 8.68.0 ((5/1/2026, 02:11 PM PST))
12
+
13
+ This is an artificial version bump with no new change.
14
+
15
+ ## 8.67.0 ((5/1/2026, 09:17 AM PST))
16
+
17
+ This is an artificial version bump with no new change.
18
+
11
19
  ## 8.66.2 ((4/28/2026, 01:06 PM PST))
12
20
 
13
21
  This is an artificial version bump with no new change.
package/mcp-docs/mobile/components/PageFooter.txt CHANGED
@@ -66,6 +66,28 @@ function StyledFooter() {
66
66
  }
67
67
  ```
68
68
 
69
+ ### With Legal Text
70
+
71
+ ```tsx
72
+ function LegalTextPageFooter() {
73
+ return (
74
+ <PageFooter
75
+ action={
76
+ <ButtonGroup block>
77
+ <Button variant="secondary" onPress={() => console.log('Back')}>
78
+ Back
79
+ </Button>
80
+ <Button variant="primary" onPress={() => console.log('Next')}>
81
+ Next
82
+ </Button>
83
+ </ButtonGroup>
84
+ }
85
+ legalText="By continuing, you agree to our Terms of Service and Privacy Policy."
86
+ />
87
+ );
88
+ }
89
+ ```
90
+
69
91
  ## Props
70
92
 
71
93
  | Prop | Type | Required | Default | Description |
@@ -113,6 +135,7 @@ function StyledFooter() {
113
135
  | `height` | `string \| number` | No | `-` | - |
114
136
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
115
137
  | `key` | `Key \| null` | No | `-` | - |
138
+ | `legalText` | `string` | No | `-` | Optional legal text rendered below the action in a pre-styled caption. Centered on mobile. |
116
139
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
117
140
  | `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
118
141
  | `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
package/mcp-docs/mobile/guides/_v9MobileInstallCommands.txt ADDED
@@ -0,0 +1,9 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9MobileInstallCommands/
2
+
3
+ ```bash
4
+ # npm
5
+ npm install @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-mobile@9.0.0-rc.2
6
+
7
+ # yarn
8
+ yarn add @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-mobile@9.0.0-rc.2
9
+ ```
package/mcp-docs/mobile/guides/_v9MobilePeerDependencies.txt ADDED
@@ -0,0 +1,15 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9MobilePeerDependencies/
2
+
3
+ <br />
4
+
5
+ | Package | Previous range | Required range |
6
+ | -------------------------------- | -------------- | -------------- |
7
+ | `react` | `^18.3.1` | `~19.1.2` |
8
+ | `react-native` | `^0.74.5` | `~0.81.5` |
9
+ | `lottie-react-native` | `^6.7.0` | `7.3.1` |
10
+ | `react-native-gesture-handler` | `^2.16.2` | `2.28.0` |
11
+ | `react-native-reanimated` | `^3.14.0` | `4.1.1` |
12
+ | `react-native-safe-area-context` | `^4.10.5` | `5.6.0` |
13
+ | `react-native-svg` | `^14.1.0` | `15.12.1` |
14
+ | `@shopify/react-native-skia` | - | `2.2.12` |
15
+ | `react-native-worklets` | - | `0.5.2` |
package/mcp-docs/mobile/guides/_v9WebInstallCommands.txt ADDED
@@ -0,0 +1,9 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9WebInstallCommands/
2
+
3
+ ```bash
4
+ # npm
5
+ npm install @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-web@9.0.0-rc.2
6
+
7
+ # yarn
8
+ yarn add @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-web@9.0.0-rc.2
9
+ ```
package/mcp-docs/mobile/guides/_v9WebPeerDependencies.txt ADDED
@@ -0,0 +1,5 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9WebPeerDependencies/
2
+
3
+ <br />
4
+
5
+ No required peer dependency changes for web.
package/mcp-docs/mobile/guides/v9-migration-guide.txt ADDED
@@ -0,0 +1,348 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/v9-migration-guide/
2
+
3
+ ---
4
+ id: v9-migration-guide
5
+ title: v9 Upgrade Guide
6
+ slug: /guides/v9-upgrade-guide
7
+ hide_title: true
8
+ ---
9
+
10
+ import { MDXSection } from '@site/src/components/page/MDXSection';
11
+ import { MDXArticle } from '@site/src/components/page/MDXArticle';
12
+ import { ContentHeader } from '@site/src/components/page/ContentHeader';
13
+ import { DeprecationTable } from '@site/src/components/page/DeprecationTable';
14
+ import { StandalonePlatformSwitcher } from '@site/src/components/page/PlatformSwitcher';
15
+ import { VStack, HStack } from '@coinbase/cds-web/layout';
16
+ import { Text } from '@coinbase/cds-web/typography/Text';
17
+ import { Tag } from '@coinbase/cds-web/tag/Tag';
18
+
19
+ import {
20
+ componentDeprecations,
21
+ hookFunctionDeprecations,
22
+ tokenConstantDeprecations,
23
+ typeDeprecations,
24
+ } from '@site/src/data/v9Deprecations';
25
+
26
+ import WebInstallCommands from './_v9WebInstallCommands.mdx';
27
+ import MobileInstallCommands from './_v9MobileInstallCommands.mdx';
28
+ import WebPeerDependencies from './_v9WebPeerDependencies.mdx';
29
+ import MobilePeerDependencies from './_v9MobilePeerDependencies.mdx';
30
+
31
+ <VStack gap={5}>
32
+ <ContentHeader title="v9 Upgrade Guide" />
33
+
34
+ <MDXSection>
35
+ <MDXArticle>
36
+
37
+ ## 👋 Introduction
38
+
39
+ CDS 9 builds on the foundation laid in v8 and focuses on stability, modernization, and addressing specific debt that improves future maintainability.
40
+
41
+ Highlights of this release:
42
+
43
+ - 🔮 React 19 support on web (with backwards compatibility for React 18)
44
+ - 📱 React Native 0.81 / Expo SDK 54 support on mobile
45
+ - 📐 Eliminates hard-coded fixed widths/heights from all components to improve customizability and themeability
46
+ - 🎯 Consolidates standalone visualization packages in order to simplify the CDS ecosystem
47
+ - 🌬️ NEW migrator tool (`@coinbase/cds-migrator`) to help with this and future upgrades
48
+
49
+ </MDXArticle>
50
+ </MDXSection>
51
+
52
+ <MDXSection>
53
+ <MDXArticle>
54
+
55
+ ## 📦 Packages
56
+
57
+ The following CDS packages are receiving new versions:
58
+
59
+ - `@coinbase/cds-common@9.0.0-rc.2`
60
+ - `@coinbase/cds-web@9.0.0-rc.2`
61
+ - `@coinbase/cds-mobile@9.0.0-rc.2`
62
+ - `@coinbase/cds-mcp-server@9.0.0-rc.2`
63
+ - `@coinbase/cds-migrator@1.0.0`{' '} <Tag colorScheme="blue">New</Tag>
64
+
65
+ :::tip Release Candidate Status
66
+ CDS 9 is currently in release candidate status. There are no breaking changes planned prior to the official release of 9.0.0. So it is safe to upgrade to `9.0.0-rc.2` if you want to get an early start.
67
+ :::
68
+
69
+ In CDS 9, we are deprecating the standalone visualization packages. See the [Deprecated packages](#packages) for more details.
70
+
71
+ - `@coinbase/cds-web-visualization`{' '} <Tag colorScheme="red">Deprecated</Tag>
72
+ - `@coinbase/cds-mobile-visualization`{' '} <Tag colorScheme="red">Deprecated</Tag>
73
+
74
+ </MDXArticle>
75
+ </MDXSection>
76
+
77
+ <MDXSection>
78
+ <MDXArticle>
79
+
80
+ ## ✅ Upgrade Steps
81
+
82
+ ### 1. Prerequisites
83
+
84
+ CDS 9 no longer bundles the v7 shim (`cds-web/v7`/`cds-mobile/v7`).
85
+ Incremental upgrade strategies, which this pattern enabled, are no longer recommended.
86
+ Starting with CDS 9, major releases will minimize breaking changes relateive to the prior version, making major upgrades possible to land in a single PR, even for large monorepos.
87
+
88
+ Before upgrading to v9:
89
+
90
+ 1. Search your codebase for any remaining `cds-web/v7` / `cds-mobile/v7` imports.
91
+ 2. Complete any partial migrations from the v7 shim to proper CDS 8 imports by following the [v8 Migration Guide](./v8-migration-guide).
92
+ 3. Once all v7 imports are eliminated, you can upgrade to v9.
93
+
94
+ ```tsx
95
+ // ❌ Before (still on v8 with incremental migration)
96
+ import { Button } from '@coinbase/cds-web/v7/buttons/Button';
97
+
98
+ // ✅ After (must complete before upgrading to v9)
99
+ import { Button } from '@coinbase/cds-web/buttons/Button';
100
+ ```
101
+
102
+ ### 2. Update Packages
103
+
104
+ <StandalonePlatformSwitcher.Root>
105
+ <VStack>
106
+ <HStack alignItems="center" justifyContent="space-between" width="100%">
107
+ <Text font="title3">Updgrade CDS Packages</Text>
108
+ <StandalonePlatformSwitcher.Toggle accessibilityLabel="Select package platform" />
109
+ </HStack>
110
+ <Text font="body">Update the CDS packages your app uses to v9.</Text>
111
+ <StandalonePlatformSwitcher.Content platform="web">
112
+ <WebInstallCommands />
113
+ </StandalonePlatformSwitcher.Content>
114
+ <StandalonePlatformSwitcher.Content platform="mobile">
115
+ <MobileInstallCommands />
116
+ </StandalonePlatformSwitcher.Content>
117
+ </VStack>
118
+ </StandalonePlatformSwitcher.Root>
119
+
120
+ <StandalonePlatformSwitcher.Root>
121
+ <VStack>
122
+ <HStack alignItems="center" justifyContent="space-between" width="100%">
123
+ <Text font="title3">Update CDS Peer Dependencies</Text>
124
+ <StandalonePlatformSwitcher.Toggle accessibilityLabel="Select peer dependency platform" />
125
+ </HStack>
126
+ <StandalonePlatformSwitcher.Content platform="web">
127
+ <WebPeerDependencies />
128
+ </StandalonePlatformSwitcher.Content>
129
+ <StandalonePlatformSwitcher.Content platform="mobile">
130
+ <MobilePeerDependencies />
131
+ </StandalonePlatformSwitcher.Content>
132
+ </VStack>
133
+ </StandalonePlatformSwitcher.Root>
134
+
135
+ <br />
136
+
137
+ ### 3. Run Automated Codemods
138
+
139
+ The new `@coinbase/cds-migrator` will help expedite your upgrade to CDS 9.
140
+ It encapsulates individual changes in **transforms**, and groups related transforms into versioned **presets**.
141
+ For upgrades from CDS 8 to CDS 9, use the `v8-to-v9` preset.
142
+
143
+ For detailed CLI documentation and individual transform/preset details, see the [package README](https://github.com/coinbase/cds/blob/cds-v9-master/packages/migrator/README.md).
144
+
145
+ :::tip Proactive Codemods
146
+ We will continually publish new transforms and presets to proactively address deprecations in preparation of the following major release.
147
+ :::
148
+
149
+ #### Running the codemods
150
+
151
+ ```bash
152
+ # Preview all changes (recommended first step)
153
+ npx @coinbase/cds-migrator ./src -p v8-to-v9 --dry-run
154
+
155
+ # Review the generated migration.log
156
+ cat migration.log
157
+
158
+ # Apply the migration
159
+ npx @coinbase/cds-migrator ./src -p v8-to-v9
160
+ ```
161
+
162
+ You can also run a single transform:
163
+
164
+ ```bash
165
+ npx @coinbase/cds-migrator ./src -t button-variant-values --dry-run
166
+ ```
167
+
168
+ The migrator tool records what it has already run in `.cds-migration-history.json` and leaves `// TODO [cds-migrator:<transform-name>]` comments in the source code for cases that may need manual review.
169
+
170
+ #### Manual upgrade effort
171
+
172
+ The CDS 9 codemods should address the vast majority of potential incompatibility issues, however there are a few specific edge cases that may require manual attention.
173
+
174
+ - Tightening some TypeScript types (`Carousel`, `Drawer`, `Tray`, `Modal`, `TableCell.end`, etc.)
175
+ - Updating custom Stepper progress UIs and `SlideButton` slot components to use Reanimated / `framer-motion` instead of `react-spring`
176
+ - See [Breaking Change Overview](#-breaking-change-overview) for more details
177
+
178
+ </MDXArticle>
179
+ </MDXSection>
180
+
181
+ <MDXSection>
182
+ <MDXArticle>
183
+
184
+ ## 💥 Breaking Change Overview
185
+
186
+ ### Hard-Coded Dimensions Removed
187
+
188
+ CDS 9 removes hard-coded fixed heights and widths from all components. Components are now driven by their content, your layout, or theme tokens. As a side effect, several constants and utilities that exposed those fixed pixel values are deprecated (see [New Deprecations](#new-deprecations)). Review any surfaces that depended on CDS components occupying fixed dimensions, since those layouts may need small visual adjustments after upgrading.
189
+
190
+ ### Packages & Imports
191
+
192
+ - **v7 import paths dropped** — `@coinbase/cds-web/v7` and `@coinbase/cds-mobile/v7` are no longer bundled. Apps must finish their CDS 8 upgrade before jumping to CDS 9.
193
+ - **Visualization packages merged** — deep paths on `@coinbase/cds-(web|mobile)-visualization` may no longer resolve. Use the new `@coinbase/cds-(web|mobile)/visualizations/*` exports.
194
+
195
+ ### Cutting react-spring references
196
+
197
+ CDS is migrating away from `react-spring`, which is poorly maintained and has been the source of recurring bugs.
198
+ The implementation detail leaked into the public API of two components — `Stepper` and `SlideButton`.
199
+ These APIs need to be adjusted before CDS can transition to the preferred animation libraries, `framer-motion` and `react-native-reanimated`.
200
+
201
+ #### Stepper <Tag colorScheme="blue">Web</Tag> <Tag colorScheme="green">Mobile</Tag>
202
+
203
+ If you supply a custom step / progress UI to `Stepper`, the `progress` prop is now a plain `number` between `0` and `1` instead of a `react-spring` value. For built-in progress animation, configure timing via the new `progressTimingConfig` / `defaultProgressTimingConfig` props. The legacy `progressSpringConfig` prop is ignored on this animation path.
204
+
205
+ ```tsx
206
+ // ❌ Before (v8) — progress was a SpringValue<number>
207
+ const CustomProgress = ({ progress }: { progress: SpringValue<number> }) => (
208
+ <animated.div style={{ width: progress.to((p) => `${p * 100}%`) }} />
209
+ );
210
+
211
+ // ✅ After (v9) — progress is a number between 0 and 1
212
+ const CustomProgress = ({ progress }: { progress: number }) => (
213
+ <div style={{ width: `${progress * 100}%` }} />
214
+ );
215
+
216
+ // Built-in animation timing
217
+ <Stepper
218
+ progressTimingConfig={{ duration: 0.4, ease: 'easeInOut' }}
219
+ // progressSpringConfig is ignored in v9
220
+ />;
221
+ ```
222
+
223
+ #### SlideButton <Tag colorScheme="green">Mobile</Tag>
224
+
225
+ Custom `SlideButtonBackgroundComponent` and `SlideButtonHandleComponent` slots now receive `progress` as a Reanimated `SharedValue<number>` instead of a `react-spring` `SpringValue<number>`. Any custom slot that drove animation with spring helpers must switch to Reanimated.
226
+
227
+ ```tsx
228
+ // ❌ Before (v8)
229
+ import { SpringValue } from '@react-spring/native';
230
+ const BackgroundComponent = ({ progress }: { progress: SpringValue<number> }) => {
231
+ // animated.View, react-spring helpers...
232
+ };
233
+
234
+ // ✅ After (v9)
235
+ import Animated, { useAnimatedStyle, type SharedValue } from 'react-native-reanimated';
236
+
237
+ const BackgroundComponent = ({ progress }: { progress: SharedValue<number> }) => {
238
+ const style = useAnimatedStyle(() => ({ opacity: progress.value }));
239
+ return <Animated.View style={style} />;
240
+ };
241
+ ```
242
+
243
+ **Spring config:** `animationConfig` on `DefaultSlideButtonHandle` is deprecated. Use `slideButtonSpringConfig` together with Reanimated's `withSpring`.
244
+
245
+ **Layout:** `SlideButton` now applies default heights (`40` for compact, `56` for regular) and derives the handle's `minWidth` from `height`. If you previously omitted `height` and relied on the old interactable-height + spring-driven sizing, double-check the rendered layout — you may need to set `height` explicitly to preserve v8 behavior.
246
+
247
+ ### TypeScript Type Changes
248
+
249
+ A handful of CDS types have been tightened to better reflect runtime behavior or to align with React 19's updated typedefs.
250
+ These changes are runtime-compatible but may surface as TypeScript errors after you upgrade.
251
+
252
+ :::tip Tip
253
+ In most cases, removing explicit type annotations and letting TypeScript infer the type from CDS is the simplest fix.
254
+ :::
255
+
256
+ #### React.FC type removed for render-children types <Tag colorScheme="blue">Web</Tag><Tag colorScheme="green">Mobile</Tag>
257
+
258
+ The following components' render functions are now typed as `(props) => ReactNode` instead of using the deprecated `React.FC` type:
259
+
260
+ - `CarouselItem`
261
+ - `Drawer`
262
+ - `Tray`
263
+ - `Modal`
264
+
265
+ #### `TableCell.end` and `SelectOptionGroupComponent.accessory` <Tag colorScheme="blue">Web</Tag>
266
+
267
+ Both components' props now require a stricter type: `React.ReactElement<CellAccessoryProps>`.
268
+
269
+ ```tsx
270
+ // ❌ Before (v8) — was previously typed as ReactElement/ReactNode
271
+ <TableCell end={<div>123</div>} />;
272
+
273
+ // ✅ After (v9)
274
+ import { CellTextAccessory } from '@coinbase/cds-web/cells';
275
+ <TableCell end={<CellTextAccessory text="123" />} />;
276
+ ```
277
+
278
+ #### Input `onFocus` / `onBlur` Event Types <Tag colorScheme="green">Mobile</Tag>
279
+
280
+ Certain mobile component APIs that accept focus/blur event handlers now use simpler typing
281
+
282
+ ```tsx
283
+ // ❌ Before (v8)
284
+ import type { NativeSyntheticEvent, TextInputFocusEventData } from 'react-native';
285
+ const onFocus = (e: NativeSyntheticEvent<TextInputFocusEventData>) => {
286
+ /* ... */
287
+ };
288
+
289
+ // ✅ After (v9)
290
+ import type { FocusEvent } from 'react-native';
291
+ const onFocus = (e: FocusEvent) => {
292
+ /* ... */
293
+ };
294
+ ```
295
+
296
+ ### Removed APIs (Dropped Deprecations)
297
+
298
+ The following `@deprecated` APIs are **fully removed** in v9.
299
+
300
+ | Package | Dropped deprecations |
301
+ | ------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
302
+ | <Tag colorScheme="gray">Common</Tag> | `emptyObject`, `StickyFooterProps` |
303
+ | <Tag colorScheme="blue">Web</Tag> | `AnnouncementCardProps`, `FeatureEntryCardProps`, `RadioGroupProps`, `CheckboxGroupProps`, `FeedCardProps`, `IconCounterButton.iconSize` |
304
+ | <Tag colorScheme="green">Mobile</Tag> | `AnnouncementCardProps`, `FeatureEntryCardProps`, `RadioGroupProps`, `CheckboxGroupProps`, `FeedCardProps`, `LinearGradient.isBelowChildren`, `IconCounterButton.iconSize` |
305
+
306
+ </MDXArticle>
307
+ </MDXSection>
308
+
309
+ <MDXSection>
310
+ <MDXArticle>
311
+
312
+ ## ⚠️ New Deprecations
313
+
314
+ The following APIs are **still available in v9** but are scheduled for removal in CDS 10. Migrators and/or AI agents will be released following the v9 launch to help with each. You can also start migrating manually using the guidance below.
315
+
316
+ ### Packages
317
+
318
+ | Package | Notes |
319
+ | ---------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
320
+ | **`@coinbase/cds-web-visualization`** | Use `@coinbase/cds-web/visualizations/{chart,sparkline}` instead. Remove the dependency once your imports are migrated. |
321
+ | **`@coinbase/cds-mobile-visualization`** | Use `@coinbase/cds-mobile/visualizations/{chart,sparkline}` instead. Remove the dependency once your imports are migrated. |
322
+
323
+ :::tip Codemod
324
+ The CDS migrator's `v8-to-v9` preset will update these packages' import paths for you.
325
+ :::
326
+
327
+ ### Components
328
+
329
+ <DeprecationTable rows={componentDeprecations} />
330
+
331
+ ### Hooks & Functions
332
+
333
+ <DeprecationTable rows={hookFunctionDeprecations} />
334
+
335
+ ### Tokens & Constants
336
+
337
+ The following tokens were fixed pixel values that pin component sizing. With v9 removing hard-coded heights/widths, they are no longer published. Define your own values or rely on layout-driven sizing.
338
+
339
+ <DeprecationTable rows={tokenConstantDeprecations} />
340
+
341
+ ### Types
342
+
343
+ <DeprecationTable rows={typeDeprecations} />
344
+
345
+ </MDXArticle>
346
+ </MDXSection>
347
+
348
+ </VStack>
package/mcp-docs/mobile/routes.txt CHANGED
@@ -154,4 +154,9 @@
154
154
 
155
155
  ## Guides
156
156
 
157
+ - [v9-migration-guide](mobile/guides/v9-migration-guide.txt)
157
158
  - [v8-migration-guide](mobile/guides/v8-migration-guide.txt)
159
+ - [_v9WebPeerDependencies](mobile/guides/_v9WebPeerDependencies.txt)
160
+ - [_v9WebInstallCommands](mobile/guides/_v9WebInstallCommands.txt)
161
+ - [_v9MobilePeerDependencies](mobile/guides/_v9MobilePeerDependencies.txt)
162
+ - [_v9MobileInstallCommands](mobile/guides/_v9MobileInstallCommands.txt)
package/mcp-docs/web/components/PageFooter.txt CHANGED
@@ -86,6 +86,28 @@ function CustomLayoutFooter() {
86
86
  }
87
87
  ```
88
88
 
89
+ ### With Legal Text
90
+
91
+ ```tsx live
92
+ function LegalTextPageFooter() {
93
+ return (
94
+ <PageFooter
95
+ action={
96
+ <ButtonGroup>
97
+ <Button variant="secondary" onClick={() => console.log('Back')}>
98
+ Back
99
+ </Button>
100
+ <Button variant="primary" onClick={() => console.log('Next')}>
101
+ Next
102
+ </Button>
103
+ </ButtonGroup>
104
+ }
105
+ legalText="By continuing, you agree to our Terms of Service and Privacy Policy."
106
+ />
107
+ );
108
+ }
109
+ ```
110
+
89
111
  ## Props
90
112
 
91
113
  | Prop | Type | Required | Default | Description |
@@ -148,6 +170,7 @@ function CustomLayoutFooter() {
148
170
  | `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
149
171
  | `justifyContent` | `ResponsiveProp<left \| right \| center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| space-between \| space-around \| space-evenly>` | No | `-` | - |
150
172
  | `key` | `Key \| null` | No | `-` | - |
173
+ | `legalText` | `string` | No | `-` | Optional legal text rendered below the action in a pre-styled caption. Right-aligned on desktop, centered on mobile/responsive web. |
151
174
  | `lineHeight` | `ResponsiveProp<LineHeight \| inherit>` | No | `-` | - |
152
175
  | `margin` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
153
176
  | `marginBottom` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
package/mcp-docs/web/guides/_v9MobileInstallCommands.txt ADDED
@@ -0,0 +1,9 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9MobileInstallCommands/
2
+
3
+ ```bash
4
+ # npm
5
+ npm install @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-mobile@9.0.0-rc.2
6
+
7
+ # yarn
8
+ yarn add @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-mobile@9.0.0-rc.2
9
+ ```
package/mcp-docs/web/guides/_v9MobilePeerDependencies.txt ADDED
@@ -0,0 +1,15 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9MobilePeerDependencies/
2
+
3
+ <br />
4
+
5
+ | Package | Previous range | Required range |
6
+ | -------------------------------- | -------------- | -------------- |
7
+ | `react` | `^18.3.1` | `~19.1.2` |
8
+ | `react-native` | `^0.74.5` | `~0.81.5` |
9
+ | `lottie-react-native` | `^6.7.0` | `7.3.1` |
10
+ | `react-native-gesture-handler` | `^2.16.2` | `2.28.0` |
11
+ | `react-native-reanimated` | `^3.14.0` | `4.1.1` |
12
+ | `react-native-safe-area-context` | `^4.10.5` | `5.6.0` |
13
+ | `react-native-svg` | `^14.1.0` | `15.12.1` |
14
+ | `@shopify/react-native-skia` | - | `2.2.12` |
15
+ | `react-native-worklets` | - | `0.5.2` |
package/mcp-docs/web/guides/_v9WebInstallCommands.txt ADDED
@@ -0,0 +1,9 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9WebInstallCommands/
2
+
3
+ ```bash
4
+ # npm
5
+ npm install @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-web@9.0.0-rc.2
6
+
7
+ # yarn
8
+ yarn add @coinbase/cds-common@9.0.0-rc.2 @coinbase/cds-web@9.0.0-rc.2
9
+ ```
package/mcp-docs/web/guides/_v9WebPeerDependencies.txt ADDED
@@ -0,0 +1,5 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/_v9WebPeerDependencies/
2
+
3
+ <br />
4
+
5
+ No required peer dependency changes for web.
package/mcp-docs/web/guides/v9-migration-guide.txt ADDED
@@ -0,0 +1,348 @@
1
+ **📖 Live documentation:** https://cds.coinbase.com/guides/v9-migration-guide/
2
+
3
+ ---
4
+ id: v9-migration-guide
5
+ title: v9 Upgrade Guide
6
+ slug: /guides/v9-upgrade-guide
7
+ hide_title: true
8
+ ---
9
+
10
+ import { MDXSection } from '@site/src/components/page/MDXSection';
11
+ import { MDXArticle } from '@site/src/components/page/MDXArticle';
12
+ import { ContentHeader } from '@site/src/components/page/ContentHeader';
13
+ import { DeprecationTable } from '@site/src/components/page/DeprecationTable';
14
+ import { StandalonePlatformSwitcher } from '@site/src/components/page/PlatformSwitcher';
15
+ import { VStack, HStack } from '@coinbase/cds-web/layout';
16
+ import { Text } from '@coinbase/cds-web/typography/Text';
17
+ import { Tag } from '@coinbase/cds-web/tag/Tag';
18
+
19
+ import {
20
+ componentDeprecations,
21
+ hookFunctionDeprecations,
22
+ tokenConstantDeprecations,
23
+ typeDeprecations,
24
+ } from '@site/src/data/v9Deprecations';
25
+
26
+ import WebInstallCommands from './_v9WebInstallCommands.mdx';
27
+ import MobileInstallCommands from './_v9MobileInstallCommands.mdx';
28
+ import WebPeerDependencies from './_v9WebPeerDependencies.mdx';
29
+ import MobilePeerDependencies from './_v9MobilePeerDependencies.mdx';
30
+
31
+ <VStack gap={5}>
32
+ <ContentHeader title="v9 Upgrade Guide" />
33
+
34
+ <MDXSection>
35
+ <MDXArticle>
36
+
37
+ ## 👋 Introduction
38
+
39
+ CDS 9 builds on the foundation laid in v8 and focuses on stability, modernization, and addressing specific debt that improves future maintainability.
40
+
41
+ Highlights of this release:
42
+
43
+ - 🔮 React 19 support on web (with backwards compatibility for React 18)
44
+ - 📱 React Native 0.81 / Expo SDK 54 support on mobile
45
+ - 📐 Eliminates hard-coded fixed widths/heights from all components to improve customizability and themeability
46
+ - 🎯 Consolidates standalone visualization packages in order to simplify the CDS ecosystem
47
+ - 🌬️ NEW migrator tool (`@coinbase/cds-migrator`) to help with this and future upgrades
48
+
49
+ </MDXArticle>
50
+ </MDXSection>
51
+
52
+ <MDXSection>
53
+ <MDXArticle>
54
+
55
+ ## 📦 Packages
56
+
57
+ The following CDS packages are receiving new versions:
58
+
59
+ - `@coinbase/cds-common@9.0.0-rc.2`
60
+ - `@coinbase/cds-web@9.0.0-rc.2`
61
+ - `@coinbase/cds-mobile@9.0.0-rc.2`
62
+ - `@coinbase/cds-mcp-server@9.0.0-rc.2`
63
+ - `@coinbase/cds-migrator@1.0.0`{' '} <Tag colorScheme="blue">New</Tag>
64
+
65
+ :::tip Release Candidate Status
66
+ CDS 9 is currently in release candidate status. There are no breaking changes planned prior to the official release of 9.0.0. So it is safe to upgrade to `9.0.0-rc.2` if you want to get an early start.
67
+ :::
68
+
69
+ In CDS 9, we are deprecating the standalone visualization packages. See the [Deprecated packages](#packages) for more details.
70
+
71
+ - `@coinbase/cds-web-visualization`{' '} <Tag colorScheme="red">Deprecated</Tag>
72
+ - `@coinbase/cds-mobile-visualization`{' '} <Tag colorScheme="red">Deprecated</Tag>
73
+
74
+ </MDXArticle>
75
+ </MDXSection>
76
+
77
+ <MDXSection>
78
+ <MDXArticle>
79
+
80
+ ## ✅ Upgrade Steps
81
+
82
+ ### 1. Prerequisites
83
+
84
+ CDS 9 no longer bundles the v7 shim (`cds-web/v7`/`cds-mobile/v7`).
85
+ Incremental upgrade strategies, which this pattern enabled, are no longer recommended.
86
+ Starting with CDS 9, major releases will minimize breaking changes relateive to the prior version, making major upgrades possible to land in a single PR, even for large monorepos.
87
+
88
+ Before upgrading to v9:
89
+
90
+ 1. Search your codebase for any remaining `cds-web/v7` / `cds-mobile/v7` imports.
91
+ 2. Complete any partial migrations from the v7 shim to proper CDS 8 imports by following the [v8 Migration Guide](./v8-migration-guide).
92
+ 3. Once all v7 imports are eliminated, you can upgrade to v9.
93
+
94
+ ```tsx
95
+ // ❌ Before (still on v8 with incremental migration)
96
+ import { Button } from '@coinbase/cds-web/v7/buttons/Button';
97
+
98
+ // ✅ After (must complete before upgrading to v9)
99
+ import { Button } from '@coinbase/cds-web/buttons/Button';
100
+ ```
101
+
102
+ ### 2. Update Packages
103
+
104
+ <StandalonePlatformSwitcher.Root>
105
+ <VStack>
106
+ <HStack alignItems="center" justifyContent="space-between" width="100%">
107
+ <Text font="title3">Updgrade CDS Packages</Text>
108
+ <StandalonePlatformSwitcher.Toggle accessibilityLabel="Select package platform" />
109
+ </HStack>
110
+ <Text font="body">Update the CDS packages your app uses to v9.</Text>
111
+ <StandalonePlatformSwitcher.Content platform="web">
112
+ <WebInstallCommands />
113
+ </StandalonePlatformSwitcher.Content>
114
+ <StandalonePlatformSwitcher.Content platform="mobile">
115
+ <MobileInstallCommands />
116
+ </StandalonePlatformSwitcher.Content>
117
+ </VStack>
118
+ </StandalonePlatformSwitcher.Root>
119
+
120
+ <StandalonePlatformSwitcher.Root>
121
+ <VStack>
122
+ <HStack alignItems="center" justifyContent="space-between" width="100%">
123
+ <Text font="title3">Update CDS Peer Dependencies</Text>
124
+ <StandalonePlatformSwitcher.Toggle accessibilityLabel="Select peer dependency platform" />
125
+ </HStack>
126
+ <StandalonePlatformSwitcher.Content platform="web">
127
+ <WebPeerDependencies />
128
+ </StandalonePlatformSwitcher.Content>
129
+ <StandalonePlatformSwitcher.Content platform="mobile">
130
+ <MobilePeerDependencies />
131
+ </StandalonePlatformSwitcher.Content>
132
+ </VStack>
133
+ </StandalonePlatformSwitcher.Root>
134
+
135
+ <br />
136
+
137
+ ### 3. Run Automated Codemods
138
+
139
+ The new `@coinbase/cds-migrator` will help expedite your upgrade to CDS 9.
140
+ It encapsulates individual changes in **transforms**, and groups related transforms into versioned **presets**.
141
+ For upgrades from CDS 8 to CDS 9, use the `v8-to-v9` preset.
142
+
143
+ For detailed CLI documentation and individual transform/preset details, see the [package README](https://github.com/coinbase/cds/blob/cds-v9-master/packages/migrator/README.md).
144
+
145
+ :::tip Proactive Codemods
146
+ We will continually publish new transforms and presets to proactively address deprecations in preparation of the following major release.
147
+ :::
148
+
149
+ #### Running the codemods
150
+
151
+ ```bash
152
+ # Preview all changes (recommended first step)
153
+ npx @coinbase/cds-migrator ./src -p v8-to-v9 --dry-run
154
+
155
+ # Review the generated migration.log
156
+ cat migration.log
157
+
158
+ # Apply the migration
159
+ npx @coinbase/cds-migrator ./src -p v8-to-v9
160
+ ```
161
+
162
+ You can also run a single transform:
163
+
164
+ ```bash
165
+ npx @coinbase/cds-migrator ./src -t button-variant-values --dry-run
166
+ ```
167
+
168
+ The migrator tool records what it has already run in `.cds-migration-history.json` and leaves `// TODO [cds-migrator:<transform-name>]` comments in the source code for cases that may need manual review.
169
+
170
+ #### Manual upgrade effort
171
+
172
+ The CDS 9 codemods should address the vast majority of potential incompatibility issues, however there are a few specific edge cases that may require manual attention.
173
+
174
+ - Tightening some TypeScript types (`Carousel`, `Drawer`, `Tray`, `Modal`, `TableCell.end`, etc.)
175
+ - Updating custom Stepper progress UIs and `SlideButton` slot components to use Reanimated / `framer-motion` instead of `react-spring`
176
+ - See [Breaking Change Overview](#-breaking-change-overview) for more details
177
+
178
+ </MDXArticle>
179
+ </MDXSection>
180
+
181
+ <MDXSection>
182
+ <MDXArticle>
183
+
184
+ ## 💥 Breaking Change Overview
185
+
186
+ ### Hard-Coded Dimensions Removed
187
+
188
+ CDS 9 removes hard-coded fixed heights and widths from all components. Components are now driven by their content, your layout, or theme tokens. As a side effect, several constants and utilities that exposed those fixed pixel values are deprecated (see [New Deprecations](#new-deprecations)). Review any surfaces that depended on CDS components occupying fixed dimensions, since those layouts may need small visual adjustments after upgrading.
189
+
190
+ ### Packages & Imports
191
+
192
+ - **v7 import paths dropped** — `@coinbase/cds-web/v7` and `@coinbase/cds-mobile/v7` are no longer bundled. Apps must finish their CDS 8 upgrade before jumping to CDS 9.
193
+ - **Visualization packages merged** — deep paths on `@coinbase/cds-(web|mobile)-visualization` may no longer resolve. Use the new `@coinbase/cds-(web|mobile)/visualizations/*` exports.
194
+
195
+ ### Cutting react-spring references
196
+
197
+ CDS is migrating away from `react-spring`, which is poorly maintained and has been the source of recurring bugs.
198
+ The implementation detail leaked into the public API of two components — `Stepper` and `SlideButton`.
199
+ These APIs need to be adjusted before CDS can transition to the preferred animation libraries, `framer-motion` and `react-native-reanimated`.
200
+
201
+ #### Stepper <Tag colorScheme="blue">Web</Tag> <Tag colorScheme="green">Mobile</Tag>
202
+
203
+ If you supply a custom step / progress UI to `Stepper`, the `progress` prop is now a plain `number` between `0` and `1` instead of a `react-spring` value. For built-in progress animation, configure timing via the new `progressTimingConfig` / `defaultProgressTimingConfig` props. The legacy `progressSpringConfig` prop is ignored on this animation path.
204
+
205
+ ```tsx
206
+ // ❌ Before (v8) — progress was a SpringValue<number>
207
+ const CustomProgress = ({ progress }: { progress: SpringValue<number> }) => (
208
+ <animated.div style={{ width: progress.to((p) => `${p * 100}%`) }} />
209
+ );
210
+
211
+ // ✅ After (v9) — progress is a number between 0 and 1
212
+ const CustomProgress = ({ progress }: { progress: number }) => (
213
+ <div style={{ width: `${progress * 100}%` }} />
214
+ );
215
+
216
+ // Built-in animation timing
217
+ <Stepper
218
+ progressTimingConfig={{ duration: 0.4, ease: 'easeInOut' }}
219
+ // progressSpringConfig is ignored in v9
220
+ />;
221
+ ```
222
+
223
+ #### SlideButton <Tag colorScheme="green">Mobile</Tag>
224
+
225
+ Custom `SlideButtonBackgroundComponent` and `SlideButtonHandleComponent` slots now receive `progress` as a Reanimated `SharedValue<number>` instead of a `react-spring` `SpringValue<number>`. Any custom slot that drove animation with spring helpers must switch to Reanimated.
226
+
227
+ ```tsx
228
+ // ❌ Before (v8)
229
+ import { SpringValue } from '@react-spring/native';
230
+ const BackgroundComponent = ({ progress }: { progress: SpringValue<number> }) => {
231
+ // animated.View, react-spring helpers...
232
+ };
233
+
234
+ // ✅ After (v9)
235
+ import Animated, { useAnimatedStyle, type SharedValue } from 'react-native-reanimated';
236
+
237
+ const BackgroundComponent = ({ progress }: { progress: SharedValue<number> }) => {
238
+ const style = useAnimatedStyle(() => ({ opacity: progress.value }));
239
+ return <Animated.View style={style} />;
240
+ };
241
+ ```
242
+
243
+ **Spring config:** `animationConfig` on `DefaultSlideButtonHandle` is deprecated. Use `slideButtonSpringConfig` together with Reanimated's `withSpring`.
244
+
245
+ **Layout:** `SlideButton` now applies default heights (`40` for compact, `56` for regular) and derives the handle's `minWidth` from `height`. If you previously omitted `height` and relied on the old interactable-height + spring-driven sizing, double-check the rendered layout — you may need to set `height` explicitly to preserve v8 behavior.
246
+
247
+ ### TypeScript Type Changes
248
+
249
+ A handful of CDS types have been tightened to better reflect runtime behavior or to align with React 19's updated typedefs.
250
+ These changes are runtime-compatible but may surface as TypeScript errors after you upgrade.
251
+
252
+ :::tip Tip
253
+ In most cases, removing explicit type annotations and letting TypeScript infer the type from CDS is the simplest fix.
254
+ :::
255
+
256
+ #### React.FC type removed for render-children types <Tag colorScheme="blue">Web</Tag><Tag colorScheme="green">Mobile</Tag>
257
+
258
+ The following components' render functions are now typed as `(props) => ReactNode` instead of using the deprecated `React.FC` type:
259
+
260
+ - `CarouselItem`
261
+ - `Drawer`
262
+ - `Tray`
263
+ - `Modal`
264
+
265
+ #### `TableCell.end` and `SelectOptionGroupComponent.accessory` <Tag colorScheme="blue">Web</Tag>
266
+
267
+ Both components' props now require a stricter type: `React.ReactElement<CellAccessoryProps>`.
268
+
269
+ ```tsx
270
+ // ❌ Before (v8) — was previously typed as ReactElement/ReactNode
271
+ <TableCell end={<div>123</div>} />;
272
+
273
+ // ✅ After (v9)
274
+ import { CellTextAccessory } from '@coinbase/cds-web/cells';
275
+ <TableCell end={<CellTextAccessory text="123" />} />;
276
+ ```
277
+
278
+ #### Input `onFocus` / `onBlur` Event Types <Tag colorScheme="green">Mobile</Tag>
279
+
280
+ Certain mobile component APIs that accept focus/blur event handlers now use simpler typing
281
+
282
+ ```tsx
283
+ // ❌ Before (v8)
284
+ import type { NativeSyntheticEvent, TextInputFocusEventData } from 'react-native';
285
+ const onFocus = (e: NativeSyntheticEvent<TextInputFocusEventData>) => {
286
+ /* ... */
287
+ };
288
+
289
+ // ✅ After (v9)
290
+ import type { FocusEvent } from 'react-native';
291
+ const onFocus = (e: FocusEvent) => {
292
+ /* ... */
293
+ };
294
+ ```
295
+
296
+ ### Removed APIs (Dropped Deprecations)
297
+
298
+ The following `@deprecated` APIs are **fully removed** in v9.
299
+
300
+ | Package | Dropped deprecations |
301
+ | ------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
302
+ | <Tag colorScheme="gray">Common</Tag> | `emptyObject`, `StickyFooterProps` |
303
+ | <Tag colorScheme="blue">Web</Tag> | `AnnouncementCardProps`, `FeatureEntryCardProps`, `RadioGroupProps`, `CheckboxGroupProps`, `FeedCardProps`, `IconCounterButton.iconSize` |
304
+ | <Tag colorScheme="green">Mobile</Tag> | `AnnouncementCardProps`, `FeatureEntryCardProps`, `RadioGroupProps`, `CheckboxGroupProps`, `FeedCardProps`, `LinearGradient.isBelowChildren`, `IconCounterButton.iconSize` |
305
+
306
+ </MDXArticle>
307
+ </MDXSection>
308
+
309
+ <MDXSection>
310
+ <MDXArticle>
311
+
312
+ ## ⚠️ New Deprecations
313
+
314
+ The following APIs are **still available in v9** but are scheduled for removal in CDS 10. Migrators and/or AI agents will be released following the v9 launch to help with each. You can also start migrating manually using the guidance below.
315
+
316
+ ### Packages
317
+
318
+ | Package | Notes |
319
+ | ---------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
320
+ | **`@coinbase/cds-web-visualization`** | Use `@coinbase/cds-web/visualizations/{chart,sparkline}` instead. Remove the dependency once your imports are migrated. |
321
+ | **`@coinbase/cds-mobile-visualization`** | Use `@coinbase/cds-mobile/visualizations/{chart,sparkline}` instead. Remove the dependency once your imports are migrated. |
322
+
323
+ :::tip Codemod
324
+ The CDS migrator's `v8-to-v9` preset will update these packages' import paths for you.
325
+ :::
326
+
327
+ ### Components
328
+
329
+ <DeprecationTable rows={componentDeprecations} />
330
+
331
+ ### Hooks & Functions
332
+
333
+ <DeprecationTable rows={hookFunctionDeprecations} />
334
+
335
+ ### Tokens & Constants
336
+
337
+ The following tokens were fixed pixel values that pin component sizing. With v9 removing hard-coded heights/widths, they are no longer published. Define your own values or rely on layout-driven sizing.
338
+
339
+ <DeprecationTable rows={tokenConstantDeprecations} />
340
+
341
+ ### Types
342
+
343
+ <DeprecationTable rows={typeDeprecations} />
344
+
345
+ </MDXArticle>
346
+ </MDXSection>
347
+
348
+ </VStack>
package/mcp-docs/web/routes.txt CHANGED
@@ -179,4 +179,9 @@
179
179
 
180
180
  ## Guides
181
181
 
182
+ - [v9-migration-guide](web/guides/v9-migration-guide.txt)
182
183
  - [v8-migration-guide](web/guides/v8-migration-guide.txt)
184
+ - [_v9WebPeerDependencies](web/guides/_v9WebPeerDependencies.txt)
185
+ - [_v9WebInstallCommands](web/guides/_v9WebInstallCommands.txt)
186
+ - [_v9MobilePeerDependencies](web/guides/_v9MobilePeerDependencies.txt)
187
+ - [_v9MobileInstallCommands](web/guides/_v9MobileInstallCommands.txt)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@coinbase/cds-mcp-server",
3
- "version": "8.66.2",
3
+ "version": "8.68.0",
4
4
  "description": "Coinbase Design System - MCP Server",
5
5
  "repository": {
6
6
  "type": "git",