DashboardShell

DASHBOARD

Full dashboard layout with collapsible sidebar, user info, and responsive design.

[EXAMPLES]

Usage
DashboardShell is a full-page layout. See code example for usage.

[PROPS]

PROPTYPEDEFAULTDESCRIPTION
sidebarItems{ id: string; label: string; href: string; icon?: ReactNode }[]Sidebar navigation items
user{ name: string; tier?: string }User info for sidebar footer
onSignOut() => voidSign out callback
logoReactNodeLogo element in sidebar header

[ACCESSIBILITY]

KEYBOARD SHORTCUTS

KEYACTION
TabNavigate sidebar items

ARIA

  • >nav element for sidebar
  • >Semantic landmarks for layout regions