A floating panel of content, opened from a button.
children |
ReactNode | PayloadChildRenderFunction<Payload> |
| – |
The content of the popover. This can be a regular React node or a render function that receives the |
defaultOpen | boolean | false | Whether the popover is initially open. To render a controlled popover, use the |
defaultTriggerId | string|null | – | ID of the trigger that the popover is associated with. This is useful in conjunction with the |
handle | PopoverHandle<Payload> | – | A handle to associate the popover with a trigger. If specified, allows external triggers to control the popover's open state. |
modal | boolean|"trap-focus" | false | Determines if the popover enters a modal state when open.
On touch devices, a When When |
onOpenChange | ((open: boolean, eventDetails: PopoverRootChangeEventDetails) => void) | – | Event handler called when the popover is opened or closed. |
onOpenChangeComplete | ((open: boolean) => void) | – | Event handler called after any animations complete when the popover is opened or closed. |
open | boolean | – | Whether the popover is currently open. |
triggerId | string|null | – | ID of the trigger that the popover is associated with. This is useful in conjunction with the |
Accepts className, style and render, plus every native attribute of the element it renders.
Accepts className, style and render, plus every native attribute of the element it renders.
Accepts className, style and render, plus every native attribute of the element it renders.
Accepts className, style and render, plus every native attribute of the element it renders.
Accepts className, style and render, plus every native attribute of the element it renders.
Accepts className, style and render, plus every native attribute of the element it renders.
PopoverCreateHandle is called, not rendered. It creates a handle: pass it as handle to a trigger and to the root, and the trigger can sit anywhere in the tree, outside the root.
undefined