DashboardLayout API
API reference docs for the React DashboardLayout component. Learn about the props, CSS, and other APIs of this exported module.
Demos
Import
import { DashboardLayout } from '@toolpad/core/DashboardLayout';
// or
import { DashboardLayout } from '@toolpad/core';Learn about the difference by reading this guide on minimizing bundle size.
Props of the native component are also available.
| Name | Type | Default | Description |
|---|---|---|---|
| children* | node | - | The content of the dashboard. |
| disableCollapsibleSidebar | bool | false | Whether the sidebar should not be collapsible to a mini variant in desktop and tablet viewports. |
| slotProps | { toolbarAccount?: { localeText?: { signInLabel: string, signOutLabel: string }, slotProps?: { iconButton?: object, signInButton?: object, signOutButton?: object }, slots?: { menuItems?: elementType, signInButton?: elementType, signOutButton?: elementType } }, toolbarActions?: object } | {} | The props used for each slot inside. |
| slots | { toolbarAccount?: elementType, toolbarActions?: elementType } | {} | The components used for each slot inside. See Slots API below for more details. |
The component cannot hold a ref.
| Slot name | Class name | Default component | Description |
|---|---|---|---|
| toolbarActions | ToolbarActions | The toolbar actions component used in the layout header. | |
| toolbarAccount | Account | The toolbar account component used in the layout header. |
Source code
If you did not find the information in this page, consider having a look at the implementation of the component for more detail.