react-swipeable - npm Package Compare versions

Comparing version 3.9.1 to 3.9.2

lib/Swipeable.js

@@ -36,9 +36,6 @@ 'use strict';
     nodeName: React.PropTypes.string,
-    trackMouse: React.PropTypes.bool
+    trackMouse: React.PropTypes.bool,
+    children: React.PropTypes.node
   },
 
-  componentWillMount: function componentWillMount() {
-    this.swipeable = getInitialState();
-  },
-
   getDefaultProps: function getDefaultProps() {
@@ -53,7 +50,9 @@ return {
   },
+  componentWillMount: function componentWillMount() {
+    this.swipeable = getInitialState();
+  },
+  calculatePos: function calculatePos(e) {
+    var x = void 0;
+    var y = void 0;
 
-  calculatePos: function calculatePos(e) {
-    var x = void 0,
-        y = void 0;
-    // If not a touch, determine point from mouse coordinates
     if (e.changedTouches) {
@@ -84,3 +83,2 @@ x = e.changedTouches[0].clientX;
   },
-
   eventStart: function eventStart(e) {
@@ -98,3 +96,3 @@ if (typeof this.props.onMouseDown === 'function') {
     }
-    // If not a touch, determine point from mouse coordinates
+
     var touches = e.touches;
@@ -113,3 +111,2 @@ if (!touches) {
   },
-
   eventMove: function eventMove(e) {
@@ -147,20 +144,14 @@ if (typeof this.props.onMouseMove === 'function') {
         }
-      } else {
-        if (this.props.onSwipingRight || this.props.onSwipedRight) {
-          this.props.onSwipingRight && this.props.onSwipingRight(e, pos.absX);
-          cancelPageSwipe = true;
-        }
+      } else if (this.props.onSwipingRight || this.props.onSwipedRight) {
+        this.props.onSwipingRight && this.props.onSwipingRight(e, pos.absX);
+        cancelPageSwipe = true;
       }
-    } else {
-      if (pos.deltaY > 0) {
-        if (this.props.onSwipingUp || this.props.onSwipedUp) {
-          this.props.onSwipingUp && this.props.onSwipingUp(e, pos.absY);
-          cancelPageSwipe = true;
-        }
-      } else {
-        if (this.props.onSwipingDown || this.props.onSwipedDown) {
-          this.props.onSwipingDown && this.props.onSwipingDown(e, pos.absY);
-          cancelPageSwipe = true;
-        }
+    } else if (pos.deltaY > 0) {
+      if (this.props.onSwipingUp || this.props.onSwipedUp) {
+        this.props.onSwipingUp && this.props.onSwipingUp(e, pos.absY);
+        cancelPageSwipe = true;
       }
+    } else if (this.props.onSwipingDown || this.props.onSwipedDown) {
+      this.props.onSwipingDown && this.props.onSwipingDown(e, pos.absY);
+      cancelPageSwipe = true;
     }
@@ -174,3 +165,2 @@
   },
-
   eventEnd: function eventEnd(e) {
@@ -200,8 +190,6 @@ if (typeof this.props.onMouseUp === 'function') {
         }
+      } else if (pos.deltaY > 0) {
+        this.props.onSwipedUp && this.props.onSwipedUp(e, pos.deltaY, isFlick);
       } else {
-        if (pos.deltaY > 0) {
-          this.props.onSwipedUp && this.props.onSwipedUp(e, pos.deltaY, isFlick);
-        } else {
-          this.props.onSwipedDown && this.props.onSwipedDown(e, pos.deltaY, isFlick);
-        }
+        this.props.onSwipedDown && this.props.onSwipedDown(e, pos.deltaY, isFlick);
       }
@@ -214,3 +202,2 @@ } else {
   },
-
   render: function render() {
@@ -217,0 +204,0 @@ var newProps = _extends({}, this.props, {

package.json

 {
   "name": "react-swipeable",
-  "version": "3.9.1",
+  "version": "3.9.2",
   "description": "Swipe bindings for react",
   "main": "lib/Swipeable.js",
   "scripts": {
-    "build:lib": "babel src --out-dir lib",
+    "test": "jest && npm run lint",
+    "lint": "eslint .",
+    "build:lib": "babel src --out-dir lib --ignore __tests__ --no-comments",
     "build:publish:examples": "./scripts/build_gh_pages.sh",
     "prepublish": "npm run build:lib"
   },
+  "jest": {
+    "testPathIgnorePatterns": [
+      "/node_modules/",
+      "/__tests__/helpers/"
+    ]
+  },
   "keywords": [
@@ -34,6 +42,16 @@ "swipe",
     "babel-cli": "^6.3.17",
+    "babel-jest": "^18.0.0",
     "babel-plugin-transform-object-rest-spread": "^6.3.13",
     "babel-preset-es2015-loose": "^6.1.4",
     "babel-preset-react": "^6.3.13",
-    "react": ">=0.12.x"
+    "enzyme": "^2.7.0",
+    "eslint": "^3.12.2",
+    "eslint-config-airbnb": "^13.0.0",
+    "eslint-plugin-import": "^2.2.0",
+    "eslint-plugin-jsx-a11y": "^2.2.3",
+    "eslint-plugin-react": "^6.8.0",
+    "jest": "^18.1.0",
+    "react": ">=0.12.x",
+    "react-addons-test-utils": "^15.4.2",
+    "react-dom": "^15.4.2"
   },
@@ -40,0 +58,0 @@ "peerDependencies": {

README.md

@@ -96,12 +96,16 @@ # Swipeable [![npm version](https://img.shields.io/npm/v/react-swipeable.svg?style=flat-square)](https://www.npmjs.com/package/react-swipeable) [![npm downloads](https://img.shields.io/npm/dm/react-swipeable.svg?style=flat-square)](https://www.npmjs.com/package/react-swipeable)
 
-Make changes/updates to the `src/Swipeable.js` file. Then run `npm run build:lib` to build the final output.
+Make changes/updates to the `src/Swipeable.js` file.
 
+Before creating a PR please run `npm test` to make sure the tests and lint pass. Add tests if PR adds functionality please.
+
 #### Test changes/updates with the examples
 
-cd into `examples` directory, run `npm install` within that directory, and then run `npm start`.
+cd into `examples` directory, then `npm install` within that directory, and finally `npm start`.
 
 After the server starts you can then view the examples page with your changes at `http://localhost:3000`.
 
+You can now make updates/changes to `src/Swipeable.js` and webpack will rebuild, then reload the page so you can test your changes!
+
 ## License
 
 MIT

src/Swipeable.js

@@ -1,4 +0,4 @@
-const React = require('react')
+const React = require('react');
 
-function getInitialState () {
+function getInitialState() {
   return {
@@ -8,3 +8,3 @@ x: null,
     swiping: false,
-    start: 0
+    start: 0,
   };
@@ -31,10 +31,7 @@ }
     nodeName: React.PropTypes.string,
-    trackMouse: React.PropTypes.bool
+    trackMouse: React.PropTypes.bool,
+    children: React.PropTypes.node,
   },
 
-  componentWillMount: function () {
-    this.swipeable = getInitialState();
-  },
-
-  getDefaultProps: function () {
+  getDefaultProps() {
     return {
@@ -45,25 +42,30 @@ flickThreshold: 0.6,
       stopPropagation: false,
-      nodeName: 'div'
-    }
+      nodeName: 'div',
+    };
   },
 
-  calculatePos: function (e) {
-    let x, y
+  componentWillMount() {
+    this.swipeable = getInitialState();
+  },
+
+  calculatePos(e) {
+    let x;
+    let y;
     // If not a touch, determine point from mouse coordinates
     if (e.changedTouches) {
-        x = e.changedTouches[0].clientX
-        y = e.changedTouches[0].clientY
+      x = e.changedTouches[0].clientX;
+      y = e.changedTouches[0].clientY;
     } else {
-        x = e.clientX
-        y = e.clientY
+      x = e.clientX;
+      y = e.clientY;
     }
 
-    const xd = this.swipeable.x - x
-    const yd = this.swipeable.y - y
+    const xd = this.swipeable.x - x;
+    const yd = this.swipeable.y - y;
 
-    const axd = Math.abs(xd)
-    const ayd = Math.abs(yd)
+    const axd = Math.abs(xd);
+    const ayd = Math.abs(yd);
 
-    const time = Date.now() - this.swipeable.start
-    const velocity = Math.sqrt(axd * axd + ayd * ayd) / time
+    const time = Date.now() - this.swipeable.start;
+    const velocity = Math.sqrt(axd * axd + ayd * ayd) / time;
 
@@ -75,24 +77,24 @@ return {
       absY: ayd,
-      velocity: velocity
-    }
+      velocity,
+    };
   },
 
-  eventStart: function (e) {
-    if (typeof this.props.onMouseDown === 'function') {
-      this.props.onMouseDown(e);
+  eventStart(e) {
+    if (typeof this.props.onMouseDown === 'function') { // eslint-disable-line react/prop-types
+      this.props.onMouseDown(e); // eslint-disable-line react/prop-types
     }
 
     if (e.type === 'mousedown' && !this.props.trackMouse) {
-      return
+      return;
     }
 
     if (e.touches && e.touches.length > 1) {
-      return
+      return;
     }
     // If not a touch, determine point from mouse coordinates
-    let touches = e.touches
+    let touches = e.touches;
     if (!touches) {
-        touches = [{ clientX: e.clientX, clientY: e.clientY }]
+      touches = [{ clientX: e.clientX, clientY: e.clientY }];
     }
-    if (this.props.stopPropagation) e.stopPropagation()
+    if (this.props.stopPropagation) e.stopPropagation();
 
@@ -103,30 +105,30 @@ this.swipeable = {
       y: touches[0].clientY,
-      swiping: false
+      swiping: false,
     };
   },
 
-  eventMove: function (e) {
-    if (typeof this.props.onMouseMove === 'function') {
-      this.props.onMouseMove(e);
+  eventMove(e) {
+    if (typeof this.props.onMouseMove === 'function') { // eslint-disable-line react/prop-types
+      this.props.onMouseMove(e); // eslint-disable-line react/prop-types
     }
 
     if (e.type === 'mousemove' && !this.props.trackMouse) {
-      return
+      return;
     }
 
     if (!this.swipeable.x || !this.swipeable.y || e.touches && e.touches.length > 1) {
-      return
+      return;
     }
 
-    let cancelPageSwipe = false
-    const pos = this.calculatePos(e)
+    let cancelPageSwipe = false;
+    const pos = this.calculatePos(e);
 
     if (pos.absX < this.props.delta && pos.absY < this.props.delta) {
-      return
+      return;
     }
 
-    if (this.props.stopPropagation) e.stopPropagation()
+    if (this.props.stopPropagation) e.stopPropagation();
 
     if (this.props.onSwiping) {
-      this.props.onSwiping(e, pos.deltaX, pos.deltaY, pos.absX, pos.absY, pos.velocity)
+      this.props.onSwiping(e, pos.deltaX, pos.deltaY, pos.absX, pos.absY, pos.velocity);
     }
@@ -137,23 +139,17 @@
         if (this.props.onSwipingLeft || this.props.onSwipedLeft) {
-          this.props.onSwipingLeft && this.props.onSwipingLeft(e, pos.absX)
-          cancelPageSwipe = true
+          this.props.onSwipingLeft && this.props.onSwipingLeft(e, pos.absX);
+          cancelPageSwipe = true;
         }
-      } else {
-        if (this.props.onSwipingRight || this.props.onSwipedRight) {
-          this.props.onSwipingRight && this.props.onSwipingRight(e, pos.absX)
-          cancelPageSwipe = true
-        }
+      } else if (this.props.onSwipingRight || this.props.onSwipedRight) {
+        this.props.onSwipingRight && this.props.onSwipingRight(e, pos.absX);
+        cancelPageSwipe = true;
       }
-    } else {
-      if (pos.deltaY > 0) {
-        if (this.props.onSwipingUp || this.props.onSwipedUp) {
-          this.props.onSwipingUp && this.props.onSwipingUp(e, pos.absY)
-          cancelPageSwipe = true
-        }
-      } else {
-        if (this.props.onSwipingDown || this.props.onSwipedDown) {
-          this.props.onSwipingDown && this.props.onSwipingDown(e, pos.absY)
-          cancelPageSwipe = true
-        }
+    } else if (pos.deltaY > 0) {
+      if (this.props.onSwipingUp || this.props.onSwipedUp) {
+        this.props.onSwipingUp && this.props.onSwipingUp(e, pos.absY);
+        cancelPageSwipe = true;
       }
+    } else if (this.props.onSwipingDown || this.props.onSwipedDown) {
+      this.props.onSwipingDown && this.props.onSwipingDown(e, pos.absY);
+      cancelPageSwipe = true;
     }
@@ -164,21 +160,21 @@
     if (cancelPageSwipe && this.props.preventDefaultTouchmoveEvent) {
-      e.preventDefault()
+      e.preventDefault();
     }
   },
 
-  eventEnd: function (e) {
-    if (typeof this.props.onMouseUp === 'function') {
-      this.props.onMouseUp(e);
+  eventEnd(e) {
+    if (typeof this.props.onMouseUp === 'function') { // eslint-disable-line react/prop-types
+      this.props.onMouseUp(e); // eslint-disable-line react/prop-types
     }
 
     if (e.type === 'mouseup' && !this.props.trackMouse) {
-      return
+      return;
     }
 
     if (this.swipeable.swiping) {
-      const pos = this.calculatePos(e)
+      const pos = this.calculatePos(e);
 
-      if (this.props.stopPropagation) e.stopPropagation()
+      if (this.props.stopPropagation) e.stopPropagation();
 
-      const isFlick = pos.velocity > this.props.flickThreshold
+      const isFlick = pos.velocity > this.props.flickThreshold;
 
@@ -190,20 +186,18 @@ this.props.onSwiped && this.props.onSwiped(
         isFlick,
-        pos.velocity
-      )
+        pos.velocity,
+      );
 
       if (pos.absX > pos.absY) {
         if (pos.deltaX > 0) {
-          this.props.onSwipedLeft && this.props.onSwipedLeft(e, pos.deltaX, isFlick)
+          this.props.onSwipedLeft && this.props.onSwipedLeft(e, pos.deltaX, isFlick);
         } else {
-          this.props.onSwipedRight && this.props.onSwipedRight(e, pos.deltaX, isFlick)
+          this.props.onSwipedRight && this.props.onSwipedRight(e, pos.deltaX, isFlick);
         }
+      } else if (pos.deltaY > 0) {
+        this.props.onSwipedUp && this.props.onSwipedUp(e, pos.deltaY, isFlick);
       } else {
-        if (pos.deltaY > 0) {
-          this.props.onSwipedUp && this.props.onSwipedUp(e, pos.deltaY, isFlick)
-        } else {
-          this.props.onSwipedDown && this.props.onSwipedDown(e, pos.deltaY, isFlick)
-        }
+        this.props.onSwipedDown && this.props.onSwipedDown(e, pos.deltaY, isFlick);
       }
     } else {
-      this.props.onTap && this.props.onTap(e)
+      this.props.onTap && this.props.onTap(e);
     }
@@ -214,3 +208,3 @@
 
-  render: function () {
+  render() {
     const newProps = {
@@ -223,23 +217,23 @@ ...this.props,
       onMouseMove: this.eventMove,
-      onMouseUp: this.eventEnd
-    }
+      onMouseUp: this.eventEnd,
+    };
 
-    delete newProps.onSwiped
-    delete newProps.onSwiping
-    delete newProps.onSwipingUp
-    delete newProps.onSwipingRight
-    delete newProps.onSwipingDown
-    delete newProps.onSwipingLeft
-    delete newProps.onSwipedUp
-    delete newProps.onSwipedRight
-    delete newProps.onSwipedDown
-    delete newProps.onSwipedLeft
-    delete newProps.onTap
-    delete newProps.flickThreshold
-    delete newProps.delta
-    delete newProps.preventDefaultTouchmoveEvent
-    delete newProps.stopPropagation
-    delete newProps.nodeName
-    delete newProps.children
-    delete newProps.trackMouse
+    delete newProps.onSwiped;
+    delete newProps.onSwiping;
+    delete newProps.onSwipingUp;
+    delete newProps.onSwipingRight;
+    delete newProps.onSwipingDown;
+    delete newProps.onSwipingLeft;
+    delete newProps.onSwipedUp;
+    delete newProps.onSwipedRight;
+    delete newProps.onSwipedDown;
+    delete newProps.onSwipedLeft;
+    delete newProps.onTap;
+    delete newProps.flickThreshold;
+    delete newProps.delta;
+    delete newProps.preventDefaultTouchmoveEvent;
+    delete newProps.stopPropagation;
+    delete newProps.nodeName;
+    delete newProps.children;
+    delete newProps.trackMouse;
 
@@ -249,7 +243,7 @@ return React.createElement(
       newProps,
-      this.props.children
+      this.props.children,
     );
-  }
-})
+  },
+});
 
-module.exports = Swipeable
+module.exports = Swipeable;

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

28801

increased by30.35%

Number of package files

8

increased by33.33%

Lines of code

543

increased by32.44%

Number of lines in readme file

111

increased by3.74%

Worsened metrics

Dev dependency count

15

increased by200%

No dependency changes