1import * as React from "react"
  2import * as SheetPrimitive from "@radix-ui/react-dialog"
  3import { cva, type VariantProps } from "class-variance-authority"
  4import { X } from "lucide-react"
  5
  6import { cn } from "@marzneshin/utils"
  7
  8const Sheet = SheetPrimitive.Root
  9
 10const SheetTrigger = SheetPrimitive.Trigger
 11
 12const SheetClose = SheetPrimitive.Close
 13
 14const SheetPortal = SheetPrimitive.Portal
 15
 16const SheetOverlay = React.forwardRef<
 17  React.ElementRef<typeof SheetPrimitive.Overlay>,
 18  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>
 19>(({ className, ...props }, ref) => (
 20  <SheetPrimitive.Overlay
 21    className={cn(
 22      "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      className
 24    )}
 25    {...props}
 26    ref={ref}
 27  />
 28))
 29SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
 30
 31const sheetVariants = cva(
 32  "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  {
 34    variants: {
 35      side: {
 36        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
 37        bottom:
 38          "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
 39        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        right:
 41          "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      },
 43    },
 44    defaultVariants: {
 45      side: "right",
 46    },
 47  }
 48)
 49
 50interface SheetContentProps
 51  extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
 52    VariantProps<typeof sheetVariants> {}
 53
 54const SheetContent = React.forwardRef<
 55  React.ElementRef<typeof SheetPrimitive.Content>,
 56  SheetContentProps
 57>(({ side = "right", className, children, ...props }, ref) => (
 58  <SheetPortal>
 59    <SheetOverlay />
 60    <SheetPrimitive.Content
 61      ref={ref}
 62      className={cn(sheetVariants({ side }), className)}
 63      {...props}
 64    >
 65      {children}
 66      <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        <X className="h-4 w-4" />
 68        <span className="sr-only">Close</span>
 69      </SheetPrimitive.Close>
 70    </SheetPrimitive.Content>
 71  </SheetPortal>
 72))
 73SheetContent.displayName = SheetPrimitive.Content.displayName
 74
 75const SheetHeader = ({
 76  className,
 77  ...props
 78}: React.HTMLAttributes<HTMLDivElement>) => (
 79  <div
 80    className={cn(
 81      "flex flex-col space-y-2 text-center sm:text-left",
 82      className
 83    )}
 84    {...props}
 85  />
 86)
 87SheetHeader.displayName = "SheetHeader"
 88
 89const SheetFooter = ({
 90  className,
 91  ...props
 92}: React.HTMLAttributes<HTMLDivElement>) => (
 93  <div
 94    className={cn(
 95      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
 96      className
 97    )}
 98    {...props}
 99  />
100)
101SheetFooter.displayName = "SheetFooter"
102
103const SheetTitle = React.forwardRef<
104  React.ElementRef<typeof SheetPrimitive.Title>,
105  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>
106>(({ className, ...props }, ref) => (
107  <SheetPrimitive.Title
108    ref={ref}
109    className={cn("text-lg font-semibold text-foreground", className)}
110    {...props}
111  />
112))
113SheetTitle.displayName = SheetPrimitive.Title.displayName
114
115const SheetDescription = React.forwardRef<
116  React.ElementRef<typeof SheetPrimitive.Description>,
117  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>
118>(({ className, ...props }, ref) => (
119  <SheetPrimitive.Description
120    ref={ref}
121    className={cn("text-sm text-muted-foreground", className)}
122    {...props}
123  />
124))
125SheetDescription.displayName = SheetPrimitive.Description.displayName
126
127export {
128  Sheet,
129  SheetPortal,
130  SheetOverlay,
131  SheetTrigger,
132  SheetClose,
133  SheetContent,
134  SheetHeader,
135  SheetFooter,
136  SheetTitle,
137  SheetDescription,
138}