Popover

Floating panel anchored to a trigger. Styled over the headless popover primitive, which flips and shifts to stay in the viewport, moves focus into the panel on open, returns it on close, and closes on Escape or an outside press.

This component needs the popover primitive — two ways to get it:

• Copy: fetch /r/primitives/popover.txt — one file with the shared core embedded — and save it as primitives/popover.js relative to your components/ui/ directory.
• Install: npm install @presetui/ui — the primitives are bundled, no second package — then use the Source · npm tab below, whose import already points at @presetui/ui/primitives/popover.

Props

Notes

For full control — custom anchors, arrows, or your own markup — use the primitive directly: Popover, PopoverTrigger, PopoverAnchor, PopoverContent, PopoverClose. Styling hooks are data-state and data-side.