Viana Kitv0.1.4

Components

Navigation Menu

A set of navigational links with dropdowns.

example.tsx

Import

tsx
import {
  AppNavigationMenu,
  AppNavigationMenuList,
  AppNavigationMenuItem,
  AppNavigationMenuTrigger,
  AppNavigationMenuContent,
  AppNavigationMenuLink,
  AppNavigationMenuIndicator,
  AppNavigationMenuViewport,
  navigationMenuTriggerStyle,
} from "@/components/primitives/AppNavigationMenu"

API Reference

AppNavigationMenu extends all native <div> HTML attributes.

PropTypeDefaultDescription
classNamestringAdditional Tailwind classes merged via cn(). Prefer the wrapper pattern for reusable overrides.

Source

src/components/primitives/AppNavigationMenu.tsx
"use client"

import {
  NavigationMenu,
  NavigationMenuContent,
  NavigationMenuIndicator,
  NavigationMenuItem,
  NavigationMenuLink,
  NavigationMenuList,
  NavigationMenuTrigger,
  NavigationMenuViewport,
  navigationMenuTriggerStyle,
} from "../ui/navigation-menu"

function AppNavigationMenu(props: React.ComponentProps<typeof NavigationMenu>) {
  return <NavigationMenu {...props} />
}

function AppNavigationMenuList(props: React.ComponentProps<typeof NavigationMenuList>) {
  return <NavigationMenuList {...props} />
}

function AppNavigationMenuItem(props: React.ComponentProps<typeof NavigationMenuItem>) {
  return <NavigationMenuItem {...props} />
}

function AppNavigationMenuTrigger(props: React.ComponentProps<typeof NavigationMenuTrigger>) {
  return <NavigationMenuTrigger {...props} />
}

function AppNavigationMenuContent(props: React.ComponentProps<typeof NavigationMenuContent>) {
  return <NavigationMenuContent {...props} />
}

function AppNavigationMenuLink(props: React.ComponentProps<typeof NavigationMenuLink>) {
  return <NavigationMenuLink {...props} />
}

function AppNavigationMenuIndicator(props: React.ComponentProps<typeof NavigationMenuIndicator>) {
  return <NavigationMenuIndicator {...props} />
}

function AppNavigationMenuViewport(props: React.ComponentProps<typeof NavigationMenuViewport>) {
  return <NavigationMenuViewport {...props} />
}

export {
  AppNavigationMenu,
  AppNavigationMenuList,
  AppNavigationMenuItem,
  AppNavigationMenuTrigger,
  AppNavigationMenuContent,
  AppNavigationMenuLink,
  AppNavigationMenuIndicator,
  AppNavigationMenuViewport,
  navigationMenuTriggerStyle,
}