1 | # @uppy/react
|
2 |
|
3 | <img src="https://uppy.io/images/logos/uppy-dog-head-arrow.svg" width="120" alt="Uppy logo: a superman puppy in a pink suit" align="right">
|
4 |
|
5 | <a href="https://www.npmjs.com/package/@uppy/react"><img src="https://img.shields.io/npm/v/@uppy/react.svg?style=flat-square"></a>
|
6 | <img src="https://github.com/transloadit/uppy/workflows/Tests/badge.svg" alt="CI status for Uppy tests"> <img src="https://github.com/transloadit/uppy/workflows/Companion/badge.svg" alt="CI status for Companion tests"> <img src="https://github.com/transloadit/uppy/workflows/End-to-end%20tests/badge.svg" alt="CI status for browser tests">
|
7 |
|
8 | React component wrappers around Uppy's officially maintained UI plugins.
|
9 |
|
10 | Uppy is being developed by the folks at [Transloadit](https://transloadit.com), a versatile file encoding service.
|
11 |
|
12 | ## Example
|
13 |
|
14 | ```js
|
15 | const Uppy = require('@uppy/core')
|
16 | const { DashboardModal } = require('@uppy/react')
|
17 |
|
18 | const uppy = new Uppy()
|
19 |
|
20 | class Example extends React.Component {
|
21 | state = { open: false }
|
22 | render () {
|
23 | return (
|
24 | <DashboardModal
|
25 | uppy={uppy}
|
26 | open={this.state.open}
|
27 | onRequestClose={this.handleClose}
|
28 | />
|
29 | )
|
30 | }
|
31 | // ..snip..
|
32 | }
|
33 | ```
|
34 |
|
35 | ## Installation
|
36 |
|
37 | ```bash
|
38 | $ npm install @uppy/react
|
39 | ```
|
40 |
|
41 | We recommend installing from npm and then using a module bundler such as [Webpack](https://webpack.js.org/), [Browserify](http://browserify.org/) or [Rollup.js](http://rollupjs.org/).
|
42 |
|
43 | Alternatively, you can also use this plugin in a pre-built bundle from Transloadit's CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. See the [main Uppy documentation](https://uppy.io/docs/#Installation) for instructions.
|
44 |
|
45 | ## Documentation
|
46 |
|
47 | Documentation for this plugin can be found on the [Uppy website](https://uppy.io/docs/react).
|
48 |
|
49 | ## License
|
50 |
|
51 | [The MIT License](./LICENSE).
|