App Layout
Basic Usage
Loading...
Installation
pnpm add @corew500/uiUsage
import { AppLayout } from "@corew500/ui/app-layout"
<AppLayout>Content</AppLayout>CMS Integration
Loading...
API Reference
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| sidebar* | enum | — | Sidebar element (use AppSidebar or custom Sidebar) |
| header | enum | — | Header element (use AppHeader or custom header) |
| className | string | — | Additional className for the layout wrapper |
| contentClassName | string | — | Additional className for the main content area |
| defaultOpen | enum | true | Default sidebar open state |
Accessibility
Keyboard Navigation
- Keyboard accessible navigation via underlying Sidebar component
Screen Readers
- Sidebar trigger includes accessible label for screen readers
Additional
- - Uses semantic HTML elements (header, main, nav)
- Navigation items support isActive state for current page indication
Localization
Translatable Content
- - Pass translated strings to title props and nav item titles
Additional
- Section titles in nav prop should be localized
- Use renderLink for framework-specific internationalized routing