PopoverContent

Overview

The floating content panel of a popover, rendered inside a portal. Positioned relative to the trigger or anchor element.

Theme entry: PopoverContent

Props

Name	Type	Required	Default	Description
themeOverride	String|Object|Array		null	A partial theme object merged with the component's default theme; accepts a class string, class array, or theme object.
class	import('vue').HTMLAttributes['class']		undefined	Additional CSS classes to apply to the root element.
side	string		undefined	The preferred side of the trigger to render against.
sideOffset	number		4	The distance in pixels from the trigger.
align	string		"center"	The preferred alignment against the trigger.
alignOffset	number		undefined	An offset in pixels from the alignment edge.
avoidCollisions	boolean		undefined	When true, overrides side and align to avoid collisions with boundary edges.
collisionPadding	number|object		undefined	The padding between the content and the boundary edge.
forceMount	boolean		undefined	Whether to force mount the content.
sticky	string		undefined	When true, keeps the content in place relative to the trigger even when it overflows.
hideWhenDetached	boolean		undefined	When true, hides the content when the trigger is fully occluded.
as	string|object		undefined	Forces content to render as a specific element.
asChild	boolean		false	When true, merges props onto the child element instead of rendering a wrapper.
trapFocus	boolean		undefined	When true, prevents auto-focusing the first focusable element.

Slots

default

Slot.

Events

Name	Description
openAutoFocus	Emitted when focus moves inside the content after it opens.
closeAutoFocus	Emitted when focus returns to the trigger after the content closes.
escapeKeyDown	Emitted when the Escape key is pressed.
pointerDownOutside	Emitted when a pointer-down event occurs outside the content.
focusOutside	Emitted when focus moves outside the content.
interactOutside	Emitted when any interaction occurs outside the content.

Full event reference

Source

client/lib/shell/popover/PopoverContent.vue