react-native-popup-navigation
Version:
2 lines • 7.06 kB
JavaScript
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _jsxFileName="/Users/mnshkv/develop/opensource/popupNavigation/lib/components/navigation/pop_up.next.js";var _Dimensions$get=_reactNative.Dimensions.get('window'),width=_Dimensions$get.width,height=_Dimensions$get.height;var EPSILON=1e-9;var easeIn=_reactNative.Easing.bezier(0.42,0,1,1,EPSILON);var easeOut=_reactNative.Easing.bezier(0,0,0.58,1,EPSILON);var easeInOut=_reactNative.Easing.bezier(0.42,0,0.58,1,EPSILON);var def=_reactNative.Easing.bezier(0.25,0.1,0.25,1,EPSILON);var PopUp=function(_Component){(0,_inherits2.default)(PopUp,_Component);function PopUp(props){var _this;(0,_classCallCheck2.default)(this,PopUp);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(PopUp).call(this,props));_this.masterdrawer=_react.default.createRef();_this.drawer=_react.default.createRef();_this.drawerheader=_react.default.createRef();_this.scroll=_react.default.createRef();_this.scrollV=_react.default.createRef();_this._onHeaderHandlerStateChange=function(_ref){var nativeEvent=_ref.nativeEvent;if(nativeEvent.oldState===_reactNativeGestureHandler.State.BEGAN){_this._lastScrollY.setValue(0);}_this._onHandlerStateChange({nativeEvent:nativeEvent});};_this.snapTo=function(value){_reactNative.Animated.timing(_this._translateYOffset,{duration:250,toValue:value,easing:def,useNativeDriver:_this.props.nativeDriver}).start(function(){_this.setState({lastSnap:value});});};_this._onHandlerStateChange=function(_ref2){var nativeEvent=_ref2.nativeEvent;if(nativeEvent.oldState===_reactNativeGestureHandler.State.ACTIVE){var velocityY=nativeEvent.velocityY,translationY=nativeEvent.translationY;translationY-=_this._lastScrollYValue;var dragToss=0.05;var endOffsetY=_this.state.lastSnap+translationY+dragToss*velocityY;var destSnapPoint=_this.props.snapPoints[0];for(var i=0;i<_this.props.snapPoints.length;i++){var snapPoint=_this.props.snapPoints[i];var distFromSnap=Math.abs(snapPoint-endOffsetY);if(distFromSnap<Math.abs(destSnapPoint-endOffsetY)){destSnapPoint=snapPoint;}}_this.setState({lastSnap:destSnapPoint});_this._translateYOffset.extractOffset();_this._translateYOffset.setValue(translationY);_this._translateYOffset.flattenOffset();_this._dragY.setValue(0);_reactNative.Animated.spring(_this._translateYOffset,{velocity:velocityY,tension:68,friction:12,toValue:destSnapPoint,useNativeDriver:_this.props.nativeDriver}).start(function(){if(_this.state.lastSnap===_this.props.snapPoints[_this.props.snapPoints.length-1]){_this.props.dismiss();}});}};var START=props.snapPoints[0];var AFTER_START=props.snapPoints[1];var END=props.snapPoints[props.snapPoints.length-1];_this.state={lastSnap:END,bounces:props.bounces};_this._lastScrollYValue=props._lastScrollYValue;_this._lastScrollY=props._lastScrollY;_this._onRegisterLastScroll=_reactNative.Animated.event([{nativeEvent:{contentOffset:{y:_this._lastScrollY}}}],{useNativeDriver:props.nativeDriver});_this._lastScrollY.addListener(function(_ref3){var value=_ref3.value;_this._lastScrollYValue=value;if(value<=20){_this.setState({bounces:false});}else{_this.setState({bounces:true});}});_this._dragY=props._dragY;_this._onGestureEvent=_reactNative.Animated.event([{nativeEvent:{translationY:_this._dragY}}],{useNativeDriver:props.nativeDriver});_this._reverseLastScrollY=_reactNative.Animated.multiply(new _reactNative.Animated.Value(-1),_this._lastScrollY);_this._translateYOffset=props._translateYOffset;_this._translateY=_reactNative.Animated.add(_this._translateYOffset,_reactNative.Animated.add(_this._dragY,_this._reverseLastScrollY)).interpolate({inputRange:[START,END],outputRange:[START,END],extrapolate:'clamp'});_this._radius=_reactNative.Animated.add(_this._translateYOffset,_reactNative.Animated.add(_this._dragY,_this._reverseLastScrollY)).interpolate({inputRange:[START,AFTER_START/12],outputRange:[0,props.cornerRadius],extrapolate:'clamp'});return _this;}(0,_createClass2.default)(PopUp,[{key:"componentDidMount",value:function componentDidMount(){}},{key:"render",value:function render(){var _this2=this;return _react.default.createElement(_reactNativeGestureHandler.TapGestureHandler,{maxDurationMs:100000,ref:this.masterdrawer,maxDeltaY:this.state.lastSnap-this.props.snapPoints[0],__source:{fileName:_jsxFileName,lineNumber:153}},_react.default.createElement(_reactNative.View,{style:{position:'absolute',width:width,height:height,top:0,left:0,right:0,bottom:0},pointerEvents:"box-none",__source:{fileName:_jsxFileName,lineNumber:157}},_react.default.createElement(_reactNative.Animated.View,{style:{width:width,height:height,transform:[{translateY:this._translateY}]},__source:{fileName:_jsxFileName,lineNumber:158}},_react.default.createElement(_reactNativeGestureHandler.PanGestureHandler,{ref:this.drawer,simultaneousHandlers:[this.scroll,this.masterdrawer],shouldCancelWhenOutside:false,onGestureEvent:this._onGestureEvent,onHandlerStateChange:this._onHandlerStateChange,__source:{fileName:_jsxFileName,lineNumber:166}},_react.default.createElement(_reactNative.Animated.View,{style:[styles.container,this.props.animateBorder&&{overflow:'hidden',borderTopLeftRadius:this._radius,borderTopRightRadius:this._radius},!this.props.animateBorder&&{overflow:'hidden',borderTopLeftRadius:this.props.cornerRadius,borderTopRightRadius:this.props.cornerRadius}],__source:{fileName:_jsxFileName,lineNumber:172}},_react.default.createElement(_reactNativeGestureHandler.NativeViewGestureHandler,{ref:this.scroll,waitFor:this.masterdrawer,simultaneousHandlers:this.drawer,__source:{fileName:_jsxFileName,lineNumber:187}},_react.default.createElement(_reactNative.Animated.ScrollView,{ref:function ref(_ref4){_this2.scrollV=_ref4;},style:this.props.scrollStyle,bounces:this.state.bounces,contentContainerStyle:{minWidth:width,minHeight:height},onScrollBeginDrag:this._onRegisterLastScroll,scrollEventThrottle:16,__source:{fileName:_jsxFileName,lineNumber:191}},this.props.renderContent())))))));}}]);return PopUp;}(_react.Component);exports.default=PopUp;PopUp.defaultProps={bounces:true,nativeDriver:true,animateBorder:false,cornerRadius:20};var styles=_reactNative.StyleSheet.create({container:{flex:1},header:{backgroundColor:'red'}});
//# sourceMappingURL=pop_up.next.js.map