diff --git a/.yarn/versions/08415281.yml b/.yarn/versions/08415281.yml new file mode 100644 index 000000000..a56fd957b --- /dev/null +++ b/.yarn/versions/08415281.yml @@ -0,0 +1,5 @@ +releases: + "@radix-ui/react-popover": patch + +declined: + - primitives diff --git a/packages/react/popover/src/Popover.stories.tsx b/packages/react/popover/src/Popover.stories.tsx index 28a3af795..b7349022d 100644 --- a/packages/react/popover/src/Popover.stories.tsx +++ b/packages/react/popover/src/Popover.stories.tsx @@ -280,6 +280,25 @@ export const WithSlottedTrigger = () => { ); }; +export const TriggerDoesntToggleClose = () => { + return ( +
+ + open + + + close + + + + + +
+ ); +}; + // change order slightly for more pleasing visual const SIDES = SIDE_OPTIONS.filter((side) => side !== 'bottom').concat(['bottom']); diff --git a/packages/react/popover/src/Popover.tsx b/packages/react/popover/src/Popover.tsx index 215f5173a..aef77e51f 100644 --- a/packages/react/popover/src/Popover.tsx +++ b/packages/react/popover/src/Popover.tsx @@ -49,6 +49,7 @@ interface PopoverProps { children?: React.ReactNode; open?: boolean; defaultOpen?: boolean; + toggleOpen?: boolean; onOpenChange?: (open: boolean) => void; modal?: boolean; } @@ -59,6 +60,7 @@ const Popover: React.FC = (props: ScopedProps) => { children, open: openProp, defaultOpen, + toggleOpen = true, onOpenChange, modal = false, } = props; @@ -79,7 +81,10 @@ const Popover: React.FC = (props: ScopedProps) => { triggerRef={triggerRef} open={open} onOpenChange={setOpen} - onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])} + onOpenToggle={React.useCallback( + () => (toggleOpen ? setOpen((prevOpen) => !prevOpen) : setOpen(true)), + [setOpen, toggleOpen] + )} hasCustomAnchor={hasCustomAnchor} onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])} onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])}