react-navigation-stack
Version:
Stack navigator component for React Navigation
2 lines • 8.39 kB
JavaScript
import _regeneratorRuntime from"@babel/runtime/regenerator";import _defineProperty from"@babel/runtime/helpers/defineProperty";import _classCallCheck from"@babel/runtime/helpers/classCallCheck";import _createClass from"@babel/runtime/helpers/createClass";import _possibleConstructorReturn from"@babel/runtime/helpers/possibleConstructorReturn";import _getPrototypeOf from"@babel/runtime/helpers/getPrototypeOf";import _inherits from"@babel/runtime/helpers/inherits";var _jsxFileName="/Users/satya/Workspace/Callstack/react-navigation-stack/src/views/Transitioner.tsx";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(source,true).forEach(function(key){_defineProperty(target,key,source[key]);});}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source));}else{ownKeys(source).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}}return target;}import*as React from'react';import{Animated,Easing,StyleSheet,View}from'react-native';import NavigationScenesReducer from'./ScenesReducer';var DefaultTransitionSpec={duration:250,easing:Easing.inOut(Easing.ease),timing:Animated.timing};var Transitioner=function(_React$Component){_inherits(Transitioner,_React$Component);function Transitioner(_props){var _this;_classCallCheck(this,Transitioner);_this=_possibleConstructorReturn(this,_getPrototypeOf(Transitioner).call(this,_props));_this.computeScenes=function(props,nextProps){var nextScenes=NavigationScenesReducer(_this.state.scenes,nextProps.navigation.state,props.navigation.state,nextProps.descriptors);if(!nextProps.navigation.state.isTransitioning){nextScenes=filterStale(nextScenes);}if(nextProps.screenProps!==_this.props.screenProps){_this.setState({nextScenes:nextScenes});}if(nextScenes===_this.state.scenes){return;}return nextScenes;};_this.handleLayout=function(event){var _event$nativeEvent$la=event.nativeEvent.layout,height=_event$nativeEvent$la.height,width=_event$nativeEvent$la.width;if(_this.state.layout.initWidth===width&&_this.state.layout.initHeight===height){return;}var layout=_objectSpread({},_this.state.layout,{initHeight:height,initWidth:width,isMeasured:true});layout.height.setValue(height);layout.width.setValue(width);var nextState=_objectSpread({},_this.state,{layout:layout});_this.transitionProps=buildTransitionProps(_this.props,nextState);_this.setState(nextState);};_this.handleTransitionEnd=function(){if(!_this.isComponentMounted){return;}var prevTransitionProps=_this.prevTransitionProps;_this.prevTransitionProps=undefined;var scenes=filterStale(_this.state.scenes);var nextState=_objectSpread({},_this.state,{scenes:scenes});_this.transitionProps=buildTransitionProps(_this.props,nextState);_this.setState(nextState,function _callee(){var result,prevProps;return _regeneratorRuntime.async(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:if(!_this.props.onTransitionEnd){_context.next=5;break;}result=_this.props.onTransitionEnd(_this.transitionProps,prevTransitionProps);if(!(result instanceof Promise)){_context.next=5;break;}_context.next=5;return _regeneratorRuntime.awrap(result);case 5:if(_this.queuedTransition){prevProps=_this.queuedTransition.prevProps;_this.queuedTransition=null;_this.startTransition(prevProps,_this.props);}else{_this.isTransitionRunning=false;}case 6:case"end":return _context.stop();}}});});};var _layout={height:new Animated.Value(0),initHeight:0,initWidth:0,isMeasured:false,width:new Animated.Value(0)};var position=new Animated.Value(_this.props.navigation.state.index);_this.positionListener=position.addListener(function(){});_this.state={layout:_layout,position:position,scenes:NavigationScenesReducer([],_this.props.navigation.state,null,_this.props.descriptors)};_this.prevTransitionProps=undefined;_this.transitionProps=buildTransitionProps(_props,_this.state);_this.isComponentMounted=false;_this.isTransitionRunning=false;_this.queuedTransition=null;return _this;}_createClass(Transitioner,[{key:"componentDidMount",value:function componentDidMount(){this.isComponentMounted=true;}},{key:"componentWillUnmount",value:function componentWillUnmount(){this.isComponentMounted=false;this.positionListener&&this.state.position.removeListener(this.positionListener);}},{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){if(this.isTransitionRunning){if(!this.queuedTransition){this.queuedTransition={prevProps:this.props};}return;}this.startTransition(this.props,nextProps);}},{key:"startTransition",value:function startTransition(props,nextProps){var _this2=this;var indexHasChanged=props.navigation.state.index!==nextProps.navigation.state.index;var nextScenes=this.computeScenes(props,nextProps);if(!nextScenes){this.prevTransitionProps=this.transitionProps;this.state.position.setValue(props.navigation.state.index);this.handleTransitionEnd();return;}var nextState=_objectSpread({},this.state,{scenes:nextScenes});var position=nextState.position;var toValue=nextProps.navigation.state.index;this.prevTransitionProps=this.transitionProps;this.transitionProps=buildTransitionProps(nextProps,nextState);var isTransitioning=this.transitionProps.navigation.state.isTransitioning;if(!isTransitioning||!indexHasChanged){this.setState(nextState,function _callee2(){var result;return _regeneratorRuntime.async(function _callee2$(_context2){while(1){switch(_context2.prev=_context2.next){case 0:if(!nextProps.onTransitionStart){_context2.next=5;break;}result=nextProps.onTransitionStart(_this2.transitionProps,_this2.prevTransitionProps);if(!(result instanceof Promise)){_context2.next=5;break;}_context2.next=5;return _regeneratorRuntime.awrap(result);case 5:indexHasChanged&&position.setValue(toValue);_this2.handleTransitionEnd();case 7:case"end":return _context2.stop();}}});});}else if(isTransitioning){this.isTransitionRunning=true;this.setState(nextState,function _callee3(){var result,transitionUserSpec,transitionSpec,timing,positionHasChanged;return _regeneratorRuntime.async(function _callee3$(_context3){while(1){switch(_context3.prev=_context3.next){case 0:if(!nextProps.onTransitionStart){_context3.next=5;break;}result=nextProps.onTransitionStart(_this2.transitionProps,_this2.prevTransitionProps);if(!(result instanceof Promise)){_context3.next=5;break;}_context3.next=5;return _regeneratorRuntime.awrap(result);case 5:transitionUserSpec=nextProps.configureTransition?nextProps.configureTransition(_this2.transitionProps,_this2.prevTransitionProps):null;transitionSpec=_objectSpread({},DefaultTransitionSpec,{},transitionUserSpec);timing=transitionSpec.timing;delete transitionSpec.timing;positionHasChanged=position.__getValue()!==toValue;if(indexHasChanged&&positionHasChanged){timing(position,_objectSpread({},transitionSpec,{toValue:nextProps.navigation.state.index})).start(function(){requestAnimationFrame(_this2.handleTransitionEnd);});}else{_this2.handleTransitionEnd();}case 11:case"end":return _context3.stop();}}});});}}},{key:"render",value:function render(){return React.createElement(View,{onLayout:this.handleLayout,style:styles.main,__source:{fileName:_jsxFileName,lineNumber:267}},this.props.render(this.transitionProps,this.prevTransitionProps));}}]);return Transitioner;}(React.Component);function buildTransitionProps(props,state){var navigation=props.navigation;var layout=state.layout,position=state.position,scenes=state.scenes;var scene=scenes.find(isSceneActive);if(!scene){throw new Error('Could not find active scene');}return{layout:layout,navigation:navigation,position:position,scenes:scenes,scene:scene,index:scene.index};}function isSceneNotStale(scene){return!scene.isStale;}function filterStale(scenes){var filtered=scenes.filter(isSceneNotStale);if(filtered.length===scenes.length){return scenes;}return filtered;}function isSceneActive(scene){return scene.isActive;}var styles=StyleSheet.create({main:{flex:1}});export default Transitioner;
//# sourceMappingURL=Transitioner.js.map