Alert
NewfeedbackInline status message for confirmations, warnings, errors, and neutral information.
import { Alert } from '@/components/forge'Preview
Alert
Component saved
Your changes are ready to reuse.
Published
The design token export completed.
Review needed
One prop value may need attention.
Code Example
Props
| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
variant | 'info' | 'success' | 'warning' | 'danger' | 'info' | No | Visual tone and default icon |
title | React.ReactNode | - | No | Optional alert heading |
icon | React.ReactNode | - | No | Custom icon override |
children | React.ReactNode | - | No | Alert body content |
Variants
infosuccesswarningdanger
Accessibility
- Uses role="status" for non-interruptive announcements
- Color is paired with icon and text, not used alone