MoonUI

Navigation Menu

PRO

A collection of links for site navigation with animated dropdown panels. Built on the Radix UI Navigation Menu primitive with hover intent, keyboard navigation, and a shared animated viewport.

Pro Features

Unlock advanced capabilities with the Pro version

Mega Menu Panels

Content panels accept arbitrary layouts, from simple link lists to rich multi-column mega menus with feature cards

Smart Hover Intent

Configurable open delay and skip-delay windows make hover navigation feel deliberate instead of twitchy

Animated Shared Viewport

Panels cross-fade and resize inside one shared viewport with directional slide animations between items

WAI-ARIA Navigation Pattern

Built on Radix UI Navigation Menu with full keyboard support, focus management, and screen reader semantics

Installation

Install via CLI

npx @moontra/moonui-cli add navigation-menu

Usage

Pro Required

Examples

Simple Links with Trigger Style

PRO

For plain links without dropdown content, apply the navigationMenuTriggerStyle helper to NavigationMenuLink. The active prop highlights the current page.

Pro Required

Mega Menu Panels

PRO

Dropdown content accepts any layout. Combine a feature card with link lists to build a rich mega menu, and reuse a small list item component for consistency.

Pro Required

With Indicator

PRO

Add NavigationMenuIndicator inside the list to render an animated arrow that tracks the active trigger. Triggers can contain icons alongside their label.

Pro Required