Popover
Free-form anchored floating panel.
Loading interactive example
Choose Popover for compact contextual content or controls anchored to a trigger. For inline confirmation, name the target, keep pending and failure state in the consumer, and close only after confirmed success. Use onCloseAutoFocus when an action moves focus to another destination.
API
| Member | Type | Kind | Required | Default |
|---|---|---|---|---|
anchor | HTMLElement | Measurable | null | prop | No | null |
children | Snippet | snippet | Yes | |
flush | boolean | prop | No | false |
focusOnOpen | boolean | prop | No | true |
onCloseAutoFocus | (event: Event) => void | callback | No | undefined |
onOpenChange | (open: boolean) => void | callback | No | undefined |
open | boolean | binding | No | false |
placement | PopoverPlacement | prop | No | 'bottom' |
sameWidth | boolean | prop | No | false |
trigger | Snippet | Snippet<[Record<string, unknown>]> | undefined | snippet | No | undefined |
triggerMode | 'delegated' | 'legacy' | never | prop | No | undefined |
Source
Loading source