Alert

Open in Playground

tone: info, success, warning, danger. onClose makes it dismissible.

Bello!

A Minion has something to tell you.

Props

tone'info' | 'success' | 'warning' | 'danger'
Default: 'info'
Color and ARIA role.
titleReactNode
Bold heading.
onClose() => void
Makes the alert dismissible.
iconReactNode
Default: InfoIcon
Leading icon.
classNamestring
Default: ''
Extra classes for the root element.
childrenReactNode
Content.

Alert props
Prop	Type	Default	Description
`tone`	'info' \| 'success' \| 'warning' \| 'danger'	`'info'`	Color and ARIA role.
`title`	ReactNode	–	Bold heading.
`onClose`	() => void	–	Makes the alert dismissible.
`icon`	ReactNode	`InfoIcon`	Leading icon.
`className`	string	`''`	Extra classes for the root element.
`children`	ReactNode	–	Content.