gui.do
Barazo default frontend
barazo.forum
1'use client'
2
3import * as React from 'react'
4import * as ToastPrimitives from '@radix-ui/react-toast'
5import { X } from '@phosphor-icons/react'
6
7import { cn } from '@/lib/utils'
8
9const ToastProvider = ToastPrimitives.Provider
10
11const ToastViewport = React.forwardRef<
12 React.ComponentRef<typeof ToastPrimitives.Viewport>,
13 React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
14>(({ className, ...props }, ref) => (
15 <ToastPrimitives.Viewport
16 ref={ref}
17 className={cn(
18 'fixed bottom-0 left-0 z-[100] flex max-h-screen w-full flex-col-reverse gap-2 overflow-hidden p-4 sm:max-w-[420px]',
19 className
20 )}
21 {...props}
22 />
23))
24ToastViewport.displayName = ToastPrimitives.Viewport.displayName
25
26const Toast = React.forwardRef<
27 React.ComponentRef<typeof ToastPrimitives.Root>,
28 React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & {
29 variant?: 'default' | 'destructive'
30 }
31>(({ className, variant = 'default', ...props }, ref) => (
32 <ToastPrimitives.Root
33 ref={ref}
34 className={cn(
35 'group pointer-events-auto relative flex w-full items-center gap-3 overflow-hidden rounded-lg border p-4 shadow-lg transition-all',
36 'data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none',
37 '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',
38 variant === 'default' && 'border-border bg-card text-foreground',
39 variant === 'destructive' &&
40 'border-destructive/50 bg-destructive text-destructive-foreground',
41 className
42 )}
43 {...props}
44 />
45))
46Toast.displayName = ToastPrimitives.Root.displayName
47
48const ToastClose = React.forwardRef<
49 React.ComponentRef<typeof ToastPrimitives.Close>,
50 React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
51>(({ className, ...props }, ref) => (
52 <ToastPrimitives.Close
53 ref={ref}
54 className={cn(
55 'absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100',
56 className
57 )}
58 toast-close=""
59 {...props}
60 >
61 <X size={16} weight="bold" />
62 </ToastPrimitives.Close>
63))
64ToastClose.displayName = ToastPrimitives.Close.displayName
65
66const ToastTitle = React.forwardRef<
67 React.ComponentRef<typeof ToastPrimitives.Title>,
68 React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
69>(({ className, ...props }, ref) => (
70 <ToastPrimitives.Title ref={ref} className={cn('text-sm font-semibold', className)} {...props} />
71))
72ToastTitle.displayName = ToastPrimitives.Title.displayName
73
74const ToastDescription = React.forwardRef<
75 React.ComponentRef<typeof ToastPrimitives.Description>,
76 React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
77>(({ className, ...props }, ref) => (
78 <ToastPrimitives.Description
79 ref={ref}
80 className={cn('text-sm opacity-90', className)}
81 {...props}
82 />
83))
84ToastDescription.displayName = ToastPrimitives.Description.displayName
85
86const ToastAction = React.forwardRef<
87 React.ComponentRef<typeof ToastPrimitives.Action>,
88 React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
89>(({ className, ...props }, ref) => (
90 <ToastPrimitives.Action
91 ref={ref}
92 className={cn(
93 'inline-flex shrink-0 items-center justify-center rounded-md border bg-transparent px-3 py-1 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
94 className
95 )}
96 {...props}
97 />
98))
99ToastAction.displayName = ToastPrimitives.Action.displayName
100
101export {
102 ToastProvider,
103 ToastViewport,
104 Toast,
105 ToastClose,
106 ToastTitle,
107 ToastDescription,
108 ToastAction,
109}
110
111export type ToastActionElement = React.ReactElement<typeof ToastAction>