Utility
AI
Terminal
Installation
pnpm dlx shadcn@latest add https://termcn.dev/r/toast.json
Usage
import { Toast } from "@/components/ui/toast";<Toast
variant="success"
message="Settings saved successfully."
duration={5000}
onDismiss={() => console.log("toast closed")}
/>Examples
Error with Longer Duration
Terminal
import { Toast } from "@/registry/ui/toast";
export default function ToastError() {
return (
<Toast
variant="error"
message="Deploy failed. Check logs."
duration={8000}
/>
);
}
API Reference
Toast
| Prop | Type | Default |
|---|---|---|
message | string | required |
variant | "success" | "error" | "warning" | "info" | "info" |
duration | number | 3000 |
onDismiss | () => void | undefined |
icon | string | undefined |