DashboardHeader API

API reference docs for the React DashboardHeader component. Learn about the props, CSS, and other APIs of this exported module.

Demos

For examples and details on the usage of this React component, visit the component demo pages:

import { DashboardHeader } from '@toolpad/core/DashboardLayout';

Name	Type	Default	Description
menuOpen*	bool	-	If `true`, show menu button as if menu is expanded, otherwise show it as if menu is collapsed.
onToggleMenu*	func	-	Callback fired when the menu button is clicked.
branding	{ homeUrl?: string, logo?: node, title?: string }	null	Branding options for the header.
hideMenuButton	bool	false	Whether the menu icon should always be hidden.
slotProps	{ appTitle?: { branding?: { homeUrl?: string, logo?: node, title?: string } }, toolbarAccount?: { localeText?: object, slotProps?: { popover?: object, popoverContent?: object, preview?: object, signInButton?: object, signOutButton?: object }, slots?: { popover?: elementType, popoverContent?: elementType, preview?: elementType, signInButton?: elementType, signOutButton?: elementType } }, toolbarActions?: object }	{}	The props used for each slot inside.
slots	{ appTitle?: elementType, 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	Default component	Description
appTitle	`Link`	The component used for the app title section.
toolbarActions	`ToolbarActions`	The toolbar actions component to be used.
toolbarAccount	`Account`	The toolbar account component to be used.

If you did not find the information in this page, consider having a look at the implementation of the component for more detail.