react-swipeable - npm Package Compare versions

Comparing version 1.5.0 to 2.0.0

CHANGELOG.md

+# 2.0
+
+* `onFlick` prop has been removed.
+
+* `onSwipe` now has a 4th argument for the callback `Boolean isFlick`
+
+* Added a prop `flickThreshold` which allows you to customize at what velocity a flick is detected.

package.json

 {
   "name": "react-swipeable",
-  "version": "1.5.0",
+  "version": "2.0.0",
   "description": "Swipe bindings for react",
@@ -5,0 +5,0 @@ "main": "Swipeable.js",

README.md

@@ -34,5 +34,5 @@ # Swipeable
 
-`onSwiped` calls back with the event and the X and Y delta.
+`onSwiped` calls back with the event, the X and Y delta, and whether or not the event was a flick `this.props.onSwiped(ev, x, y, isFlick)`
 
-`onFlick` is called only if a flick is detected with the event and the X and Y delta.
+`flickThreshold` is a number (float) which determines the max velocity of a swipe before it's considered a flick.
 
@@ -47,2 +47,3 @@ `delta` is the amount of px before we start firing events. The default value is 10.
     onSwipingLeft: React.PropTypes.func,
+    flickThreshold: React.PropTypes.number,
     delta: React.PropTypes.number
@@ -49,0 +50,0 @@

Swipeable.js

 var React = require('react')
 var assign = require('object-assign')
 
-var FLICK_THRESHOLD = 0.6
-
 var Swipeable = React.createClass({
   propTypes: {
     onSwiped: React.PropTypes.func,
-    onFlick: React.PropTypes.func,
     onSwipingUp: React.PropTypes.func,
@@ -14,2 +11,3 @@ onSwipingRight: React.PropTypes.func,
     onSwipingLeft: React.PropTypes.func,
+    flickThreshold: React.PropTypes.number,
     delta: React.PropTypes.number
@@ -29,2 +27,3 @@ },
     return {
+      flickThreshold: 0.6,
       delta: 10
@@ -109,15 +108,16 @@ }
 
-  touchEnd: function (e) {
+  touchEnd: function (ev) {
     if (this.state.swiping) {
-      var pos = this.calculatePos(e)
+      var pos = this.calculatePos(ev)
 
       var time = Date.now() - this.state.start
       var velocity = Math.sqrt(pos.absX * pos.absX + pos.absY * pos.absY) / time
-      var isFlick = velocity > FLICK_THRESHOLD
+      var isFlick = velocity > this.props.flickThreshold
 
-      if (isFlick) {
-        this.props.onFlick && this.props.onFlick(e, pos.deltaX, pos.deltaY)
-      } else {
-        this.props.onSwiped && this.props.onSwiped(e, pos.deltaX, pos.deltaY)
-      }
+      this.props.onSwiped && this.props.onSwiped(
+        ev,
+        pos.deltaX,
+        pos.deltaY,
+        isFlick
+      )
     }
@@ -124,0 +124,0 @@ this.setState(this.getInitialState())

No alert changes

Improved metrics

Total package byte prevSize

6332

5.22%

Number of package files

6

20%

Lines of code

114

0.88%

Number of lines in readme file

52

1.96%

No dependency changes