"use client"; import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu"; import { cva } from "class-variance-authority"; import type * as React from "react"; import { ThemeIcon } from "@/components/registry/primitives/core/theme-icon"; import { cn } from "@/lib/registry/cn"; function NavigationMenu({ className, children, viewport = true, ...props }: React.ComponentProps & { viewport?: boolean; }) { return ( {children} {viewport && } ); } function NavigationMenuList({ className, ...props }: React.ComponentProps) { return ( ); } function NavigationMenuItem({ className, ...props }: React.ComponentProps) { return ( ); } const navigationMenuTriggerStyle = cva( "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background py-2 ps-4 pe-5 text-neutral text-base font-medium hover:bg-neutral-background hover:text-neutral focus-visible:bg-transparent focus-visible:text-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent-background data-[state=open]:text-neutral data-[state=open]:focus-visible:bg-transparent data-[state=open]:bg-accent-background focus-visible:ring-primary/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 [&.active]:bg-primary-background [&.active]:text-foreground [&.active]:hover:bg-primary-background [&.active]:hover:text-foreground", ); function NavigationMenuTrigger({ className, children, ...props }: React.ComponentProps) { return ( {children}{" "} ); } function NavigationMenuContent({ className, ...props }: React.ComponentProps) { return ( ); } function NavigationMenuViewport({ className, ...props }: React.ComponentProps) { return (

); } function NavigationMenuLink({ className, ...props }: React.ComponentProps) { return ( ); } function NavigationMenuIndicator({ className, ...props }: React.ComponentProps) { return (

); } export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle, };

Navigation menu

Showcase

Navigation menu