Pixelact Alert Dialog

1import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
2import { type VariantProps, cva } from "class-variance-authority";
3import { cn } from "@/lib/utils";
4import {
5  AlertDialog as ShadcnAlertDialog,
6  AlertDialogTrigger as ShadcnAlertDialogTrigger,
7  AlertDialogContent as ShadcnAlertDialogContent,
8  AlertDialogDescription as ShadcnAlertDialogDescription,
9  AlertDialogFooter as ShadcnAlertDialogFooter,
10  AlertDialogHeader as ShadcnAlertDialogHeader,
11  AlertDialogOverlay as ShadcnAlertDialogOverlay,
12  AlertDialogPortal as ShadcnAlertDialogPortal,
13  AlertDialogTitle as ShadcnAlertDialogTitle,
14} from "@/components/ui/alert-dialog";
15 
16import "@/components/ui/pixelact-ui/styles/styles.css";
17 
18export const alertDialogVariants = cva("", {
19  variants: {
20    font: {
21      normal: "",
22      pixel: "pixel-font",
23    },
24  },
25  defaultVariants: {
26    font: "pixel",
27  },
28});
29 
30export interface AlertDialogProps
31  extends React.ComponentProps<typeof AlertDialogPrimitive.Root>,
32    VariantProps<typeof alertDialogVariants> {}
33 
34function AlertDialog({ ...props }: AlertDialogProps) {
35  return <ShadcnAlertDialog {...props} />;
36}
37 
38function AlertDialogTrigger({
39  className,
40  asChild = true,
41  ...props
42}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {
43  return (
44    <ShadcnAlertDialogTrigger
45      className={cn(className)}
46      asChild={asChild}
47      {...props}
48    />
49  );
50}
51 
52function AlertDialogPortal({
53  ...props
54}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {
55  return <ShadcnAlertDialogPortal {...props} />;
56}
57 
58function AlertDialogOverlay({
59  className,
60  ...props
61}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {
62  return <ShadcnAlertDialogOverlay className={cn(className)} {...props} />;
63}
64 
65interface AlertDialogContentProps
66  extends React.ComponentProps<typeof AlertDialogPrimitive.Content>,
67    VariantProps<typeof alertDialogVariants> {}
68 
69function AlertDialogContent({
70  className,
71  children,
72  font,
73  ...props
74}: AlertDialogContentProps) {
75  return (
76    <AlertDialogPortal>
77      <AlertDialogOverlay />
78      <>
79        <ShadcnAlertDialogContent
80          className={cn(
81            "rounded-none shadow-(--pixel-box-shadow) box-shadow-margin",
82            alertDialogVariants({ font }),
83            className
84          )}
85          {...props}
86        >
87          {children}
88        </ShadcnAlertDialogContent>
89      </>
90    </AlertDialogPortal>
91  );
92}
93 
94function AlertDialogHeader({
95  className,
96  ...props
97// … truncated