Alert

There's no <alert> element, ARIA live-region roles are the correct tool for exactly this gap. danger/warning interrupt (role="alert", assertive);info/success wait their turn (role="status", polite).

Heads up

This is announced politely (role="status"), it won't interrupt anything in progress.

Something went wrong

This is announced immediately (role="alert").

Usage

import { Alert } from "@kernelui/react";

<Alert variant="danger" title="Payment failed">
  Update your card details to keep your subscription active.
</Alert>

Props

Prop	Type	Default
`variant`	"info" \| "success" \| "warning" \| "danger"	"info"
`title`	ReactNode	—