Containers

PanelHeader

The title row at the top of a builder panel, with room for actions.

Importimport { PanelHeader } from "@/components/ui/PanelHeader";
Sourcesrc/components/ui/PanelHeader

The title row at the top of a panel — twelve builder panels use it, which is why it is worth having rather than each panel styling its own heading.

Default

Pages

Slots

leftSlot takes a back button or an icon; rightSlottakes the panel's actions. Keep the right side to one or two IconButtons — a panel header is not a toolbar.

Collections

Props

PanelHeader

PropTypeDefaultDescription
titlestringRequired. The panel's name.
leftSlotReactNodeContent before the title.
rightSlotReactNodeActions after the title.