- Components
- alert
Alert
Inline notification for conveying success, error, or warning messages.
Demo
You can add components to your app using our CLI.
You can add components to your app using our CLI.
You can add components to your app using our CLI.
Installation
Shell
flexi-cli add alertExamples
With Title
Alert with title : default
You can add components to your app using our CLI.
Alert with title & Icon
You can add components to your app using our CLI.
Alert with title & Icon : default Reverse
You can add components to your app using our CLI.
Variants
You can add components to your app using our CLI.
You can add components to your app using our CLI.
You can add components to your app using our CLI.
With Border
You can add components to your app using our CLI.
Danger zone
You can add components to your app using our CLI.
References
Props
The alert component accepts the following props. All props are optional.
| Prop | Type | Default | Description |
|---|---|---|---|
variant
|
string | 'solid' |
The visual style variant of the alert. Can be 'solid', 'soft', 'outline', 'subtle', or
'link'
|
intent
|
string | 'gray' |
The color intent of the alert. Common intents include 'primary', 'success', 'warning', 'danger', and
'info'
|
size
|
string | 'default' |
Size of the alert. Can be 'xs', 'sm', 'default', or 'lg'
|
radius
|
string | 'md' |
Border radius of the alert. Common values include 'none', 'sm', 'md', 'lg', 'full'
|
class
|
string | '' |
Additional CSS classes to apply to the alert
|