Components
Field
Displays a callout for user attention, such as a success message, warning, or error.
Loading
Installation
pnpm dlx shadcn@latest add @toui/alert
Examples
API Reference
The Alert component is a custom implementation that provides flexible and customizable alert messages. Here's the complete API reference:
Alert
The root Alert component includes the following props:
| Prop | Type | Default |
|---|---|---|
variant | ||
appearance | ||
size | ||
className | ||
close | ||
onClose |
AlertTitle
The AlertTitle component includes the following props:
| Prop | Type | Default |
|---|---|---|
asChild | ||
className |
AlertDescription
The AlertDescription component includes the following props:
| Prop | Type | Default |
|---|---|---|
asChild | ||
className |
AlertIcon
The AlertIcon component includes the following props:
| Prop | Type | Default |
|---|---|---|
variant | ||
className |
AlertContent
The AlertContent component includes the following props:
| Prop | Type | Default |
|---|---|---|
className |
AlertToolbar
The AlertToolbar component includes the following props:
| Prop | Type | Default |
|---|---|---|
variant | ||
className |
Credits
- Built with Radix UI Slot.