
Sidenav is a responsive shell container for side surfaces. Use it when a page or app shell needs a side region that can open, close, push content, overlay content, sit beside content, collapse to icon width, show a backdrop, adapt to a mobile breakpoint, and manage focus.
Compose Sidenav with ngs-sidenav-container, ngs-sidenav, and ngs-sidenav-content. For admin navigation shells, place ngs-sidebar inside ngs-sidenav; Sidebar owns the actual navigation items.
Do not use Sidenav as the navigation structure itself, a temporary task drawer, a persistent tabbed tool panel, a static local column, a modal, a confirmation dialog, or an action menu. Use Sidebar, Navigation, Drawer, SidePanel, Panel, LayoutSidebar, Dialog, Confirm, or Menu when those match the job better.