XDS — Design System

SideNavItem@xds/core v0.0.13 · XDSSideNavItem

Usage

A sidebar navigation component for organizing application pages with sections, nested items, and icons. Use SideNav as the primary navigation when an app has 5 or more destinations or requires hierarchical grouping.

ts
import {XDSSideNavItem} from '@xds/core/SideNav'

Best practices

Guidance	Practices
Do	Use sections to group related navigation items and help users scan for their destination.
Do	Pair outline and filled icon variants so the selected state is visually distinct.
Don't	Include a SideNavHeading when a TopNav is already providing app identity — this duplicates branding.
Don't	Use for filtering content — use tabs or filter buttons instead.