Files

31 lines
1002 B
TypeScript
Raw Permalink Normal View History

"use client"
import { Toaster as SonnerToaster } from "sonner"
import { CheckCircle2, XCircle, AlertTriangle, Info, Loader2 } from "lucide-react"
/**
* App-wide toast surface. Styling lives in globals.css (targeting Sonner's
* data-attributes) so the toast reads as part of the product's dark design
* system; here we only set behavior and the brand-colored type icons.
*/
export function Toaster() {
return (
<SonnerToaster
position="bottom-right"
theme="dark"
closeButton
expand
gap={12}
offset={20}
duration={4000}
icons={{
success: <CheckCircle2 className="h-[18px] w-[18px] text-emerald-400" />,
error: <XCircle className="h-[18px] w-[18px] text-red-400" />,
warning: <AlertTriangle className="h-[18px] w-[18px] text-amber-400" />,
info: <Info className="h-[18px] w-[18px] text-indigo-400" />,
loading: <Loader2 className="h-[18px] w-[18px] animate-spin text-indigo-400" />,
}}
/>
)
}