Literal UI

import { AppShell } from '@literal-ui/core'import { AppShell } from '@literal-ui/core'

Props

interface AppShellProps {
  className?: string
  header?: ReactNode
  sidebar?: ReactNode
  navbar?: ReactNode
}
interface AppShellProps {
  className?: string
  header?: ReactNode
  sidebar?: ReactNode
  navbar?: ReactNode
}

Usage

<AppShell
  className="mx-auto max-w-3xl p-4"
  header={<TopAppBar {/* ... */} />}
  sidebar={<NavDrawer>{/* ... */}</NavDrawer>}
  navbar={<NavBar>{/* ... */}</NavBar>}
>
  {children}
</AppShell>
<AppShell
  className="mx-auto max-w-3xl p-4"
  header={<TopAppBar {/* ... */} />}
  sidebar={<NavDrawer>{/* ... */}</NavDrawer>}
  navbar={<NavBar>{/* ... */}</NavBar>}
>
  {children}
</AppShell>