Skip to content

About

Responsive React Image Dropzone with Zoom, Pan, and Crop functionality

Resources

Stars

0 stars

Watchers

0 watching

Forks

Repository files navigation

@milkybytes/image-dropzone

CI npm license

A React component library for drag-and-drop image upload with pan, zoom, and multi-slot carousels. Fully themeable via CSS custom properties — no Tailwind or other framework required.

Live Demo + Reference Examples →

Installation

npm install @milkybytes/image-dropzone
# or
yarn add @milkybytes/image-dropzone
# or
pnpm add @milkybytes/image-dropzone

Import the stylesheet once in your app's entry file (e.g. main.tsx):

import '@milkybytes/image-dropzone/style.css';

Usage

import { ImageDropzone } from '@milkybytes/image-dropzone';

function App() {
  const [image, setImage] = useState<string>();

  return (
    <ImageDropzone
      width={350}
      height={570}
      imageSrc={image}
      onImageUpload={(src) => setImage(src ?? undefined)}
    />
  );
}

Requires React 17+.

License

MIT

About

Responsive React Image Dropzone with Zoom, Pan, and Crop functionality

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Used by

Contributors

Languages