@coinbase/cds-mcp-server 8.44.1 → 8.45.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.
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.45.0 ((2/12/2026, 07:33 AM PST))
|
|
12
|
+
|
|
13
|
+
This is an artificial version bump with no new change.
|
|
14
|
+
|
|
15
|
+
## 8.44.2 ((2/10/2026, 08:38 AM PST))
|
|
16
|
+
|
|
17
|
+
This is an artificial version bump with no new change.
|
|
18
|
+
|
|
11
19
|
## 8.44.1 ((2/10/2026, 12:05 PM PST))
|
|
12
20
|
|
|
13
21
|
This is an artificial version bump with no new change.
|
|
@@ -298,6 +298,7 @@ function SelectChipExample() {
|
|
|
298
298
|
| `presentationStyle` | `fullScreen \| pageSheet \| formSheet \| overFullScreen` | No | `-` | The presentationStyle determines the style of modal to show |
|
|
299
299
|
| `preventDismissGestures` | `boolean` | No | `-` | Prevents a user from dismissing the drawer by pressing the overlay or swiping |
|
|
300
300
|
| `preventHardwareBackBehaviorAndroid` | `boolean` | No | `-` | Prevents a user from dismissing the drawer by pressing hardware back button on Android |
|
|
301
|
+
| `reduceMotion` | `boolean` | No | `-` | When true, the drawer opens and closes with an opacity fade instead of a slide animation. Swipe-to-dismiss gestures remain enabled and use the slide transform so the drawer follows the users finger naturally. |
|
|
301
302
|
| `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
|
|
302
303
|
| `right` | `string \| number` | No | `-` | - |
|
|
303
304
|
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
@@ -382,8 +382,33 @@ function PreventDismissTray() {
|
|
|
382
382
|
|
|
383
383
|
### Accessibility
|
|
384
384
|
|
|
385
|
+
#### Accessibility labels
|
|
386
|
+
|
|
385
387
|
Trays require an accessibility label. If you pass in a ReactNode to `title`, make sure to set `accessibilityLabel`.
|
|
386
388
|
|
|
389
|
+
#### Reduce Motion
|
|
390
|
+
|
|
391
|
+
Use the `reduceMotion` prop to accommodate users with reduced motion settings.
|
|
392
|
+
|
|
393
|
+
```jsx
|
|
394
|
+
function ReducedMotionTray() {
|
|
395
|
+
const [visible, setVisible] = useState(false);
|
|
396
|
+
const handleOpen = () => setVisible(true);
|
|
397
|
+
const handleClose = () => setVisible(false);
|
|
398
|
+
|
|
399
|
+
return (
|
|
400
|
+
<VStack gap={2}>
|
|
401
|
+
<Button onPress={handleOpen}>Open Tray</Button>
|
|
402
|
+
{visible && (
|
|
403
|
+
<Tray reduceMotion onCloseComplete={handleClose} title="Reduced Motion">
|
|
404
|
+
<Text color="fgMuted">This tray fades in and out using opacity.</Text>
|
|
405
|
+
</Tray>
|
|
406
|
+
)}
|
|
407
|
+
</VStack>
|
|
408
|
+
);
|
|
409
|
+
}
|
|
410
|
+
```
|
|
411
|
+
|
|
387
412
|
### Styling
|
|
388
413
|
|
|
389
414
|
#### Handlebar
|
|
@@ -824,6 +849,7 @@ function Example() {
|
|
|
824
849
|
| `presentationStyle` | `fullScreen \| pageSheet \| formSheet \| overFullScreen` | No | `-` | The presentationStyle determines the style of modal to show |
|
|
825
850
|
| `preventDismissGestures` | `boolean` | No | `-` | Prevents a user from dismissing the drawer by pressing the overlay or swiping |
|
|
826
851
|
| `preventHardwareBackBehaviorAndroid` | `boolean` | No | `-` | Prevents a user from dismissing the drawer by pressing hardware back button on Android |
|
|
852
|
+
| `reduceMotion` | `boolean` | No | `-` | When true, the drawer opens and closes with an opacity fade instead of a slide animation. Swipe-to-dismiss gestures remain enabled and use the slide transform so the drawer follows the users finger naturally. |
|
|
827
853
|
| `ref` | `((instance: DrawerRefBaseProps \| null) => void) \| RefObject<DrawerRefBaseProps> \| null` | No | `-` | - |
|
|
828
854
|
| `statusBarTranslucent` | `boolean` | No | `-` | Determines whether your modal should go under the system statusbar. |
|
|
829
855
|
| `stickyFooter` | `ReactNode \| DrawerRenderChildren` | No | `-` | StickyFooter to be rendered at bottom of Drawer |
|
|
@@ -836,3 +862,18 @@ function Example() {
|
|
|
836
862
|
| `visible` | `boolean` | No | `-` | The visible prop determines whether your modal is visible. |
|
|
837
863
|
|
|
838
864
|
|
|
865
|
+
## Styles
|
|
866
|
+
|
|
867
|
+
| Selector | Static class name | Description |
|
|
868
|
+
| --- | --- | --- |
|
|
869
|
+
| `root` | `-` | Root container element |
|
|
870
|
+
| `overlay` | `-` | Overlay backdrop element |
|
|
871
|
+
| `container` | `-` | Animated sliding container element |
|
|
872
|
+
| `handleBar` | `-` | Handle bar container element |
|
|
873
|
+
| `handleBarHandle` | `-` | Handle bar indicator element |
|
|
874
|
+
| `drawer` | `-` | Drawer content wrapper element |
|
|
875
|
+
| `content` | `-` | Content area element |
|
|
876
|
+
| `header` | `-` | Header section element |
|
|
877
|
+
| `title` | `-` | Title text element |
|
|
878
|
+
|
|
879
|
+
|
|
@@ -453,8 +453,51 @@ function PreventDismissTray() {
|
|
|
453
453
|
|
|
454
454
|
### Accessibility
|
|
455
455
|
|
|
456
|
+
#### Accessibility labels
|
|
457
|
+
|
|
456
458
|
Trays require an accessibility label. If you pass in a ReactNode to `title`, make sure to set `accessibilityLabel` or `accessibilityLabelledBy`.
|
|
457
459
|
|
|
460
|
+
#### Reduce Motion
|
|
461
|
+
|
|
462
|
+
Use the `reduceMotion` prop to accommodate users with reduced motion settings.
|
|
463
|
+
|
|
464
|
+
```jsx live
|
|
465
|
+
function ReducedMotionTray() {
|
|
466
|
+
const [visible, setVisible] = useState(false);
|
|
467
|
+
const { isPhone } = useBreakpoints();
|
|
468
|
+
const handleOpen = () => setVisible(true);
|
|
469
|
+
const handleClose = () => setVisible(false);
|
|
470
|
+
|
|
471
|
+
return (
|
|
472
|
+
<VStack gap={2}>
|
|
473
|
+
<Button onClick={handleOpen}>Open Tray</Button>
|
|
474
|
+
{visible && (
|
|
475
|
+
<Tray
|
|
476
|
+
reduceMotion
|
|
477
|
+
pin={isPhone ? 'bottom' : 'right'}
|
|
478
|
+
showHandleBar={isPhone}
|
|
479
|
+
onCloseComplete={handleClose}
|
|
480
|
+
title="Reduced Motion"
|
|
481
|
+
footer={({ handleClose }) => (
|
|
482
|
+
<PageFooter
|
|
483
|
+
borderedTop
|
|
484
|
+
justifyContent={isPhone ? 'center' : 'flex-end'}
|
|
485
|
+
action={
|
|
486
|
+
<Button block={isPhone} onClick={handleClose}>
|
|
487
|
+
Close
|
|
488
|
+
</Button>
|
|
489
|
+
}
|
|
490
|
+
/>
|
|
491
|
+
)}
|
|
492
|
+
>
|
|
493
|
+
<Text paddingBottom={2}>This tray fades in and out using opacity.</Text>
|
|
494
|
+
</Tray>
|
|
495
|
+
)}
|
|
496
|
+
</VStack>
|
|
497
|
+
);
|
|
498
|
+
}
|
|
499
|
+
```
|
|
500
|
+
|
|
458
501
|
### Styling
|
|
459
502
|
|
|
460
503
|
The Tray component exposes `styles` and `classNames` props for customizing various parts of the component. Available keys include: `root`, `overlay`, `container`, `header`, `title`, `content`, `footer`, `handleBar`, `handleBarHandle`, and `closeButton`.
|
|
@@ -1154,6 +1197,7 @@ function ResponsiveTrayExample() {
|
|
|
1154
1197
|
| `onVisibilityChange` | `((context: hidden \| visible) => void)` | No | `-` | Optional callback that, if provided, will be triggered when the Tray is toggled open/ closed If used for analytics, context (visible \| hidden) can be bundled with the event info to track whether the multiselect was toggled into or out of view |
|
|
1155
1198
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `'bottom'` | Pin the tray to one side of the screen |
|
|
1156
1199
|
| `preventDismiss` | `boolean` | No | `-` | Prevents a user from dismissing the tray by pressing the overlay or swiping |
|
|
1200
|
+
| `reduceMotion` | `boolean` | No | `-` | When true, the tray will use opacity animation instead of transform animation. This is useful for supporting reduced motion for accessibility. |
|
|
1157
1201
|
| `ref` | `((instance: TrayRefProps \| null) => void) \| RefObject<TrayRefProps> \| null` | No | `-` | - |
|
|
1158
1202
|
| `restoreFocusOnUnmount` | `boolean` | No | `true` | If true, the focus trap will restore focus to the previously focused element when it unmounts. WARNING: If you disable this, you need to ensure that focus is restored properly so it doesnt end up on the body |
|
|
1159
1203
|
| `role` | `dialog \| alertdialog` | No | `-` | WAI-ARIA Roles |
|
|
@@ -1164,3 +1208,18 @@ function ResponsiveTrayExample() {
|
|
|
1164
1208
|
| `zIndex` | `number` | No | `-` | z-index for the tray overlay |
|
|
1165
1209
|
|
|
1166
1210
|
|
|
1211
|
+
## Styles
|
|
1212
|
+
|
|
1213
|
+
| Selector | Static class name | Description |
|
|
1214
|
+
| --- | --- | --- |
|
|
1215
|
+
| `root` | `cds-Tray` | Root container element |
|
|
1216
|
+
| `overlay` | `cds-Tray-overlay` | Overlay backdrop element |
|
|
1217
|
+
| `container` | `cds-Tray-container` | Animated sliding container element |
|
|
1218
|
+
| `header` | `cds-Tray-header` | Header section element |
|
|
1219
|
+
| `title` | `cds-Tray-title` | Title text element |
|
|
1220
|
+
| `content` | `cds-Tray-content` | Content area element |
|
|
1221
|
+
| `handleBar` | `cds-Tray-handleBar` | Handle bar container element, only rendered when showHandleBar is true and pin is bottom |
|
|
1222
|
+
| `handleBarHandle` | `cds-Tray-handleBarHandle` | Handle bar indicator element, only rendered when showHandleBar is true and pin is bottom |
|
|
1223
|
+
| `closeButton` | `cds-Tray-closeButton` | Close button element |
|
|
1224
|
+
|
|
1225
|
+
|