Skip to content

Commit

Permalink
[docs-infra] Fix code block layout shift
Browse files Browse the repository at this point in the history
  • Loading branch information
oliviertassinari committed Apr 16, 2024
1 parent 418fb02 commit ee0ee3f
Showing 1 changed file with 3 additions and 1 deletion.
4 changes: 3 additions & 1 deletion docs/src/modules/components/HighlightedCodeWithTabs.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,8 @@ export default function HighlightedCodeWithTabs(
const { tabs, storageKey } = props;
const availableTabs = React.useMemo(() => tabs.map(({ tab }) => tab), [tabs]);
const [activeTab, setActiveTab] = useLocalStorageState(storageKey ?? null, availableTabs[0]);
// During hydration, activeTab is null, default to first value.
const value = activeTab ?? availableTabs[0];

const [mounted, setMounted] = React.useState(false);

Expand All @@ -101,7 +103,7 @@ export default function HighlightedCodeWithTabs(

const ownerState = { mounted };
return (
<Tabs selectionFollowsFocus value={activeTab} onChange={handleChange}>
<Tabs selectionFollowsFocus value={value} onChange={handleChange}>
<TabList>
{tabs.map(({ tab }) => (
<Tab ownerState={ownerState} key={tab} value={tab}>
Expand Down

0 comments on commit ee0ee3f

Please sign in to comment.