Alert

PreviousNext

Compact alert message.

import { Alert } from "@/rl-ui";

<Alert variant="warning" title="Check connection">Try again in a moment.</Alert>

Examples

Variants

import { Alert } from "@/rl-ui";

<>
<Alert variant="default" title="default">Message</Alert>
<Alert variant="info" title="info">Message</Alert>
<Alert variant="success" title="success">Message</Alert>
<Alert variant="warning" title="warning">Message</Alert>
<Alert variant="error" title="error">Message</Alert>
</>

API

PropTypeDefaultDescription
variant"default" | "info" | "success" | "warning" | "error""info"Alert tone.
titleReactNode—Optional title.
dismissiblebooleanfalseShow dismiss control.
onDismiss() => void—Dismiss handler.
actionReactNode—Optional action slot.
iconReactNode—Override default icon.