Popover
Popover is a hidden panel connected to an element. The popover will be placed on top of all other elements in the interface. You control when and how it should be displayed and hidden.
Read more about this component in the Aksel documentation.
Keyboard interaction is incomplete. Missing esc to close popover.
top
bottom
right
left
top-start
top-end
bottom-start
bottom-end
right-start
right-end
left-start
left-end
Properties
| Property | Description | Default | Control | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Properties | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| anchorEl | Element popover anchors to Element undefined | - | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| open | Open state boolean | false | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| arrow | Adds a arrow from dialog to anchor when true boolean | true | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| contentClass | Class to add to the popover content string unknown unknown | - | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| flip | Changes placement of the floating element in order to keep it in view. boolean | true | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| offset | Distance from anchor to popover number | - | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| placement | Orientation for popover "top" "bottom" "right" "left" "top-start" "top-end" "bottom-start" "bottom-end" "right-start" "right-end" | "top" | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| strategy | Changes what CSS position property to use You want to use "fixed" if reference element is inside a fixed container, but popover is not "absolute" "fixed" | "absolute" | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Snippets | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| children | Content | - | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Properties included from: HTMLAttributes<HTMLDivElement>