Search for a command to run...
A dropzone is an area into which one or multiple objects can be dragged and dropped.
The <DropzonePrimitive /> component is built on top of react-dropzone, wrapping the library to deliver a more consistent API that aligns with Radix UI conventions.
pnpm dlx shadcn@latest add https://ui-x.junwen-k.dev/r/dropzone-primitive.jsonimport * as DropzonePrimitive from "@/components/ui/dropzone-primitive";
export default () => (
<DropzonePrimitive.Root>
<DropzonePrimitive.Input />
<DropzonePrimitive.Zone />
<DropzonePrimitive.Trigger />
<DropzonePrimitive.DragAccepted />
<DropzonePrimitive.DragRejected />
<DropzonePrimitive.DragDefault />
<DropzonePrimitive.Accepted />
<DropzonePrimitive.Rejected />
</DropzonePrimitive.Root>
);