dialog

1"use client"
2 
3import * as React from "react"
4import { Dialog as DialogPrimitive } from "radix-ui"
5 
6import { cn } from "@/registry/bases/radix/lib/utils"
7import { Button } from "@/registry/bases/radix/ui/button"
8import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
9 
10function Dialog({
11  ...props
12}: React.ComponentProps<typeof DialogPrimitive.Root>) {
13  return <DialogPrimitive.Root data-slot="dialog" {...props} />
14}
15 
16function DialogTrigger({
17  ...props
18}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
19  return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
20}
21 
22function DialogPortal({
23  ...props
24}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
25  return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
26}
27 
28function DialogClose({
29  ...props
30}: React.ComponentProps<typeof DialogPrimitive.Close>) {
31  return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
32}
33 
34function DialogOverlay({
35  className,
36  ...props
37}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
38  return (
39    <DialogPrimitive.Overlay
40      data-slot="dialog-overlay"
41      className={cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50", className)}
42      {...props}
43    />
44  )
45}
46 
47function DialogContent({
48  className,
49  children,
50  showCloseButton = true,
51  ...props
52}: React.ComponentProps<typeof DialogPrimitive.Content> & {
53  showCloseButton?: boolean
54}) {
55  return (
56    <DialogPortal>
57      <DialogOverlay />
58      <DialogPrimitive.Content
59        data-slot="dialog-content"
60        className={cn(
61          "bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 sm:max-w-sm fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2",
62          className
63        )}
64        {...props}
65      >
66        {children}
67        {showCloseButton && (
68          <DialogPrimitive.Close data-slot="dialog-close" asChild>
69            <Button variant="ghost" className="absolute top-2 right-2" size="icon-sm">
70              <IconPlaceholder
71                lucide="XIcon"
72                tabler="IconX"
73                hugeicons="Cancel01Icon"
74                phosphor="XIcon"
75              />
76// … truncated