Components
Toast
Auto-dismissing notifications — a bottom-right toast region.
Available since@crisp-ui-kit/crisp@0.11.0
The notifications region: a bottom-right stack of cards that auto-dismiss. Wrap your app in a ToastProvider, then call useToast().toast({...}) from anywhere.
Installation
npm install @crisp-ui-kit/crispProps
toast(options) accepts { title, description?, tone?, duration?, action? } where tone is "info" | "success" | "warning" | "danger", duration is ms (0 keeps it until dismissed, default 4000), and action is { label, onClick, variant? }. variant is "button" (default, a 24px tinted pill) or "link" (plain 13px text, Linear's "View issue"; its colour is --crisp-toast-link-fg).
ToastProvider
| Prop | Type | Default | Description |
|---|---|---|---|
duration | number | 4000 | Default auto-dismiss ms for toasts that don't set their own. |
dismissLabel | string | "Dismiss" | aria-label on each toast's close button — override for non-English UIs. |
regionLabel | string | "Notifications" | aria-label on the always-mounted notifications region — announced on every page even before a toast ever shows, so this is the highest-impact one to translate. |