react-native-tab-view 3.2.1 → 3.3.2

package/lib/module/TabBar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","StyleSheet","View","I18nManager","Platform","TabBarItem","TabBarIndicator","Separator","width","TabBar","Component","layout","height","tabWidths","Value","createRef","style","tabStyle","flatten","undefined","index","routes","scrollEnabled","flattenedWidth","key","endsWith","parseFloat","Number","isFinite","length","tabBarWidth","layoutWidth","props","state","navigationState","reduce","acc","_","i","gap","getComputedTabWidth","getFlattenedTabWidth","value","getTabBarWidth","maxDistance","getMaxScrollDistance","scrollValue","Math","max","min","OS","isRTL","centerDistance","Array","from","total","tabWidth","scrollAmount","normalizeScrollValue","flatListRef","current","scrollToOffset","offset","getScrollAmount","animated","e","nativeEvent","setState","maxScrollDistance","multiply","add","componentDidUpdate","prevProps","prevState","every","r","resetScroll","render","position","jumpTo","bounces","getAccessibilityLabel","getAccessible","getLabelText","getTestID","renderBadge","renderIcon","renderLabel","renderTabBarItem","activeColor","inactiveColor","pressColor","pressOpacity","onTabPress","onTabLongPress","labelStyle","indicatorStyle","contentContainerStyle","indicatorContainerStyle","isWidthDynamic","separatorsWidth","separatorPercent","tabBarWidthPercent","translateX","getTranslateX","handleLayout","styles","tabBar","indicatorContainer","transform","renderIndicator","getTabWidth","scroll","item","tabContent","container","route","onLayout","measuredTabWidths","onPress","event","defaultPrevented","preventDefault","onLongPress","contentOffset","x","useNativeDriver","title","accessible","accessibilityLabel","testID","create","flex","overflow","select","default","web","backgroundColor","elevation","shadowColor","shadowOpacity","shadowRadius","hairlineWidth","shadowOffset","zIndex","flexDirection","flexWrap","top","left","right","bottom"],"sources":["TabBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Animated,\n  StyleSheet,\n  View,\n  StyleProp,\n  ViewStyle,\n  TextStyle,\n  LayoutChangeEvent,\n  I18nManager,\n  Platform,\n  FlatList,\n  ListRenderItemInfo,\n} from 'react-native';\nimport TabBarItem, { Props as TabBarItemProps } from './TabBarItem';\nimport TabBarIndicator, { Props as IndicatorProps } from './TabBarIndicator';\nimport type {\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  renderTabBarItem?: (\n    props: TabBarItemProps<T> & { key: string }\n  ) => React.ReactElement;\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  gap?: number;\n};\n\ntype State = {\n  layout: Layout;\n  tabWidths: { [key: string]: number };\n};\n\nconst Separator = ({ width }: { width: number }) => {\n  return <View style={{ width }} />;\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>) => 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    gap: 0,\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 flatListRef = React.createRef<FlatList>();\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    return layout.width / routes.length;\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        (i > 0 ? props.gap ?? 0 : 0) +\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 (\n          total +\n          (index === i\n            ? (tabWidth + (props.gap ?? 0)) / 2\n            : tabWidth + (props.gap ?? 0))\n        );\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.flatListRef.current?.scrollToOffset({\n        offset: 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 = (\n    scrollAmount: Animated.Value,\n    maxScrollDistance: number\n  ) =>\n    Animated.multiply(\n      Platform.OS === 'android' && I18nManager.isRTL\n        ? Animated.add(maxScrollDistance, Animated.multiply(scrollAmount, -1))\n        : scrollAmount,\n      I18nManager.isRTL ? 1 : -1\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      renderTabBarItem,\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      gap = 0,\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 separatorsWidth = Math.max(0, routes.length - 1) * gap;\n    const separatorPercent = (separatorsWidth / tabBarWidth) * 100;\n\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 > separatorsWidth\n              ? { width: tabBarWidth - separatorsWidth }\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\n              ? 'auto'\n              : `${(100 - separatorPercent) / routes.length}%`,\n            style: indicatorStyle,\n            getTabWidth: (i: number) =>\n              this.getComputedTabWidth(\n                i,\n                layout,\n                routes,\n                scrollEnabled,\n                tabWidths,\n                this.getFlattenedTabWidth(tabStyle)\n              ),\n            gap,\n          })}\n        </Animated.View>\n        <View style={styles.scroll}>\n          <Animated.FlatList\n            data={routes as Animated.WithAnimatedValue<T>[]}\n            keyExtractor={(item) => item.key}\n            horizontal\n            accessibilityRole=\"tablist\"\n            keyboardShouldPersistTaps=\"handled\"\n            scrollEnabled={scrollEnabled}\n            bounces={bounces}\n            alwaysBounceHorizontal={false}\n            scrollsToTop={false}\n            showsHorizontalScrollIndicator={false}\n            showsVerticalScrollIndicator={false}\n            automaticallyAdjustContentInsets={false}\n            overScrollMode=\"never\"\n            contentContainerStyle={[\n              styles.tabContent,\n              scrollEnabled\n                ? {\n                    width:\n                      tabBarWidth > separatorsWidth\n                        ? tabBarWidth\n                        : tabBarWidthPercent,\n                  }\n                : styles.container,\n              contentContainerStyle,\n            ]}\n            scrollEventThrottle={16}\n            renderItem={({ item: route, index }: ListRenderItemInfo<T>) => {\n              const props: TabBarItemProps<T> & { key: string } = {\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                onLayout: 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                onPress: () => {\n                  const event: Scene<T> & Event = {\n                    route,\n                    defaultPrevented: false,\n                    preventDefault: () => {\n                      event.defaultPrevented = true;\n                    },\n                  };\n\n                  onTabPress?.(event);\n\n                  if (event.defaultPrevented) {\n                    return;\n                  }\n\n                  this.props.jumpTo(route.key);\n                },\n                onLongPress: () => onTabLongPress?.({ route }),\n                labelStyle: labelStyle,\n                style: [\n                  tabStyle,\n                  // Calculate the deafult width for tab for FlatList to work.\n                  this.getFlattenedTabWidth(tabStyle) === undefined && {\n                    width: this.getComputedTabWidth(\n                      index,\n                      layout,\n                      routes,\n                      scrollEnabled,\n                      tabWidths,\n                      this.getFlattenedTabWidth(tabStyle)\n                    ),\n                  },\n                ],\n              };\n\n              return (\n                <React.Fragment key={route.key}>\n                  {gap > 0 && index > 0 ? <Separator width={gap} /> : null}\n                  {renderTabBarItem ? (\n                    renderTabBarItem(props)\n                  ) : (\n                    <TabBarItem {...props} />\n                  )}\n                </React.Fragment>\n              );\n            }}\n            onScroll={Animated.event(\n              [\n                {\n                  nativeEvent: {\n                    contentOffset: { x: this.scrollAmount },\n                  },\n                },\n              ],\n              { useNativeDriver: true }\n            )}\n            ref={this.flatListRef}\n          />\n        </View>\n      </Animated.View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  scroll: {\n    overflow: Platform.select({ default: 'scroll', web: undefined }),\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"],"mappings":"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"}
+{"version":3,"names":["React","Animated","I18nManager","Platform","StyleSheet","View","useLatestCallback","TabBarIndicator","TabBarItem","useAnimatedValue","Separator","width","getFlattenedTabWidth","style","tabStyle","flatten","getComputedTabWidth","index","layout","routes","scrollEnabled","tabWidths","flattenedWidth","key","endsWith","parseFloat","Number","isFinite","length","getMaxScrollDistance","tabBarWidth","layoutWidth","getTranslateX","scrollAmount","maxScrollDistance","multiply","OS","isRTL","add","getTabBarWidth","navigationState","gap","flattenedTabWidth","reduce","acc","_","i","normalizeScrollValue","value","maxDistance","scrollValue","Math","max","min","getScrollAmount","centerDistance","Array","from","total","tabWidth","getLabelTextDefault","route","title","getAccessibleDefault","accessible","getAccessibilityLabelDefault","accessibilityLabel","undefined","renderIndicatorDefault","props","getTestIdDefault","testID","MEASURE_PER_BATCH","TabBar","getLabelText","getAccessible","getAccessibilityLabel","getTestID","renderIndicator","jumpTo","position","activeColor","bounces","contentContainerStyle","inactiveColor","indicatorContainerStyle","indicatorStyle","labelStyle","onTabLongPress","onTabPress","pressColor","pressOpacity","renderBadge","renderIcon","renderLabel","renderTabBarItem","setLayout","useState","height","setTabWidths","flatListRef","useRef","isFirst","measuredTabWidths","isWidthDynamic","scrollOffset","hasMeasuredTabWidths","Boolean","slice","every","r","useEffect","current","scrollToOffset","offset","animated","handleLayout","e","nativeEvent","separatorsWidth","separatorPercent","tabBarWidthPercent","translateX","useMemo","renderItem","useCallback","item","onLayout","onPress","event","defaultPrevented","preventDefault","onLongPress","defaultTabWidth","keyExtractor","contentContainerStyleMemoized","styles","tabContent","container","handleScroll","contentOffset","x","useNativeDriver","handleViewableItemsChanged","changed","isViewable","tabBar","indicatorContainer","transform","getTabWidth","scroll","create","flex","overflow","select","default","web","backgroundColor","elevation","shadowColor","shadowOpacity","shadowRadius","hairlineWidth","shadowOffset","zIndex","flexDirection","flexWrap","top","left","right","bottom"],"sources":["TabBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Animated,\n  FlatList,\n  I18nManager,\n  LayoutChangeEvent,\n  ListRenderItemInfo,\n  Platform,\n  StyleProp,\n  StyleSheet,\n  TextStyle,\n  View,\n  ViewStyle,\n  ViewToken,\n} from 'react-native';\nimport useLatestCallback from 'use-latest-callback';\n\nimport TabBarIndicator, { Props as IndicatorProps } from './TabBarIndicator';\nimport TabBarItem, { Props as TabBarItemProps } from './TabBarItem';\nimport type {\n  Event,\n  Layout,\n  NavigationState,\n  Route,\n  Scene,\n  SceneRendererProps,\n} from './types';\nimport useAnimatedValue from './useAnimatedValue';\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  renderTabBarItem?: (\n    props: TabBarItemProps<T> & { key: string }\n  ) => React.ReactElement;\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  gap?: number;\n  testID?: string;\n};\n\ntype FlattenedTabWidth = string | number | undefined;\n\nconst Separator = ({ width }: { width: number }) => {\n  return <View style={{ width }} />;\n};\n\nconst getFlattenedTabWidth = (style: StyleProp<ViewStyle>) => {\n  const tabStyle = StyleSheet.flatten(style);\n\n  return tabStyle?.width;\n};\n\nconst getComputedTabWidth = (\n  index: number,\n  layout: Layout,\n  routes: Route[],\n  scrollEnabled: boolean | undefined,\n  tabWidths: { [key: string]: number },\n  flattenedWidth: FlattenedTabWidth\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  return layout.width / routes.length;\n};\n\nconst getMaxScrollDistance = (tabBarWidth: number, layoutWidth: number) =>\n  tabBarWidth - layoutWidth;\n\nconst getTranslateX = (\n  scrollAmount: Animated.Value,\n  maxScrollDistance: number\n) =>\n  Animated.multiply(\n    Platform.OS === 'android' && I18nManager.isRTL\n      ? Animated.add(maxScrollDistance, Animated.multiply(scrollAmount, -1))\n      : scrollAmount,\n    I18nManager.isRTL ? 1 : -1\n  );\n\nconst getTabBarWidth = <T extends Route>({\n  navigationState,\n  layout,\n  gap,\n  scrollEnabled,\n  flattenedTabWidth,\n  tabWidths,\n}: Pick<Props<T>, 'navigationState' | 'gap' | 'layout' | 'scrollEnabled'> & {\n  tabWidths: Record<string, number>;\n  flattenedTabWidth: FlattenedTabWidth;\n}) => {\n  const { routes } = navigationState;\n\n  return routes.reduce<number>(\n    (acc, _, i) =>\n      acc +\n      (i > 0 ? gap ?? 0 : 0) +\n      getComputedTabWidth(\n        i,\n        layout,\n        routes,\n        scrollEnabled,\n        tabWidths,\n        flattenedTabWidth\n      ),\n    0\n  );\n};\n\nconst normalizeScrollValue = <T extends Route>({\n  layout,\n  navigationState,\n  gap,\n  scrollEnabled,\n  tabWidths,\n  value,\n  flattenedTabWidth,\n}: Pick<Props<T>, 'layout' | 'navigationState' | 'gap' | 'scrollEnabled'> & {\n  tabWidths: Record<string, number>;\n  value: number;\n  flattenedTabWidth: FlattenedTabWidth;\n}) => {\n  const tabBarWidth = getTabBarWidth({\n    layout,\n    navigationState,\n    tabWidths,\n    gap,\n    scrollEnabled,\n    flattenedTabWidth,\n  });\n  const maxDistance = 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\nconst getScrollAmount = <T extends Route>({\n  layout,\n  navigationState,\n  gap,\n  scrollEnabled,\n  flattenedTabWidth,\n  tabWidths,\n}: Pick<Props<T>, 'layout' | 'navigationState' | 'scrollEnabled' | 'gap'> & {\n  tabWidths: Record<string, number>;\n  flattenedTabWidth: FlattenedTabWidth;\n}) => {\n  const centerDistance = Array.from({\n    length: navigationState.index + 1,\n  }).reduce<number>((total, _, i) => {\n    const tabWidth = getComputedTabWidth(\n      i,\n      layout,\n      navigationState.routes,\n      scrollEnabled,\n      tabWidths,\n      flattenedTabWidth\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 (\n      total +\n      (navigationState.index === i\n        ? (tabWidth + (gap ?? 0)) / 2\n        : tabWidth + (gap ?? 0))\n    );\n  }, 0);\n\n  const scrollAmount = centerDistance - layout.width / 2;\n\n  return normalizeScrollValue({\n    layout,\n    navigationState,\n    tabWidths,\n    value: scrollAmount,\n    gap,\n    scrollEnabled,\n    flattenedTabWidth,\n  });\n};\n\nconst getLabelTextDefault = ({ route }: Scene<Route>) => route.title;\n\nconst getAccessibleDefault = ({ route }: Scene<Route>) =>\n  typeof route.accessible !== 'undefined' ? route.accessible : true;\n\nconst getAccessibilityLabelDefault = ({ route }: Scene<Route>) =>\n  typeof route.accessibilityLabel === 'string'\n    ? route.accessibilityLabel\n    : typeof route.title === 'string'\n    ? route.title\n    : undefined;\n\nconst renderIndicatorDefault = (props: IndicatorProps<Route>) => (\n  <TabBarIndicator {...props} />\n);\n\nconst getTestIdDefault = ({ route }: Scene<Route>) => route.testID;\n\n// How many items measurements should we update per batch.\n// Defaults to 10, since that's whats FlatList is using in initialNumToRender.\nconst MEASURE_PER_BATCH = 10;\n\nexport default function TabBar<T extends Route>({\n  getLabelText = getLabelTextDefault,\n  getAccessible = getAccessibleDefault,\n  getAccessibilityLabel = getAccessibilityLabelDefault,\n  getTestID = getTestIdDefault,\n  renderIndicator = renderIndicatorDefault,\n  gap = 0,\n  scrollEnabled,\n  jumpTo,\n  navigationState,\n  position,\n  activeColor,\n  bounces,\n  contentContainerStyle,\n  inactiveColor,\n  indicatorContainerStyle,\n  indicatorStyle,\n  labelStyle,\n  onTabLongPress,\n  onTabPress,\n  pressColor,\n  pressOpacity,\n  renderBadge,\n  renderIcon,\n  renderLabel,\n  renderTabBarItem,\n  style,\n  tabStyle,\n  testID,\n}: Props<T>) {\n  const [layout, setLayout] = React.useState<Layout>({ width: 0, height: 0 });\n  const [tabWidths, setTabWidths] = React.useState<Record<string, number>>({});\n  const flatListRef = React.useRef<FlatList | null>(null);\n  const isFirst = React.useRef(true);\n  const scrollAmount = useAnimatedValue(0);\n  const measuredTabWidths = React.useRef<Record<string, number>>({});\n\n  const { routes } = navigationState;\n  const flattenedTabWidth = getFlattenedTabWidth(tabStyle);\n  const isWidthDynamic = flattenedTabWidth === 'auto';\n  const scrollOffset = getScrollAmount({\n    layout,\n    navigationState,\n    tabWidths,\n    gap,\n    scrollEnabled,\n    flattenedTabWidth,\n  });\n\n  const hasMeasuredTabWidths =\n    Boolean(layout.width) &&\n    routes\n      .slice(0, navigationState.index)\n      .every((r) => typeof tabWidths[r.key] === 'number');\n\n  React.useEffect(() => {\n    if (isFirst.current) {\n      isFirst.current = false;\n      return;\n    }\n\n    if (isWidthDynamic && !hasMeasuredTabWidths) {\n      return;\n    }\n\n    if (scrollEnabled) {\n      flatListRef.current?.scrollToOffset({\n        offset: scrollOffset,\n        animated: true,\n      });\n    }\n  }, [hasMeasuredTabWidths, isWidthDynamic, scrollEnabled, scrollOffset]);\n\n  const handleLayout = (e: LayoutChangeEvent) => {\n    const { height, width } = e.nativeEvent.layout;\n\n    setLayout((layout) =>\n      layout.width === width && layout.height === height\n        ? layout\n        : { width, height }\n    );\n  };\n\n  const tabBarWidth = getTabBarWidth({\n    layout,\n    navigationState,\n    tabWidths,\n    gap,\n    scrollEnabled,\n    flattenedTabWidth,\n  });\n\n  const separatorsWidth = Math.max(0, routes.length - 1) * gap;\n  const separatorPercent = (separatorsWidth / tabBarWidth) * 100;\n  const tabBarWidthPercent = `${routes.length * 40}%`;\n\n  const translateX = React.useMemo(\n    () =>\n      getTranslateX(\n        scrollAmount,\n        getMaxScrollDistance(tabBarWidth, layout.width)\n      ),\n    [layout.width, scrollAmount, tabBarWidth]\n  );\n\n  const renderItem = React.useCallback(\n    ({ item: route, index }: ListRenderItemInfo<T>) => {\n      const props: TabBarItemProps<T> & { key: string } = {\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        onLayout: isWidthDynamic\n          ? (e: LayoutChangeEvent) => {\n              measuredTabWidths.current[route.key] = 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 we have more than 10 routes divide updating tabWidths into multiple batches. Here we update only first batch of 10 items.\n              if (\n                routes.length > MEASURE_PER_BATCH &&\n                index === MEASURE_PER_BATCH &&\n                routes\n                  .slice(0, MEASURE_PER_BATCH)\n                  .every(\n                    (r) => typeof measuredTabWidths.current[r.key] === 'number'\n                  )\n              ) {\n                setTabWidths({ ...measuredTabWidths.current });\n              } else if (\n                routes.every(\n                  (r) => typeof measuredTabWidths.current[r.key] === 'number'\n                )\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                setTabWidths({ ...measuredTabWidths.current });\n              }\n            }\n          : undefined,\n        onPress: () => {\n          const event: Scene<T> & Event = {\n            route,\n            defaultPrevented: false,\n            preventDefault: () => {\n              event.defaultPrevented = true;\n            },\n          };\n\n          onTabPress?.(event);\n\n          if (event.defaultPrevented) {\n            return;\n          }\n\n          jumpTo(route.key);\n        },\n        onLongPress: () => onTabLongPress?.({ route }),\n        labelStyle: labelStyle,\n        style: tabStyle,\n        // Calculate the deafult width for tab for FlatList to work\n        defaultTabWidth: !isWidthDynamic\n          ? getComputedTabWidth(\n              index,\n              layout,\n              routes,\n              scrollEnabled,\n              tabWidths,\n              getFlattenedTabWidth(tabStyle)\n            )\n          : undefined,\n      };\n\n      return (\n        <>\n          {gap > 0 && index > 0 ? <Separator width={gap} /> : null}\n          {renderTabBarItem ? (\n            renderTabBarItem(props)\n          ) : (\n            <TabBarItem {...props} />\n          )}\n        </>\n      );\n    },\n    [\n      activeColor,\n      gap,\n      getAccessibilityLabel,\n      getAccessible,\n      getLabelText,\n      getTestID,\n      inactiveColor,\n      isWidthDynamic,\n      jumpTo,\n      labelStyle,\n      layout,\n      navigationState,\n      onTabLongPress,\n      onTabPress,\n      position,\n      pressColor,\n      pressOpacity,\n      renderBadge,\n      renderIcon,\n      renderLabel,\n      renderTabBarItem,\n      routes,\n      scrollEnabled,\n      tabStyle,\n      tabWidths,\n    ]\n  );\n\n  const keyExtractor = React.useCallback((item: T) => item.key, []);\n\n  const contentContainerStyleMemoized = React.useMemo(\n    () => [\n      styles.tabContent,\n      scrollEnabled\n        ? {\n            width:\n              tabBarWidth > separatorsWidth ? tabBarWidth : tabBarWidthPercent,\n          }\n        : styles.container,\n      contentContainerStyle,\n    ],\n    [\n      contentContainerStyle,\n      scrollEnabled,\n      separatorsWidth,\n      tabBarWidth,\n      tabBarWidthPercent,\n    ]\n  );\n\n  const handleScroll = React.useMemo(\n    () =>\n      Animated.event(\n        [\n          {\n            nativeEvent: {\n              contentOffset: { x: scrollAmount },\n            },\n          },\n        ],\n        { useNativeDriver: true }\n      ),\n    [scrollAmount]\n  );\n\n  const handleViewableItemsChanged = useLatestCallback(\n    ({ changed }: { changed: ViewToken[] }) => {\n      if (routes.length <= MEASURE_PER_BATCH) {\n        return;\n      }\n      // Get next vievable item\n      const item = changed[changed.length - 1];\n      const index = item?.index || 0;\n      if (\n        item.isViewable &&\n        (index % 10 === 0 ||\n          index === navigationState.index ||\n          index === routes.length - 1)\n      ) {\n        setTabWidths({ ...measuredTabWidths.current });\n      }\n    }\n  );\n\n  return (\n    <Animated.View onLayout={handleLayout} style={[styles.tabBar, style]}>\n      <Animated.View\n        pointerEvents=\"none\"\n        style={[\n          styles.indicatorContainer,\n          scrollEnabled ? { transform: [{ translateX }] as any } : null,\n          tabBarWidth > separatorsWidth\n            ? { width: tabBarWidth - separatorsWidth }\n            : scrollEnabled\n            ? { width: tabBarWidthPercent }\n            : null,\n          indicatorContainerStyle,\n        ]}\n      >\n        {renderIndicator({\n          position,\n          layout,\n          navigationState,\n          jumpTo,\n          width: isWidthDynamic\n            ? 'auto'\n            : `${(100 - separatorPercent) / routes.length}%`,\n          style: indicatorStyle,\n          getTabWidth: (i: number) =>\n            getComputedTabWidth(\n              i,\n              layout,\n              routes,\n              scrollEnabled,\n              tabWidths,\n              flattenedTabWidth\n            ),\n          gap,\n        })}\n      </Animated.View>\n      <View style={styles.scroll}>\n        <Animated.FlatList\n          data={routes as Animated.WithAnimatedValue<T>[]}\n          keyExtractor={keyExtractor}\n          horizontal\n          accessibilityRole=\"tablist\"\n          keyboardShouldPersistTaps=\"handled\"\n          scrollEnabled={scrollEnabled}\n          bounces={bounces}\n          initialNumToRender={MEASURE_PER_BATCH}\n          onViewableItemsChanged={handleViewableItemsChanged}\n          alwaysBounceHorizontal={false}\n          scrollsToTop={false}\n          showsHorizontalScrollIndicator={false}\n          showsVerticalScrollIndicator={false}\n          automaticallyAdjustContentInsets={false}\n          overScrollMode=\"never\"\n          contentContainerStyle={contentContainerStyleMemoized}\n          scrollEventThrottle={16}\n          renderItem={renderItem}\n          onScroll={handleScroll}\n          ref={flatListRef}\n          testID={testID}\n        />\n      </View>\n    </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  scroll: {\n    overflow: Platform.select({ default: 'scroll', web: undefined }),\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"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,QADF,EAGEC,WAHF,EAMEC,QANF,EAQEC,UARF,EAUEC,IAVF,QAaO,cAbP;AAcA,OAAOC,iBAAP,MAA8B,qBAA9B;AAEA,OAAOC,eAAP,MAAyD,mBAAzD;AACA,OAAOC,UAAP,MAAqD,cAArD;AASA,OAAOC,gBAAP,MAA6B,oBAA7B;;AA6CA,MAAMC,SAAS,GAAG,QAAkC;EAAA,IAAjC;IAAEC;EAAF,CAAiC;EAClD,oBAAO,oBAAC,IAAD;IAAM,KAAK,EAAE;MAAEA;IAAF;EAAb,EAAP;AACD,CAFD;;AAIA,MAAMC,oBAAoB,GAAIC,KAAD,IAAiC;EAC5D,MAAMC,QAAQ,GAAGV,UAAU,CAACW,OAAX,CAAmBF,KAAnB,CAAjB;EAEA,OAAOC,QAAP,aAAOA,QAAP,uBAAOA,QAAQ,CAAEH,KAAjB;AACD,CAJD;;AAMA,MAAMK,mBAAmB,GAAG,CAC1BC,KAD0B,EAE1BC,MAF0B,EAG1BC,MAH0B,EAI1BC,aAJ0B,EAK1BC,SAL0B,EAM1BC,cAN0B,KAOvB;EACH,IAAIA,cAAc,KAAK,MAAvB,EAA+B;IAC7B,OAAOD,SAAS,CAACF,MAAM,CAACF,KAAD,CAAN,CAAcM,GAAf,CAAT,IAAgC,CAAvC;EACD;;EAED,QAAQ,OAAOD,cAAf;IACE,KAAK,QAAL;MACE,OAAOA,cAAP;;IACF,KAAK,QAAL;MACE,IAAIA,cAAc,CAACE,QAAf,CAAwB,GAAxB,CAAJ,EAAkC;QAChC,MAAMb,KAAK,GAAGc,UAAU,CAACH,cAAD,CAAxB;;QACA,IAAII,MAAM,CAACC,QAAP,CAAgBhB,KAAhB,CAAJ,EAA4B;UAC1B,OAAOO,MAAM,CAACP,KAAP,IAAgBA,KAAK,GAAG,GAAxB,CAAP;QACD;MACF;;EATL;;EAYA,IAAIS,aAAJ,EAAmB;IACjB,OAAQF,MAAM,CAACP,KAAP,GAAe,CAAhB,GAAqB,CAA5B;EACD;;EACD,OAAOO,MAAM,CAACP,KAAP,GAAeQ,MAAM,CAACS,MAA7B;AACD,CA5BD;;AA8BA,MAAMC,oBAAoB,GAAG,CAACC,WAAD,EAAsBC,WAAtB,KAC3BD,WAAW,GAAGC,WADhB;;AAGA,MAAMC,aAAa,GAAG,CACpBC,YADoB,EAEpBC,iBAFoB,KAIpBjC,QAAQ,CAACkC,QAAT,CACEhC,QAAQ,CAACiC,EAAT,KAAgB,SAAhB,IAA6BlC,WAAW,CAACmC,KAAzC,GACIpC,QAAQ,CAACqC,GAAT,CAAaJ,iBAAb,EAAgCjC,QAAQ,CAACkC,QAAT,CAAkBF,YAAlB,EAAgC,CAAC,CAAjC,CAAhC,CADJ,GAEIA,YAHN,EAIE/B,WAAW,CAACmC,KAAZ,GAAoB,CAApB,GAAwB,CAAC,CAJ3B,CAJF;;AAWA,MAAME,cAAc,GAAG,SAUjB;EAAA,IAVmC;IACvCC,eADuC;IAEvCtB,MAFuC;IAGvCuB,GAHuC;IAIvCrB,aAJuC;IAKvCsB,iBALuC;IAMvCrB;EANuC,CAUnC;EACJ,MAAM;IAAEF;EAAF,IAAaqB,eAAnB;EAEA,OAAOrB,MAAM,CAACwB,MAAP,CACL,CAACC,GAAD,EAAMC,CAAN,EAASC,CAAT,KACEF,GAAG,IACFE,CAAC,GAAG,CAAJ,GAAQL,GAAR,aAAQA,GAAR,cAAQA,GAAR,GAAe,CAAf,GAAmB,CADjB,CAAH,GAEAzB,mBAAmB,CACjB8B,CADiB,EAEjB5B,MAFiB,EAGjBC,MAHiB,EAIjBC,aAJiB,EAKjBC,SALiB,EAMjBqB,iBANiB,CAJhB,EAYL,CAZK,CAAP;AAcD,CA3BD;;AA6BA,MAAMK,oBAAoB,GAAG,SAYvB;EAAA,IAZyC;IAC7C7B,MAD6C;IAE7CsB,eAF6C;IAG7CC,GAH6C;IAI7CrB,aAJ6C;IAK7CC,SAL6C;IAM7C2B,KAN6C;IAO7CN;EAP6C,CAYzC;EACJ,MAAMZ,WAAW,GAAGS,cAAc,CAAC;IACjCrB,MADiC;IAEjCsB,eAFiC;IAGjCnB,SAHiC;IAIjCoB,GAJiC;IAKjCrB,aALiC;IAMjCsB;EANiC,CAAD,CAAlC;EAQA,MAAMO,WAAW,GAAGpB,oBAAoB,CAACC,WAAD,EAAcZ,MAAM,CAACP,KAArB,CAAxC;EACA,MAAMuC,WAAW,GAAGC,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAASL,KAAT,EAAgBC,WAAhB,CAAT,EAAuC,CAAvC,CAApB;;EAEA,IAAI9C,QAAQ,CAACiC,EAAT,KAAgB,SAAhB,IAA6BlC,WAAW,CAACmC,KAA7C,EAAoD;IAClD;IACA;IACA,OAAOY,WAAW,GAAGC,WAArB;EACD;;EAED,OAAOA,WAAP;AACD,CA/BD;;AAiCA,MAAMI,eAAe,GAAG,SAUlB;EAAA,IAVoC;IACxCpC,MADwC;IAExCsB,eAFwC;IAGxCC,GAHwC;IAIxCrB,aAJwC;IAKxCsB,iBALwC;IAMxCrB;EANwC,CAUpC;EACJ,MAAMkC,cAAc,GAAGC,KAAK,CAACC,IAAN,CAAW;IAChC7B,MAAM,EAAEY,eAAe,CAACvB,KAAhB,GAAwB;EADA,CAAX,EAEpB0B,MAFoB,CAEL,CAACe,KAAD,EAAQb,CAAR,EAAWC,CAAX,KAAiB;IACjC,MAAMa,QAAQ,GAAG3C,mBAAmB,CAClC8B,CADkC,EAElC5B,MAFkC,EAGlCsB,eAAe,CAACrB,MAHkB,EAIlCC,aAJkC,EAKlCC,SALkC,EAMlCqB,iBANkC,CAApC,CADiC,CAUjC;IACA;;IACA,OACEgB,KAAK,IACJlB,eAAe,CAACvB,KAAhB,KAA0B6B,CAA1B,GACG,CAACa,QAAQ,IAAIlB,GAAJ,aAAIA,GAAJ,cAAIA,GAAJ,GAAW,CAAX,CAAT,IAA0B,CAD7B,GAEGkB,QAAQ,IAAIlB,GAAJ,aAAIA,GAAJ,cAAIA,GAAJ,GAAW,CAAX,CAHP,CADP;EAMD,CApBsB,EAoBpB,CApBoB,CAAvB;EAsBA,MAAMR,YAAY,GAAGsB,cAAc,GAAGrC,MAAM,CAACP,KAAP,GAAe,CAArD;EAEA,OAAOoC,oBAAoB,CAAC;IAC1B7B,MAD0B;IAE1BsB,eAF0B;IAG1BnB,SAH0B;IAI1B2B,KAAK,EAAEf,YAJmB;IAK1BQ,GAL0B;IAM1BrB,aAN0B;IAO1BsB;EAP0B,CAAD,CAA3B;AASD,CA5CD;;AA8CA,MAAMkB,mBAAmB,GAAG;EAAA,IAAC;IAAEC;EAAF,CAAD;EAAA,OAA6BA,KAAK,CAACC,KAAnC;AAAA,CAA5B;;AAEA,MAAMC,oBAAoB,GAAG;EAAA,IAAC;IAAEF;EAAF,CAAD;EAAA,OAC3B,OAAOA,KAAK,CAACG,UAAb,KAA4B,WAA5B,GAA0CH,KAAK,CAACG,UAAhD,GAA6D,IADlC;AAAA,CAA7B;;AAGA,MAAMC,4BAA4B,GAAG;EAAA,IAAC;IAAEJ;EAAF,CAAD;EAAA,OACnC,OAAOA,KAAK,CAACK,kBAAb,KAAoC,QAApC,GACIL,KAAK,CAACK,kBADV,GAEI,OAAOL,KAAK,CAACC,KAAb,KAAuB,QAAvB,GACAD,KAAK,CAACC,KADN,GAEAK,SAL+B;AAAA,CAArC;;AAOA,MAAMC,sBAAsB,GAAIC,KAAD,iBAC7B,oBAAC,eAAD,EAAqBA,KAArB,CADF;;AAIA,MAAMC,gBAAgB,GAAG;EAAA,IAAC;IAAET;EAAF,CAAD;EAAA,OAA6BA,KAAK,CAACU,MAAnC;AAAA,CAAzB,C,CAEA;AACA;;;AACA,MAAMC,iBAAiB,GAAG,EAA1B;AAEA,eAAe,SAASC,MAAT,QA6BF;EAAA,IA7BmC;IAC9CC,YAAY,GAAGd,mBAD+B;IAE9Ce,aAAa,GAAGZ,oBAF8B;IAG9Ca,qBAAqB,GAAGX,4BAHsB;IAI9CY,SAAS,GAAGP,gBAJkC;IAK9CQ,eAAe,GAAGV,sBAL4B;IAM9C3B,GAAG,GAAG,CANwC;IAO9CrB,aAP8C;IAQ9C2D,MAR8C;IAS9CvC,eAT8C;IAU9CwC,QAV8C;IAW9CC,WAX8C;IAY9CC,OAZ8C;IAa9CC,qBAb8C;IAc9CC,aAd8C;IAe9CC,uBAf8C;IAgB9CC,cAhB8C;IAiB9CC,UAjB8C;IAkB9CC,cAlB8C;IAmB9CC,UAnB8C;IAoB9CC,UApB8C;IAqB9CC,YArB8C;IAsB9CC,WAtB8C;IAuB9CC,UAvB8C;IAwB9CC,WAxB8C;IAyB9CC,gBAzB8C;IA0B9ClF,KA1B8C;IA2B9CC,QA3B8C;IA4B9CyD;EA5B8C,CA6BnC;EACX,MAAM,CAACrD,MAAD,EAAS8E,SAAT,IAAsBhG,KAAK,CAACiG,QAAN,CAAuB;IAAEtF,KAAK,EAAE,CAAT;IAAYuF,MAAM,EAAE;EAApB,CAAvB,CAA5B;EACA,MAAM,CAAC7E,SAAD,EAAY8E,YAAZ,IAA4BnG,KAAK,CAACiG,QAAN,CAAuC,EAAvC,CAAlC;EACA,MAAMG,WAAW,GAAGpG,KAAK,CAACqG,MAAN,CAA8B,IAA9B,CAApB;EACA,MAAMC,OAAO,GAAGtG,KAAK,CAACqG,MAAN,CAAa,IAAb,CAAhB;EACA,MAAMpE,YAAY,GAAGxB,gBAAgB,CAAC,CAAD,CAArC;EACA,MAAM8F,iBAAiB,GAAGvG,KAAK,CAACqG,MAAN,CAAqC,EAArC,CAA1B;EAEA,MAAM;IAAElF;EAAF,IAAaqB,eAAnB;EACA,MAAME,iBAAiB,GAAG9B,oBAAoB,CAACE,QAAD,CAA9C;EACA,MAAM0F,cAAc,GAAG9D,iBAAiB,KAAK,MAA7C;EACA,MAAM+D,YAAY,GAAGnD,eAAe,CAAC;IACnCpC,MADmC;IAEnCsB,eAFmC;IAGnCnB,SAHmC;IAInCoB,GAJmC;IAKnCrB,aALmC;IAMnCsB;EANmC,CAAD,CAApC;EASA,MAAMgE,oBAAoB,GACxBC,OAAO,CAACzF,MAAM,CAACP,KAAR,CAAP,IACAQ,MAAM,CACHyF,KADH,CACS,CADT,EACYpE,eAAe,CAACvB,KAD5B,EAEG4F,KAFH,CAEUC,CAAD,IAAO,OAAOzF,SAAS,CAACyF,CAAC,CAACvF,GAAH,CAAhB,KAA4B,QAF5C,CAFF;EAMAvB,KAAK,CAAC+G,SAAN,CAAgB,MAAM;IACpB,IAAIT,OAAO,CAACU,OAAZ,EAAqB;MACnBV,OAAO,CAACU,OAAR,GAAkB,KAAlB;MACA;IACD;;IAED,IAAIR,cAAc,IAAI,CAACE,oBAAvB,EAA6C;MAC3C;IACD;;IAED,IAAItF,aAAJ,EAAmB;MAAA;;MACjB,wBAAAgF,WAAW,CAACY,OAAZ,8EAAqBC,cAArB,CAAoC;QAClCC,MAAM,EAAET,YAD0B;QAElCU,QAAQ,EAAE;MAFwB,CAApC;IAID;EACF,CAhBD,EAgBG,CAACT,oBAAD,EAAuBF,cAAvB,EAAuCpF,aAAvC,EAAsDqF,YAAtD,CAhBH;;EAkBA,MAAMW,YAAY,GAAIC,CAAD,IAA0B;IAC7C,MAAM;MAAEnB,MAAF;MAAUvF;IAAV,IAAoB0G,CAAC,CAACC,WAAF,CAAcpG,MAAxC;IAEA8E,SAAS,CAAE9E,MAAD,IACRA,MAAM,CAACP,KAAP,KAAiBA,KAAjB,IAA0BO,MAAM,CAACgF,MAAP,KAAkBA,MAA5C,GACIhF,MADJ,GAEI;MAAEP,KAAF;MAASuF;IAAT,CAHG,CAAT;EAKD,CARD;;EAUA,MAAMpE,WAAW,GAAGS,cAAc,CAAC;IACjCrB,MADiC;IAEjCsB,eAFiC;IAGjCnB,SAHiC;IAIjCoB,GAJiC;IAKjCrB,aALiC;IAMjCsB;EANiC,CAAD,CAAlC;EASA,MAAM6E,eAAe,GAAGpE,IAAI,CAACC,GAAL,CAAS,CAAT,EAAYjC,MAAM,CAACS,MAAP,GAAgB,CAA5B,IAAiCa,GAAzD;EACA,MAAM+E,gBAAgB,GAAID,eAAe,GAAGzF,WAAnB,GAAkC,GAA3D;EACA,MAAM2F,kBAAkB,GAAI,GAAEtG,MAAM,CAACS,MAAP,GAAgB,EAAG,GAAjD;EAEA,MAAM8F,UAAU,GAAG1H,KAAK,CAAC2H,OAAN,CACjB,MACE3F,aAAa,CACXC,YADW,EAEXJ,oBAAoB,CAACC,WAAD,EAAcZ,MAAM,CAACP,KAArB,CAFT,CAFE,EAMjB,CAACO,MAAM,CAACP,KAAR,EAAesB,YAAf,EAA6BH,WAA7B,CANiB,CAAnB;EASA,MAAM8F,UAAU,GAAG5H,KAAK,CAAC6H,WAAN,CACjB,UAAmD;IAAA,IAAlD;MAAEC,IAAI,EAAEjE,KAAR;MAAe5C;IAAf,CAAkD;IACjD,MAAMoD,KAA2C,GAAG;MAClD9C,GAAG,EAAEsC,KAAK,CAACtC,GADuC;MAElDyD,QAAQ,EAAEA,QAFwC;MAGlDnB,KAAK,EAAEA,KAH2C;MAIlDrB,eAAe,EAAEA,eAJiC;MAKlDoC,qBAAqB,EAAEA,qBAL2B;MAMlDD,aAAa,EAAEA,aANmC;MAOlDD,YAAY,EAAEA,YAPoC;MAQlDG,SAAS,EAAEA,SARuC;MASlDe,WAAW,EAAEA,WATqC;MAUlDC,UAAU,EAAEA,UAVsC;MAWlDC,WAAW,EAAEA,WAXqC;MAYlDb,WAAW,EAAEA,WAZqC;MAalDG,aAAa,EAAEA,aAbmC;MAclDM,UAAU,EAAEA,UAdsC;MAelDC,YAAY,EAAEA,YAfoC;MAgBlDoC,QAAQ,EAAEvB,cAAc,GACnBa,CAAD,IAA0B;QACxBd,iBAAiB,CAACS,OAAlB,CAA0BnD,KAAK,CAACtC,GAAhC,IAAuC8F,CAAC,CAACC,WAAF,CAAcpG,MAAd,CAAqBP,KAA5D,CADwB,CAGxB;QACA;QACA;;QACA,IACEQ,MAAM,CAACS,MAAP,GAAgB4C,iBAAhB,IACAvD,KAAK,KAAKuD,iBADV,IAEArD,MAAM,CACHyF,KADH,CACS,CADT,EACYpC,iBADZ,EAEGqC,KAFH,CAGKC,CAAD,IAAO,OAAOP,iBAAiB,CAACS,OAAlB,CAA0BF,CAAC,CAACvF,GAA5B,CAAP,KAA4C,QAHvD,CAHF,EAQE;UACA4E,YAAY,CAAC,EAAE,GAAGI,iBAAiB,CAACS;UAAvB,CAAD,CAAZ;QACD,CAVD,MAUO,IACL7F,MAAM,CAAC0F,KAAP,CACGC,CAAD,IAAO,OAAOP,iBAAiB,CAACS,OAAlB,CAA0BF,CAAC,CAACvF,GAA5B,CAAP,KAA4C,QADrD,CADK,EAIL;UACA;UACA;UACA4E,YAAY,CAAC,EAAE,GAAGI,iBAAiB,CAACS;UAAvB,CAAD,CAAZ;QACD;MACF,CA1BmB,GA2BpB7C,SA3C8C;MA4ClD6D,OAAO,EAAE,MAAM;QACb,MAAMC,KAAuB,GAAG;UAC9BpE,KAD8B;UAE9BqE,gBAAgB,EAAE,KAFY;UAG9BC,cAAc,EAAE,MAAM;YACpBF,KAAK,CAACC,gBAAN,GAAyB,IAAzB;UACD;QAL6B,CAAhC;QAQAzC,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGwC,KAAH,CAAV;;QAEA,IAAIA,KAAK,CAACC,gBAAV,EAA4B;UAC1B;QACD;;QAEDnD,MAAM,CAAClB,KAAK,CAACtC,GAAP,CAAN;MACD,CA5DiD;MA6DlD6G,WAAW,EAAE,MAAM5C,cAAN,aAAMA,cAAN,uBAAMA,cAAc,CAAG;QAAE3B;MAAF,CAAH,CA7DiB;MA8DlD0B,UAAU,EAAEA,UA9DsC;MA+DlD1E,KAAK,EAAEC,QA/D2C;MAgElD;MACAuH,eAAe,EAAE,CAAC7B,cAAD,GACbxF,mBAAmB,CACjBC,KADiB,EAEjBC,MAFiB,EAGjBC,MAHiB,EAIjBC,aAJiB,EAKjBC,SALiB,EAMjBT,oBAAoB,CAACE,QAAD,CANH,CADN,GASbqD;IA1E8C,CAApD;IA6EA,oBACE,0CACG1B,GAAG,GAAG,CAAN,IAAWxB,KAAK,GAAG,CAAnB,gBAAuB,oBAAC,SAAD;MAAW,KAAK,EAAEwB;IAAlB,EAAvB,GAAmD,IADtD,EAEGsD,gBAAgB,GACfA,gBAAgB,CAAC1B,KAAD,CADD,gBAGf,oBAAC,UAAD,EAAgBA,KAAhB,CALJ,CADF;EAUD,CAzFgB,EA0FjB,CACEY,WADF,EAEExC,GAFF,EAGEmC,qBAHF,EAIED,aAJF,EAKED,YALF,EAMEG,SANF,EAOEO,aAPF,EAQEoB,cARF,EASEzB,MATF,EAUEQ,UAVF,EAWErE,MAXF,EAYEsB,eAZF,EAaEgD,cAbF,EAcEC,UAdF,EAeET,QAfF,EAgBEU,UAhBF,EAiBEC,YAjBF,EAkBEC,WAlBF,EAmBEC,UAnBF,EAoBEC,WApBF,EAqBEC,gBArBF,EAsBE5E,MAtBF,EAuBEC,aAvBF,EAwBEN,QAxBF,EAyBEO,SAzBF,CA1FiB,CAAnB;EAuHA,MAAMiH,YAAY,GAAGtI,KAAK,CAAC6H,WAAN,CAAmBC,IAAD,IAAaA,IAAI,CAACvG,GAApC,EAAyC,EAAzC,CAArB;EAEA,MAAMgH,6BAA6B,GAAGvI,KAAK,CAAC2H,OAAN,CACpC,MAAM,CACJa,MAAM,CAACC,UADH,EAEJrH,aAAa,GACT;IACET,KAAK,EACHmB,WAAW,GAAGyF,eAAd,GAAgCzF,WAAhC,GAA8C2F;EAFlD,CADS,GAKTe,MAAM,CAACE,SAPP,EAQJvD,qBARI,CAD8B,EAWpC,CACEA,qBADF,EAEE/D,aAFF,EAGEmG,eAHF,EAIEzF,WAJF,EAKE2F,kBALF,CAXoC,CAAtC;EAoBA,MAAMkB,YAAY,GAAG3I,KAAK,CAAC2H,OAAN,CACnB,MACE1H,QAAQ,CAACgI,KAAT,CACE,CACE;IACEX,WAAW,EAAE;MACXsB,aAAa,EAAE;QAAEC,CAAC,EAAE5G;MAAL;IADJ;EADf,CADF,CADF,EAQE;IAAE6G,eAAe,EAAE;EAAnB,CARF,CAFiB,EAYnB,CAAC7G,YAAD,CAZmB,CAArB;EAeA,MAAM8G,0BAA0B,GAAGzI,iBAAiB,CAClD,UAA2C;IAAA,IAA1C;MAAE0I;IAAF,CAA0C;;IACzC,IAAI7H,MAAM,CAACS,MAAP,IAAiB4C,iBAArB,EAAwC;MACtC;IACD,CAHwC,CAIzC;;;IACA,MAAMsD,IAAI,GAAGkB,OAAO,CAACA,OAAO,CAACpH,MAAR,GAAiB,CAAlB,CAApB;IACA,MAAMX,KAAK,GAAG,CAAA6G,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAE7G,KAAN,KAAe,CAA7B;;IACA,IACE6G,IAAI,CAACmB,UAAL,KACChI,KAAK,GAAG,EAAR,KAAe,CAAf,IACCA,KAAK,KAAKuB,eAAe,CAACvB,KAD3B,IAECA,KAAK,KAAKE,MAAM,CAACS,MAAP,GAAgB,CAH5B,CADF,EAKE;MACAuE,YAAY,CAAC,EAAE,GAAGI,iBAAiB,CAACS;MAAvB,CAAD,CAAZ;IACD;EACF,CAhBiD,CAApD;EAmBA,oBACE,oBAAC,QAAD,CAAU,IAAV;IAAe,QAAQ,EAAEI,YAAzB;IAAuC,KAAK,EAAE,CAACoB,MAAM,CAACU,MAAR,EAAgBrI,KAAhB;EAA9C,gBACE,oBAAC,QAAD,CAAU,IAAV;IACE,aAAa,EAAC,MADhB;IAEE,KAAK,EAAE,CACL2H,MAAM,CAACW,kBADF,EAEL/H,aAAa,GAAG;MAAEgI,SAAS,EAAE,CAAC;QAAE1B;MAAF,CAAD;IAAb,CAAH,GAA4C,IAFpD,EAGL5F,WAAW,GAAGyF,eAAd,GACI;MAAE5G,KAAK,EAAEmB,WAAW,GAAGyF;IAAvB,CADJ,GAEInG,aAAa,GACb;MAAET,KAAK,EAAE8G;IAAT,CADa,GAEb,IAPC,EAQLpC,uBARK;EAFT,GAaGP,eAAe,CAAC;IACfE,QADe;IAEf9D,MAFe;IAGfsB,eAHe;IAIfuC,MAJe;IAKfpE,KAAK,EAAE6F,cAAc,GACjB,MADiB,GAEhB,GAAE,CAAC,MAAMgB,gBAAP,IAA2BrG,MAAM,CAACS,MAAO,GAPjC;IAQff,KAAK,EAAEyE,cARQ;IASf+D,WAAW,EAAGvG,CAAD,IACX9B,mBAAmB,CACjB8B,CADiB,EAEjB5B,MAFiB,EAGjBC,MAHiB,EAIjBC,aAJiB,EAKjBC,SALiB,EAMjBqB,iBANiB,CAVN;IAkBfD;EAlBe,CAAD,CAblB,CADF,eAmCE,oBAAC,IAAD;IAAM,KAAK,EAAE+F,MAAM,CAACc;EAApB,gBACE,oBAAC,QAAD,CAAU,QAAV;IACE,IAAI,EAAEnI,MADR;IAEE,YAAY,EAAEmH,YAFhB;IAGE,UAAU,MAHZ;IAIE,iBAAiB,EAAC,SAJpB;IAKE,yBAAyB,EAAC,SAL5B;IAME,aAAa,EAAElH,aANjB;IAOE,OAAO,EAAE8D,OAPX;IAQE,kBAAkB,EAAEV,iBARtB;IASE,sBAAsB,EAAEuE,0BAT1B;IAUE,sBAAsB,EAAE,KAV1B;IAWE,YAAY,EAAE,KAXhB;IAYE,8BAA8B,EAAE,KAZlC;IAaE,4BAA4B,EAAE,KAbhC;IAcE,gCAAgC,EAAE,KAdpC;IAeE,cAAc,EAAC,OAfjB;IAgBE,qBAAqB,EAAER,6BAhBzB;IAiBE,mBAAmB,EAAE,EAjBvB;IAkBE,UAAU,EAAEX,UAlBd;IAmBE,QAAQ,EAAEe,YAnBZ;IAoBE,GAAG,EAAEvC,WApBP;IAqBE,MAAM,EAAE7B;EArBV,EADF,CAnCF,CADF;AA+DD;AAED,MAAMiE,MAAM,GAAGpI,UAAU,CAACmJ,MAAX,CAAkB;EAC/Bb,SAAS,EAAE;IACTc,IAAI,EAAE;EADG,CADoB;EAI/BF,MAAM,EAAE;IACNG,QAAQ,EAAEtJ,QAAQ,CAACuJ,MAAT,CAAgB;MAAEC,OAAO,EAAE,QAAX;MAAqBC,GAAG,EAAEzF;IAA1B,CAAhB;EADJ,CAJuB;EAO/B+E,MAAM,EAAE;IACNW,eAAe,EAAE,SADX;IAENC,SAAS,EAAE,CAFL;IAGNC,WAAW,EAAE,OAHP;IAINC,aAAa,EAAE,GAJT;IAKNC,YAAY,EAAE7J,UAAU,CAAC8J,aALnB;IAMNC,YAAY,EAAE;MACZjE,MAAM,EAAE9F,UAAU,CAAC8J,aADP;MAEZvJ,KAAK,EAAE;IAFK,CANR;IAUNyJ,MAAM,EAAE;EAVF,CAPuB;EAmB/B3B,UAAU,EAAE;IACV4B,aAAa,EAAE,KADL;IAEVC,QAAQ,EAAE;EAFA,CAnBmB;EAuB/BnB,kBAAkB,EAAE;IAClBnE,QAAQ,EAAE,UADQ;IAElBuF,GAAG,EAAE,CAFa;IAGlBC,IAAI,EAAE,CAHY;IAIlBC,KAAK,EAAE,CAJW;IAKlBC,MAAM,EAAE;EALU;AAvBW,CAAlB,CAAf"}

package/lib/module/TabBarIndicator.js

@@ -1,114 +1,96 @@
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 import * as React from 'react';
-import { Animated, Easing, StyleSheet, I18nManager, Platform } from 'react-native';
-export default class TabBarIndicator extends React.Component {
-  constructor() {
-    super(...arguments);
+import { Animated, Easing, I18nManager, Platform, StyleSheet } from 'react-native';
+import useAnimatedValue from './useAnimatedValue';
+
+const getTranslateX = (position, routes, getTabWidth, gap) => {
+  const inputRange = routes.map((_, i) => i); // every index contains widths at all previous indices
 
-    _defineProperty(this, "fadeInIndicator", () => {
-      const {
-        navigationState,
-        layout,
-        width,
-        getTabWidth
-      } = this.props;
+  const outputRange = routes.reduce((acc, _, i) => {
+    if (i === 0) return [0];
+    return [...acc, acc[i - 1] + getTabWidth(i - 1) + (gap !== null && gap !== void 0 ? gap : 0)];
+  }, []);
+  const translateX = position.interpolate({
+    inputRange,
+    outputRange,
+    extrapolate: 'clamp'
+  });
+  return Animated.multiply(translateX, I18nManager.isRTL ? -1 : 1);
+};
 
-      if (!this.isIndicatorShown && width === 'auto' && layout.width && // We should fade-in the indicator when we have widths for all the tab items
-      navigationState.routes.every((_, i) => getTabWidth(i))) {
-        this.isIndicatorShown = true;
-        Animated.timing(this.opacity, {
+export default function TabBarIndicator(_ref) {
+  let {
+    getTabWidth,
+    layout,
+    navigationState,
+    position,
+    width,
+    gap,
+    style
+  } = _ref;
+  const isIndicatorShown = React.useRef(false);
+  const isWidthDynamic = width === 'auto';
+  const opacity = useAnimatedValue(isWidthDynamic ? 0 : 1);
+  const indicatorVisible = isWidthDynamic ? layout.width && navigationState.routes.slice(0, navigationState.index).every((_, r) => getTabWidth(r)) : true;
+  React.useEffect(() => {
+    const fadeInIndicator = () => {
+      if (!isIndicatorShown.current && isWidthDynamic && // We should fade-in the indicator when we have widths for all the tab items
+      indicatorVisible) {
+        isIndicatorShown.current = true;
+        Animated.timing(opacity, {
           toValue: 1,
           duration: 150,
           easing: Easing.in(Easing.linear),
           useNativeDriver: true
         }).start();
       }
-    });
-
-    _defineProperty(this, "isIndicatorShown", false);
+    };
 
-    _defineProperty(this, "opacity", new Animated.Value(this.props.width === 'auto' ? 0 : 1));
+    fadeInIndicator();
+    return () => opacity.stopAnimation();
+  }, [indicatorVisible, isWidthDynamic, opacity]);
+  const {
+    routes
+  } = navigationState;
+  const transform = [];
 
-    _defineProperty(this, "getTranslateX", (position, routes, getTabWidth, gap) => {
-      const inputRange = routes.map((_, i) => i); // every index contains widths at all previous indices
+  if (layout.width) {
+    const translateX = routes.length > 1 ? getTranslateX(position, routes, getTabWidth, gap) : 0;
+    transform.push({
+      translateX
+    });
+  }
 
-      const outputRange = routes.reduce((acc, _, i) => {
-        if (i === 0) return [0];
-        return [...acc, acc[i - 1] + getTabWidth(i - 1) + (gap ?? 0)];
-      }, []);
-      const translateX = position.interpolate({
+  if (width === 'auto') {
+    const inputRange = routes.map((_, i) => i);
+    const outputRange = inputRange.map(getTabWidth);
+    transform.push({
+      scaleX: routes.length > 1 ? position.interpolate({
         inputRange,
         outputRange,
         extrapolate: 'clamp'
-      });
-      return Animated.multiply(translateX, I18nManager.isRTL ? -1 : 1);
-    });
-  }
-
-  componentDidMount() {
-    this.fadeInIndicator();
-  }
-
-  componentDidUpdate() {
-    this.fadeInIndicator();
-  }
-
-  render() {
-    const {
-      position,
-      navigationState,
-      getTabWidth,
-      width,
-      style,
-      layout,
-      gap
-    } = this.props;
-    const {
-      routes
-    } = navigationState;
-    const transform = [];
-
-    if (layout.width) {
-      const translateX = routes.length > 1 ? this.getTranslateX(position, routes, getTabWidth, gap) : 0;
-      transform.push({
-        translateX
-      });
-    }
-
-    if (width === 'auto') {
-      const inputRange = routes.map((_, i) => i);
-      const outputRange = inputRange.map(getTabWidth);
-      transform.push({
-        scaleX: routes.length > 1 ? position.interpolate({
-          inputRange,
-          outputRange,
-          extrapolate: 'clamp'
-        }) : outputRange[0]
-      }, {
-        translateX: 0.5
-      });
-    }
-
-    return /*#__PURE__*/React.createElement(Animated.View, {
-      style: [styles.indicator, {
-        width: width === 'auto' ? 1 : width
-      }, // If layout is not available, use `left` property for positioning the indicator
-      // This avoids rendering delay until we are able to calculate translateX
-      // If platform is macos use `left` property as `transform` is broken at the moment.
-      // See: https://github.com/microsoft/react-native-macos/issues/280
-      layout.width && Platform.OS !== 'macos' ? {
-        left: 0
-      } : {
-        left: `${100 / routes.length * navigationState.index}%`
-      }, {
-        transform
-      }, width === 'auto' ? {
-        opacity: this.opacity
-      } : null, style]
+      }) : outputRange[0]
+    }, {
+      translateX: 0.5
     });
   }
 
+  return /*#__PURE__*/React.createElement(Animated.View, {
+    style: [styles.indicator, {
+      width: width === 'auto' ? 1 : width
+    }, // If layout is not available, use `left` property for positioning the indicator
+    // This avoids rendering delay until we are able to calculate translateX
+    // If platform is macos use `left` property as `transform` is broken at the moment.
+    // See: https://github.com/microsoft/react-native-macos/issues/280
+    layout.width && Platform.OS !== 'macos' ? {
+      left: 0
+    } : {
+      left: `${100 / routes.length * navigationState.index}%`
+    }, {
+      transform
+    }, width === 'auto' ? {
+      opacity: opacity
+    } : null, style]
+  });
 }
 const styles = StyleSheet.create({
   indicator: {

package/lib/module/TabBarIndicator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","Easing","StyleSheet","I18nManager","Platform","TabBarIndicator","Component","navigationState","layout","width","getTabWidth","props","isIndicatorShown","routes","every","_","i","timing","opacity","toValue","duration","easing","in","linear","useNativeDriver","start","Value","position","gap","inputRange","map","outputRange","reduce","acc","translateX","interpolate","extrapolate","multiply","isRTL","componentDidMount","fadeInIndicator","componentDidUpdate","render","style","transform","length","getTranslateX","push","scaleX","styles","indicator","OS","left","index","create","backgroundColor","bottom","right","height"],"sources":["TabBarIndicator.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Animated,\n  Easing,\n  StyleSheet,\n  I18nManager,\n  StyleProp,\n  ViewStyle,\n  Platform,\n} from 'react-native';\n\nimport type { Route, SceneRendererProps, NavigationState } from './types';\n\nexport type GetTabWidth = (index: number) => number;\n\nexport type Props<T extends Route> = SceneRendererProps & {\n  navigationState: NavigationState<T>;\n  width: string | number;\n  style?: StyleProp<ViewStyle>;\n  getTabWidth: GetTabWidth;\n  gap?: number;\n};\n\nexport default class TabBarIndicator<T extends Route> extends React.Component<\n  Props<T>\n> {\n  componentDidMount() {\n    this.fadeInIndicator();\n  }\n\n  componentDidUpdate() {\n    this.fadeInIndicator();\n  }\n\n  private fadeInIndicator = () => {\n    const { navigationState, layout, width, getTabWidth } = this.props;\n\n    if (\n      !this.isIndicatorShown &&\n      width === 'auto' &&\n      layout.width &&\n      // We should fade-in the indicator when we have widths for all the tab items\n      navigationState.routes.every((_, i) => getTabWidth(i))\n    ) {\n      this.isIndicatorShown = true;\n\n      Animated.timing(this.opacity, {\n        toValue: 1,\n        duration: 150,\n        easing: Easing.in(Easing.linear),\n        useNativeDriver: true,\n      }).start();\n    }\n  };\n\n  private isIndicatorShown = false;\n\n  private opacity = new Animated.Value(this.props.width === 'auto' ? 0 : 1);\n\n  private getTranslateX = (\n    position: Animated.AnimatedInterpolation,\n    routes: Route[],\n    getTabWidth: GetTabWidth,\n    gap?: number\n  ) => {\n    const inputRange = routes.map((_, i) => i);\n\n    // every index contains widths at all previous indices\n    const outputRange = routes.reduce<number[]>((acc, _, i) => {\n      if (i === 0) return [0];\n      return [...acc, acc[i - 1] + getTabWidth(i - 1) + (gap ?? 0)];\n    }, []);\n\n    const translateX = position.interpolate({\n      inputRange,\n      outputRange,\n      extrapolate: 'clamp',\n    });\n\n    return Animated.multiply(translateX, I18nManager.isRTL ? -1 : 1);\n  };\n\n  render() {\n    const {\n      position,\n      navigationState,\n      getTabWidth,\n      width,\n      style,\n      layout,\n      gap,\n    } = this.props;\n    const { routes } = navigationState;\n\n    const transform = [];\n\n    if (layout.width) {\n      const translateX =\n        routes.length > 1\n          ? this.getTranslateX(position, routes, getTabWidth, gap)\n          : 0;\n\n      transform.push({ translateX });\n    }\n\n    if (width === 'auto') {\n      const inputRange = routes.map((_, i) => i);\n      const outputRange = inputRange.map(getTabWidth);\n\n      transform.push(\n        {\n          scaleX:\n            routes.length > 1\n              ? position.interpolate({\n                  inputRange,\n                  outputRange,\n                  extrapolate: 'clamp',\n                })\n              : outputRange[0],\n        },\n        { translateX: 0.5 }\n      );\n    }\n\n    return (\n      <Animated.View\n        style={[\n          styles.indicator,\n          { width: width === 'auto' ? 1 : width },\n          // If layout is not available, use `left` property for positioning the indicator\n          // This avoids rendering delay until we are able to calculate translateX\n          // If platform is macos use `left` property as `transform` is broken at the moment.\n          // See: https://github.com/microsoft/react-native-macos/issues/280\n          layout.width && Platform.OS !== 'macos'\n            ? { left: 0 }\n            : { left: `${(100 / routes.length) * navigationState.index}%` },\n          { transform },\n          width === 'auto' ? { opacity: this.opacity } : null,\n          style,\n        ]}\n      />\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  indicator: {\n    backgroundColor: '#ffeb3b',\n    position: 'absolute',\n    left: 0,\n    bottom: 0,\n    right: 0,\n    height: 2,\n  },\n});\n"],"mappings":"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"}
+{"version":3,"names":["React","Animated","Easing","I18nManager","Platform","StyleSheet","useAnimatedValue","getTranslateX","position","routes","getTabWidth","gap","inputRange","map","_","i","outputRange","reduce","acc","translateX","interpolate","extrapolate","multiply","isRTL","TabBarIndicator","layout","navigationState","width","style","isIndicatorShown","useRef","isWidthDynamic","opacity","indicatorVisible","slice","index","every","r","useEffect","fadeInIndicator","current","timing","toValue","duration","easing","in","linear","useNativeDriver","start","stopAnimation","transform","length","push","scaleX","styles","indicator","OS","left","create","backgroundColor","bottom","right","height"],"sources":["TabBarIndicator.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Animated,\n  Easing,\n  I18nManager,\n  Platform,\n  StyleProp,\n  StyleSheet,\n  ViewStyle,\n} from 'react-native';\n\nimport type { NavigationState, Route, SceneRendererProps } from './types';\nimport useAnimatedValue from './useAnimatedValue';\n\nexport type GetTabWidth = (index: number) => number;\n\nexport type Props<T extends Route> = SceneRendererProps & {\n  navigationState: NavigationState<T>;\n  width: string | number;\n  style?: StyleProp<ViewStyle>;\n  getTabWidth: GetTabWidth;\n  gap?: number;\n};\n\nconst getTranslateX = (\n  position: Animated.AnimatedInterpolation,\n  routes: Route[],\n  getTabWidth: GetTabWidth,\n  gap?: number\n) => {\n  const inputRange = routes.map((_, i) => i);\n\n  // every index contains widths at all previous indices\n  const outputRange = routes.reduce<number[]>((acc, _, i) => {\n    if (i === 0) return [0];\n    return [...acc, acc[i - 1] + getTabWidth(i - 1) + (gap ?? 0)];\n  }, []);\n\n  const translateX = position.interpolate({\n    inputRange,\n    outputRange,\n    extrapolate: 'clamp',\n  });\n\n  return Animated.multiply(translateX, I18nManager.isRTL ? -1 : 1);\n};\n\nexport default function TabBarIndicator<T extends Route>({\n  getTabWidth,\n  layout,\n  navigationState,\n  position,\n  width,\n  gap,\n  style,\n}: Props<T>) {\n  const isIndicatorShown = React.useRef(false);\n  const isWidthDynamic = width === 'auto';\n\n  const opacity = useAnimatedValue(isWidthDynamic ? 0 : 1);\n\n  const indicatorVisible = isWidthDynamic\n    ? layout.width &&\n      navigationState.routes\n        .slice(0, navigationState.index)\n        .every((_, r) => getTabWidth(r))\n    : true;\n\n  React.useEffect(() => {\n    const fadeInIndicator = () => {\n      if (\n        !isIndicatorShown.current &&\n        isWidthDynamic &&\n        // We should fade-in the indicator when we have widths for all the tab items\n        indicatorVisible\n      ) {\n        isIndicatorShown.current = true;\n\n        Animated.timing(opacity, {\n          toValue: 1,\n          duration: 150,\n          easing: Easing.in(Easing.linear),\n          useNativeDriver: true,\n        }).start();\n      }\n    };\n\n    fadeInIndicator();\n\n    return () => opacity.stopAnimation();\n  }, [indicatorVisible, isWidthDynamic, opacity]);\n\n  const { routes } = navigationState;\n\n  const transform = [];\n\n  if (layout.width) {\n    const translateX =\n      routes.length > 1 ? getTranslateX(position, routes, getTabWidth, gap) : 0;\n\n    transform.push({ translateX });\n  }\n\n  if (width === 'auto') {\n    const inputRange = routes.map((_, i) => i);\n    const outputRange = inputRange.map(getTabWidth);\n\n    transform.push(\n      {\n        scaleX:\n          routes.length > 1\n            ? position.interpolate({\n                inputRange,\n                outputRange,\n                extrapolate: 'clamp',\n              })\n            : outputRange[0],\n      },\n      { translateX: 0.5 }\n    );\n  }\n\n  return (\n    <Animated.View\n      style={[\n        styles.indicator,\n        { width: width === 'auto' ? 1 : width },\n        // If layout is not available, use `left` property for positioning the indicator\n        // This avoids rendering delay until we are able to calculate translateX\n        // If platform is macos use `left` property as `transform` is broken at the moment.\n        // See: https://github.com/microsoft/react-native-macos/issues/280\n        layout.width && Platform.OS !== 'macos'\n          ? { left: 0 }\n          : { left: `${(100 / routes.length) * navigationState.index}%` },\n        { transform },\n        width === 'auto' ? { opacity: opacity } : null,\n        style,\n      ]}\n    />\n  );\n}\n\nconst styles = StyleSheet.create({\n  indicator: {\n    backgroundColor: '#ffeb3b',\n    position: 'absolute',\n    left: 0,\n    bottom: 0,\n    right: 0,\n    height: 2,\n  },\n});\n"],"mappings":"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"}