Page

• All examples set the isManagedSidebar prop on the Page component to have the sidebar automatically close for smaller screen widths. You can also manually control this behavior by not adding the isManagedSidebar prop and instead:

  1. Add an onNavToggle callback to PageHeader
  2. Pass a boolean into the isNavOpen prop to PageSidebar

This demonstrates a variety of navigation patterns in the context of a full page layout. These can be used as a basis for choosing the most appropriate page template for your application.

Sticky section group

TS

Sticky section group (alternate syntax)

TS

Sticky section breadcrumb (with breakpoints)

TS

Context selector/perspective switcher in sidebar

TS