Block · C-054 · erp

SideNav

Grouped side navigation with an active state, counts and an optional footer. A plain click is intercepted to navigate without a reload; modified clicks still open new tabs.

Install

Blocks compose Koten primitives; install koten-theme first.

npx shadcn@latest add https://koten.codehive.com.co/r/side-nav.json

Anatomy

This block composes Koten primitives. Read the source files before changing it.

@/components/patterns/side-nav.tsx
@/lib/koten/cn.ts
@/lib/koten/format.ts
@/lib/koten/intl.ts
@/lib/koten/labels.ts
@/lib/koten/provider.tsx

Accessibility

The active item uses aria-current="page"; the bar and background reinforce the colour.
onNavigate intercepts plain clicks only: Cmd, Ctrl, Shift, Alt and middle click still open a tab.
The count is tabular text inside the link, so the accessible name includes the label and the number.
Each group uses an h2 inside the nav; do not add another h1 in the bar.

Read the whole page

Markdown page
Agent index (llms.txt)
Full documentation (llms-full.txt)