react-navigation-stack
Version:
Stack navigator component for React Navigation
2 lines • 4.26 kB
JavaScript
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/Header/ModularHeaderBackButton.tsx";import*as React from'react';import{I18nManager,Image,Text,View,StyleSheet}from'react-native';import TouchableItem from'../TouchableItem';import defaultBackImage from'../assets/back-icon.png';var ModularHeaderBackButton=function(_React$PureComponent){_inherits(ModularHeaderBackButton,_React$PureComponent);function ModularHeaderBackButton(){var _getPrototypeOf2;var _this;_classCallCheck(this,ModularHeaderBackButton);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(ModularHeaderBackButton)).call.apply(_getPrototypeOf2,[this].concat(args)));_this.state={};_this.onTextLayout=function(e){if(_this.state.initialTextWidth){return;}_this.setState({initialTextWidth:e.nativeEvent.layout.x+e.nativeEvent.layout.width});};_this.getTitleText=function(){var _this$props=_this.props,width=_this$props.width,title=_this$props.title,truncatedTitle=_this$props.truncatedTitle;var initialTextWidth=_this.state.initialTextWidth;if(title===null){return null;}else if(!title){return truncatedTitle;}else if(initialTextWidth&&width&&initialTextWidth>width){return truncatedTitle;}else{return title.length>8?truncatedTitle:title;}};return _this;}_createClass(ModularHeaderBackButton,[{key:"renderBackImage",value:function renderBackImage(){var _this$props2=this.props,backImage=_this$props2.backImage,backTitleVisible=_this$props2.backTitleVisible,tintColor=_this$props2.tintColor;if(React.isValidElement(backImage)){return backImage;}else if(backImage){return backImage({tintColor:tintColor});}else{return React.createElement(Image,{style:[styles.icon,!!backTitleVisible&&styles.iconWithTitle,!!tintColor&&{tintColor:tintColor}],source:defaultBackImage,__source:{fileName:_jsxFileName,lineNumber:51}});}}},{key:"maybeRenderTitle",value:function maybeRenderTitle(){var _this$props3=this.props,backTitleVisible=_this$props3.backTitleVisible,titleStyle=_this$props3.titleStyle,tintColor=_this$props3.tintColor;var backTitleText=this.getTitleText();if(!backTitleVisible||backTitleText===null){return null;}var LabelContainerComponent=this.props.LabelContainerComponent;return React.createElement(LabelContainerComponent,{__source:{fileName:_jsxFileName,lineNumber:90}},React.createElement(Text,{accessible:false,onLayout:this.onTextLayout,style:[styles.title,!!tintColor&&{color:tintColor},titleStyle],numberOfLines:1,__source:{fileName:_jsxFileName,lineNumber:91}},this.getTitleText()));}},{key:"render",value:function render(){var _this$props4=this.props,onPress=_this$props4.onPress,title=_this$props4.title;var ButtonContainerComponent=this.props.ButtonContainerComponent;return React.createElement(TouchableItem,{accessibilityComponentType:"button",accessibilityLabel:title?title+", back":'Go back',accessibilityTraits:"button",testID:"header-back",delayPressIn:0,onPress:onPress,style:styles.container,borderless:true,__source:{fileName:_jsxFileName,lineNumber:112}},React.createElement(View,{style:styles.container,__source:{fileName:_jsxFileName,lineNumber:122}},React.createElement(ButtonContainerComponent,{__source:{fileName:_jsxFileName,lineNumber:123}},this.renderBackImage()),this.maybeRenderTitle()));}}]);return ModularHeaderBackButton;}(React.PureComponent);ModularHeaderBackButton.defaultProps={tintColor:'#037aff',truncatedTitle:'Back'};var styles=StyleSheet.create({container:{alignItems:'center',flexDirection:'row',backgroundColor:'transparent',marginBottom:1,overflow:'visible'},title:{fontSize:17,paddingRight:10},icon:{height:21,width:12,marginLeft:9,marginRight:22,marginVertical:12,resizeMode:'contain',transform:[{scaleX:I18nManager.isRTL?-1:1}]},iconWithTitle:{marginRight:3}});export default ModularHeaderBackButton;
//# sourceMappingURL=ModularHeaderBackButton.js.map