Prop	Default	Type
align		'start' | 'center' | 'end' The preferred alignment against the trigger. May change when collisions occur.
alignOffset		number An offset in pixels from the start or end alignment options.
arrowPadding		number The padding between the arrow and the edges of the content. If your content has border-radius, this will prevent it from overflowing the corners.
as	'div'	AsTag | Component The element or component this component should render as. Can be overwritten by asChild.
asChild		boolean Change the default rendered element for the one passed as a child, merging their props and behavior. Read our Composition guide for more details.
avoidCollisions		boolean When true, overrides the side andalign preferences to prevent collisions with boundary edges.
collisionBoundary		Element | (Element | null)[] | null The element used as the collision boundary. By default this is the viewport, though you can provide additional element(s) to be included in this check.
collisionPadding		number | Partial<Record<'top' | 'right' | 'bottom' | 'left', number>> The distance in pixels from the boundary edges where collision detection should occur. Accepts a number (same for all sides), or a partial padding object, for example: { top: 20, left: 20 }.
forceMount		boolean Used to force mounting when more control is needed. Useful when controlling animation with Vue animation libraries.
hideWhenDetached		boolean Whether to hide the content when the trigger becomes fully occluded.
loop		boolean When true, keyboard navigation will loop from last item to first, and vice versa.
prioritizePosition		boolean Force content to be position within the viewport. Might overlap the reference element, which may not be desired.
side		'top' | 'right' | 'bottom' | 'left' The preferred side of the trigger to render against when open. Will be reversed when collisions occur and avoidCollisions is enabled.
sideOffset		number The distance in pixels from the trigger.
sticky		'partial' | 'always' The sticky behavior on the align axis. partial will keep the content in the boundary as long as the trigger is at least partially in the boundary whilst "always" will keep the content in the boundary regardless.
updatePositionStrategy		'always' | 'optimized' Strategy to update the position of the floating element on every animation frame.

Emit	Payload
closeAutoFocus	[event: Event] Event handler called when auto-focusing on close. Can be prevented.
escapeKeyDown	[event: KeyboardEvent] Event handler called when the escape key is down. Can be prevented.
focusOutside	[event: FocusOutsideEvent] Event handler called when the focus moves outside of the DismissableLayer. Can be prevented.
interactOutside	[event: PointerDownOutsideEvent | FocusOutsideEvent] Event handler called when an interaction happens outside the DismissableLayer. Specifically, when a pointerdown event happens outside or focus moves outside of it. Can be prevented.
pointerDownOutside	[event: PointerDownOutsideEvent] Event handler called when the a pointerdown event happens outside of the DismissableLayer. Can be prevented.