@neynar/ui/llm-docs/alert-title.llm.md

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

# AlertTitle

**Type**: component

AlertTitle - The title/heading component for alerts Provides a prominent title or heading for the alert message. Automatically styled with medium font weight, line clamping, and proper grid positioning. Used to give context and immediate recognition of the alert's purpose. ## Features - Medium font weight for visual hierarchy - Single line with overflow handling (line-clamp-1) - Consistent minimum height for layout stability - Proper grid positioning (col-start-2) for icon layout - Tight character spacing (tracking-tight) for readability

## JSX Usage

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

<AlertTitle
  className="value"
>
  {/* Your content here */}
</AlertTitle>
```

## Component Props

### className
- **Type**: `string`
- **Required**: No
- **Description**: Additional CSS classes to apply

### children
- **Type**: `React.ReactNode`
- **Required**: No
- **Description**: Title text content

## Examples

### Example 1
```tsx
<Alert>
  <Info className="size-4" />
  <AlertTitle>Payment Successful</AlertTitle>
  <AlertDescription>Your payment has been processed.</AlertDescription>
</Alert>
```
### Example 2
```tsx
// Title-only alert (no description)
<Alert variant="destructive">
  <AlertCircle className="size-4" />
  <AlertTitle>Connection Failed</AlertTitle>
</Alert>
```