Skip to content

Commit ae2e642

Browse files
committed
fixed initial selectedTabIndex on Tabs
1 parent d1dd871 commit ae2e642

File tree

1 file changed

+3
-22
lines changed

1 file changed

+3
-22
lines changed

src/Tabs.tsx

Lines changed: 3 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,6 @@
11
"use client";
22

3-
import React, {
4-
memo,
5-
forwardRef,
6-
useId,
7-
useState,
8-
useEffect,
9-
type ReactNode,
10-
type CSSProperties,
11-
useCallback
12-
} from "react";
3+
import React, { memo, forwardRef, useId, type ReactNode, type CSSProperties, useMemo } from "react";
134
import type { FrIconClassName, RiIconClassName } from "./fr/generatedFromCss/classNames";
145
import { symToStr } from "tsafe/symToStr";
156
import { fr } from "./fr";
@@ -79,25 +70,15 @@ export const Tabs = memo(
7970
"explicitlyProvidedId": id_props
8071
});
8172

82-
const getSelectedTabIndex = () => {
73+
const selectedTabIndex = useMemo(() => {
8374
const index = tabs.findIndex(tab =>
8475
"content" in tab ? tab.isDefault ?? false : tab.tabId === selectedTabId
8576
);
8677
return index === -1 ? 0 : index;
87-
};
88-
89-
const currentSelectedTabIndex = getSelectedTabIndex();
78+
}, [tabs, selectedTabId]);
9079

9180
const buttonRefs = React.useRef<Array<HTMLButtonElement | null>>([]);
9281

93-
const [selectedTabIndex, setSelectedTabIndex] = useState<number>(currentSelectedTabIndex);
94-
95-
useEffect(() => {
96-
if (selectedTabId) {
97-
setSelectedTabIndex(currentSelectedTabIndex);
98-
}
99-
}, [selectedTabId, currentSelectedTabIndex]);
100-
10182
const onTabClickFactory = useCallbackFactory(([tabIndex]: [number]) => {
10283
if (selectedTabId === undefined) {
10384
onTabChange?.({

0 commit comments

Comments
 (0)