react-touch-events - npm Package Compare versions

Comparing version 1.1.0 to 2.0.0

lib/index.js

@@ -59,2 +59,10 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 	/**
@@ -75,116 +83,103 @@ * Created by jerry on 16/9/5.
 
-	var ReactTouchEvents = React.createClass({
-	    displayName: "ReactTouchEvents",
+	var ReactTouchEvents = function (_React$Component) {
+	    _inherits(ReactTouchEvents, _React$Component);
 
+	    function ReactTouchEvents() {
+	        var _ref;
 
-	    propTypes: {
-	        children: PropTypes.node,
-	        tapTolerance: PropTypes.number,
-	        swipeTolerance: PropTypes.number,
-	        onTap: PropTypes.func,
-	        onSwipe: PropTypes.func,
-	        disableClick: PropTypes.bool
-	    },
+	        var _temp, _this, _ret;
 
-	    getDefaultProps: function getDefaultProps() {
-	        return {
-	            tapTolerance: 10,
-	            swipeTolerance: 30,
-	            disableClick: false
-	        };
-	    },
+	        _classCallCheck(this, ReactTouchEvents);
 
-	    handleClick: function handleClick() {
-	        if (!this.usingTouch && this.props.onTap) {
-	            this.props.onTap();
+	        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+	            args[_key] = arguments[_key];
 	        }
-	    },
 
-	    handleTouchStart: function handleTouchStart(event) {
+	        return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = ReactTouchEvents.__proto__ || Object.getPrototypeOf(ReactTouchEvents)).call.apply(_ref, [this].concat(args))), _this), _this.handleTouchStart = function (event) {
 
-	        this.usingTouch = true;
+	            if (_this.touchStarted) {
+	                return;
+	            }
 
-	        if (this.touchStarted) {
-	            return;
-	        }
+	            _this.touchStarted = true;
 
-	        this.touchStarted = true;
+	            _this.touchMoved = false;
+	            _this.swipeOutBounded = false;
 
-	        this.touchMoved = false;
-	        this.swipeOutBounded = false;
+	            _this.startX = touchX(event);
+	            _this.startY = touchY(event);
 
-	        this.startX = touchX(event);
-	        this.startY = touchY(event);
+	            _this.currentX = 0;
+	            _this.currentY = 0;
+	        }, _this.handleTouchMove = function (event) {
+	            _this.currentX = touchX(event);
+	            _this.currentY = touchY(event);
 
-	        this.currentX = 0;
-	        this.currentY = 0;
-	    },
+	            if (!_this.touchMoved) {
+	                var tapTolerance = _this.props.tapTolerance;
 
-	    handleTouchMove: function handleTouchMove(event) {
-	        this.currentX = touchX(event);
-	        this.currentY = touchY(event);
+	                _this.touchMoved = Math.abs(_this.startX - _this.currentX) > tapTolerance || Math.abs(_this.startY - _this.currentY) > tapTolerance;
+	            } else if (!_this.swipeOutBounded) {
+	                var swipeOutBounded = _this.props.swipeTolerance;
 
-	        if (!this.touchMoved) {
-	            var tapTolerance = this.props.tapTolerance;
+	                _this.swipeOutBounded = Math.abs(_this.startX - _this.currentX) > swipeOutBounded && Math.abs(_this.startY - _this.currentY) > swipeOutBounded;
+	            }
+	        }, _this.handleTouchCancel = function () {
+	            _this.touchStarted = _this.touchMoved = false;
+	            _this.startX = _this.startY = 0;
+	        }, _this.handleTouchEnd = function (event) {
+	            _this.touchStarted = false;
 
-	            this.touchMoved = Math.abs(this.startX - this.currentX) > tapTolerance || Math.abs(this.startY - this.currentY) > tapTolerance;
-	        } else if (!this.swipeOutBounded) {
-	            var swipeOutBounded = this.props.swipeTolerance;
+	            if (!_this.touchMoved) {
+	                if (_this.props.onTap) {
+	                    _this.props.onTap(event);
+	                }
+	            } else if (!_this.swipeOutBounded) {
+	                if (_this.props.onSwipe) {
+	                    var swipeOutBounded = _this.props.swipeTolerance,
+	                        direction = void 0;
 
-	            this.swipeOutBounded = Math.abs(this.startX - this.currentX) > swipeOutBounded && Math.abs(this.startY - this.currentY) > swipeOutBounded;
-	        }
-	    },
+	                    if (Math.abs(_this.startX - _this.currentX) < swipeOutBounded) {
+	                        direction = _this.startY > _this.currentY ? "top" : "bottom";
+	                    } else {
+	                        direction = _this.startX > _this.currentX ? "left" : "right";
+	                    }
 
-	    handleTouchCancel: function handleTouchCancel() {
-	        this.touchStarted = this.touchMoved = false;
-	        this.startX = this.startY = 0;
-	    },
-
-	    handleTouchEnd: function handleTouchEnd(event) {
-	        this.touchStarted = false;
-
-	        if (!this.touchMoved) {
-	            if (this.props.onTap) {
-	                this.props.onTap(event);
+	                    _this.props.onSwipe(direction, event);
+	                }
 	            }
-	        } else if (!this.swipeOutBounded) {
-	            if (this.props.onSwipe) {
-	                var swipeOutBounded = this.props.swipeTolerance,
-	                    direction = void 0;
+	        }, _temp), _possibleConstructorReturn(_this, _ret);
+	    }
 
-	                if (Math.abs(this.startX - this.currentX) < swipeOutBounded) {
-	                    direction = this.startY > this.currentY ? "top" : "bottom";
-	                } else {
-	                    direction = this.startX > this.currentX ? "left" : "right";
-	                }
+	    _createClass(ReactTouchEvents, [{
+	        key: "render",
+	        value: function render() {
+	            var children = this.props.children;
+	            var element = children ? React.Children.only(children) : React.createElement("button", null);
 
-	                this.props.onSwipe(direction, event);
-	            }
+	            return React.cloneElement(element, {
+	                onTouchStart: this.handleTouchStart,
+	                onTouchMove: this.handleTouchMove,
+	                onTouchCancel: this.handleTouchCancel,
+	                onTouchEnd: this.handleTouchEnd
+	            });
 	        }
-	    },
+	    }]);
 
-	    componentWillMount: function componentWillMount() {
-	        this.usingTouch = false;
-	    },
+	    return ReactTouchEvents;
+	}(React.Component);
 
-	    render: function render() {
-	        var children = this.props.children;
-	        var disableClick = this.props.disableClick;
-	        var element = children ? React.Children.only(children) : React.createElement("button", null);
+	ReactTouchEvents.defaultProps = {
+	    tapTolerance: 10,
+	    swipeTolerance: 30
+	};
 
-	        var eventBinding = {
-	            onClick: this.handleClick,
-	            onTouchStart: this.handleTouchStart,
-	            onTouchMove: this.handleTouchMove,
-	            onTouchCancel: this.handleTouchCancel,
-	            onTouchEnd: this.handleTouchEnd
-	        };
+	ReactTouchEvents.propTypes = {
+	    children: PropTypes.node,
+	    tapTolerance: PropTypes.number,
+	    swipeTolerance: PropTypes.number,
+	    onTap: PropTypes.func,
+	    onSwipe: PropTypes.func
+	};
 
-	        if (disableClick) delete eventBinding.onClick;
-
-	        return React.cloneElement(element, eventBinding);
-	    }
-
-	});
-
 	module.exports = ReactTouchEvents;
@@ -191,0 +186,0 @@

package.json

 {
   "name": "react-touch-events",
-  "version": "1.1.0",
+  "version": "2.0.0",
   "description": "Enable tap / swipe events for react",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -13,2 +13,5 @@ # react-touch-events  [![](https://img.shields.io/npm/v/react-touch-events.svg)](https://www.npmjs.com/package/react-touch-events)
 
+We have removed all click events from `ReactTouchEvents` since v2.x. If you want use click event fallback, please use the v1.x version with `npm i -S react-touch-events@1`.
+
+
 ## Usage
@@ -20,4 +23,11 @@
 
-in React
+You can also use as UMD mode. Download the library file from `lib/index.js`(there provide uncompress file only) and add a `script` tag like this and you can use `window.ReactTouchEvents` now:
 
+```html
+<script src="path/to/lib/index.js"></script>
+```
+
+
+In React
+
 ```js
@@ -30,5 +40,3 @@ <ReactTouchEvents
 
-~~`onTap` will also bind `click` event.~~ Before v1.1.0, `onTap` will auto bind `click` event. But it'll cause a click-through bug. So it has a simple fix after (include) v1.1.0 to use `disableClick` attribute. `onTap` will bind `click` event on default. You can use `disableClick={true}` to disable it.
 
-
 The full example:
@@ -67,3 +75,2 @@
             onSwipe={ this.handleSwipe.bind(this) }
-            disableClick= { true }
             >
@@ -70,0 +77,0 @@

No alert changes

Improved metrics

Total package byte prevSize

12735

increased by16.54%

Number of lines in readme file

109

increased by6.86%

Worsened metrics

Lines of code

179

decreased by-1.1%

No dependency changes