Popover API

A headless component for creating popovers and tooltips using modern CSS anchor positioning.

Explore these related pages for additional context and usage patterns.

Page	Category
Popover	Disclosure
usePopover	System
Expansion Panel	Disclosure

id

string | undefined

Unique identifier for the popover (auto-generated if not provided)

modelValue

boolean | undefined

Default: false

default

PopoverRootSlotProps

target

string | undefined

Target popover ID (defaults to parent PopoverRoot id)

default

PopoverActivatorSlotProps

id

string | undefined

Unique identifier (defaults to parent PopoverRoot id)

positionArea

string | undefined

CSS position-area value for anchor positioning

positionTry

string | undefined

CSS position-try value for fallback positioning

beforetoggle

[e: ToggleEvent]

default

PopoverContentSlotProps

Popover API

Popover.Root

Props

id

modelValue

Slots

default

Popover.Activator

Props

target

Slots

default

Popover.Content

Props

id

positionArea

positionTry

Events

beforetoggle

Slots

default