rc-touchable - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

lib/index.js

@@ -32,2 +32,9 @@ // inspired by react-native
 }
+function copy(from, list) {
+    var to = {};
+    list.forEach(function (k) {
+        to[k] = from[k];
+    });
+    return to;
+}
 function extractSingleTouch(nativeEvent) {
@@ -40,14 +47,2 @@ var touches = nativeEvent.touches;
 }
-function _bindEvents(el, events) {
-    Object.keys(events).forEach(function (event) {
-        var listener = events[event];
-        el.addEventListener(event, listener, false);
-    });
-    return function () {
-        Object.keys(events).forEach(function (event) {
-            var listener = events[event];
-            el.removeEventListener(event, listener, false);
-        });
-    };
-}
 /**
@@ -209,43 +204,9 @@ * Touchable states.
     componentDidMount: function componentDidMount() {
-        var _this = this;
-
         this.root = _reactDom2["default"].findDOMNode(this);
-        this.eventsToBeBinded = {
-            touchstart: function touchstart(e) {
-                window.addEventListener('scroll', _this.checkWindowScroll, false);
-                _this.lockMouse = true;
-                if (_this.releaseLockTimer) {
-                    clearTimeout(_this.releaseLockTimer);
-                }
-                _this.touchableHandleResponderGrant(e);
-            },
-            touchmove: this.touchableHandleResponderMove,
-            touchend: function touchend(e) {
-                window.removeEventListener('scroll', _this.checkWindowScroll, false);
-                _this.releaseLockTimer = setTimeout(function () {
-                    _this.lockMouse = false;
-                }, 300);
-                _this.touchableHandleResponderRelease(e);
-            },
-            touchcancel: function touchcancel(e) {
-                window.removeEventListener('scroll', _this.checkWindowScroll, false);
-                _this.releaseLockTimer = setTimeout(function () {
-                    _this.lockMouse = false;
-                }, 300);
-                _this.touchableHandleResponderTerminate(e);
-            },
-            mousedown: this.onMouseDown
-        };
-        this.bindEvents();
     },
     componentDidUpdate: function componentDidUpdate() {
         this.root = _reactDom2["default"].findDOMNode(this);
-        this.bindEvents();
     },
     componentWillUnmount: function componentWillUnmount() {
         this.clearRaf();
-        if (this.eventsReleaseHandle) {
-            this.eventsReleaseHandle();
-            this.eventsReleaseHandle = null;
-        }
         if (this.releaseLockTimer) {
@@ -264,7 +225,44 @@ clearTimeout(this.releaseLockTimer);
     },
+    callChildEvent: function callChildEvent(event, e) {
+        var childHandle = this.props.children.props[event];
+        if (childHandle) {
+            childHandle(e);
+        }
+    },
+    onTouchStart: function onTouchStart(e) {
+        this.callChildEvent('onTouchStart', e);
+        this.lockMouse = true;
+        if (this.releaseLockTimer) {
+            clearTimeout(this.releaseLockTimer);
+        }
+        this.touchableHandleResponderGrant(e.nativeEvent);
+    },
+    onTouchMove: function onTouchMove(e) {
+        this.callChildEvent('onTouchMove', e);
+        this.touchableHandleResponderMove(e.nativeEvent);
+    },
+    onTouchEnd: function onTouchEnd(e) {
+        var _this = this;
+
+        this.callChildEvent('onTouchEnd', e);
+        this.releaseLockTimer = setTimeout(function () {
+            _this.lockMouse = false;
+        }, 300);
+        this.touchableHandleResponderRelease(e.nativeEvent);
+    },
+    onTouchCancel: function onTouchCancel(e) {
+        var _this2 = this;
+
+        this.callChildEvent('onTouchCancel', e);
+        this.releaseLockTimer = setTimeout(function () {
+            _this2.lockMouse = false;
+        }, 300);
+        this.touchableHandleResponderTerminate(e.nativeEvent);
+    },
     onMouseDown: function onMouseDown(e) {
+        this.callChildEvent('onMouseDown', e);
         if (this.lockMouse) {
             return;
         }
-        this.touchableHandleResponderGrant(e);
+        this.touchableHandleResponderGrant(e.nativeEvent);
         document.addEventListener('mousemove', this.touchableHandleResponderMove, false);
@@ -278,13 +276,2 @@ document.addEventListener('mouseup', this.onMouseUp, false);
     },
-    bindEvents: function bindEvents() {
-        var root = this.root;
-        var disabled = this.props.disabled;
-
-        if (disabled && this.eventsReleaseHandle) {
-            this.eventsReleaseHandle();
-            this.eventsReleaseHandle = null;
-        } else if (!disabled && !this.eventsReleaseHandle) {
-            this.eventsReleaseHandle = _bindEvents(root, this.eventsToBeBinded);
-        }
-    },
     _remeasureMetricsOnInit: function _remeasureMetricsOnInit() {
@@ -306,5 +293,4 @@ var root = this.root;
     touchableHandleResponderGrant: function touchableHandleResponderGrant(e) {
-        var _this2 = this;
+        var _this3 = this;
 
-        this.windowScrolled = false;
         this._remeasureMetricsOnInit();
@@ -320,3 +306,3 @@ if (this.pressOutDelayTimeout) {
             this.touchableDelayTimeout = setTimeout(function () {
-                _this2._handleDelay(e);
+                _this3._handleDelay(e);
             }, delayMS);
@@ -328,3 +314,3 @@ } else {
         this.longPressDelayTimeout = setTimeout(function () {
-            _this2._handleLongDelay(e);
+            _this3._handleLongDelay(e);
         }, longDelayMS + delayMS);
@@ -340,3 +326,2 @@ },
         this.clearRaf();
-        // log(this.checkEndScroll(e) + ' , ' + this.checkScroll(e) + ' , ' + this.windowScrolled);
         if (this.checkEndScroll(e) === false || this.checkScroll(e) === false) {
@@ -352,6 +337,2 @@ return;
     checkScroll: function checkScroll(e) {
-        if (this.windowScrolled) {
-            this._receiveSignal(Signals.RESPONDER_TERMINATED, e);
-            return false;
-        }
         var positionOnGrant = this.touchable.positionOnGrant;
@@ -365,6 +346,2 @@ // container or window scroll
     },
-    checkWindowScroll: function checkWindowScroll() {
-        this.windowScrolled = true;
-        window.removeEventListener('scroll', this.checkWindowScroll, false);
-    },
     checkEndScroll: function checkEndScroll(e) {
@@ -442,3 +419,3 @@ if (!this.checkTouchWithinActive(e)) {
     touchableHandlePress: function touchableHandlePress(e) {
-        var _this3 = this;
+        var _this4 = this;
 
@@ -448,3 +425,3 @@ if (this.props.onPress) {
             setTimeout(function () {
-                _this3.props.onPress(e);
+                _this4.props.onPress(e);
             }, 10);
@@ -557,7 +534,7 @@ }
     _endHighlight: function _endHighlight(e) {
-        var _this4 = this;
+        var _this5 = this;
 
         if (this.props.delayPressOut) {
             this.pressOutDelayTimeout = setTimeout(function () {
-                _this4.touchableHandleActivePressOut(e);
+                _this5.touchableHandleActivePressOut(e);
             }, this.props.delayPressOut);
@@ -569,9 +546,14 @@ } else {
     render: function render() {
-        var child = _react2["default"].Children.only(this.props.children);
+        var _props2 = this.props,
+            children = _props2.children,
+            disabled = _props2.disabled,
+            activeStyle = _props2.activeStyle,
+            activeClassName = _props2.activeClassName;
+
+        var events = disabled ? undefined : copy(this, ['onTouchStart', 'onTouchMove', 'onTouchEnd', 'onTouchCancel', 'onMouseDown']);
+        var child = _react2["default"].Children.only(children);
         if (this.state.active) {
-            var style = child.props.style;
-            var className = child.props.className;
-            var _props2 = this.props,
-                activeStyle = _props2.activeStyle,
-                activeClassName = _props2.activeClassName;
+            var _child$props = child.props,
+                style = _child$props.style,
+                className = _child$props.className;
 
@@ -588,8 +570,8 @@ if (activeStyle) {
             }
-            return _react2["default"].cloneElement(child, {
+            return _react2["default"].cloneElement(child, (0, _objectAssign2["default"])({
                 className: className,
                 style: style
-            });
+            }, events));
         }
-        return child;
+        return _react2["default"].cloneElement(child, events);
     }
@@ -596,0 +578,0 @@ });

package.json

 {
   "name": "rc-touchable",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "React Touchable Component",
@@ -5,0 +5,0 @@ "keywords": [

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

Worsened metrics

Total package byte prevSize

27506

decreased by-3.25%

Lines of code

570

decreased by-3.23%

No dependency changes