https://datafuse-mvp-spark.lovable.app/assets/drawer-CWXHv480.js

1const e=`import * as React from "react";
2import { Drawer as DrawerPrimitive } from "vaul";
3
4import { cn } from "@/lib/utils";
5
6const Drawer = ({
7  shouldScaleBackground = true,
8  ...props
9}: React.ComponentProps<typeof DrawerPrimitive.Root>) => (
10  <DrawerPrimitive.Root shouldScaleBackground={shouldScaleBackground} {...props} />
11);
12Drawer.displayName = "Drawer";
13
14const DrawerTrigger = DrawerPrimitive.Trigger;
15
16const DrawerPortal = DrawerPrimitive.Portal;
17
18const DrawerClose = DrawerPrimitive.Close;
19
20const DrawerOverlay = React.forwardRef<
21  React.ElementRef<typeof DrawerPrimitive.Overlay>,
22  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>
23>(({ className, ...props }, ref) => (
24  <DrawerPrimitive.Overlay
25    ref={ref}
26    className={cn("fixed inset-0 z-50 bg-black/80", className)}
27    {...props}
28  />
29));
30DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
31
32const DrawerContent = React.forwardRef<
33  React.ElementRef<typeof DrawerPrimitive.Content>,
34  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>
35>(({ className, children, ...props }, ref) => (
36  <DrawerPortal>
37    <DrawerOverlay />
38    <DrawerPrimitive.Content
39      ref={ref}
40      className={cn(
41        "fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background",
42        className,
43      )}
44      {...props}
45    >
46      <div className="mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" />
47      {children}
48    </DrawerPrimitive.Content>
49  </DrawerPortal>
50));
51DrawerContent.displayName = "DrawerContent";
52
53const DrawerHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
54  <div className={cn("grid gap-1.5 p-4 text-center sm:text-left", className)} {...props} />
55);
56DrawerHeader.displayName = "DrawerHeader";
57
58const DrawerFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
59  <div className={cn("mt-auto flex flex-col gap-2 p-4", className)} {...props} />
60);
61DrawerFooter.displayName = "DrawerFooter";
62
63const DrawerTitle = React.forwardRef<
64  React.ElementRef<typeof DrawerPrimitive.Title>,
65  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>
66>(({ className, ...props }, ref) => (
67  <DrawerPrimitive.Title
68    ref={ref}
69    className={cn("text-lg font-semibold leading-none tracking-tight", className)}
70    {...props}
71  />
72));
73DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
74
75const DrawerDescription = React.forwardRef<
76  React.ElementRef<typeof DrawerPrimitive.Description>,
77  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>
78>(({ className, ...props }, ref) => (
79  <DrawerPrimitive.Description
80    ref={ref}
81    className={cn("text-sm text-muted-foreground", className)}
82    {...props}
83  />
84));
85DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
86
87export {
88  Drawer,
89  DrawerPortal,
90  DrawerOverlay,
91  DrawerTrigger,
92  DrawerClose,
93  DrawerContent,
94  DrawerHeader,
95  DrawerFooter,
96  DrawerTitle,
97  DrawerDescription,
98};
99`;export{e as default};