react-dropzone - npm Package Compare versions

Comparing version 2.1.0 to 2.2.0

index.js

@@ -44,5 +44,10 @@ var React = require('react');
 
-    var dataTransferItems = Array.prototype.slice.call(e.dataTransfer ? e.dataTransfer.items : e.target.files);
-    var allFilesAccepted = this.allFilesAccepted(dataTransferItems);
+    // This is tricky. During the drag even the dataTransfer.files is null
+    // But Chrome implements some drag store, which is accesible via dataTransfer.items
+    var dataTransferItems = e.dataTransfer && e.dataTransfer.items ? e.dataTransfer.items : [];
 
+    // Now we need to convert the DataTransferList to Array
+    var itemsArray = Array.prototype.slice.call(dataTransferItems);
+    var allFilesAccepted = this.allFilesAccepted(itemsArray);
+
     this.setState({
@@ -134,5 +139,9 @@ isDragActive: allFilesAccepted,
     var style, activeStyle;
-    if (this.props.style) {
-      style = this.props.style;
-      activeStyle = this.props.activeStyle;
+    if (this.props.style || this.props.activeStyle) {
+      if (this.props.style) {
+        style = this.props.style;
+      }
+      if (this.props.activeStyle) {
+        activeStyle = this.props.activeStyle;
+      }
     } else if (!className) {
@@ -154,3 +163,3 @@ style = {
     var appliedStyle;
-    if (style && this.state.isDragActive) {
+    if (activeStyle && this.state.isDragActive) {
       appliedStyle = {
@@ -157,0 +166,0 @@ ...style,

lib/index.js

@@ -53,5 +53,10 @@ 'use strict';
 
-    var dataTransferItems = Array.prototype.slice.call(e.dataTransfer ? e.dataTransfer.items : e.target.files);
-    var allFilesAccepted = this.allFilesAccepted(dataTransferItems);
+    // This is tricky. During the drag even the dataTransfer.files is null
+    // But Chrome implements some drag store, which is accesible via dataTransfer.items
+    var dataTransferItems = e.dataTransfer && e.dataTransfer.items ? e.dataTransfer.items : [];
 
+    // Now we need to convert the DataTransferList to Array
+    var itemsArray = Array.prototype.slice.call(dataTransferItems);
+    var allFilesAccepted = this.allFilesAccepted(itemsArray);
+
     this.setState({
@@ -143,5 +148,9 @@ isDragActive: allFilesAccepted,
     var style, activeStyle;
-    if (this.props.style) {
-      style = this.props.style;
-      activeStyle = this.props.activeStyle;
+    if (this.props.style || this.props.activeStyle) {
+      if (this.props.style) {
+        style = this.props.style;
+      }
+      if (this.props.activeStyle) {
+        activeStyle = this.props.activeStyle;
+      }
     } else if (!className) {
@@ -163,3 +172,3 @@ style = {
     var appliedStyle;
-    if (style && this.state.isDragActive) {
+    if (activeStyle && this.state.isDragActive) {
       appliedStyle = _extends({}, style, activeStyle);
@@ -166,0 +175,0 @@ } else {

package.json

 {
   "name": "react-dropzone",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "Simple HTML5 drag-drop zone with React.js",
@@ -27,2 +27,5 @@ "main": "lib/index.js",
   "license": "MIT",
+  "peerDependencies": {
+    "react": ">=0.13"
+  },
   "dependencies": {
@@ -29,0 +32,0 @@ "attr-accept": "^1.0.1"

README.md

@@ -17,2 +17,8 @@ react-dropzone
 
+Create a standalone module using *WebPack*:
+```
+> npm install
+> webpack
+```
+
 Usage
@@ -19,0 +25,0 @@ =====

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

15580

increased by8.34%

Number of package files

7

increased by40%

Lines of code

347

increased by9.46%

Number of lines in readme file

132

increased by4.76%

Worsened metrics

Dependency count

2

increased by100%

No dependency changes