SideNav

SideNav can be used either for in-page navigation, or for lists of articles under a given topic.

Import Syntax

xxxxxxxxxx
 
import SideNav, {
  SideNavTitle,
  SideNavLink
} from 'calcite-react/SideNav'

Basic Usage

 
<SideNav>
  <SideNavTitle>Sidenav Group</SideNavTitle>
  <nav>
    <SideNavLink>Agricultural</SideNavLink>
    <SideNavLink>Transition</SideNavLink>
    <SideNavLink>Perpetual</SideNavLink>
    <SideNavLink>Cultural</SideNavLink>
  </nav>
</SideNav>

Props

SideNav `default`

Property	Type	Required	Default	Description
children	Node	false	-	The content of the component.

SideNavTitle

Property	Type	Required	Default	Description
children	Node	false	-	The content of the component.

SideNavLink

Property	Type	Required	Default	Description
children	Node	false	-	The content of the component.
disabled	Bool	false	-	Toggle the disabled state of the SideNavLink, results in the item being unselectable and slightly lower opacity

Calcite React

SideNav

Import Syntax

Basic Usage

Props

SideNav default

SideNavTitle

SideNavLink

SideNav `default`