Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
react-native-picker-actionsheet
Advanced tools
react-native-picker-actionsheet - npm Package Compare versions
Comparing version 1.3.0 to 1.4.0
| { | ||
| "name": "react-native-picker-actionsheet", | ||
| "version": "1.3.0", | ||
| "version": "1.4.0", | ||
| "description": "A picker like ActionSheet component which can be used in iOS & Android . Use Animated . ", | ||
@@ -30,2 +30,2 @@ "main": "src/index.js", | ||
| } | ||
| } | ||
| } |
137
src/index.js
@@ -29,2 +29,3 @@ import React from 'react'; | ||
| renderFooter: null, | ||
| showHeader: true, | ||
| }; | ||
@@ -38,16 +39,17 @@ constructor(props) { | ||
| }; | ||
| this.cancelF = () => props.onCancel(); | ||
| this.shadowF = () => | ||
| props.onMask | ||
| ? props.onMask() | ||
| : props.shadowClick === 'submit' | ||
| ? props.onSubmit() | ||
| : props.onCancel(); | ||
| this.submitF = () => props.onSubmit(); | ||
| } | ||
| cancelF = () => { | ||
| this.props.onCancel(); | ||
| } | ||
| submitF = () => { | ||
| this.props.onSubmit(); | ||
| } | ||
| shadowF = () => { | ||
| this.props.onMask | ||
| ? this.props.onMask() | ||
| : this.props.shadowClick === 'submit' | ||
| ? this.props.onSubmit() | ||
| : this.props.onCancel(); | ||
| } | ||
| render() { | ||
| let item = []; | ||
| for (let i = 0; i < this.props.data.length; i++) { | ||
| item.push(this.props.renderItem({item: this.props.data[i], index: i})); | ||
| } | ||
| if (this.state.show !== this.props.show) { | ||
@@ -69,60 +71,55 @@ requestAnimationFrame(() => | ||
| } | ||
| return 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}]} | ||
| /> | ||
| </TouchableWithoutFeedback> | ||
| <Animated.View | ||
| style={[ | ||
| styles.item_container, | ||
| { | ||
| height: this.props.height + this.props.bottom, | ||
| paddingBottom: this.props.bottom, | ||
| transform: [ | ||
| { | ||
| translateY: this.state.bottomPosition.interpolate({ | ||
| inputRange: [0, 1], | ||
| outputRange: [this.props.height, 0], | ||
| }), | ||
| }, | ||
| ], | ||
| }, | ||
| this.props.containerStyle, | ||
| ]}> | ||
| <View style={[styles.item_top, this.props.topStyle]}> | ||
| <Text | ||
| style={[styles.item_top_btn, {left: 12, right: 'auto'}]} | ||
| onPress={this.cancelF}> | ||
| {this.props.cancelText} | ||
| </Text> | ||
| <TouchableWithoutFeedback onPress={this.props.titlePress}> | ||
| <View style={styles.item_top_title_container}> | ||
| <Text | ||
| style={[styles.item_top_title, this.props.titleStyle]}> | ||
| {this.props.title} | ||
| </Text> | ||
| {this.props.titleRight} | ||
| </View> | ||
| </TouchableWithoutFeedback> | ||
| <Text style={styles.item_top_btn} onPress={this.submitF}> | ||
| {this.props.submitText} | ||
| </Text> | ||
| </View> | ||
| {item.length > 0 ? ( | ||
| this.props.scrollEnabled ? ( | ||
| <ScrollView style={styles.items_scroll}>{item}</ScrollView> | ||
| ) : ( | ||
| <View style={styles.items}>{item}</View> | ||
| ) | ||
| ) : ( | ||
| this.props.ListEmptyComponent | ||
| )} | ||
| {this.props.renderFooter && this.props.renderFooter()} | ||
| </Animated.View> | ||
| </Modal> | ||
| ): null) | ||
| : null; | ||
| return ( | ||
| <Modal transparent={true} onRequestClose={this.cancelF} visible={this.state.show || this.props.show}> | ||
| <TouchableWithoutFeedback onPress={this.shadowF}> | ||
| <Animated.View style={[styles.masker, {opacity: this.state.maskerOpacity}]} /> | ||
| </TouchableWithoutFeedback> | ||
| {this.props.maskerChildren} | ||
| <Animated.View | ||
| style={[ | ||
| styles.item_container, | ||
| { | ||
| height: this.props.height + this.props.bottom, | ||
| paddingBottom: this.props.bottom, | ||
| transform: [ | ||
| { | ||
| translateY: this.state.bottomPosition.interpolate({ | ||
| inputRange: [0, 1], | ||
| outputRange: [this.props.height, 0], | ||
| }), | ||
| }, | ||
| ], | ||
| }, | ||
| this.props.containerStyle, | ||
| ]}> | ||
| {this.props.showHeader ? <View style={[styles.item_top, this.props.topStyle]}> | ||
| <Text | ||
| style={[styles.item_top_btn, {left: 12, right: 'auto'}]} | ||
| onPress={this.cancelF}> | ||
| {this.props.cancelText} | ||
| </Text> | ||
| <TouchableWithoutFeedback onPress={this.props.titlePress}> | ||
| <View style={styles.item_top_title_container}> | ||
| <Text | ||
| style={[styles.item_top_title, this.props.titleStyle]}> | ||
| {this.props.title} | ||
| </Text> | ||
| {this.props.titleRight} | ||
| </View> | ||
| </TouchableWithoutFeedback> | ||
| <Text style={styles.item_top_btn} onPress={this.submitF}> | ||
| {this.props.submitText} | ||
| </Text> | ||
| </View> : null} | ||
| {this.props.children ? this.props.children : ( item.length > 0 ? ( | ||
| <ScrollView style={styles.items_scroll} scrollEnabled={this.props.scrollEnabled}> | ||
| {this.props.data.map(this.props.renderItem)} | ||
| </ScrollView> | ||
| ) : ( | ||
| this.props.ListEmptyComponent | ||
| ))} | ||
| {this.props.renderFooter && this.props.renderFooter()} | ||
| </Animated.View> | ||
| </Modal> | ||
| ); | ||
| } | ||
@@ -129,0 +126,0 @@ } |
Fixed alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Number of medium supply chain risk alerts
- decreased by-100%
0
Worsened metrics
- Total package byte prevSize
- decreased by-1.84%
8626
- Lines of code
- decreased by-1.75%
168
No dependency changes