PageLayout

Combines PageHeader with AsyncContent for consistent page structure.

Props

PageLayoutProps<T>

Prop	Type	Required	Description
title	string | ReactNode	No	Page title
subtitle	string | ReactNode	No	Page subtitle
backButton	BackButtonConfig	No	Back button configuration
actions	ReactNode	No	Header action buttons
isLoading	boolean	No	Loading state
error	Error | null	No	Error object
data	T | null	No	Data for async content
isEmpty	boolean	No	Override empty detection
children	ReactNode | (data: T) => ReactNode	Yes	Page content
onRetry	() => void	No	Retry callback
loadingComponent	ReactNode	No	Custom loading UI
errorComponent	ReactNode	No	Custom error UI
emptyComponent	ReactNode	No	Custom empty UI
className	string	No	Container class
headerClassName	string	No	Header class
contentClassName	string	No	Content class

BackButtonConfig

Property	Type	Description
to	string	Navigation URL
label	string	Button label
onClick	() => void	Custom click handler

Example

<PageLayout
  title="Users"
  subtitle="Manage user accounts"
  backButton={{ to: '/dashboard' }}
  actions={<Button>Add User</Button>}
  isLoading={isLoading}
  error={error}
  data={users}
  onRetry={refetch}
>
  {(users) => <UserTable users={users} />}
</PageLayout>

See also

• PageLayout (Conceptual)
• AsyncContent