import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Canvas } from '@storybook/addon-docs/blocks';
import * as TabsStories from './tabs.stories';

<Meta of={TabsStories} />

<Title />
<Subtitle>A content switcher for logically related views.</Subtitle>

<Description />

<Primary />

---

## Variations

<Stories />

---

## AI Best Practices

> [!IMPORTANT]
> - **Value Matching** — Ensure `TabsTrigger` value matches the corresponding `TabsContent` value.
> - **Spacing** — Add top margin (`mt-4` or `mt-6`) to `TabsContent` to separate it from the triggers.
> - **Correct Component** — Use `Tabs` for in-page view switching. For global site navigation, use `Sidebar` or `NavigationMenu`.