Drawer
A drawer is a panel that slides in from the right side of the screen. The Drawer is overlayed on top of the main area of the page to capture the users attention while keeping the context of the current task.
import { ... } from '@ag.ds-next/react/drawer';
Usage
Drawer components can be imported via the drawer
entrypoint in the @ag.ds-next/react
package.
For example:
import { ... } from '@ag.ds-next/react/drawer';
Props
Prop | Type | Description |
---|---|---|
onDismiss | () => void | Function to be called when the drawer is closed. |
title | string | The title of the drawer. It can span lines but should not be too long. |
actions? | ReactNode | The actions to display at the bottom of the drawer. Typically a `ButtonGroup`. |
children? | ReactNode | |
isOpen? | booleanDefault: "false" | If true, the drawer will be displayed. |
width? | "md" | "lg"Default: "md" | The width of the drawer. |
Source
You can view the full source code for this package on Github.