Sidebar Nav

Grouped sidebar menu with section labels, icon rows, optional counters, and a muted active state.

Workspace

Admin

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Nav14 } from "@/components/beste/piece/nav14";

<Nav14
  groups={[
    {
      "label": "Workspace",
      "items": [
        {
          "label": "Home",
          "icon": "home",
          "active": true
        },
        {
          "label": "Projects",
          "icon": "kanban",
          "count": 4
        },
        {
          "label": "Team",
          "icon": "users"
        }
      ]
    },
    {
      "label": "Admin",
      "items": [
        {
          "label": "Analytics",
          "icon": "chart"
        },
        {
          "label": "Settings",
          "icon": "settings"
        }
      ]
    }
  ]}
/>