NavigationMenuContent() — ui Function Reference

Architecture documentation for the NavigationMenuContent() function in navigation-menu.tsx from the ui codebase.

Function tsx ComponentRegistry ChartRegistry

Entity Profile

ComponentRegistry→ ChartRegistry→ NavigationMenuContent() — ui Function Reference

Dependency Diagram

graph TD
  73892e98_92f2_8fbc_1617_c47cdef31bd2["NavigationMenuContent()"]
  bef2e1fa_d797_5e4e_8069_981d93331806["navigation-menu.tsx"]
  73892e98_92f2_8fbc_1617_c47cdef31bd2 -->|defined in| bef2e1fa_d797_5e4e_8069_981d93331806
  style 73892e98_92f2_8fbc_1617_c47cdef31bd2 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/registry/bases/radix/ui/navigation-menu.tsx lines 90–104

function NavigationMenuContent({
  className,
  ...props
}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {
  return (
    <NavigationMenuPrimitive.Content
      data-slot="navigation-menu-content"
      className={cn(
        "cn-navigation-menu-content top-0 left-0 w-full group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none md:absolute md:w-auto",
        className
      )}
      {...props}
    />
  )
}