Tabs
Use tabs when several variants share the same space, like platform-specific setup or alternative workflows.
Tabs are helpful when the reader should compare several versions of the same content without leaving the page.
Use in MDX
Add a Tabs block and provide one named slot per panel:
<Tabs labels={["First tab", "Second tab", "Third tab"]}>
<div slot="panel-1">First tab content.</div>
<div slot="panel-2">Second tab content.</div>
<div slot="panel-3">Third tab content.</div>
</Tabs>Implementation notes
The component lives in src/components/docs/Tabs.astro. If you want different interaction or styling, update that file and the .docs-tab* rules in src/index.css.
Preview
This content is only visible in the first tab. Use a tab when one page needs a few parallel versions of the same idea.