Side nav

A vertical list of links used for site navigation, typically placed beside body content.

import { ... } from '@ag.ds-next/react/side-nav';

Usage

Side nav components can be imported via the side-nav entrypoint in the @ag.ds-next/react package.

For example:

import { ... } from '@ag.ds-next/react/side-nav';

SideNav Props
Prop	Type	Description
activePath	string	Used for highlighting the active element.
items	SideNavMenuItem[]	The list of links.
title	string	The title is placed at the top of the list of links.
background?	"body" \| "bodyAlt"Default: "body"	If SideNav is placed on 'bodyAlt' background, please set this to 'bodyAlt'.
collapseTitle?	string	@deprecated Unused. The title is now always used, even when collapsed.
subLevelVisible?	"always" \| "whenActive"Default: "whenActive"	When to show sub-level navigation items.
titleLink?	string	If provided, the title will be rendered as an anchor element.

You can view the full source code for this package on Github.