Alert

Alert is a notification component that creates focus around a response message without necessarily interrupting the user's task flow.

Read more about this component in the Aksel documentation.

Information
Id elit esse enim reprehenderit enim nisi veniam nostrud.

Properties

PropertyDescriptionDefault
Control
Properties
closeButton

Adds a close-button (X).

Requires onClose to be set.

boolean
false
closeButtonIconText

Icon text for screen readers used for the close button.

string
"Close message"
contentMaxWidth

Sets max-width on the content to 43.5rem.

boolean
true
fullWidth

Removes border-radius

boolean
false
iconTitleText

Title attribute on the icon

string
""
inline

Removes background from Alert

boolean
false
size

Changes padding and font-sizes

"medium" "small"
"medium"
variant

Changes colors and icon usage when changed

"error" "warning" "info" "success"
"info"
Snippets
children

Alert content

 -
Events
onclose

Callback for alert wanting to close.

Requires closeButton to be true.

 -

Properties included from: HTMLAttributes<HTMLDivElement>