@neynar/ui/llm-docs/accordion-trigger.llm.md

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

# AccordionTrigger

**Type**: component

AccordionTrigger - Clickable header that toggles accordion content visibility An interactive button element that users click or activate via keyboard to expand or collapse the associated accordion content. Features a rotating chevron icon for visual state indication and supports both text and custom content.

## JSX Usage

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

<AccordionTrigger
  className="value"
  disabled={true}
  asChild={true}
>
  {/* Your content here */}
</AccordionTrigger>
```

## Component Props

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

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

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

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

## Examples

### Example 1
```tsx
// Simple text trigger
<AccordionTrigger>
  Click to expand this section
</AccordionTrigger>
```
### Example 2
```tsx
// With icon and custom styling
<AccordionTrigger className="text-lg font-semibold">
  <User className="mr-2 h-4 w-4" />
  User Profile Settings
</AccordionTrigger>
```
### Example 3
```tsx
// With complex content
<AccordionTrigger>
  <div className="flex items-center justify-between w-full">
    <span>Section Title</span>
    <Badge variant="secondary">5 items</Badge>
  </div>
</AccordionTrigger>
```