react-dnd-touch-backend - npm Package Compare versions

Comparing version 0.3.17 to 0.3.18

dist/Touch.js

@@ -43,2 +43,36 @@ /**
 
+// Used for MouseEvent.buttons (note the s on the end).
+var MouseButtons = {
+    Left: 1,
+    Right: 2,
+    Center: 4
+
+    // Used for e.button (note the lack of an s on the end).
+};var MouseButton = {
+    Left: 0,
+    Center: 1,
+    Right: 2
+
+    /**
+     * Only touch events and mouse events where the left button is pressed should initiate a drag.
+     * @param {MouseEvent | TouchEvent} e The event
+     */
+};function eventShouldStartDrag(e) {
+    // For touch events, button will be undefined. If e.button is defined,
+    // then it should be MouseButton.Left.
+    return e.button === undefined || e.button !== MouseButton.Left;
+}
+
+/**
+ * Only touch events and mouse events where the left mouse button is no longer held should end a drag.
+ * It's possible the user mouse downs with the left mouse button, then mouse down and ups with the right mouse button.
+ * We don't want releasing the right mouse button to end the drag.
+ * @param {MouseEvent | TouchEvent} e The event
+ */
+function eventShouldEndDrag(e) {
+    // Touch events will have buttons be undefined, while mouse events will have e.buttons's left button
+    // bit field unset if the left mouse button has been released
+    return e.buttons === undefined || (e.buttons & MouseButtons.Left) === 0;
+}
+
 // Polyfill for document.elementsFromPoint
@@ -342,2 +376,6 @@ var elementsFromPoint = (typeof document !== 'undefined' && document.elementsFromPoint || function (x, y) {
         value: function handleTopMoveStartCapture(e) {
+            if (!eventShouldStartDrag(e)) {
+                return;
+            }
+
             this.moveStartSourceIds = [];
@@ -362,2 +400,6 @@ }
         value: function handleTopMoveStart(e) {
+            if (!eventShouldStartDrag(e)) {
+                return;
+            }
+
             // Don't prematurely preventDefault() here since it might:
@@ -377,2 +419,6 @@ // 1. Mess up scrolling
         value: function handleTopMoveStartDelay(e) {
+            if (!eventShouldStartDrag(e)) {
+                return;
+            }
+
             var delay = e.type === eventNames.touch.start ? this.delayTouchStart : this.delayMouseStart;
@@ -475,2 +521,6 @@ this.timeout = setTimeout(this.handleTopMoveStart.bind(this, e), delay);
         value: function handleTopMoveEndCapture(e) {
+            if (!eventShouldEndDrag(e)) {
+                return;
+            }
+
             if (!this.monitor.isDragging() || this.monitor.didDrop()) {
@@ -477,0 +527,0 @@ this.moveStartSourceIds = null;

package.json

 {
   "name": "react-dnd-touch-backend",
-  "version": "0.3.17",
+  "version": "0.3.18",
   "description": "Touch backend for react-dnd",
@@ -30,3 +30,3 @@ "main": "dist/Touch.js",
   "dependencies": {
-    "react-dnd": "^2.5.1",
+    "react-dnd": "^2.5.4",
     "invariant": "^2.2.2"
@@ -36,3 +36,3 @@ },
     "babel-core": "^6.26.0",
-    "babel-eslint": "^8.0.0",
+    "babel-eslint": "^8.0.3",
     "babel-preset-es2015": "^6.24.1",
@@ -42,7 +42,7 @@ "babel-preset-react": "^6.24.1",
     "babelify": "^8.0.0",
-    "browserify": "^14.4.0",
+    "browserify": "^14.5.0",
     "classnames": "^2.2.5",
     "del": "^3.0.0",
-    "eslint": "^4.6.1",
-    "eslint-plugin-react": "^7.3.0",
+    "eslint": "^4.13.1",
+    "eslint-plugin-react": "^7.5.1",
     "gulp": "^3.9.1",
@@ -53,5 +53,6 @@ "gulp-babel": "^7.0.0",
     "gulp-util": "^3.0.8",
-    "immutable": "^3.8.1",
-    "react": "^16.1.0",
-    "react-dom": "^16.1.0",
+    "immutable": "^3.8.2",
+    "prop-types": "^15.6.0",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
     "vinyl-source-stream": "^1.1.0",
@@ -58,0 +59,0 @@ "watchify": "^3.9.0"

src/Touch.js

@@ -26,2 +26,38 @@ /**
 
+// Used for MouseEvent.buttons (note the s on the end).
+const MouseButtons = {
+    Left: 1,
+    Right: 2,
+    Center: 4
+}
+
+// Used for e.button (note the lack of an s on the end).
+const MouseButton = {
+    Left: 0,
+    Center: 1,
+    Right: 2
+}
+
+/**
+ * Only touch events and mouse events where the left button is pressed should initiate a drag.
+ * @param {MouseEvent | TouchEvent} e The event
+ */
+function eventShouldStartDrag(e) {
+    // For touch events, button will be undefined. If e.button is defined,
+    // then it should be MouseButton.Left.
+    return e.button === undefined || e.button !== MouseButton.Left;
+}
+
+/**
+ * Only touch events and mouse events where the left mouse button is no longer held should end a drag.
+ * It's possible the user mouse downs with the left mouse button, then mouse down and ups with the right mouse button.
+ * We don't want releasing the right mouse button to end the drag.
+ * @param {MouseEvent | TouchEvent} e The event
+ */
+function eventShouldEndDrag(e) {
+    // Touch events will have buttons be undefined, while mouse events will have e.buttons's left button
+    // bit field unset if the left mouse button has been released
+    return e.buttons === undefined || (e.buttons & MouseButtons.Left) === 0;
+}
+
 // Polyfill for document.elementsFromPoint
@@ -299,2 +335,6 @@ const elementsFromPoint = ((typeof document !== 'undefined' && document.elementsFromPoint) || function (x,y) {
     handleTopMoveStartCapture (e) {
+        if (!eventShouldStartDrag(e)) {
+            return;
+        }
+
         this.moveStartSourceIds = [];
@@ -316,2 +356,6 @@ }
     handleTopMoveStart (e) {
+        if (!eventShouldStartDrag(e)) {
+            return;
+        }
+
         // Don't prematurely preventDefault() here since it might:
@@ -330,2 +374,6 @@ // 1. Mess up scrolling
     handleTopMoveStartDelay (e) {
+        if (!eventShouldStartDrag(e)) {
+            return;
+        }
+
         const delay = (e.type === eventNames.touch.start)
@@ -426,2 +474,6 @@ ? this.delayTouchStart
     handleTopMoveEndCapture (e) {
+        if (!eventShouldEndDrag(e)) {
+            return;
+        }
+
         if (!this.monitor.isDragging() || this.monitor.didDrop()) {
@@ -428,0 +480,0 @@ this.moveStartSourceIds = null;

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

292801

increased by2.7%

Lines of code

1890

increased by8%

Worsened metrics

Dev dependency count

22

increased by4.76%

Dependency changes

• Updatedreact-dnd@^2.5.4