gitscope
/
← marzneshin / dashboard/src/components/ui/sheet.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/components/ui/sheet.tsx · v0.3.0-alpha7
Source
1 b15ff05 Mrdn 2y ago import * as React from "react"
2 b15ff05 Mrdn 2y ago import * as SheetPrimitive from "@radix-ui/react-dialog"
3 b15ff05 Mrdn 2y ago import { cva, type VariantProps } from "class-variance-authority"
4 b15ff05 Mrdn 2y ago import { X } from "lucide-react"
5 b15ff05 Mrdn 2y ago
6 b15ff05 Mrdn 2y ago import { cn } from "@marzneshin/utils"
7 b15ff05 Mrdn 2y ago
8 b15ff05 Mrdn 2y ago const Sheet = SheetPrimitive.Root
9 b15ff05 Mrdn 2y ago
10 b15ff05 Mrdn 2y ago const SheetTrigger = SheetPrimitive.Trigger
11 b15ff05 Mrdn 2y ago
12 b15ff05 Mrdn 2y ago const SheetClose = SheetPrimitive.Close
13 b15ff05 Mrdn 2y ago
14 b15ff05 Mrdn 2y ago const SheetPortal = SheetPrimitive.Portal
15 b15ff05 Mrdn 2y ago
16 b15ff05 Mrdn 2y ago const SheetOverlay = React.forwardRef<
17 b15ff05 Mrdn 2y ago React.ElementRef<typeof SheetPrimitive.Overlay>,
18 b15ff05 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>
19 b15ff05 Mrdn 2y ago >(({ className, ...props }, ref) => (
20 b15ff05 Mrdn 2y ago <SheetPrimitive.Overlay
21 b15ff05 Mrdn 2y ago className={cn(
22 b15ff05 Mrdn 2y ago "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
23 b15ff05 Mrdn 2y ago className
24 b15ff05 Mrdn 2y ago )}
25 b15ff05 Mrdn 2y ago {...props}
26 b15ff05 Mrdn 2y ago ref={ref}
27 b15ff05 Mrdn 2y ago />
28 b15ff05 Mrdn 2y ago ))
29 b15ff05 Mrdn 2y ago SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
30 b15ff05 Mrdn 2y ago
31 b15ff05 Mrdn 2y ago const sheetVariants = cva(
32 b15ff05 Mrdn 2y ago "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
33 b15ff05 Mrdn 2y ago {
34 b15ff05 Mrdn 2y ago variants: {
35 b15ff05 Mrdn 2y ago side: {
36 b15ff05 Mrdn 2y ago top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
37 b15ff05 Mrdn 2y ago bottom:
38 b15ff05 Mrdn 2y ago "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
39 b15ff05 Mrdn 2y ago left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
40 b15ff05 Mrdn 2y ago right:
41 b15ff05 Mrdn 2y ago "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
42 b15ff05 Mrdn 2y ago },
43 b15ff05 Mrdn 2y ago },
44 b15ff05 Mrdn 2y ago defaultVariants: {
45 b15ff05 Mrdn 2y ago side: "right",
46 b15ff05 Mrdn 2y ago },
47 b15ff05 Mrdn 2y ago }
48 b15ff05 Mrdn 2y ago )
49 b15ff05 Mrdn 2y ago
50 b15ff05 Mrdn 2y ago interface SheetContentProps
51 b15ff05 Mrdn 2y ago extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
52 b15ff05 Mrdn 2y ago VariantProps<typeof sheetVariants> {}
53 b15ff05 Mrdn 2y ago
54 b15ff05 Mrdn 2y ago const SheetContent = React.forwardRef<
55 b15ff05 Mrdn 2y ago React.ElementRef<typeof SheetPrimitive.Content>,
56 b15ff05 Mrdn 2y ago SheetContentProps
57 b15ff05 Mrdn 2y ago >(({ side = "right", className, children, ...props }, ref) => (
58 b15ff05 Mrdn 2y ago <SheetPortal>
59 b15ff05 Mrdn 2y ago <SheetOverlay />
60 b15ff05 Mrdn 2y ago <SheetPrimitive.Content
61 b15ff05 Mrdn 2y ago ref={ref}
62 b15ff05 Mrdn 2y ago className={cn(sheetVariants({ side }), className)}
63 b15ff05 Mrdn 2y ago {...props}
64 b15ff05 Mrdn 2y ago >
65 b15ff05 Mrdn 2y ago {children}
66 b15ff05 Mrdn 2y ago <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
67 b15ff05 Mrdn 2y ago <X className="h-4 w-4" />
68 b15ff05 Mrdn 2y ago <span className="sr-only">Close</span>
69 b15ff05 Mrdn 2y ago </SheetPrimitive.Close>
70 b15ff05 Mrdn 2y ago </SheetPrimitive.Content>
71 b15ff05 Mrdn 2y ago </SheetPortal>
72 b15ff05 Mrdn 2y ago ))
73 b15ff05 Mrdn 2y ago SheetContent.displayName = SheetPrimitive.Content.displayName
74 b15ff05 Mrdn 2y ago
75 b15ff05 Mrdn 2y ago const SheetHeader = ({
76 b15ff05 Mrdn 2y ago className,
77 b15ff05 Mrdn 2y ago ...props
78 b15ff05 Mrdn 2y ago }: React.HTMLAttributes<HTMLDivElement>) => (
79 b15ff05 Mrdn 2y ago <div
80 b15ff05 Mrdn 2y ago className={cn(
81 b15ff05 Mrdn 2y ago "flex flex-col space-y-2 text-center sm:text-left",
82 b15ff05 Mrdn 2y ago className
83 b15ff05 Mrdn 2y ago )}
84 b15ff05 Mrdn 2y ago {...props}
85 b15ff05 Mrdn 2y ago />
86 b15ff05 Mrdn 2y ago )
87 b15ff05 Mrdn 2y ago SheetHeader.displayName = "SheetHeader"
88 b15ff05 Mrdn 2y ago
89 b15ff05 Mrdn 2y ago const SheetFooter = ({
90 b15ff05 Mrdn 2y ago className,
91 b15ff05 Mrdn 2y ago ...props
92 b15ff05 Mrdn 2y ago }: React.HTMLAttributes<HTMLDivElement>) => (
93 b15ff05 Mrdn 2y ago <div
94 b15ff05 Mrdn 2y ago className={cn(
95 b15ff05 Mrdn 2y ago "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
96 b15ff05 Mrdn 2y ago className
97 b15ff05 Mrdn 2y ago )}
98 b15ff05 Mrdn 2y ago {...props}
99 b15ff05 Mrdn 2y ago />
100 b15ff05 Mrdn 2y ago )
101 b15ff05 Mrdn 2y ago SheetFooter.displayName = "SheetFooter"
102 b15ff05 Mrdn 2y ago
103 b15ff05 Mrdn 2y ago const SheetTitle = React.forwardRef<
104 b15ff05 Mrdn 2y ago React.ElementRef<typeof SheetPrimitive.Title>,
105 b15ff05 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>
106 b15ff05 Mrdn 2y ago >(({ className, ...props }, ref) => (
107 b15ff05 Mrdn 2y ago <SheetPrimitive.Title
108 b15ff05 Mrdn 2y ago ref={ref}
109 b15ff05 Mrdn 2y ago className={cn("text-lg font-semibold text-foreground", className)}
110 b15ff05 Mrdn 2y ago {...props}
111 b15ff05 Mrdn 2y ago />
112 b15ff05 Mrdn 2y ago ))
113 b15ff05 Mrdn 2y ago SheetTitle.displayName = SheetPrimitive.Title.displayName
114 b15ff05 Mrdn 2y ago
115 b15ff05 Mrdn 2y ago const SheetDescription = React.forwardRef<
116 b15ff05 Mrdn 2y ago React.ElementRef<typeof SheetPrimitive.Description>,
117 b15ff05 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>
118 b15ff05 Mrdn 2y ago >(({ className, ...props }, ref) => (
119 b15ff05 Mrdn 2y ago <SheetPrimitive.Description
120 b15ff05 Mrdn 2y ago ref={ref}
121 b15ff05 Mrdn 2y ago className={cn("text-sm text-muted-foreground", className)}
122 b15ff05 Mrdn 2y ago {...props}
123 b15ff05 Mrdn 2y ago />
124 b15ff05 Mrdn 2y ago ))
125 b15ff05 Mrdn 2y ago SheetDescription.displayName = SheetPrimitive.Description.displayName
126 b15ff05 Mrdn 2y ago
127 b15ff05 Mrdn 2y ago export {
128 b15ff05 Mrdn 2y ago Sheet,
129 b15ff05 Mrdn 2y ago SheetPortal,
130 b15ff05 Mrdn 2y ago SheetOverlay,
131 b15ff05 Mrdn 2y ago SheetTrigger,
132 b15ff05 Mrdn 2y ago SheetClose,
133 b15ff05 Mrdn 2y ago SheetContent,
134 b15ff05 Mrdn 2y ago SheetHeader,
135 b15ff05 Mrdn 2y ago SheetFooter,
136 b15ff05 Mrdn 2y ago SheetTitle,
137 b15ff05 Mrdn 2y ago SheetDescription,
138 b15ff05 Mrdn 2y ago }