first commit

apps/docs/components/code-example-tabs.tsx

@@ -0,0 +1,26 @@
+'use client';
+
+import type { CodeExample } from '@/lib/code-example';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { CodeBlock } from '@/components/code-block';
+
+export function CodeExampleTabs({ examples }: { examples: CodeExample[] }) {
+  if (examples.length === 0) return null;
+
+  return (
+    <Tabs defaultValue={examples[0].id} className="my-6">
+      <TabsList className="mb-2 flex h-auto max-w-full flex-wrap gap-1">
+        {examples.map((example) => (
+          <TabsTrigger key={example.id} value={example.id} className="text-xs sm:text-sm">
+            {example.label}
+          </TabsTrigger>
+        ))}
+      </TabsList>
+      {examples.map((example) => (
+        <TabsContent key={example.id} value={example.id}>
+          <CodeBlock code={example.code} language={example.language} title={example.label} />
+        </TabsContent>
+      ))}
+    </Tabs>
+  );
+}