Attaches a portaled popover, attached to the parent node. Can be used to create dropdowns, tooltips etc. The parent scoped shadow styles are copied to the created portals shadow styles, to allow styling popover contents externally.
Props
arrow
If the popover should render an arrow.
boolean
false
attachTo
Pass an element to attach the popover to. (Defaults to the parent element.)
HTMLElementor
undefined
autoSize
Constrain the size of the popover to the size of the attachment node.
bothor
heightor
noneor
width
none
backdrop
If the popover should overlay a backdrop, to prevent external clicks.
boolean
false
closeOnBlur
If the popover should request to close when focus is lost
boolean
false
closeOnClickOutside
If the popover should request to close when clicked outside
boolean
false
closeOnEsc
If the popover should request to close when esc is pressed
boolean
false
closeOnScrollEscape
If the popover should request to close when the attachment element scrolls out of view
boolean
false
constrain
Constrain the size of the popover inner to the size of the window.
bothor
heightor
noneor
width
height
flip
An array of allowed placements or enable / disable
Placement[]or
booleanor
undefined
true
hideOnScrollEscape
If the popover should hide itself when the attachment element scrolls out of view
boolean
true
maxHeight
The maximum height to constrain to.
number
Infinity
maxWidth
The maximum width to constrain to.
number
Infinity
offset
The offset away from the attachement element in px.
number
0
open
Toggles if the popover is open or not.
boolean
false
placement
Where to place the popover in relation to the attachment point.
bottomor
bottom-endor
bottom-startor
leftor
left-endor
left-startor
rightor
right-endor
right-startor
topor
top-endor
top-start
top
popperClass
Class name for the popper
stringor
undefined
target
A query selecter to select the element to portal the popper to.
string
body
trapFocus
If the popover should trap focus within, and return focus on close.
boolean
false
zIndex
What zIndex to place the popover in.
numberor
undefined
Placement
Events
requestClose
any
Triggers when the popover requests to close.