478e2435a94b88adf23df678c37eada1.json
37.3 KB
{"ast":null,"code":"var _interopRequireWildcard=require(\"@babel/runtime/helpers/interopRequireWildcard\");var _interopRequireDefault=require(\"@babel/runtime/helpers/interopRequireDefault\");Object.defineProperty(exports,\"__esModule\",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require(\"@babel/runtime/helpers/extends\"));var _objectSpread2=_interopRequireDefault(require(\"@babel/runtime/helpers/objectSpread\"));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 _getPrototypeOf3=_interopRequireDefault(require(\"@babel/runtime/helpers/getPrototypeOf\"));var _inherits2=_interopRequireDefault(require(\"@babel/runtime/helpers/inherits\"));var React=_interopRequireWildcard(require(\"react\"));var _StyleSheet=_interopRequireDefault(require(\"react-native-web/dist/exports/StyleSheet\"));var _View=_interopRequireDefault(require(\"react-native-web/dist/exports/View\"));var _I18nManager=_interopRequireDefault(require(\"react-native-web/dist/exports/I18nManager\"));var _Platform=_interopRequireDefault(require(\"react-native-web/dist/exports/Platform\"));var _reactNativeReanimated=_interopRequireDefault(require(\"react-native-reanimated\"));var _TabBarItem=_interopRequireDefault(require(\"./TabBarItem\"));var _TabBarIndicator=_interopRequireDefault(require(\"./TabBarIndicator\"));var _memoize=_interopRequireDefault(require(\"./memoize\"));var _jsxFileName=\"/Users/satya/Workspace/Projects/react-native-tab-view/src/TabBar.tsx\";var TabBar=function(_React$Component){(0,_inherits2.default)(TabBar,_React$Component);function TabBar(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,TabBar);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(TabBar)).call.apply(_getPrototypeOf2,[this].concat(args)));_this.state={layout:{width:0,height:0},tabWidths:{}};_this.measuredTabWidths={};_this.scrollAmount=new _reactNativeReanimated.default.Value(0);_this.getFlattenedTabWidth=function(style){var tabStyle=_StyleSheet.default.flatten(style);return tabStyle?tabStyle.width:undefined;};_this.getComputedTabWidth=function(index,layout,routes,scrollEnabled,tabWidths,flattenedWidth){if(flattenedWidth==='auto'){return tabWidths[routes[index].key]||0;}switch(typeof flattenedWidth){case'number':return flattenedWidth;case'string':if(flattenedWidth.endsWith('%')){var width=parseFloat(flattenedWidth);if(Number.isFinite(width)){return layout.width*(width/100);}}}if(scrollEnabled){return layout.width/5*2;}return layout.width/routes.length;};_this.getMemoizedTabWidthGettter=(0,_memoize.default)(function(layout,routes,scrollEnabled,tabWidths,flattenedWidth){return function(i){return _this.getComputedTabWidth(i,layout,routes,scrollEnabled,tabWidths,flattenedWidth);};});_this.getMaxScrollDistance=function(tabBarWidth,layoutWidth){return tabBarWidth-layoutWidth;};_this.getTabBarWidth=function(props,state){var layout=state.layout,tabWidths=state.tabWidths;var scrollEnabled=props.scrollEnabled,tabStyle=props.tabStyle;var routes=props.navigationState.routes;return routes.reduce(function(acc,_,i){return acc+_this.getComputedTabWidth(i,layout,routes,scrollEnabled,tabWidths,_this.getFlattenedTabWidth(tabStyle));},0);};_this.normalizeScrollValue=function(props,state,value){var layout=state.layout;var tabBarWidth=_this.getTabBarWidth(props,state);var maxDistance=_this.getMaxScrollDistance(tabBarWidth,layout.width);var scrollValue=Math.max(Math.min(value,maxDistance),0);if(_Platform.default.OS==='android'&&_I18nManager.default.isRTL){return maxDistance-scrollValue;}return scrollValue;};_this.getScrollAmount=function(props,state,index){var layout=state.layout,tabWidths=state.tabWidths;var scrollEnabled=props.scrollEnabled,tabStyle=props.tabStyle;var routes=props.navigationState.routes;var centerDistance=Array.from({length:index+1}).reduce(function(total,_,i){var tabWidth=_this.getComputedTabWidth(i,layout,routes,scrollEnabled,tabWidths,_this.getFlattenedTabWidth(tabStyle));return total+(index===i?tabWidth/2:tabWidth);},0);var scrollAmount=centerDistance-layout.width/2;return _this.normalizeScrollValue(props,state,scrollAmount);};_this.resetScroll=function(index){if(_this.props.scrollEnabled){_this.scrollView&&_this.scrollView.scrollTo({x:_this.getScrollAmount(_this.props,_this.state,index),animated:true});}};_this.handleLayout=function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,height=_e$nativeEvent$layout.height,width=_e$nativeEvent$layout.width;if(_this.state.layout.width===width&&_this.state.layout.height===height){return;}_this.setState({layout:{height:height,width:width}});};_this.getTranslateX=(0,_memoize.default)(function(scrollAmount,maxScrollDistance){return _reactNativeReanimated.default.multiply(_Platform.default.OS==='android'&&_I18nManager.default.isRTL?_reactNativeReanimated.default.sub(maxScrollDistance,scrollAmount):scrollAmount,_I18nManager.default.isRTL?1:-1);});return _this;}(0,_createClass2.default)(TabBar,[{key:\"componentDidUpdate\",value:function componentDidUpdate(prevProps,prevState){var navigationState=this.props.navigationState;var _this$state=this.state,layout=_this$state.layout,tabWidths=_this$state.tabWidths;if(prevProps.navigationState.routes.length!==navigationState.routes.length||prevProps.navigationState.index!==navigationState.index||prevState.layout.width!==layout.width||prevState.tabWidths!==tabWidths){if(this.getFlattenedTabWidth(this.props.tabStyle)==='auto'&&!(layout.width&&navigationState.routes.every(function(r){return typeof tabWidths[r.key]==='number';}))){return;}this.resetScroll(navigationState.index);}}},{key:\"render\",value:function render(){var _this2=this;var _this$props=this.props,position=_this$props.position,navigationState=_this$props.navigationState,jumpTo=_this$props.jumpTo,scrollEnabled=_this$props.scrollEnabled,bounces=_this$props.bounces,getAccessibilityLabel=_this$props.getAccessibilityLabel,getAccessible=_this$props.getAccessible,getLabelText=_this$props.getLabelText,getTestID=_this$props.getTestID,renderBadge=_this$props.renderBadge,renderIcon=_this$props.renderIcon,renderLabel=_this$props.renderLabel,activeColor=_this$props.activeColor,inactiveColor=_this$props.inactiveColor,pressColor=_this$props.pressColor,pressOpacity=_this$props.pressOpacity,onTabPress=_this$props.onTabPress,onTabLongPress=_this$props.onTabLongPress,tabStyle=_this$props.tabStyle,labelStyle=_this$props.labelStyle,indicatorStyle=_this$props.indicatorStyle,contentContainerStyle=_this$props.contentContainerStyle,style=_this$props.style,indicatorContainerStyle=_this$props.indicatorContainerStyle;var _this$state2=this.state,layout=_this$state2.layout,tabWidths=_this$state2.tabWidths;var routes=navigationState.routes;var isWidthDynamic=this.getFlattenedTabWidth(tabStyle)==='auto';var tabBarWidth=this.getTabBarWidth(this.props,this.state);var tabBarWidthPercent=routes.length*40+\"%\";var translateX=this.getTranslateX(this.scrollAmount,this.getMaxScrollDistance(tabBarWidth,layout.width));return React.createElement(_reactNativeReanimated.default.View,{onLayout:this.handleLayout,style:[styles.tabBar,style],__source:{fileName:_jsxFileName,lineNumber:331}},React.createElement(_reactNativeReanimated.default.View,{pointerEvents:\"none\",style:[styles.indicatorContainer,scrollEnabled?{transform:[{translateX:translateX}]}:null,tabBarWidth?{width:tabBarWidth}:scrollEnabled?{width:tabBarWidthPercent}:null,indicatorContainerStyle],__source:{fileName:_jsxFileName,lineNumber:335}},this.props.renderIndicator({position:position,layout:layout,navigationState:navigationState,jumpTo:jumpTo,width:isWidthDynamic?'auto':100/routes.length+\"%\",style:indicatorStyle,getTabWidth:this.getMemoizedTabWidthGettter(layout,routes,scrollEnabled,tabWidths,this.getFlattenedTabWidth(tabStyle))})),React.createElement(_View.default,{style:styles.scroll,__source:{fileName:_jsxFileName,lineNumber:364}},React.createElement(_reactNativeReanimated.default.ScrollView,{horizontal:true,keyboardShouldPersistTaps:\"handled\",scrollEnabled:scrollEnabled,bounces:bounces,alwaysBounceHorizontal:false,scrollsToTop:false,showsHorizontalScrollIndicator:false,automaticallyAdjustContentInsets:false,overScrollMode:\"never\",contentContainerStyle:[styles.tabContent,scrollEnabled?{width:tabBarWidth||tabBarWidthPercent}:styles.container,contentContainerStyle],scrollEventThrottle:16,onScroll:_reactNativeReanimated.default.event([{nativeEvent:{contentOffset:{x:this.scrollAmount}}}]),ref:function ref(el){_this2.scrollView=el&&el.getNode();},__source:{fileName:_jsxFileName,lineNumber:365}},routes.map(function(route){return React.createElement(_TabBarItem.default,{onLayout:isWidthDynamic?function(e){_this2.measuredTabWidths[route.key]=e.nativeEvent.layout.width;if(routes.every(function(r){return typeof _this2.measuredTabWidths[r.key]==='number';})){_this2.setState({tabWidths:(0,_objectSpread2.default)({},_this2.measuredTabWidths)});}}:undefined,key:route.key,position:position,route:route,navigationState:navigationState,getAccessibilityLabel:getAccessibilityLabel,getAccessible:getAccessible,getLabelText:getLabelText,getTestID:getTestID,renderBadge:renderBadge,renderIcon:renderIcon,renderLabel:renderLabel,activeColor:activeColor,inactiveColor:inactiveColor,pressColor:pressColor,pressOpacity:pressOpacity,onPress:function onPress(){var event={route:route,defaultPrevented:false,preventDefault:function preventDefault(){event.defaultPrevented=true;}};onTabPress&&onTabPress(event);if(event.defaultPrevented){return;}_this2.props.jumpTo(route.key);},onLongPress:function onLongPress(){return onTabLongPress&&onTabLongPress({route:route});},labelStyle:labelStyle,style:tabStyle,__source:{fileName:_jsxFileName,lineNumber:396}});}))));}}]);return TabBar;}(React.Component);exports.default=TabBar;TabBar.defaultProps={getLabelText:function getLabelText(_ref){var route=_ref.route;return typeof route.title==='string'?route.title.toUpperCase():route.title;},getAccessible:function getAccessible(_ref2){var route=_ref2.route;return typeof route.accessible!=='undefined'?route.accessible:true;},getAccessibilityLabel:function getAccessibilityLabel(_ref3){var route=_ref3.route;return typeof route.accessibilityLabel==='string'?route.accessibilityLabel:typeof route.title==='string'?route.title:undefined;},getTestID:function getTestID(_ref4){var route=_ref4.route;return route.testID;},renderIndicator:function renderIndicator(props){return React.createElement(_TabBarIndicator.default,(0,_extends2.default)({},props,{__source:{fileName:_jsxFileName,lineNumber:84}}));}};var styles=_StyleSheet.default.create({container:{flex:1},scroll:{overflow:'scroll'},tabBar:{backgroundColor:'#2196f3',elevation:4,shadowColor:'black',shadowOpacity:0.1,shadowRadius:_StyleSheet.default.hairlineWidth,shadowOffset:{height:_StyleSheet.default.hairlineWidth,width:0},zIndex:1},tabContent:{flexDirection:'row',flexWrap:'nowrap'},indicatorContainer:{position:'absolute',top:0,left:0,right:0,bottom:0}});","map":{"version":3,"sources":["TabBar.tsx"],"names":["TabBar","React","Component","defaultProps","getLabelText","route","getAccessible","getAccessibilityLabel","getTestID","renderIndicator","state","layout","width","height","tabWidths","prevProps","prevState","navigationState","r","measuredTabWidths","scrollAmount","Animated","getFlattenedTabWidth","tabStyle","StyleSheet","getComputedTabWidth","flattenedWidth","routes","parseFloat","Number","getMemoizedTabWidthGettter","memoize","getMaxScrollDistance","tabBarWidth","getTabBarWidth","scrollEnabled","props","acc","normalizeScrollValue","maxDistance","scrollValue","Math","Platform","I18nManager","getScrollAmount","centerDistance","Array","length","index","tabWidth","total","resetScroll","x","animated","handleLayout","e","getTranslateX","position","jumpTo","bounces","renderBadge","renderIcon","renderLabel","activeColor","inactiveColor","pressColor","pressOpacity","onTabPress","onTabLongPress","labelStyle","indicatorStyle","contentContainerStyle","style","indicatorContainerStyle","isWidthDynamic","tabBarWidthPercent","translateX","styles","transform","getTabWidth","nativeEvent","contentOffset","el","event","defaultPrevented","preventDefault","container","flex","scroll","overflow","tabBar","backgroundColor","elevation","shadowColor","shadowOpacity","shadowRadius","shadowOffset","zIndex","tabContent","flexDirection","flexWrap","indicatorContainer","top","left","right","bottom"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n StyleSheet,\n View,\n ScrollView,\n StyleProp,\n ViewStyle,\n TextStyle,\n LayoutChangeEvent,\n I18nManager,\n Platform,\n} from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport TabBarItem from './TabBarItem';\nimport TabBarIndicator, { Props as IndicatorProps } from './TabBarIndicator';\nimport memoize from './memoize';\nimport {\n Route,\n Scene,\n SceneRendererProps,\n NavigationState,\n Layout,\n Event,\n} from './types';\n\nexport type Props<T extends Route> = SceneRendererProps & {\n navigationState: NavigationState<T>;\n scrollEnabled?: boolean;\n bounces?: boolean;\n activeColor?: string;\n inactiveColor?: string;\n pressColor?: string;\n pressOpacity?: number;\n getLabelText: (scene: Scene<T>) => string | undefined;\n getAccessible: (scene: Scene<T>) => boolean | undefined;\n getAccessibilityLabel: (scene: Scene<T>) => string | undefined;\n getTestID: (scene: Scene<T>) => string | undefined;\n renderLabel?: (\n scene: Scene<T> & {\n focused: boolean;\n color: string;\n }\n ) => React.ReactNode;\n renderIcon?: (\n scene: Scene<T> & {\n focused: boolean;\n color: string;\n }\n ) => React.ReactNode;\n renderBadge?: (scene: Scene<T>) => React.ReactNode;\n renderIndicator: (props: IndicatorProps<T>) => React.ReactNode;\n onTabPress?: (scene: Scene<T> & Event) => void;\n onTabLongPress?: (scene: Scene<T>) => void;\n tabStyle?: StyleProp<ViewStyle>;\n indicatorStyle?: StyleProp<ViewStyle>;\n indicatorContainerStyle?: StyleProp<ViewStyle>;\n labelStyle?: StyleProp<TextStyle>;\n contentContainerStyle?: StyleProp<ViewStyle>;\n style?: StyleProp<ViewStyle>;\n};\n\ntype State = {\n layout: Layout;\n tabWidths: { [key: string]: number };\n};\n\nexport default class TabBar<T extends Route> extends React.Component<\n Props<T>,\n State\n> {\n static defaultProps = {\n getLabelText: ({ route }: Scene<Route>) =>\n typeof route.title === 'string' ? route.title.toUpperCase() : route.title,\n getAccessible: ({ route }: Scene<Route>) =>\n typeof route.accessible !== 'undefined' ? route.accessible : true,\n getAccessibilityLabel: ({ route }: Scene<Route>) =>\n typeof route.accessibilityLabel === 'string'\n ? route.accessibilityLabel\n : typeof route.title === 'string'\n ? route.title\n : undefined,\n getTestID: ({ route }: Scene<Route>) => route.testID,\n renderIndicator: (props: IndicatorProps<Route>) => (\n <TabBarIndicator {...props} />\n ),\n };\n\n state: State = {\n layout: { width: 0, height: 0 },\n tabWidths: {},\n };\n\n componentDidUpdate(prevProps: Props<T>, prevState: State) {\n const { navigationState } = this.props;\n const { layout, tabWidths } = this.state;\n\n if (\n prevProps.navigationState.routes.length !==\n navigationState.routes.length ||\n prevProps.navigationState.index !== navigationState.index ||\n prevState.layout.width !== layout.width ||\n prevState.tabWidths !== tabWidths\n ) {\n if (\n this.getFlattenedTabWidth(this.props.tabStyle) === 'auto' &&\n !(\n layout.width &&\n navigationState.routes.every(\n r => typeof tabWidths[r.key] === 'number'\n )\n )\n ) {\n // When tab width is dynamic, only adjust the scroll once we have all tab widths and layout\n return;\n }\n\n this.resetScroll(navigationState.index);\n }\n }\n\n // to store the layout.width of each tab\n // when all onLayout's are fired, this would be set in state\n private measuredTabWidths: { [key: string]: number } = {};\n\n private scrollAmount = new Animated.Value(0);\n\n private scrollView: ScrollView | undefined;\n\n private getFlattenedTabWidth = (style: StyleProp<ViewStyle>) => {\n const tabStyle = StyleSheet.flatten(style);\n\n return tabStyle ? tabStyle.width : undefined;\n };\n\n private getComputedTabWidth = (\n index: number,\n layout: Layout,\n routes: Route[],\n scrollEnabled: boolean | undefined,\n tabWidths: { [key: string]: number },\n flattenedWidth: string | number | undefined\n ) => {\n if (flattenedWidth === 'auto') {\n return tabWidths[routes[index].key] || 0;\n }\n\n switch (typeof flattenedWidth) {\n case 'number':\n return flattenedWidth;\n case 'string':\n if (flattenedWidth.endsWith('%')) {\n const width = parseFloat(flattenedWidth);\n if (Number.isFinite(width)) {\n return layout.width * (width / 100);\n }\n }\n }\n\n if (scrollEnabled) {\n return (layout.width / 5) * 2;\n }\n\n return layout.width / routes.length;\n };\n\n private getMemoizedTabWidthGettter = memoize(\n (\n layout: Layout,\n routes: Route[],\n scrollEnabled: boolean | undefined,\n tabWidths: { [key: string]: number },\n flattenedWidth: string | number | undefined\n ) => (i: number) =>\n this.getComputedTabWidth(\n i,\n layout,\n routes,\n scrollEnabled,\n tabWidths,\n flattenedWidth\n )\n );\n\n private getMaxScrollDistance = (tabBarWidth: number, layoutWidth: number) =>\n tabBarWidth - layoutWidth;\n\n private getTabBarWidth = (props: Props<T>, state: State) => {\n const { layout, tabWidths } = state;\n const { scrollEnabled, tabStyle } = props;\n const { routes } = props.navigationState;\n\n return routes.reduce<number>(\n (acc, _, i) =>\n acc +\n this.getComputedTabWidth(\n i,\n layout,\n routes,\n scrollEnabled,\n tabWidths,\n this.getFlattenedTabWidth(tabStyle)\n ),\n 0\n );\n };\n\n private normalizeScrollValue = (\n props: Props<T>,\n state: State,\n value: number\n ) => {\n const { layout } = state;\n const tabBarWidth = this.getTabBarWidth(props, state);\n const maxDistance = this.getMaxScrollDistance(tabBarWidth, layout.width);\n const scrollValue = Math.max(Math.min(value, maxDistance), 0);\n\n if (Platform.OS === 'android' && I18nManager.isRTL) {\n // On Android, scroll value is not applied in reverse in RTL\n // so we need to manually adjust it to apply correct value\n return maxDistance - scrollValue;\n }\n\n return scrollValue;\n };\n\n private getScrollAmount = (props: Props<T>, state: State, index: number) => {\n const { layout, tabWidths } = state;\n const { scrollEnabled, tabStyle } = props;\n const { routes } = props.navigationState;\n\n const centerDistance = Array.from({ length: index + 1 }).reduce<number>(\n (total, _, i) => {\n const tabWidth = this.getComputedTabWidth(\n i,\n layout,\n routes,\n scrollEnabled,\n tabWidths,\n this.getFlattenedTabWidth(tabStyle)\n );\n\n // To get the current index centered we adjust scroll amount by width of indexes\n // 0 through (i - 1) and add half the width of current index i\n return total + (index === i ? tabWidth / 2 : tabWidth);\n },\n 0\n );\n\n const scrollAmount = centerDistance - layout.width / 2;\n\n return this.normalizeScrollValue(props, state, scrollAmount);\n };\n\n private resetScroll = (index: number) => {\n if (this.props.scrollEnabled) {\n this.scrollView &&\n this.scrollView.scrollTo({\n x: this.getScrollAmount(this.props, this.state, index),\n animated: true,\n });\n }\n };\n\n private handleLayout = (e: LayoutChangeEvent) => {\n const { height, width } = e.nativeEvent.layout;\n\n if (\n this.state.layout.width === width &&\n this.state.layout.height === height\n ) {\n return;\n }\n\n this.setState({\n layout: {\n height,\n width,\n },\n });\n };\n\n private getTranslateX = memoize(\n (scrollAmount: Animated.Node<number>, maxScrollDistance: number) =>\n Animated.multiply(\n Platform.OS === 'android' && I18nManager.isRTL\n ? Animated.sub(maxScrollDistance, scrollAmount)\n : scrollAmount,\n I18nManager.isRTL ? 1 : -1\n )\n );\n\n render() {\n const {\n position,\n navigationState,\n jumpTo,\n scrollEnabled,\n bounces,\n getAccessibilityLabel,\n getAccessible,\n getLabelText,\n getTestID,\n renderBadge,\n renderIcon,\n renderLabel,\n activeColor,\n inactiveColor,\n pressColor,\n pressOpacity,\n onTabPress,\n onTabLongPress,\n tabStyle,\n labelStyle,\n indicatorStyle,\n contentContainerStyle,\n style,\n indicatorContainerStyle,\n } = this.props;\n const { layout, tabWidths } = this.state;\n const { routes } = navigationState;\n\n const isWidthDynamic = this.getFlattenedTabWidth(tabStyle) === 'auto';\n const tabBarWidth = this.getTabBarWidth(this.props, this.state);\n const tabBarWidthPercent = `${routes.length * 40}%`;\n const translateX = this.getTranslateX(\n this.scrollAmount,\n this.getMaxScrollDistance(tabBarWidth, layout.width)\n );\n\n return (\n <Animated.View\n onLayout={this.handleLayout}\n style={[styles.tabBar, style]}\n >\n <Animated.View\n pointerEvents=\"none\"\n style={[\n styles.indicatorContainer,\n scrollEnabled ? { transform: [{ translateX }] as any } : null,\n tabBarWidth\n ? { width: tabBarWidth }\n : scrollEnabled\n ? { width: tabBarWidthPercent }\n : null,\n indicatorContainerStyle,\n ]}\n >\n {this.props.renderIndicator({\n position,\n layout,\n navigationState,\n jumpTo,\n width: isWidthDynamic ? 'auto' : `${100 / routes.length}%`,\n style: indicatorStyle,\n getTabWidth: this.getMemoizedTabWidthGettter(\n layout,\n routes,\n scrollEnabled,\n tabWidths,\n this.getFlattenedTabWidth(tabStyle)\n ),\n })}\n </Animated.View>\n <View style={styles.scroll}>\n <Animated.ScrollView\n horizontal\n keyboardShouldPersistTaps=\"handled\"\n scrollEnabled={scrollEnabled}\n bounces={bounces}\n alwaysBounceHorizontal={false}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n automaticallyAdjustContentInsets={false}\n overScrollMode=\"never\"\n contentContainerStyle={[\n styles.tabContent,\n scrollEnabled\n ? { width: tabBarWidth || tabBarWidthPercent }\n : styles.container,\n contentContainerStyle,\n ]}\n scrollEventThrottle={16}\n onScroll={Animated.event([\n {\n nativeEvent: {\n contentOffset: { x: this.scrollAmount },\n },\n },\n ])}\n ref={el => {\n // @ts-ignore\n this.scrollView = el && el.getNode();\n }}\n >\n {routes.map((route: T) => (\n <TabBarItem\n onLayout={\n isWidthDynamic\n ? e => {\n this.measuredTabWidths[route.key] =\n e.nativeEvent.layout.width;\n\n // When we have measured widths for all of the tabs, we should updates the state\n // We avoid doing separate setState for each layout since it triggers multiple renders and slows down app\n if (\n routes.every(\n r =>\n typeof this.measuredTabWidths[r.key] === 'number'\n )\n ) {\n this.setState({\n tabWidths: { ...this.measuredTabWidths },\n });\n }\n }\n : undefined\n }\n key={route.key}\n position={position}\n route={route}\n navigationState={navigationState}\n getAccessibilityLabel={getAccessibilityLabel}\n getAccessible={getAccessible}\n getLabelText={getLabelText}\n getTestID={getTestID}\n renderBadge={renderBadge}\n renderIcon={renderIcon}\n renderLabel={renderLabel}\n activeColor={activeColor}\n inactiveColor={inactiveColor}\n pressColor={pressColor}\n pressOpacity={pressOpacity}\n onPress={() => {\n const event: Scene<T> & Event = {\n route,\n defaultPrevented: false,\n preventDefault: () => {\n event.defaultPrevented = true;\n },\n };\n\n onTabPress && onTabPress(event);\n\n if (event.defaultPrevented) {\n return;\n }\n\n this.props.jumpTo(route.key);\n }}\n onLongPress={() => onTabLongPress && onTabLongPress({ route })}\n labelStyle={labelStyle}\n style={tabStyle}\n />\n ))}\n </Animated.ScrollView>\n </View>\n </Animated.View>\n );\n }\n}\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n },\n scroll: {\n overflow: 'scroll',\n },\n tabBar: {\n backgroundColor: '#2196f3',\n elevation: 4,\n shadowColor: 'black',\n shadowOpacity: 0.1,\n shadowRadius: StyleSheet.hairlineWidth,\n shadowOffset: {\n height: StyleSheet.hairlineWidth,\n width: 0,\n },\n zIndex: 1,\n },\n tabContent: {\n flexDirection: 'row',\n flexWrap: 'nowrap',\n },\n indicatorContainer: {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n },\n});\n"]},"metadata":{},"sourceType":"script"}