Floating element for displaying rich content, triggered by a button.
This component inherits props from the Popover primitive.
Contains all the parts of a popover.
Wraps the control that will open the popover.
Contains content to be rendered in the open popover. This component is based on the div
element.
Prop | Type | Default |
---|---|---|
asChild | boolean | |
size | Responsive<"1" | "2" | "3" | "4"> | "2" |
width | Responsive<string> | |
minWidth | Responsive<string> | |
maxWidth | Responsive<string> | "480px" |
height | Responsive<string> | |
minHeight | Responsive<string> | |
maxHeight | Responsive<string> |
Wraps the control that will close the popover.
Use the size
prop to control size of the popover. It will affect the padding
and border-radius
of the Content.
Use it in conjunction with the width
/minWidth
/maxWidth
and height
/minHeight
/maxHeight
props to control the size of the popover.
Use the Inset component to align content flush with the sides of the popover.