@neynar/ui/llm-docs/sidebar-menu-sub.llm.md

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

# SidebarMenuSub

**Type**: component

Submenu container for hierarchical navigation A specialized container for nested navigation items that provides visual hierarchy through indentation and connecting border lines. Perfect for organizing complex navigation structures with parent-child relationships.

## JSX Usage

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

<SidebarMenuSub
  className="value"
/>
```

## Component Props

### className
- **Type**: `string`
- **Required**: No
- **Description**: No description available

## Examples

### Example 1
```tsx
// Collapsible submenu with parent item
<SidebarMenuItem>
  <Collapsible>
    <CollapsibleTrigger asChild>
      <SidebarMenuButton>
        <Folder />
        <span>Projects</span>
        <ChevronRight className="ml-auto transition-transform group-data-[state=open]:rotate-90" />
      </SidebarMenuButton>
    </CollapsibleTrigger>
    <CollapsibleContent>
      <SidebarMenuSub>
        <SidebarMenuSubItem>
          <SidebarMenuSubButton>Web Application</SidebarMenuSubButton>
        </SidebarMenuSubItem>
        <SidebarMenuSubItem>
          <SidebarMenuSubButton>Mobile App</SidebarMenuSubButton>
        </SidebarMenuSubItem>
        <SidebarMenuSubItem>
          <SidebarMenuSubButton>Documentation</SidebarMenuSubButton>
        </SidebarMenuSubItem>
      </SidebarMenuSub>
    </CollapsibleContent>
  </Collapsible>
</SidebarMenuItem>
```
### Example 2
```tsx
// Always expanded submenu
<SidebarMenuItem>
  <SidebarMenuButton>
    <Settings />
    <span>Settings</span>
  </SidebarMenuButton>
  <SidebarMenuSub>
    <SidebarMenuSubItem>
      <SidebarMenuSubButton>General</SidebarMenuSubButton>
    </SidebarMenuSubItem>
    <SidebarMenuSubItem>
      <SidebarMenuSubButton>Privacy</SidebarMenuSubButton>
    </SidebarMenuSubItem>
    <SidebarMenuSubItem>
      <SidebarMenuSubButton>Security</SidebarMenuSubButton>
    </SidebarMenuSubItem>
  </SidebarMenuSub>
</SidebarMenuItem>
```