Something went wrong. Try again.
A lexicon-driven AppView for ATProto.
Something went wrong. Try again.
1.2 kB · 44 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445"use client"
import { CircleCheckIcon, InfoIcon, Loader2Icon, OctagonXIcon, TriangleAlertIcon,} from "lucide-react"import { useTheme } from "next-themes"import { Toaster as Sonner, type ToasterProps } from "sonner"
const Toaster = ({ ...props }: ToasterProps) => { const { theme = "system" } = useTheme()
return ( <Sonner theme={theme as ToasterProps["theme"]} className="toaster group" closeButton icons={{ success: <CircleCheckIcon className="size-4" />, info: <InfoIcon className="size-4" />, warning: <TriangleAlertIcon className="size-4" />, error: <OctagonXIcon className="size-4" />, loading: <Loader2Icon className="size-4 animate-spin" />, }} style={ { "--normal-bg": "var(--popover)", "--normal-text": "var(--popover-foreground)", "--normal-border": "var(--border)", "--border-radius": "var(--radius)", "--toast-close-button-start": "unset", "--toast-close-button-end": "0", "--toast-close-button-transform": "translate(35%, -35%)", } as React.CSSProperties } {...props} /> )}
export { Toaster }