Alert
Alerts are temporary notifications that provide concise feedback about an action or event.
Installation
npx nextui-cli@latest add alert
The above command is for individual installation only. You may skip this step if @nextui-org/react is already installed globally.
Import
Usage
Radius
Colors
IsCloseable
If isCloseable is true, a close button appear on alert which can be used to close it.
It is set to true by default.
API
Alert Props
| Attribute | Type | Description | Default |
|---|---|---|---|
| title | string | Title for alert | - |
| description | ReactNode | Description for alert message | - |
| color | default | primary | secondary | success | warning | danger | The alert color theme. | default |
| radius | none | sm | md | lg | full | The alert border radius. | md |
| isCloseable | boolean | Whether the close button should be displayed. | true |
Alert Events
| Attribute | Type | Description |
|---|---|---|
| onClose | () => void | Handler that is called when the close button is clicked. |
