docs: fix runtime error occuring with code tabs (#13873)
This commit is contained in:
1 parent
9f154c308e
commit
39f2893738
1 file changed
+7
-4
@@ -175,7 +175,7 @@ export const CodeTabs = ({
|
|||||||
group,
|
group,
|
||||||
})
|
})
|
||||||
|
|
||||||
const tabRefs: (HTMLButtonElement | null)[] = useMemo(() => [], [])
|
const tabRefs = useRef<(HTMLButtonElement | null)[]>([])
|
||||||
const codeTabSelectorRef = useRef<HTMLSpanElement | null>(null)
|
const codeTabSelectorRef = useRef<HTMLSpanElement | null>(null)
|
||||||
const codeTabsWrapperRef = useRef<HTMLDivElement | null>(null)
|
const codeTabsWrapperRef = useRef<HTMLDivElement | null>(null)
|
||||||
|
|
||||||
@@ -221,8 +221,8 @@ export const CodeTabs = ({
|
|||||||
)
|
)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (codeTabSelectorRef?.current && tabRefs.length) {
|
if (codeTabSelectorRef?.current && tabRefs.current.length) {
|
||||||
const selectedTabElm = tabRefs.find(
|
const selectedTabElm = tabRefs.current.find(
|
||||||
(tab) => tab?.getAttribute("aria-selected") === "true"
|
(tab) => tab?.getAttribute("aria-selected") === "true"
|
||||||
)
|
)
|
||||||
if (selectedTabElm) {
|
if (selectedTabElm) {
|
||||||
@@ -250,6 +250,9 @@ export const CodeTabs = ({
|
|||||||
}
|
}
|
||||||
}, [selectedTab])
|
}, [selectedTab])
|
||||||
|
|
||||||
|
// Reset tabRefs array before each render
|
||||||
|
tabRefs.current = []
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={clsx(
|
className={clsx(
|
||||||
@@ -299,7 +302,7 @@ export const CodeTabs = ({
|
|||||||
{...(typeof child.props === "object" ? child.props : {})}
|
{...(typeof child.props === "object" ? child.props : {})}
|
||||||
changeSelectedTab={changeSelectedTab}
|
changeSelectedTab={changeSelectedTab}
|
||||||
pushRef={(tabButton: HTMLButtonElement | null) =>
|
pushRef={(tabButton: HTMLButtonElement | null) =>
|
||||||
tabRefs.push(tabButton)
|
tabRefs.current.push(tabButton)
|
||||||
}
|
}
|
||||||
blockStyle={blockStyle}
|
blockStyle={blockStyle}
|
||||||
isSelected={
|
isSelected={
|
||||||
|
|||||||
Reference in new issue
Block a user