diff --git a/docs/src/components/CodeTabs.tsx b/docs/src/components/CodeTabs.tsx
index a0128be74..16f0a190a 100644
--- a/docs/src/components/CodeTabs.tsx
+++ b/docs/src/components/CodeTabs.tsx
@@ -1,5 +1,6 @@
-import { createSignal, For } from "solid-js";
+import { createEffect, createSignal, For } from "solid-js";
import { CodeBlock } from "./CodeBlock";
+import { useCodeTabsSelection } from "./CodeTabsContext";
export type Tab = {
key: string;
@@ -15,18 +16,31 @@ type CodeTabsProps = {
};
export default function CodeTabs(props: CodeTabsProps) {
+ const sharedSelection = useCodeTabsSelection();
const [active, setActive] = createSignal(
props.defaultKey || props.tabs[0].key,
);
const current = () => props.tabs.find((tab) => tab.key === active());
+ createEffect(() => {
+ const selectedKey = sharedSelection?.selectedKey();
+ if (selectedKey && props.tabs.some((tab) => tab.key === selectedKey)) {
+ setActive(selectedKey);
+ }
+ });
+
+ const selectTab = (key: string) => {
+ setActive(key);
+ sharedSelection?.selectKey(key);
+ };
+
return (
{(tab) => (