Page
The Page component is deprecated and will be removed in a future release. Please use PageLayout instead.
The Page component provides the basic layout for your app with slots for a header, sidebar, main content, and a detail view. The Main slot is the only slot that is mandatory for rendering the Page; every other slot is optional.
Check out the UI and design guidelines for more information on how to structure your app using the page.
PageProps
The Page component is deprecated and will be removed in a future release. Please use PageLayout instead.
, <<>, keyof >, , , , | Name | Type | Default | Description |
|---|---|---|---|
disableAnimations? | false | Whether animations should be disabled. If true or 'prefers-reduced-motion' is set to 'reduce', no animations are applied. |
Page.Header
The Page.Header is rendered at the very top of the page. Take a look at the UI and design guidelines for information on which components we recommend to use in the header.
HeaderProps
Deprecated along with the Page component. Please use PageLayout.Header instead.
, <<>, keyof >, , Page.Sidebar
The Page.Sidebar is the first slot of the page you can use to display content. Take a look at the UI and design guidelines for information on which content we recommend to use in the sidebar.
SidebarProps
Signature:
export declare type SidebarProps = | ;Page.Main
You should use the Page.Main compound to display the main content of your application. Take a look at the UI and design guidelines for information on which content we recommend to use in the main view.
MainProps
Deprecated along with the Page component. Please use PageLayout.Content instead.
, , , <<>, keyof >| Name | Type | Default | Description |
|---|---|---|---|
minWidth? | 320 | The minimum width of the main panel in pixels. |
Page.DetailView
The Page.DetailView can be leveraged to provide additional information related to the main content. Take a look at the UI and design guidelines for information on which content we recommend to use in the detail view.
DetailViewProps
Signature:
export declare type DetailViewProps = | ;Page.PanelControlButton
The Page.PanelControlButton updates the dismissed state of an uncontrolled panel. The button automatically renders the correct icons depending on the panel state.
PanelControlButtonProps
Deprecated along with the Page component and will be removed in a future release.
<<>, | | >| Name | Type | Default | Description |
|---|---|---|---|
action? | | | | | The action triggered by the button. |
target? | | | | The target panel controlled by the button. |