Alert
An alert displays a short, important message in a way that attracts the user's attention without interrupting the user's task.
Alert Types
Click the buttons below to see different alert types with dismissable close buttons.
Auto-Dismiss Alert
This alert automatically dismisses after 5 seconds without a close button.
With Second Message
Add a secondary message below the primary message for additional context (center aligned).
interface AlertProps {
open?: boolean;
type: 'success' | 'warning' | 'error' | 'info' | 'default';
message: string;
secondMessage?: string; // Secondary text for additional context (center aligned)
onClose: () => void;
showCloseButton?: boolean; // default: false (auto-dismiss after 5s), true = dismissable
}