alert-dialog

1"use client"
2 
3import * as React from "react"
4import { AlertDialog as AlertDialogPrimitive } from "radix-ui"
5 
6import { cn } from "@/registry/radix-sera/lib/utils"
7import { Button } from "@/registry/radix-sera/ui/button"
8 
9function AlertDialog({
10  ...props
11}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {
12  return <AlertDialogPrimitive.Root data-slot="alert-dialog" {...props} />
13}
14 
15function AlertDialogTrigger({
16  ...props
17}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {
18  return (
19    <AlertDialogPrimitive.Trigger data-slot="alert-dialog-trigger" {...props} />
20  )
21}
22 
23function AlertDialogPortal({
24  ...props
25}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {
26  return (
27    <AlertDialogPrimitive.Portal data-slot="alert-dialog-portal" {...props} />
28  )
29}
30 
31function AlertDialogOverlay({
32  className,
33  ...props
34}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {
35  return (
36    <AlertDialogPrimitive.Overlay
37      data-slot="alert-dialog-overlay"
38      className={cn(
39        "fixed inset-0 z-50 bg-black/20 duration-100 supports-backdrop-filter:backdrop-blur-sm data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
40        className
41      )}
42      {...props}
43    />
44  )
45}
46 
47function AlertDialogContent({
48  className,
49  size = "default",
50  ...props
51}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
52  size?: "default" | "sm"
53}) {
54  return (
55    <AlertDialogPortal>
56      <AlertDialogOverlay />
57      <AlertDialogPrimitive.Content
58        data-slot="alert-dialog-content"
59        data-size={size}
60        className={cn(
61          "group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-6 rounded-none bg-popover p-6 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-md data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
62          className
63        )}
64        {...props}
65      />
66    </AlertDialogPortal>
67  )
68}
69 
70function AlertDialogHeader({
71  className,
72  ...props
73}: React.ComponentProps<"div">) {
74  return (
75    <div
76      data-slot="alert-dialog-header"
77      className={cn(
78// … truncated