react-native-picker-actionsheet - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

package.json

@@ -19,3 +19,5 @@ {
   "_hasShrinkwrap": false,
-  "_id": "react-native-picker-actionsheet@1.1.4",
+  "_id": "react-native-picker-actionsheet@1.2.0",
+  "_inBundle": false,
+  "_integrity": "sha1-THzySVWZ9yXH+vYSmG7QWQMyJns=",
   "_location": "/react-native-picker-actionsheet",
@@ -34,9 +36,10 @@ "_nodeVersion": "8.9.4",
   "_requested": {
+    "type": "tag",
+    "registry": true,
     "raw": "react-native-picker-actionsheet",
-    "scope": null,
+    "name": "react-native-picker-actionsheet",
     "escapedName": "react-native-picker-actionsheet",
-    "name": "react-native-picker-actionsheet",
     "rawSpec": "",
-    "spec": "latest",
-    "type": "tag"
+    "saveSpec": null,
+    "fetchSpec": "latest"
   },
@@ -47,7 +50,7 @@ "_requiredBy": [
   ],
-  "_resolved": "http://registry.npm.taobao.org/react-native-picker-actionsheet/download/react-native-picker-actionsheet-1.1.4.tgz",
-  "_shasum": "d34bf8d87ac27052d9f85c418f66c071f863c1d9",
+  "_resolved": "http://r.cnpmjs.org/react-native-picker-actionsheet/download/react-native-picker-actionsheet-1.2.0.tgz",
+  "_shasum": "4c7cf2495599f725c7faf612986ed0590332267b",
   "_shrinkwrap": null,
   "_spec": "react-native-picker-actionsheet",
-  "_where": "/Users/liulirui/Desktop/test/mojom",
+  "_where": "/Users/liulirui/Desktop/mojom",
   "author": {
@@ -59,3 +62,5 @@ "name": "BooYeu - llr"
   },
+  "bundleDependencies": false,
   "dependencies": {},
+  "deprecated": false,
   "description": "A picker like ActionSheet component which can be used in iOS & Android . Use Animated . ",
@@ -92,4 +97,2 @@ "devDependencies": {
   "publish_time": 1519664210164,
-  "readme": "# react-native-picker-actionsheet [![Monthly download](https://img.shields.io/npm/dm/react-native-picker-actionsheet.svg)](https://img.shields.io/npm/dm/react-native-picker-actionsheet.svg) [![Total downloads](https://img.shields.io/npm/dt/react-native-picker-actionsheet.svg)](https://img.shields.io/npm/dt/react-native-picker-actionsheet.svg)\n\n## Install\n\n```bash\nnpm install react-native-picker-actionsheet --save\n```\n\n## Usage\n\n```javascript\nimport PickerActionSheet from 'react-native-picker-actionsheet';\n\n<PickerActionSheet />\n```\n\n## Example\n\n![ios](https://raw.githubusercontent.com/BooYeu/react-native-picker-actionsheet/master/images/ios.jpg)\n![android](https://raw.githubusercontent.com/BooYeu/react-native-picker-actionsheet/master/images/android.jpg)\n\n## Properties\n\n| Prop  | Default  | Required | Description |\n| :------------ |:---------------:| :---------------:| :-----|\n| show | false | yes | Controller whether or not show it |\n| height | 120 | yes | The height of the container,you have to change it for your requirement |\n| title | '' | no | The title text of the container |\n| titleRight | null | no | The compoment on the right hand of title |\n| data | [] | no | The data you give users to picker |\n| renderItem | ({item,index})=>{} | no | Function that shows data | \n| onCancel | ()=>{} | no | Function that is called when user cancels it |\n| onSubmit | (text)=>{} | no | Function that is called when user submits it |\n| cancelText | 'cancel' | no | The string that is displayed on the cancel button |\n| submitText | 'submit' | no | The string that is displayed on the submit button |\n",
-  "readmeFilename": "README.md",
   "repository": {
@@ -102,3 +105,3 @@ "type": "git",
   },
-  "version": "1.2.0"
+  "version": "1.2.1"
 }

src/index.js

 import React from 'react';
 import {StyleSheet,Animated,Modal,View,ScrollView,Text,TouchableWithoutFeedback,Dimensions} from 'react-native';
 
-export default class extends React.Component{
+export default class extends React.PureComponent{
   static defaultProps={
@@ -16,3 +16,4 @@ show:false,
     onCancel:()=>{},
-    shadowClick:'submit'
+    shadowClick:'submit',
+    renderFooter:null
   };
@@ -22,2 +23,6 @@ constructor(props){
     this.state={maskerOpacity:new Animated.Value(this.props.show?.5:0),bottomPosition:new Animated.Value(this.props.show?1:0),show:!this.props.show};
+	  this.showF=()=>this.setState({show:this.props.show});
+	  this.cancelF=()=>this.props.onCancel();
+	  this.shadowF=()=>this.props.shadowClick==='submit'?this.props.onSubmit():this.props.onCancel();
+	  this.submitF=()=>this.props.onSubmit();
   }
@@ -29,3 +34,3 @@ render(){
     if(this.state.show!==this.props.show)
-      Animated.parallel([
+	    requestAnimationFrame(()=>Animated.parallel([
         Animated.timing(
@@ -45,6 +50,6 @@ this.state.maskerOpacity,
         )
-      ]).start(()=>this.setState({show:this.props.show}));
+      ]).start(this.showF));
     return(
-	    this.state.show||this.props.show?<Modal transparent={true} onRequestClose={()=>this.props.onCancel()}>
-        <TouchableWithoutFeedback onPress={()=>this.props.shadowClick==='submit'?this.props.onSubmit():this.props.onCancel()}>
+	    this.state.show||this.props.show?<Modal transparent={true} onRequestClose={this.cancelF}>
+        <TouchableWithoutFeedback onPress={this.shadowF}>
           <Animated.View style={[styles.masker,{opacity:this.state.maskerOpacity}]} />
@@ -62,3 +67,3 @@ </TouchableWithoutFeedback>
           <View style={styles.item_top}>
-            <Text style={styles.item_top_btn} onPress={()=>this.props.onCancel()}>{this.props.cancelText}</Text>
+            <Text style={[styles.item_top_btn,{left:12,right:'auto'}]} onPress={this.cancelF}>{this.props.cancelText}</Text>
 						<View style={styles.item_top_title_container}>
@@ -68,3 +73,3 @@ <Text style={styles.item_top_title}>{this.props.title}</Text>
 						</View>
-            <Text style={styles.item_top_btn} onPress={()=>this.props.onSubmit()}>{this.props.submitText}</Text>
+            <Text style={styles.item_top_btn} onPress={this.submitF}>{this.props.submitText}</Text>
           </View>
@@ -78,2 +83,3 @@ {item.length>0?this.props.scrollEnabled?
 						</View>:this.props.ListEmptyComponent}
+          {this.props.renderFooter&&this.props.renderFooter()}
         </Animated.View>
@@ -94,9 +100,9 @@ </Modal>:null
     width:'100%',
-    backgroundColor:'#fff'
+	  backgroundColor:'#f9f9f9'
   },
   item_top:{
     flexDirection:'row',
-    justifyContent:'space-between',
+    justifyContent:'center',
     alignItems:'center',
-    padding:12,
+    paddingVertical:12,
     borderColor:'#ddd',
@@ -107,5 +113,7 @@ borderBottomWidth:.5,
   item_top_btn:{
-    color:'#666',
+    color:'#888',
     fontWeight:'bold',
-    fontSize:14
+    fontSize:12,
+    position:'absolute',
+    right:12
   },
@@ -126,9 +134,7 @@ item_top_title_container:{
     alignItems:'center',
-    flexWrap:'wrap',
-    backgroundColor:'#f9f9f9'
+    flexWrap:'wrap'
   },
 	items_scroll:{
-  	paddingVertical:6,
-		backgroundColor:'#f9f9f9'
+  	paddingVertical:6
 	}
 });

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

Lines of code

127

increased by4.96%

Worsened metrics

Total package byte prevSize

9687

decreased by-11.99%

No dependency changes