Alert
A structured message offering feedback, warnings, or notifications, utilizing soft 3D semantic styles.
Base Layout
A simple alert offering information.
Update Available
Maya UI v2.0 is now available with new animations and components. Please update your dependencies to receive the latest features.
Semantic Variants
Different intents to convey distinct levels of urgency.
Default Note
This is a standard system default alert.
Software Update
A new software version (v4.2.1) has been downloaded.
Payment Successful
Your recent transaction has been processed properly without any issues.
Disk Space Low
Your internal disk is at 90% capacity. Please free up space soon.
Connection Lost
We cannot connect to the server. Please check your network connection and retry.
With Actions
Alerts can embed interactive actionable buttons via the 'action' slot.
New Feature
We've introduced interactive component demos directly in the playground. Check them out!
Row Layout
A compact layout for narrow spaces where text flows inline.
Heads up!
This is a compact row layout where text flows inline.
Alert API
| Prop / Event | Type | Default | Description |
|---|---|---|---|
intent | string | 'default' | Semantic color intent. One of 'default' | 'success' | 'warning' | 'danger' | 'info'. |
title | string | '' | The bold title text shown at the top of the alert. |
icon | Component | string | null | Lucide or custom icon component rendered in the icon slot. |
layout | string | 'column' | Layout direction. 'column' stacks title/desc vertically; 'row' flows them inline. |