Popover
A floating panel anchored to a trigger element for displaying additional content. Built on Radix UI Popover.
Default
Usage
Use popovers for interactive content like forms, pickers, or settings that are tied to a specific element.
For non-interactive preview content, use a Hover Card. For simple text, use a Tooltip.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| open | boolean | — | Controlled open state |
| onOpenChange | (open: boolean) => void | — | Callback when open state changes |
| align | "start" | "center" | "end" | "center" | Alignment (on PopoverContent) |
| sideOffset | number | 0 | Distance from trigger in px (on PopoverContent) |