Popover

A non-modal panel anchored to a trigger.

Examples

Basic

API

Prop	Type	Default
`label*` Accessible name for the panel (role="dialog").	`string`	—
`align` Which trigger edge the panel lines up with. Flips automatically near the viewport edge.	`"end" \| "start"`	`"start"`
`open` Whether the panel is open.	`boolean`	`false`

Event	Payload
`update:open` `v-model:open` update.	`[value: boolean]`

Slot	Props
`trigger` The trigger. Bind `attrs` to a `<button>`.	`{ isOpen: boolean; attrs: Record<string, unknown>; }`
`default` Panel content. Mounted on first open.	`{ close: () => void; }`

Styling

Parts: popover-anchorpopover
States: data-popover-align

Keyboard

Keys	Action
`Enter` / `Space`	Toggle
`Escape`	Close and return focus to the trigger
`Tab`	Move through the panel; leaving it closes it

Accessibility

Focus moves into the panel on open.