Package Exports

dropzone-ui-react
dropzone-ui-react/build/index.es.js
dropzone-ui-react/build/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (dropzone-ui-react) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

files-ui-react-19

This package is a fork of files-ui/files-ui-react with added support for React 19.

Changes from original

Added support for React 19
Updated testing libraries to latest versions
Improved TypeScript type definitions

Original Package

This is based on the excellent work by JinSSJ3 in the original files-ui-react package. Please check out the original repository for detailed documentation and examples.

Installation

npm install files-ui-react-19

Usage

Use it exactly the same way as the original package. All original features are preserved.

import { Dropzone } from 'files-ui-react-19';

License

MIT - Same as the original package.

Files ui

UI components for file uploads with React js.

Files UI is a complete library for handling files in the UI. You can validate and upload them.

❤️ it ?, support us by giving a ⭐ on :octocat: Github :D
⚡ Enjoying @files-ui/react? Please leave a short review on Openbase
👀 More previews here.

Installation

@files-ui/react is available as an npm package.

// with npm
npm i @files-ui/react

// with yarn
yarn add @files-ui/react

Usage and examples

Here is a quick example to get you started, it's all you need:

import * as React from "react";
import ReactDOM from "react-dom";
import { Dropzone, FileMosaic } from "@files-ui/react";

function App() {
  const [files, setFiles] = React.useState([]);
  const updateFiles = (incommingFiles) => {
    setFiles(incommingFiles);
  };
  return (
    <Dropzone onChange={updateFiles} value={files}>
      {files.map((file) => (
        <FileMosaic {...file} preview />
      ))}
    </Dropzone>
  );
}

ReactDOM.render(<App />, document.querySelector("#app"));