← DOCS
navigation

CollapsedNav

Navigation with items dispersed around screen edges, inspired by collapse demo.

npx chaos add collapsed-nav

PREVIEW

COLLAPSE

USAGE

case 'glass-button': return ; case 'neon-glow': return ; case 'floating-button': return ;
import { CollapsedNav } from '@oalacea/chaosui/navigation/collapsed-nav';

<CollapsedNav items={[
  { label: 'Work', href: '#work' },
  { label: 'About', href: '#about' },
  { label: 'Data', href: '#data' }
]} />

PROPS

PropTypeDefault
itemsNavigation items
NavItem[]-
chaosLevelDispersion amount
"low" | "medium" | "high""medium"