initial commit

1 files changed, 87 insertions, 0 deletions

diff --git a/components/ui/dropzone.tsx b/components/ui/dropzone.tsx
new file mode 100644
index 00000000..a72826d9
--- /dev/null
+++ b/components/ui/dropzone.tsx
@@ -0,0 +1,87 @@
+"use client"
+
+import * as React from "react"
+import { Primitive } from "@radix-ui/react-primitive"
+import { Ban, CheckCircle2, Upload } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+import * as DropzonePrimitive from "@/components/ui/dropzone-primitive"
+
+export const Dropzone = DropzonePrimitive.Dropzone
+
+export const DropzoneInput = DropzonePrimitive.Input
+
+export const DropzoneZone = React.forwardRef<
+  React.ElementRef<typeof DropzonePrimitive.Zone>,
+  React.ComponentPropsWithoutRef<typeof DropzonePrimitive.Zone>
+>(({ className, ...props }, ref) => (
+  <DropzonePrimitive.Zone
+    ref={ref}
+    className={cn(
+      "cursor-pointer rounded-md border-2 border-dashed border-input p-6 shadow-sm transition-colors hover:border-accent-foreground/50 hover:bg-accent focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring data-[disabled]:cursor-not-allowed data-[drag-reject]:cursor-no-drop data-[no-click]:cursor-default data-[disabled]:border-inherit data-[drag-active]:border-accent-foreground/50 data-[drag-reject]:border-destructive data-[disabled]:bg-inherit data-[drag-active]:bg-accent data-[drag-reject]:bg-destructive/30 data-[disabled]:opacity-50",
+      className
+    )}
+    {...props}
+  />
+))
+DropzoneZone.displayName = "DropzoneZone"
+
+export const DropzoneUploadIcon = React.forwardRef<
+  React.ElementRef<typeof Upload>,
+  React.ComponentPropsWithoutRef<typeof Upload>
+>(({ className, ...props }, ref) => (
+  <>
+    <DropzonePrimitive.DragAccepted>
+      <CheckCircle2 ref={ref} className={cn("size-8", className)} {...props} />
+    </DropzonePrimitive.DragAccepted>
+    <DropzonePrimitive.DragRejected>
+      <Ban ref={ref} className={cn("size-8", className)} {...props} />
+    </DropzonePrimitive.DragRejected>
+    <DropzonePrimitive.DragDefault>
+      <Upload ref={ref} className={cn("size-8", className)} {...props} />
+    </DropzonePrimitive.DragDefault>
+  </>
+))
+DropzoneUploadIcon.displayName = "DropzoneUploadIcon"
+
+export const DropzoneGroup = React.forwardRef<
+  React.ElementRef<typeof Primitive.div>,
+  React.ComponentPropsWithoutRef<typeof Primitive.div>
+>(({ className, ...props }, ref) => (
+  <Primitive.div
+    ref={ref}
+    className={cn("grid place-items-center gap-1.5", className)}
+    {...props}
+  />
+))
+DropzoneGroup.displayName = "DropzoneGroup"
+
+export const DropzoneTitle = React.forwardRef<
+  React.ElementRef<typeof Primitive.h3>,
+  React.ComponentPropsWithoutRef<typeof Primitive.h3>
+>(({ className, ...props }, ref) => (
+  <Primitive.h3
+    ref={ref}
+    className={cn("font-medium leading-none tracking-tight", className)}
+    {...props}
+  />
+))
+DropzoneTitle.displayName = "DropzoneTitle"
+
+export const DropzoneDescription = React.forwardRef<
+  React.ElementRef<typeof Primitive.p>,
+  React.ComponentPropsWithoutRef<typeof Primitive.p>
+>(({ className, ...props }, ref) => (
+  <Primitive.p
+    ref={ref}
+    className={cn("text-sm text-muted-foreground", className)}
+    {...props}
+  />
+))
+DropzoneDescription.displayName = "DropzoneDescription"
+
+export const DropzoneTrigger = DropzonePrimitive.Trigger
+
+export const DropzoneAccepted = DropzonePrimitive.Accepted
+
+export const DropzoneRejected = DropzonePrimitive.Rejected