Type Alias: DrawerProps
DrawerProps:
object
Drawer component props.
Type declaration
| Name | Type | Description |
|---|---|---|
activeIconColor | DrawerItemProps["activeIconColor"] | Color of the active drawer item icons |
backgroundColor | StyledDrawerProps["backgroundColor"] | Background color of the drawer |
buttonSx | SxProps<Theme> | Custom styles for drawer buttons, following the sx (opens in a new tab) pattern. |
collapsed | boolean | Whether the drawer is collapsed |
collapsedWidth | StyledDrawerProps["collapsedWidth"] | Width of the drawer when collapsed |
collapsible | boolean | Whether the drawer is collapsible |
collapsibleIcon | ReactNode | (collapsed?) => ReactNode | Icon to use for the collapsible button |
collapsibleIconBgColor | string | Background color of the collapsible icon |
collapsibleIconColor | string | Color of the collapsible icon |
currentId | string | ID of the currently active item, changing the menu item to active when the page selected corresponds to the path name. |
customToggle | (toggleDrawer, collapsed?) => ReactNode | Custom node that can be rendered on the bottom of the Drawer, serving as toggle for expanded/collapsed state. |
expandedWidth | StyledDrawerProps["expandedWidth"] | Width of the drawer when expanded |
horizontal | boolean | Whether the drawer items should be displayed horizontally |
iconColor | DrawerItemProps["iconColor"] | Color of the drawer item icons |
items | DrawerItemProps[] | Array of items to display in the drawer |
logo | string | ReactNode | (collapsed?) => ReactNode | Logo to display in the drawer header |
mobileIsOpen | boolean | Whether the drawer is open on mobile devices |
onCollapsedChange | (collapsed) => void | Callback function to handle changes to the collapsed state |
onMobileClose | () => void | Callback function to handle closing the drawer on mobile devices |
sx | StyledDrawerProps["sx"] | Custom styles for the drawer, following the sx (opens in a new tab) |
textProps | TextProps | Props for text elements inside the drawer |
Defined in
packages/react-material-ui/src/components/Drawer/Drawer.tsx:17 (opens in a new tab)