31 lines
1002 B
TypeScript
31 lines
1002 B
TypeScript
"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" />,
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
)
|
||
|
|
}
|