diff --git a/packages/common/CHANGELOG.md b/packages/common/CHANGELOG.md index 66c2f96d1f..82e316966c 100644 --- a/packages/common/CHANGELOG.md +++ b/packages/common/CHANGELOG.md @@ -8,6 +8,10 @@ All notable changes to this project will be documented in this file. +## 9.4.2 ((6/17/2026, 11:55 PM PST)) + +This is an artificial version bump with no new change. + ## 9.4.1 ((6/15/2026, 01:02 PM PST)) This is an artificial version bump with no new change. diff --git a/packages/common/package.json b/packages/common/package.json index 23a5e8917f..61b5339e1e 100644 --- a/packages/common/package.json +++ b/packages/common/package.json @@ -1,6 +1,6 @@ { "name": "@coinbase/cds-common", - "version": "9.4.1", + "version": "9.4.2", "description": "Coinbase Design System - Common", "repository": { "type": "git", diff --git a/packages/mcp-server/CHANGELOG.md b/packages/mcp-server/CHANGELOG.md index 5c26ae2237..225ea8d516 100644 --- a/packages/mcp-server/CHANGELOG.md +++ b/packages/mcp-server/CHANGELOG.md @@ -8,6 +8,10 @@ All notable changes to this project will be documented in this file. +## 9.4.2 ((6/17/2026, 11:55 PM PST)) + +This is an artificial version bump with no new change. + ## 9.4.1 ((6/15/2026, 01:02 PM PST)) This is an artificial version bump with no new change. diff --git a/packages/mcp-server/package.json b/packages/mcp-server/package.json index fd2664552e..17d08bb034 100644 --- a/packages/mcp-server/package.json +++ b/packages/mcp-server/package.json @@ -1,6 +1,6 @@ { "name": "@coinbase/cds-mcp-server", - "version": "9.4.1", + "version": "9.4.2", "description": "Coinbase Design System - MCP Server", "repository": { "type": "git", diff --git a/packages/mobile/CHANGELOG.md b/packages/mobile/CHANGELOG.md index ba39f27291..0c2426db28 100644 --- a/packages/mobile/CHANGELOG.md +++ b/packages/mobile/CHANGELOG.md @@ -8,6 +8,10 @@ All notable changes to this project will be documented in this file. +## 9.4.2 ((6/17/2026, 11:55 PM PST)) + +This is an artificial version bump with no new change. + ## 9.4.1 (6/15/2026 PST) #### 🐞 Fixes diff --git a/packages/mobile/package.json b/packages/mobile/package.json index 8f655a2b4d..03d1c05bfc 100644 --- a/packages/mobile/package.json +++ b/packages/mobile/package.json @@ -1,6 +1,6 @@ { "name": "@coinbase/cds-mobile", - "version": "9.4.1", + "version": "9.4.2", "description": "Coinbase Design System - Mobile", "repository": { "type": "git", diff --git a/packages/web/CHANGELOG.md b/packages/web/CHANGELOG.md index c071f7ad95..fa61fd4d4f 100644 --- a/packages/web/CHANGELOG.md +++ b/packages/web/CHANGELOG.md @@ -8,6 +8,12 @@ All notable changes to this project will be documented in this file. +## 9.4.2 (6/17/2026 PST) + +#### 🐞 Fixes + +- Fix: Tray overlay backdrop now fades out on close. [[#736](https://github.com/coinbase/cds/pull/736)] + ## 9.4.1 (6/15/2026 PST) #### 🐞 Fixes diff --git a/packages/web/package.json b/packages/web/package.json index 29be2fd7cc..857ff8e6e8 100644 --- a/packages/web/package.json +++ b/packages/web/package.json @@ -1,6 +1,6 @@ { "name": "@coinbase/cds-web", - "version": "9.4.1", + "version": "9.4.2", "description": "Coinbase Design System - Web", "repository": { "type": "git", diff --git a/packages/web/src/overlays/tray/Tray.tsx b/packages/web/src/overlays/tray/Tray.tsx index a1b91ea772..2dfa909767 100644 --- a/packages/web/src/overlays/tray/Tray.tsx +++ b/packages/web/src/overlays/tray/Tray.tsx @@ -288,6 +288,7 @@ export const Tray = memo( const trayRef = useRef(null); const { observe: observeTraySize, height: trayHeight } = useDimensions(); const contentRef = useRef(null); + const overlayRef = useRef(null); const hasCalledOnOpenComplete = useRef(false); const [scope, animate] = useAnimate(); const dragControls = useDragControls(); @@ -320,6 +321,9 @@ export const Tray = memo( ? { x: pin === 'right' ? '100%' : '-100%' } : { y: pin === 'bottom' ? '100%' : '-100%' }; } + if (overlayRef.current) { + animate(overlayRef.current, { opacity: 0 }, animationConfig.slideOut.transition); + } animate(scope.current, finalAnimationValue, animationConfig.slideOut.transition).then(() => { setIsOpen(false); onClose?.(); @@ -329,6 +333,9 @@ export const Tray = memo( const handleSwipeClose = useCallback(() => { if (!scope.current) return; + if (overlayRef.current) { + animate(overlayRef.current, { opacity: 0 }, { duration: 0.15, ease: 'easeOut' }); + } animate(scope.current, { y: '100%' }, { duration: 0.15, ease: 'easeOut' }).then(() => { setIsOpen(false); onBlur?.(); @@ -454,6 +461,8 @@ export const Tray = memo( zIndex={zIndex} > { expect(root?.querySelector(`.${trayClassNames.handleBarHandle}`)).toBeInTheDocument(); }); }); + + describe('overlay animation', () => { + it('wraps the overlay in a motion container so the backdrop fades', () => { + const onCloseCompleteSpy = jest.fn(); + render( + + + {loremIpsum} + + , + ); + expect(screen.getByTestId('tray-overlay-motion')).toBeInTheDocument(); + }); + }); });