import * as React from "react" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" import { X } from "lucide-react" const toastVariants = cva( "group pointer-events-auto relative flex w-full items-center justify-between gap-3 rounded-2xl border-1 p-4 shadow-lg ring-1 ring-black/5 data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-bottom-full", { variants: { variant: { default: "border-2 border-white/30 bg-white/30 backdrop-blur-md", destructive: "border-destructive/30 bg-destructive/10 text-destructive ring-destructive/10", success: "border-emerald-500/30 bg-emerald-500/10 text-emerald-600 ring-emerald-500/10 dark:text-emerald-400", }, }, defaultVariants: { variant: "default", }, } ) interface ToastProps extends React.HTMLAttributes, VariantProps { onClose?: () => void inner?: string } const SonnerToast = React.forwardRef( ({ className, variant, inner, children, onClose, ...props }, ref) => (

{children}

{onClose && ( )}

) ) SonnerToast.displayName = "SonnerToast" const SonnerToastTitle = React.forwardRef>( ({ className, ...props }, ref) => (

) ) SonnerToastTitle.displayName = "SonnerToastTitle" const SonnerToastDescription = React.forwardRef>( ({ className, ...props }, ref) => (
) ) SonnerToastDescription.displayName = "SonnerToastDescription" const SonnerToaster = React.forwardRef>( ({ className, ...props }, ref) => (
) ) SonnerToaster.displayName = "SonnerToaster" export { SonnerToast, SonnerToastTitle, SonnerToastDescription, SonnerToaster, toastVariants, }

Sonner

Saved!