diff --git a/demo/src/screens/componentScreens/TabControllerScreen/index.tsx b/demo/src/screens/componentScreens/TabControllerScreen/index.tsx index 5171ba84f8..aac646cb97 100644 --- a/demo/src/screens/componentScreens/TabControllerScreen/index.tsx +++ b/demo/src/screens/componentScreens/TabControllerScreen/index.tsx @@ -1,3 +1,4 @@ +import _ from 'lodash'; import React, {Component} from 'react'; import {ActivityIndicator, StyleSheet} from 'react-native'; import { @@ -11,7 +12,6 @@ import { TabControllerImperativeMethods } from 'react-native-ui-lib'; import {gestureHandlerRootHOC} from 'react-native-gesture-handler'; -import _ from 'lodash'; import Tab1 from './tab1'; import Tab2 from './tab2'; @@ -162,14 +162,13 @@ class TabControllerScreen extends Component<{}, State> { } render() { - const {key, initialIndex, /* selectedIndex, */ asCarousel, centerSelected, fewItems, items} = this.state; + const {key, initialIndex, asCarousel, centerSelected, fewItems, items} = this.state; return ( { currentPage, targetPage, initialIndex, - selectedIndex, containerWidth: contextContainerWidth } = context; const containerWidth: number = useMemo(() => { @@ -196,7 +194,7 @@ const TabBar = (props: Props) => { // @ts-expect-error TODO: typing bug scrollViewRef: tabBar, itemsCount, - selectedIndex: selectedIndex || initialIndex, + selectedIndex: initialIndex, containerWidth, offsetType: centerSelected ? useScrollToItem.offsetType.CENTER : useScrollToItem.offsetType.DYNAMIC }); diff --git a/src/components/tabController/TabBarContext.ts b/src/components/tabController/TabBarContext.ts index dd0f664148..6a1e0ac1b4 100644 --- a/src/components/tabController/TabBarContext.ts +++ b/src/components/tabController/TabBarContext.ts @@ -3,8 +3,6 @@ import Reanimated from 'react-native-reanimated'; interface TabControllerContext { initialIndex?: number; - // DEPRECATED: use initialIndex instead - selectedIndex?: number; items?: any[]; itemsCount: number; asCarousel?: boolean; diff --git a/src/components/tabController/apis/tabController.api.json b/src/components/tabController/apis/tabController.api.json index 46654265d5..5bea7bd9b5 100644 --- a/src/components/tabController/apis/tabController.api.json +++ b/src/components/tabController/apis/tabController.api.json @@ -8,7 +8,6 @@ "props": [ {"name": "items", "type": "TabControllerItemProps[]", "description": "The list of tab bar items"}, {"name": "initialIndex", "type": "number", "description": "Initial selected index", "default": "0"}, - {"name": "selectedIndex", "type": "number", "description": "The current selected index", "deprecated": true}, { "name": "onChangeIndex", "type": "(index: number, prevIndex: number | null) => void", diff --git a/src/components/tabController/index.tsx b/src/components/tabController/index.tsx index a21e61a545..ab5c5e2c73 100644 --- a/src/components/tabController/index.tsx +++ b/src/components/tabController/index.tsx @@ -1,10 +1,9 @@ // TODO: support commented props -import React, {PropsWithChildren, useMemo, useEffect, useState, useCallback} from 'react'; import _ from 'lodash'; +import React, {PropsWithChildren, useMemo, useEffect, useState, useCallback} from 'react'; import {useAnimatedReaction, useSharedValue, withTiming, runOnJS} from 'react-native-reanimated'; import {useOrientation, useThemeProps} from '../../hooks'; import {Constants} from '../../commons/new'; -import {LogService} from '../../services'; import TabBarContext from './TabBarContext'; import TabBar from './TabBar'; import TabBarItem, {TabControllerItemProps} from './TabBarItem'; @@ -13,8 +12,6 @@ import PageCarousel from './PageCarousel'; import useImperativeTabControllerHandle, {TabControllerImperativeMethods} from './useImperativeTabControllerHandle'; export {TabControllerItemProps, TabControllerImperativeMethods}; -// TODO: should migrate selectedIndex to initialIndex (and make this prop uncontrolled) - interface TabControllerStatics { TabBar: typeof TabBar; TabBarItem: typeof TabBarItem; @@ -31,10 +28,6 @@ export interface TabControllerProps extends ThemeComponent { * Initial selected index */ initialIndex?: number; - /** - * DEPRECATED: use initialIndex instead - */ - selectedIndex?: number; /** * callback for when index has change (will not be called on ignored items) */ @@ -70,7 +63,6 @@ const TabController = React.forwardRef((props: PropsWithChildren(items, (item: TabControllerItemProps) => item.ignore); }, [items]); - /* backwards compatibility for `selectedIndex` prop. this line eventually should be removed */ - const _initialIndex = selectedIndex || initialIndex; - /* currentPage - static page index */ - const currentPage = useSharedValue(_initialIndex); + const currentPage = useSharedValue(initialIndex); /* targetPage - transitioned page index (can be a fraction when transitioning between pages) */ - const targetPage = useSharedValue(_initialIndex); - // const carouselOffset = useSharedValue(initialIndex * Math.round(pageWidth)); + const targetPage = useSharedValue(initialIndex); const setCurrentIndex = useCallback((index: number) => { 'worklet'; @@ -113,14 +101,8 @@ const TabController = React.forwardRef((props: PropsWithChildren { - if (!_.isUndefined(selectedIndex)) { - LogService.deprecationWarn({component: 'TabController', oldProp: 'selectedIndex', newProp: 'initialIndex'}); - } - }, [selectedIndex]); - - useEffect(() => { - setCurrentIndex(_initialIndex); - }, [_initialIndex]); + setCurrentIndex(initialIndex); + }, [initialIndex]); useAnimatedReaction(() => { return currentPage.value; @@ -137,7 +119,7 @@ const TabController = React.forwardRef((props: PropsWithChildren { return { /* Pass Props */ - initialIndex: _initialIndex, + initialIndex, asCarousel, pageWidth, /* Items */ @@ -147,13 +129,12 @@ const TabController = React.forwardRef((props: PropsWithChildren{children}; }); diff --git a/typings/incubator/index.d.ts b/typings/incubator/index.d.ts index 387bc8d744..41decbfdbe 100644 --- a/typings/incubator/index.d.ts +++ b/typings/incubator/index.d.ts @@ -12,7 +12,7 @@ import {BadgeProps} from '../components/Badge'; export namespace Incubator { export interface TabControllerProps { - selectedIndex?: number; + initialIndex?: number; onChangeIndex?: (index: number) => void; asCarousel?: boolean; }