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.
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.
signal feedback value:{ message:"" visible:false }
action dismissFeedback
set feedback.visible value:false
Alert type:"success" message:feedback.message visible:feedback.visible onClose:dismissFeedbackVISIBILITY
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 dataThere are no records to display | ||