react-native-tab-view/lib/module/TabBarIndicator.js

Tab view component for React Native

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/Projects/react-native-tab-view/src/TabBarIndicator.tsx";import*as React from'react';import{StyleSheet,I18nManager}from'react-native';import Animated from'react-native-reanimated';import memoize from'./memoize';var max=Animated.max,min=Animated.min,multiply=Animated.multiply;var TabBarIndicator=function(_React$Component){_inherits(TabBarIndicator,_React$Component);function TabBarIndicator(){var _getPrototypeOf2;var _this;_classCallCheck(this,TabBarIndicator);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(TabBarIndicator)).call.apply(_getPrototypeOf2,[this].concat(args)));_this.getTranslateX=memoize(function(position,routes,width){return multiply(max(min(position,routes.length-1),0),width*(I18nManager.isRTL?-1:1));});return _this;}_createClass(TabBarIndicator,[{key:"render",value:function render(){var _this$props=this.props,width=_this$props.width,position=_this$props.position,navigationState=_this$props.navigationState,style=_this$props.style;var routes=navigationState.routes;var translateX=this.getTranslateX(position,routes,width);return React.createElement(Animated.View,{style:[styles.indicator,{width:100/routes.length+"%"},width?{transform:[{translateX:translateX}]}:{left:100/routes.length*navigationState.index+"%"},style],__source:{fileName:_jsxFileName,lineNumber:34}});}}]);return TabBarIndicator;}(React.Component);export{TabBarIndicator as default};var styles=StyleSheet.create({indicator:{backgroundColor:'#ffeb3b',position:'absolute',left:0,bottom:0,right:0,height:2}});
//# sourceMappingURL=TabBarIndicator.js.map