@neynar/ui/llm-docs/tabs.llm.md

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

# Tabs

**Type**: component

A tabbed interface component for organizing content into multiple sections. Tabs provide an intuitive way to organize and display content in separate panels, with only one panel visible at a time. Built on Radix UI's robust accessibility foundation with full keyboard navigation, focus management, and screen reader support. The component supports both controlled and uncontrolled usage patterns, allowing for flexible integration in various application contexts. Each tab consists of a trigger (button) that activates its corresponding content panel.

## JSX Usage

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

<Tabs
  defaultValue="value"
  value="value"
  onValueChange={handleValueChange}
  orientation={value}
  dir={value}
  activationMode={value}
  className="value"
  asChild={true}
>
  {/* Your content here */}
</Tabs>
```

## Component Props

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

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

### onValueChange
- **Type**: `(value: string) => void`
- **Required**: No
- **Description**: No description available

### orientation
- **Type**: `"horizontal" | "vertical"`
- **Required**: No
- **Description**: No description available

### dir
- **Type**: `"ltr" | "rtl"`
- **Required**: No
- **Description**: No description available

### activationMode
- **Type**: `"automatic" | "manual"`
- **Required**: No
- **Description**: No description available

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

### children
- **Type**: `React.ReactNode`
- **Required**: No
- **Description**: No description available

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