diff options
Diffstat (limited to 'packages/ui-new/src/components/ui/dialog.tsx')
| -rw-r--r-- | packages/ui-new/src/components/ui/dialog.tsx | 155 |
1 files changed, 0 insertions, 155 deletions
diff --git a/packages/ui-new/src/components/ui/dialog.tsx b/packages/ui-new/src/components/ui/dialog.tsx deleted file mode 100644 index 033b47c..0000000 --- a/packages/ui-new/src/components/ui/dialog.tsx +++ /dev/null @@ -1,155 +0,0 @@ -"use client"; - -import { Dialog as DialogPrimitive } from "@base-ui/react/dialog"; -import { XIcon } from "lucide-react"; -import type * as React from "react"; -import { Button } from "@/components/ui/button"; -import { cn } from "@/lib/utils"; - -function Dialog({ ...props }: DialogPrimitive.Root.Props) { - return <DialogPrimitive.Root data-slot="dialog" {...props} />; -} - -function DialogTrigger({ ...props }: DialogPrimitive.Trigger.Props) { - return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />; -} - -function DialogPortal({ ...props }: DialogPrimitive.Portal.Props) { - return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />; -} - -function DialogClose({ ...props }: DialogPrimitive.Close.Props) { - return <DialogPrimitive.Close data-slot="dialog-close" {...props} />; -} - -function DialogOverlay({ - className, - ...props -}: DialogPrimitive.Backdrop.Props) { - return ( - <DialogPrimitive.Backdrop - data-slot="dialog-overlay" - 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, - )} - {...props} - /> - ); -} - -function DialogContent({ - className, - children, - showCloseButton = true, - ...props -}: DialogPrimitive.Popup.Props & { - showCloseButton?: boolean; -}) { - return ( - <DialogPortal> - <DialogOverlay /> - <DialogPrimitive.Popup - data-slot="dialog-content" - className={cn( - "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-none p-4 text-xs/relaxed 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 outline-none", - className, - )} - {...props} - > - {children} - {showCloseButton && ( - <DialogPrimitive.Close - data-slot="dialog-close" - render={ - <Button - variant="ghost" - className="absolute top-2 right-2" - size="icon-sm" - /> - } - > - <XIcon /> - <span className="sr-only">Close</span> - </DialogPrimitive.Close> - )} - </DialogPrimitive.Popup> - </DialogPortal> - ); -} - -function DialogHeader({ className, ...props }: React.ComponentProps<"div">) { - return ( - <div - data-slot="dialog-header" - className={cn("gap-1 text-left flex flex-col", className)} - {...props} - /> - ); -} - -function DialogFooter({ - className, - showCloseButton = false, - children, - ...props -}: React.ComponentProps<"div"> & { - showCloseButton?: boolean; -}) { - return ( - <div - data-slot="dialog-footer" - className={cn( - "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", - className, - )} - {...props} - > - {children} - {showCloseButton && ( - <DialogPrimitive.Close render={<Button variant="outline" />}> - Close - </DialogPrimitive.Close> - )} - </div> - ); -} - -function DialogTitle({ className, ...props }: DialogPrimitive.Title.Props) { - return ( - <DialogPrimitive.Title - data-slot="dialog-title" - className={cn("text-sm font-medium", className)} - {...props} - /> - ); -} - -function DialogDescription({ - className, - ...props -}: DialogPrimitive.Description.Props) { - return ( - <DialogPrimitive.Description - data-slot="dialog-description" - className={cn( - "text-muted-foreground *:[a]:hover:text-foreground text-xs/relaxed *:[a]:underline *:[a]:underline-offset-3", - className, - )} - {...props} - /> - ); -} - -export { - Dialog, - DialogClose, - DialogContent, - DialogDescription, - DialogFooter, - DialogHeader, - DialogOverlay, - DialogPortal, - DialogTitle, - DialogTrigger, -}; |