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