Alert
Display a brief, important message in a way that attracts the user's attention without interrupting the user's task.
Import
ts
import { Alert } from "@kobalte/core/alert";// orimport { Root } from "@kobalte/core/alert";// or (deprecated)import { Alert } from "@kobalte/core";
ts
import { Alert } from "@kobalte/core/alert";// orimport { Root } from "@kobalte/core/alert";// or (deprecated)import { Alert } from "@kobalte/core";
Features
- Adhere to the WAI ARIA Alert design pattern.
Anatomy
The alert consists of :
- Alert: The root container for an alert.
tsx
<Alert />
tsx
<Alert />
Example
Kobalte is going live soon, get ready!
API reference
Alert
Alert
is equivalent to the Root
import from @kobalte/core/alert
(and deprecated Alert.Root
).
Renders a div
by default and support all its props.
Rendered elements
Component | Default rendered element |
---|---|
Alert | div |