@neynar/ui/llm-docs/navigation-menu-indicator.llm.md

React UI component library built on shadcn/ui and Tailwind CSS

# NavigationMenuIndicator

**Type**: component

NavigationMenuIndicator - Animated visual indicator for active menu items An optional visual indicator that displays an animated arrow pointing to the currently active or focused navigation menu item. Automatically transitions between positions as users navigate through menu items, providing clear visual feedback about the current selection. The indicator appears below the active item and includes smooth fade and position animations.

## JSX Usage

```jsx
import { NavigationMenuIndicator } from '@neynar/ui';

<NavigationMenuIndicator
  asChild={true}
  forceMount={true}
/>
```

## Component Props

### asChild
- **Type**: `boolean`
- **Required**: No
- **Description**: No description available

### forceMount
- **Type**: `boolean`
- **Required**: No
- **Description**: No description available

## Examples

### Example 1
```tsx
// Basic usage within NavigationMenuList
<NavigationMenuList>
  <NavigationMenuItem value="home">
    <NavigationMenuTrigger>Home</NavigationMenuTrigger>
    <NavigationMenuContent>
      <NavigationMenuLink href="/">Homepage</NavigationMenuLink>
    </NavigationMenuContent>
  </NavigationMenuItem>
  <NavigationMenuItem value="about">
    <NavigationMenuTrigger>About</NavigationMenuTrigger>
    <NavigationMenuContent>
      <NavigationMenuLink href="/about">About Us</NavigationMenuLink>
    </NavigationMenuContent>
  </NavigationMenuItem>
  <NavigationMenuIndicator className="data-[state=visible]:bg-primary" />
</NavigationMenuList>
```
### Example 2
```tsx
// Custom styled indicator
<NavigationMenuIndicator className="
  data-[state=visible]:animate-pulse
  data-[state=visible]:bg-gradient-to-r
  data-[state=visible]:from-blue-500
  data-[state=visible]:to-purple-500
" />
```
### Example 3
```tsx
// Force mounted indicator for custom animations
<NavigationMenuIndicator
  forceMount
  className="custom-indicator-animation"
/>
```