# rn-alert
URL: /docs/native/components/alert

Inline alert banner with variant colors, sizes, and rounded corners.

## Installation

```bash
pnpm dlx @docyrus/cli add @docyrus/rn-alert
```

**Dependencies:**
- [react-native-reanimated](https://www.npmjs.com/package/react-native-reanimated)

## Usage

```tsx
import { Alert } from '@/components/docyrus-native/alert';

```

## API Reference

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `title` | `string` | — | Alert title text |
| `description` | `string` | — | Alert description text |
| `variant` | `'info' \| 'success' \| 'warning' \| 'destructive'` | `'info'` | Visual style variant |
| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Component size |
| `rounded` | `'none' \| 'sm' \| 'md' \| 'lg' \| 'xl'` | `'md'` | Border radius preset |
| `className` | `string` | — | Additional CSS classes |
| `titleClassName` | `string` | — | Title text CSS classes |
| `descriptionClassName` | `string` | — | Description text CSS classes |

## Type Exports

| Type | Description |
|------|-------------|
| `AlertProps` | Props for Alert component |
| `AlertVariant` | `'info' \| 'success' \| 'warning' \| 'destructive'` |
| `AlertSize` | `'sm' \| 'md' \| 'lg'` |