Drawer
A triggerable drawer that overlaps whatever page it's on.
Usage#
API Reference#
Drawer#
This component is based on the Radix UI Dialog primitives.
Drawer.Trigger#
This component is used to create the trigger button that opens the drawer. It accepts props from the Radix UI Dialog Trigger component.
Drawer.Content#
This component wraps the content of the drawer. It accepts props from the Radix UI Dialog Content component.
Prop | Type | Default |
---|---|---|
overlayProps | ReactComponentPropsWithoutRef | - |
portalProps | ReactComponentPropsWithoutRef | - |
Drawer.Header#
This component is used to wrap the header content of the drawer.
This component is based on the div
element and supports all of its props.
Drawer.Title#
This component adds an accessible title to the drawer. It accepts props from the Radix UI Dialog Title component.
Drawer.Body#
This component is used to wrap the body content of the drawer.
This component is based on the div
element and supports all of its props
Drawer.Footer#
This component is used to wrap the footer content of the drawer.
This component is based on the div
element and supports all of its props.