OrJDev / solid-dropzone

React Dropzone Adapter For SolidJS

Solid DropZone

SolidJS Adapter For React DropZone

Info

I was working on a SolidJS adapter for UploadThing, noticed it was using React DropZone so I was looking for a SolidJS DropZone adapter and faced an issue with the existing one where it was not working and threw an error (attr-etc is not installed), so i copied the code of it and made a few changes to make it work + used my own build config. The repo is here so thanks to the original author.

Install

pnpm install solidjs-dropzone

Usage

import { createDropzone } from "solidjs-dropzone";

function MyDropzone() {
  const onDrop = (acceptedFiles: File[]) => {
    // Do something with the files
  };
  const { getInputProps, getRootProps, isDragActive } = createDropzone({
    onDrop,
  });
  return (
    <div {...getRootProps()}>
      <input {...getInputProps()} />
      {isDragActive ? (
        <p>Drop the files here ...</p>
      ) : (
        <p>Drag 'n' drop some files here, or click to select files</p>
      )}
    </div>
  );
}