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.
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"));
Yes, it's really all you need to get started as you can see in these live and interactive demos:
| |
|---|
| Basic Sample :cake: |  |
| Advanced Sample :hammer: | |
Main Components 💠
Full Documentation 📚
You can find the complete documentation and demos for every component on files-ui.com
More Previews :eyes:
Image full screen preview 🖼️
Video full screen preview 🎞️
FileCard, FileInputButton and Avatar preview 🎴
DarkMode 🌙 🌞
Supporters
Special thanks to these amazing people :star: :
:clap: Stargazers
:clap: Forkers
License
This project is licensed under the terms of the
MIT license.
