Alert
Fluent 2 MessageBar visuals, shadcn APIs. Five variants (default, destructive, success, warning, info) — icon + title + description, title-only, and no-icon rows.
Light
Icon + title + description
Heads up
A neutral message with no particular urgency.
Something went wrong
Your changes were not saved. Try again in a moment.
Changes saved
Your changes have been saved successfully.
This can't be undone
Confirming this action will permanently delete the item.
New version available
A new version of the app is ready — refresh to update.
Title only, no description
Heads up
Something went wrong
Changes saved
This can't be undone
New version available
No icon
Heads up
A neutral message with no particular urgency.
Something went wrong
Your changes were not saved. Try again in a moment.
Changes saved
Your changes have been saved successfully.
This can't be undone
Confirming this action will permanently delete the item.
New version available
A new version of the app is ready — refresh to update.
Dark
Icon + title + description
Heads up
A neutral message with no particular urgency.
Something went wrong
Your changes were not saved. Try again in a moment.
Changes saved
Your changes have been saved successfully.
This can't be undone
Confirming this action will permanently delete the item.
New version available
A new version of the app is ready — refresh to update.
Title only, no description
Heads up
Something went wrong
Changes saved
This can't be undone
New version available
No icon
Heads up
A neutral message with no particular urgency.
Something went wrong
Your changes were not saved. Try again in a moment.
Changes saved
Your changes have been saved successfully.
This can't be undone
Confirming this action will permanently delete the item.
New version available
A new version of the app is ready — refresh to update.