react-mobile-picker - npm Package Compare versions

Comparing version 0.1.12 to 0.1.13

package.json

 {
   "name": "react-mobile-picker",
-  "version": "0.1.12",
+  "version": "0.1.13",
   "description": "An iOS like select box component for React",
@@ -5,0 +5,0 @@ "main": "lib/react-mobile-picker.js",

README.md

@@ -44,2 +44,3 @@ # React Mobile Picker
 | onChange(name, value) | Function | N/A | Callback called when user pick a new value. |
+| onClick(name, value) | Function | N/A | Callback called when user click on selected value. |
 | itemHeight | Number | 36 | Height of each item (that is each option). In `px`. |
@@ -46,0 +47,0 @@ | height | Number | 216 | Height of the picker. In `px`. |

src/index.js

@@ -12,3 +12,4 @@ import React, {Component} from 'react';
     columnHeight: PropTypes.number.isRequired,
-    onChange: PropTypes.func.isRequired
+    onChange: PropTypes.func.isRequired,
+    onClick: PropTypes.func.isRequired
   };
@@ -61,4 +62,11 @@
 
+  safePreventDefault = (event) =>{
+    const passiveEvents = ['onTouchStart', 'onTouchMove', 'onWheel'];
+    if(!passiveEvents.includes(event._reactName)) {
+      event.preventDefault();
+    }
+  }
+
   handleTouchMove = (event) => {
-    event.preventDefault();
+    this.safePreventDefault(event);
     const touchY = event.targetTouches[0].pageY;
@@ -123,2 +131,4 @@ this.setState(({isMoving, startTouchY, startScrollerTranslate, minTranslate, maxTranslate}) => {
       this.onValueSelected(option);
+    } else {
+      this.props.onClick(this.props.name, this.props.value);
     }
@@ -178,2 +188,3 @@ };
     onChange: PropTypes.func.isRequired,
+    onClick: PropTypes.func,
     itemHeight: PropTypes.number,
@@ -184,2 +195,3 @@ height: PropTypes.number
   static defaultProps = {
+    onClick: () => {},
     itemHeight: 36,
@@ -190,3 +202,3 @@ height: 216
   renderInner() {
-    const {optionGroups, valueGroups, itemHeight, height, onChange} = this.props;
+    const {optionGroups, valueGroups, itemHeight, height, onChange, onClick} = this.props;
     const highlightStyle = {
@@ -206,3 +218,4 @@ height: itemHeight,
           columnHeight={height}
-          onChange={onChange} />
+          onChange={onChange}
+          onClick={onClick} />
       );
@@ -209,0 +222,0 @@ }

No alert changes

Improved metrics

Lines of code

216

5.88%

Number of lines in readme file

110

0.92%

Worsened metrics

Total package byte prevSize

26074

-0.03%

No dependency changes