@amazon-devices/react-navigation__react-native-tab-view 8.0.9000000001 → 8.0.9000000002

package/src/TabView.tsx

@@ -1,198 +0,0 @@
-import * as React from 'react';
-import {
-  I18nManager,
-  type LayoutChangeEvent,
-  Platform,
-  type StyleProp,
-  StyleSheet,
-  View,
-  type ViewStyle,
-} from 'react-native';
-
-import { Pager } from './Pager';
-import { SceneView } from './SceneView';
-import { TabBar } from './TabBar';
-import type {
-  Layout,
-  LocaleDirection,
-  NavigationState,
-  PagerProps,
-  Route,
-  SceneRendererProps,
-  TabDescriptor,
-} from './types';
-
-export type Props<T extends Route> = Omit<PagerProps, 'layoutDirection'> & {
-  onIndexChange: (index: number) => void;
-  onTabSelect?: (props: { index: number }) => void;
-  navigationState: NavigationState<T>;
-  renderLazyPlaceholder?: (props: { route: T }) => React.ReactNode;
-  renderTabBar?: (
-    props: SceneRendererProps & {
-      navigationState: NavigationState<T>;
-      options: Record<string, TabDescriptor<T>> | undefined;
-    }
-  ) => React.ReactNode;
-  tabBarPosition?: 'top' | 'bottom';
-  initialLayout?: Partial<Layout>;
-  lazy?: ((props: { route: T }) => boolean) | boolean;
-  lazyPreloadDistance?: number;
-  direction?: LocaleDirection;
-  pagerStyle?: StyleProp<ViewStyle>;
-  style?: StyleProp<ViewStyle>;
-  renderScene: (props: SceneRendererProps & { route: T }) => React.ReactNode;
-  options?: Record<string, TabDescriptor<T>>;
-  commonOptions?: TabDescriptor<T>;
-};
-
-const renderLazyPlaceholderDefault = () => null;
-
-export function TabView<T extends Route>({
-  onIndexChange,
-  onTabSelect,
-  navigationState,
-  renderScene,
-  initialLayout,
-  keyboardDismissMode = 'auto',
-  lazy = false,
-  lazyPreloadDistance = 0,
-  onSwipeStart,
-  onSwipeEnd,
-  renderLazyPlaceholder = renderLazyPlaceholderDefault,
-  // eslint-disable-next-line @eslint-react/no-unstable-default-props
-  renderTabBar = (props) => <TabBar {...props} />,
-  pagerStyle,
-  style,
-  direction = I18nManager.getConstants().isRTL ? 'rtl' : 'ltr',
-  swipeEnabled = true,
-  tabBarPosition = 'top',
-  animationEnabled = true,
-  overScrollMode,
-  options: sceneOptions,
-  commonOptions,
-}: Props<T>) {
-  if (
-    Platform.OS !== 'web' &&
-    direction !== (I18nManager.getConstants().isRTL ? 'rtl' : 'ltr')
-  ) {
-    console.warn(
-      `The 'direction' prop is set to '${direction}' but the effective value is '${
-        I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'
-      }'. This is not supported. Make sure to match the 'direction' prop with the writing direction of the app.`
-    );
-  }
-
-  const [layout, setLayout] = React.useState({
-    width: 0,
-    height: 0,
-    ...initialLayout,
-  });
-
-  const jumpToIndex = (index: number) => {
-    if (index !== navigationState.index) {
-      onIndexChange(index);
-    }
-  };
-
-  const handleLayout = (e: LayoutChangeEvent) => {
-    const { height, width } = e.nativeEvent.layout;
-
-    setLayout((prevLayout) => {
-      if (prevLayout.width === width && prevLayout.height === height) {
-        return prevLayout;
-      }
-
-      return { height, width };
-    });
-  };
-
-  const options = Object.fromEntries(
-    navigationState.routes.map((route) => [
-      route.key,
-      {
-        ...commonOptions,
-        ...sceneOptions?.[route.key],
-      },
-    ])
-  );
-
-  return (
-    <View onLayout={handleLayout} style={[styles.pager, style]}>
-      <Pager
-        layout={layout}
-        navigationState={navigationState}
-        keyboardDismissMode={keyboardDismissMode}
-        swipeEnabled={swipeEnabled}
-        onSwipeStart={onSwipeStart}
-        onSwipeEnd={onSwipeEnd}
-        onIndexChange={jumpToIndex}
-        onTabSelect={onTabSelect}
-        animationEnabled={animationEnabled}
-        overScrollMode={overScrollMode}
-        style={pagerStyle}
-        layoutDirection={direction}
-      >
-        {({ position, render, addEnterListener, jumpTo }) => {
-          // All the props here must not change between re-renders
-          // This is crucial to optimizing the routes with PureComponent
-          const sceneRendererProps = {
-            position,
-            layout,
-            jumpTo,
-          };
-
-          return (
-            <React.Fragment>
-              {tabBarPosition === 'top' &&
-                renderTabBar({
-                  ...sceneRendererProps,
-                  options,
-                  navigationState,
-                })}
-              {render(
-                navigationState.routes.map((route, i) => {
-                  const { sceneStyle } = options?.[route.key] ?? {};
-
-                  return (
-                    <SceneView
-                      key={route.key}
-                      {...sceneRendererProps}
-                      addEnterListener={addEnterListener}
-                      index={i}
-                      lazy={typeof lazy === 'function' ? lazy({ route }) : lazy}
-                      lazyPreloadDistance={lazyPreloadDistance}
-                      navigationState={navigationState}
-                      style={sceneStyle}
-                    >
-                      {({ loading }) =>
-                        loading
-                          ? renderLazyPlaceholder({ route })
-                          : renderScene({
-                              ...sceneRendererProps,
-                              route,
-                            })
-                      }
-                    </SceneView>
-                  );
-                })
-              )}
-              {tabBarPosition === 'bottom' &&
-                renderTabBar({
-                  ...sceneRendererProps,
-                  options,
-                  navigationState,
-                })}
-            </React.Fragment>
-          );
-        }}
-      </Pager>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  pager: {
-    flex: 1,
-    overflow: 'hidden',
-  },
-});

package/src/types.tsx

@@ -1,87 +0,0 @@
-import type { Animated, StyleProp, TextStyle, ViewStyle } from 'react-native';
-import type { PagerViewProps } from 'react-native-pager-view';
-
-export type TabDescriptor<T extends Route> = {
-  accessibilityLabel?: string;
-  accessible?: boolean;
-  testID?: string;
-  labelText?: string;
-  labelAllowFontScaling?: boolean;
-  href?: string;
-  label?: (props: {
-    route: T;
-    labelText?: string;
-    focused: boolean;
-    color: string;
-    allowFontScaling?: boolean;
-    style?: StyleProp<TextStyle>;
-  }) => React.ReactNode;
-  labelStyle?: StyleProp<TextStyle>;
-  icon?: (props: {
-    route: T;
-    focused: boolean;
-    color: string;
-    size: number;
-  }) => React.ReactNode;
-  badge?: (props: { route: T }) => React.ReactElement;
-  sceneStyle?: StyleProp<ViewStyle>;
-};
-
-export type LocaleDirection = 'ltr' | 'rtl';
-
-export type Route = {
-  key: string;
-  icon?: string;
-  title?: string;
-  accessible?: boolean;
-  accessibilityLabel?: string;
-  testID?: string;
-};
-
-export type Event = {
-  defaultPrevented: boolean;
-  preventDefault(): void;
-};
-
-export type Scene<T extends Route> = {
-  route: T;
-};
-
-export type NavigationState<T extends Route> = {
-  index: number;
-  routes: T[];
-};
-
-export type Layout = {
-  width: number;
-  height: number;
-};
-
-export type Listener = (value: number) => void;
-
-export type SceneRendererProps = {
-  layout: Layout;
-  position: Animated.AnimatedInterpolation<number>;
-  jumpTo: (key: string) => void;
-};
-
-export type EventEmitterProps = {
-  addEnterListener: (listener: Listener) => () => void;
-};
-
-export type PagerProps = Omit<
-  PagerViewProps,
-  | 'initialPage'
-  | 'scrollEnabled'
-  | 'onPageScroll'
-  | 'onPageSelected'
-  | 'onPageScrollStateChanged'
-  | 'keyboardDismissMode'
-  | 'children'
-> & {
-  keyboardDismissMode?: 'none' | 'on-drag' | 'auto';
-  swipeEnabled?: boolean;
-  animationEnabled?: boolean;
-  onSwipeStart?: () => void;
-  onSwipeEnd?: () => void;
-};

package/src/useAnimatedValue.tsx

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { Animated } from 'react-native';
-
-export function useAnimatedValue(initialValue: number) {
-  const lazyRef = React.useRef<Animated.Value>(undefined);
-
-  if (lazyRef.current === undefined) {
-    lazyRef.current = new Animated.Value(initialValue);
-  }
-
-  return lazyRef.current as Animated.Value;
-}