DISPLAY

Alert

Alerts communicate success, errors, information, and warnings with accessible target-native semantics.

SEMANTIC TYPES

Feedback users can scan

Type defines meaning and derives the default scheme. Override scheme only when the product language requires it.

Your changes were saved successfully.
We could not save your changes. Review the fields and try again.
A newer version is available for this project.
This operation will replace the current generated output.
dowe
Alert type:"success" message:"Your changes were saved successfully."
Alert type:"error" message:"We could not save your changes."
Alert type:"info" message:"A newer version is available."
Alert type:"warning" message:"This operation replaces generated output."

VARIANTS

Match the visual emphasis

Solid feedback for high emphasis.
Soft feedback for routine confirmation.
Outlined feedback preserves surrounding contrast.
Ghost feedback keeps the lightest visual footprint.

REACTIVE FEEDBACK

Connect request state

Message and visible can read compatible Signal paths. onClose invokes a declared view action that clears or hides the alert.

dowe
signal feedback value:{ message:"" visible:false }

action dismissFeedback
  set feedback.visible value:false

Alert type:"success" message:feedback.message visible:feedback.visible onClose:dismissFeedback

VISIBILITY

visible and show compose

When both props are present, the Alert renders only when visible and show resolve to true.

This alert is visible on medium and larger viewports.

API

Props

Alert also accepts applicable common spacing, sizing, visibility, grid placement, and style props.

Prop
Type
Default

No data

There are no records to display