Sidebar layout with provider, variants, and mobile sheet integration.

O módulo está em @zexon/ui/components/sidebar. Inclui SidebarProvider, Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarGroup, SidebarMenu, SidebarMenuButton, SidebarMenuItem, submenus, SidebarTrigger, SidebarRail, SidebarInset, useSidebar, entre outros.

Em viewports estreitos, a barra pode ser mostrada dentro de um Sheet (comportamento interno do componente).

Uso compacto

O exemplo usa collapsible="none" para uma barra fixa num contentor de demonstração, sem depender do encolhimento nem do modo mobile.

Seção + itens

Navegação
Seção
Área principal ao lado da barra lateral

Provedor e estado

SidebarProvider envolve o layout que contém a barra e a área principal. useSidebar expõe open, setOpen, toggleSidebar e o modo mobile — útil para botões de menu personalizados.

Aplicações

Combine SidebarInset com a variante inset da barra para cartões com margem e borda na área principal (ver classes em SidebarInset no pacote). Use SidebarTrigger e atalho de teclado (definido no pacote) para alternar a visibilidade em layouts offcanvas ou icon.

Anterior:

Próximo: