diff --git a/docs/src/app/(private)/experiments/motion.tsx b/docs/src/app/(private)/experiments/motion.tsx index 9a8ff70274..9884aa0a92 100644 --- a/docs/src/app/(private)/experiments/motion.tsx +++ b/docs/src/app/(private)/experiments/motion.tsx @@ -59,10 +59,10 @@ function AlwaysMounted() { function NoOpacity() { const [open, setOpen] = React.useState(false); - const action = React.useRef({ unmount: () => {} }); + const actionRef = React.useRef({ unmount: () => {} }); return ( - + Trigger {open && ( @@ -75,9 +75,7 @@ function NoOpacity() { animate={{ scale: 1 }} exit={{ scale: 0 }} onAnimationComplete={() => { - if (!open) { - action.current.unmount(); - } + actionRef.current.unmount(); }} /> } diff --git a/packages/react/src/popover/root/usePopoverRoot.ts b/packages/react/src/popover/root/usePopoverRoot.ts index 4ae27516f8..3f6bc4a769 100644 --- a/packages/react/src/popover/root/usePopoverRoot.ts +++ b/packages/react/src/popover/root/usePopoverRoot.ts @@ -77,8 +77,10 @@ export function usePopoverRoot(params: usePopoverRoot.Parameters): usePopoverRoo ); const handleUnmount = useEventCallback(() => { - setMounted(false); - setOpenReason(null); + if (!open) { + setMounted(false); + setOpenReason(null); + } }); useAfterExitAnimation({ @@ -236,7 +238,7 @@ export namespace usePopoverRoot { */ closeDelay?: number; /** - * A ref to manually unmount the popover. + * A ref to imperative actions. */ action?: React.RefObject<{ unmount: () => void }>; }