53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import * as ToastPrimitives from "@radix-ui/react-toast"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
const ToastProvider = ToastPrimitives.Provider
|
|
|
|
const ToastViewport = React.forwardRef<
|
|
React.ElementRef<typeof ToastPrimitives.Viewport>,
|
|
React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
|
|
>(({ className, ...props }, ref) => (
|
|
<ToastPrimitives.Viewport
|
|
ref={ref}
|
|
className={cn(
|
|
"fixed top-0 right-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:top-auto sm:flex-col md:max-w-[420px]",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
))
|
|
ToastViewport.displayName = ToastPrimitives.Viewport.displayName
|
|
|
|
const Toast = React.forwardRef<
|
|
React.ElementRef<typeof ToastPrimitives.Root>,
|
|
React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root>
|
|
>(({ className, ...props }, ref) => (
|
|
<ToastPrimitives.Root
|
|
ref={ref}
|
|
className={cn(
|
|
"group relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border bg-background p-4 pr-6 shadow-lg transition-all data-[state=open]:animate-in data-[state=closed]:animate-out",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
))
|
|
Toast.displayName = ToastPrimitives.Root.displayName
|
|
|
|
const ToastAction = ToastPrimitives.Action
|
|
const ToastClose = ToastPrimitives.Close
|
|
const ToastTitle = ToastPrimitives.Title
|
|
const ToastDescription = ToastPrimitives.Description
|
|
|
|
export {
|
|
ToastProvider,
|
|
ToastViewport,
|
|
Toast,
|
|
ToastTitle,
|
|
ToastDescription,
|
|
ToastClose,
|
|
ToastAction,
|
|
}
|