| import * as React from 'react' | |
| import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog' | |
| import { cn } from '@/lib/utils' | |
| import { buttonVariants } from '@/components/ui/Button' | |
| const AlertDialog = AlertDialogPrimitive.Root | |
| const AlertDialogTrigger = AlertDialogPrimitive.Trigger | |
| const AlertDialogPortal = AlertDialogPrimitive.Portal | |
| const AlertDialogOverlay = React.forwardRef< | |
| React.ComponentRef<typeof AlertDialogPrimitive.Overlay>, | |
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay> | |
| >(({ className, ...props }, ref) => ( | |
| <AlertDialogPrimitive.Overlay | |
| className={cn( | |
| 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50', | |
| className | |
| )} | |
| {...props} | |
| ref={ref} | |
| /> | |
| )) | |
| AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName | |
| const AlertDialogContent = React.forwardRef< | |
| React.ComponentRef<typeof AlertDialogPrimitive.Content>, | |
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content> | |
| >(({ className, ...props }, ref) => ( | |
| <AlertDialogPortal> | |
| <AlertDialogOverlay /> | |
| <AlertDialogPrimitive.Content | |
| ref={ref} | |
| className={cn( | |
| 'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg', | |
| className | |
| )} | |
| {...props} | |
| /> | |
| </AlertDialogPortal> | |
| )) | |
| AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName | |
| const AlertDialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => ( | |
| <div className={cn('flex flex-col space-y-2 text-center sm:text-left', className)} {...props} /> | |
| ) | |
| AlertDialogHeader.displayName = 'AlertDialogHeader' | |
| const AlertDialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => ( | |
| <div | |
| className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)} | |
| {...props} | |
| /> | |
| ) | |
| AlertDialogFooter.displayName = 'AlertDialogFooter' | |
| const AlertDialogTitle = React.forwardRef< | |
| React.ComponentRef<typeof AlertDialogPrimitive.Title>, | |
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title> | |
| >(({ className, ...props }, ref) => ( | |
| <AlertDialogPrimitive.Title | |
| ref={ref} | |
| className={cn('text-lg font-semibold', className)} | |
| {...props} | |
| /> | |
| )) | |
| AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName | |
| const AlertDialogDescription = React.forwardRef< | |
| React.ComponentRef<typeof AlertDialogPrimitive.Description>, | |
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description> | |
| >(({ className, ...props }, ref) => ( | |
| <AlertDialogPrimitive.Description | |
| ref={ref} | |
| className={cn('text-muted-foreground text-sm', className)} | |
| {...props} | |
| /> | |
| )) | |
| AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName | |
| const AlertDialogAction = React.forwardRef< | |
| React.ComponentRef<typeof AlertDialogPrimitive.Action>, | |
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action> | |
| >(({ className, ...props }, ref) => ( | |
| <AlertDialogPrimitive.Action ref={ref} className={cn(buttonVariants(), className)} {...props} /> | |
| )) | |
| AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName | |
| const AlertDialogCancel = React.forwardRef< | |
| React.ComponentRef<typeof AlertDialogPrimitive.Cancel>, | |
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel> | |
| >(({ className, ...props }, ref) => ( | |
| <AlertDialogPrimitive.Cancel | |
| ref={ref} | |
| className={cn(buttonVariants({ variant: 'outline' }), 'mt-2 sm:mt-0', className)} | |
| {...props} | |
| /> | |
| )) | |
| AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName | |
| export { | |
| AlertDialog, | |
| AlertDialogPortal, | |
| AlertDialogOverlay, | |
| AlertDialogTrigger, | |
| AlertDialogContent, | |
| AlertDialogHeader, | |
| AlertDialogFooter, | |
| AlertDialogTitle, | |
| AlertDialogDescription, | |
| AlertDialogAction, | |
| AlertDialogCancel | |
| } | |