Browse Source

uppy-react: Add a DragDrop component wrapper.

René Kooi 8 years ago
parent
commit
812f60e7fe
2 changed files with 34 additions and 0 deletions
  1. 33 0
      src/uppy-react/DragDrop.js
  2. 1 0
      src/uppy-react/index.js

+ 33 - 0
src/uppy-react/DragDrop.js

@@ -0,0 +1,33 @@
+const React = require('react')
+const UppyCore = require('../core/Core').Uppy
+const DragDropPlugin = require('../plugins/DragDrop')
+
+const h = React.createElement
+
+/**
+ * React component that renders an area in which files can be dropped to be
+ * uploaded.
+ */
+
+class DragDrop extends React.Component {
+  componentDidMount () {
+    const uppy = this.props.uppy
+    uppy.use(DragDropPlugin, {
+      target: this.container
+    })
+  }
+
+  render () {
+    return h('div', {
+      ref: (container) => {
+        this.container = container
+      }
+    })
+  }
+}
+
+DragDrop.propTypes = {
+  uppy: React.PropTypes.instanceOf(UppyCore).isRequired
+}
+
+module.exports = DragDrop

+ 1 - 0
src/uppy-react/index.js

@@ -1,2 +1,3 @@
 exports.Dashboard = require('./Dashboard')
 exports.DashboardModal = require('./DashboardModal')
+exports.DragDrop = require('./DragDrop')