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.import {XDSSideNavItem} from '@xds/core/SideNav'
Best 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. |