AppSidebar
Pre-wired sidebar with Brand / Nav / Footer slots
SSR mode
Examples
Default
Page content
Wide, no border
Wide rail, no right border
API
The element family below can be composed together. Click an element to jump to its properties.
| Element | Purpose |
|---|---|
| AppSidebar | Pre-wired sidebar with three slots: Brand (top), Nav (scrollable middle), Footer (bottom). A column flex <aside> with fixed width and full height, designed to live inside an AppShell.Sidebar slot or freestanding. Wrapper-styling. |
AppSidebar
Pre-wired sidebar with three slots: Brand (top), Nav (scrollable middle), Footer (bottom). A column flex <aside> with fixed width and full height, designed to live inside an AppShell.Sidebar slot or freestanding. Wrapper-styling.
| Property | Type | Required | Description |
|---|---|---|---|
| Brand | RenderFragment? | Branding row at the top. Typically an AppBrand chunk. | |
| Nav | RenderFragment? | Main nav slot. Typically a <NavList>. | |
| Footer | RenderFragment? | Footer row at the bottom. Typically a version label, AccountMenu, or settings link. | |
| Borders | bool | Toggles border-r border-border on the aside, plus border-b/border-t on Brand/Footer wrappers. Default: true. | |
| Gutters | bool | Toggles p-4 on Brand and Footer wrappers. Default: true. Nav slot stays controlled by its inner content. | |
| BgFilled | bool | Toggles bg-background. Default: true. | |
| Width | Size | Sidebar width via the shared Size enum (mapped through SizeClasses.Width). Default: Size.Md (w-56). Common values: Sm (w-48), Md (w-56), Lg (w-72). |