Popover

An anchored floating panel for interactive content. Unlike Tooltip, Popover content is interactive and can contain forms, buttons, or other components.

Primitive: PopoverARIA: role="dialog"Keyboard: Escape closes

Dimensions

Width

Height

popover.rs

use stratum_leptos::*;

view! {
    <Popover>
        <PopoverTrigger>
            <Button variant=ButtonVariant::Outline>
                "Open Popover"
            </Button>
        </PopoverTrigger>
        <PopoverContent>
            <Input label="Width" />
            <Input label="Height" />
        </PopoverContent>
    </Popover>
}

Installation

stratum add popover

Props

Prop	Type	Default	Description
open	Option<bool>	None	Controlled open state
default_open	bool	false	Initial state
side	PopoverSide	Bottom	Placement relative to trigger
align	PopoverAlign	Center	Alignment: Start, Center, End
modal	bool	false	Whether to trap focus
on_open_change	Option<Callback<bool>>	None	Fires when open state changes

Accessibility

Content renders with role="dialog".
Trigger gets aria-expanded and aria-haspopup="dialog".
Escape closes. Focus restores to trigger on close.

Source

Primitive: popover.rs
Styled: popover.rs