Alert

Feedback

Displays a brief, important message that requires the user's attention without interrupting their workflow.

Loading component...

Run the following command to add this component to your project:

$pnpm dlx static-ui add alert

Import the component directly from the package:

import { Alert } from "@static-ui/ui"

Common props available for this component:

Prop	Type	Description
className	string	Additional CSS classes to apply.

Uses `role="alert"` to announce dynamic content to screen readers. Optionally supports `role="alertdialog"` for interactive alerts.

ProgressTask completion indicator.

SkeletonLoading state placeholder.

SonnerToast notification system.

SpinnerLoading progress indicator.

ToastTransient notification.