Something went wrong while fetching comments. Please try again.
Created by: valerybugakov
A proposal for improving the PageHeader component API in response to changes required for accessibility fixes. The component API has grown and has become more coupled to components used in the internal implementation. To make the PageHeader component API more flexible and extensible, we can lean more into the composition of compounds component that would expose props of nested components (e.g., HeadingProps) automatically without polluting the top-level interface.
<PageHeader
annotation="Hello world!"
description="Enter the description for your section here. This is useful on list and create pages."
>
<PageHeader.Heading as="h2" styleAs="h1">
<PageHeader.Breadcrumb to="/level-0" icon={PuzzleOutlineIcon} />
<PageHeader.Breadcrumb to="/level-1">Level 1</PageHeader.Breadcrumb>
<PageHeader.Breadcrumb>Level 2</PageHeader.Breadcrumb>
</PageHeader.Heading>
</PageHeader>We can use this approach more frequently for components with growing complexity to make them flexible. Especially it can be helpful for components reused in multiple client applications with slightly different requirements.
PageHeader component
PageHeader.Heading to expose Heading API.PageHeader.Breadcrumb to use a more Reactish approach for defining PageHeader breadcrumbs.HeadingElement type export warning.Ensure that there're no visual changes to the PageHeader component.
Check out the client app preview documentation to learn more.