React Alert Component API

Alert API

Explore the API reference for the React Alert component and discover how to effectively utilize its props for customization.

On this page

import { CAlert } from '@coreui/react'
// or
import CAlert from '@coreui/react/src/components/alert/CAlert'

Property	Default	Type
className#	-	`string`
A string of all className you want applied to the component.
color#	`primary`	`'primary'`, `'secondary'`, `'success'`, `'danger'`, `'warning'`, `'info'`, `'dark'`, `'light'`, `string`
Sets the color context of the component to one of CoreUI’s themed colors.
dismissible#	-	`boolean`
Optionally add a close button to alert and allow it to self dismiss.
onClose#	-	`() => void`
Callback fired when the component requests to be closed.
variant#	-	`string`
Set the alert variant to a solid.
visible#	`true`	`boolean`
Toggle the visibility of component.

import { CAlertHeading } from '@coreui/react'
// or
import CAlertHeading from '@coreui/react/src/components/alert/CAlertHeading'

Property	Default	Type
as#	`h4`	`(ElementType & 'symbol')`, `(ElementType & 'object')`, `(ElementType & 'h4')`, `(ElementType & 'slot')`, `(ElementType & 'style')`, `... 174 more ...`, `(ElementType & FunctionComponent<...>)`
Component used for the root node. Either a string to use a HTML element or a component.
className#	-	`string`
A string of all className you want applied to the base component.

import { CAlertLink } from '@coreui/react'
// or
import CAlertLink from '@coreui/react/src/components/alert/CAlertLink'

Property	Default	Type
className#	-	`string`
A string of all className you want applied to the base component.