React Navigation Menu Component

Installation

pnpm add krz-ui

Usage

import { NavigationMenu } from "krz-ui";
import Link from "next/link";

<NavigationMenu
  linkComponent={Link}
  items={[
    {
      label: "Products",
      links: [
        { title: "Analytics", href: "/analytics", description: "Dashboards and reports." },
        { title: "Automation", href: "/automation", description: "Workflows that run themselves." },
      ],
    },
    { label: "Pricing", href: "/pricing" },
  ]}
/>

API Reference

Prop	Type	Description
`items`	`NavigationMenuItem[]`	Top-level items: a link (href) or a panel of links.
`items[].links`	`NavigationMenuLink[]`	Links with title, href, description and icon.
`items[].active`	`boolean`	Marks the current section.
`linkComponent`	`ElementType`	Component for links, e.g. Next.js Link. Defaults to a.
`openOnHover`	`boolean`	Open panels on hover as well as click. Defaults to true.
`className / style / ref`	`—`	All go to the outer element. See Customization.
`classNames`	`{ list?, item?, trigger?, chevron?, panel?, links?, link?, linkIcon?, linkTitle?, linkDescription? }`	Extra classes for inner parts.