@eds/page-header
v4.0.7
PageHeader
Helps users understand what the content of the page is about. The PageHeader should always be at the top of a page.Prop | Required | Description | Type |
---|---|---|---|
breadcrumbs | ✅ | Props for the Breadcrumbs, which is used to communicate the user's current location in the site's hierarchical structure. | BreadcrumbsProps |
heading | ✅ | The main heading, offers immediate context about the page content. | string |
actions | — | Static list of actions. First two actions are displayed as Button, the rest goes into ActionsDropdown | Action[] |
avatar | — | Props for the Avatar. The primary avatar, displayed to the left of the title, will always be xlarge. The secondary avatar, displayed at the bottom of the title, will be xsmall. | { primary?: AvatarProps; secondary?: AvatarProps & { name: string; }; } |
badge | — | Props for the Badge, which is used to communicate the current status. | BadgeProps |
contextualItems | — | Optional info that can be displayed alongside the badge and/or tag, or on it's own. | ContextualItems |
tabs | — | Compose Tabs using a list of NavigationalTabItemProps. | NavigationalTabItemProps[] |
tag | — | Specific props for the Tag, which is suitable for highlighting crucial details. | Pick<TagProps, "label" | "disabled" | "maxWidth" | "tone" | "weight"> |