Tabs
A component that organizes content into multiple sections, with a tabbed interface for navigation between these sections.
Loading preview
Usage
import { Tabs } from "@lemonsqueezy/wedges";<Tabs defaultValue="tab-1">
<Tabs.List>
<Tabs.Trigger value="tab-1">Tab 1</Tabs.Trigger>
<Tabs.Trigger value="tab-2">Tab 2</Tabs.Trigger>
</Tabs.List>
<Tabs.Content value="tab-1">Tab 1 content</Tabs.Content>
<Tabs.Content value="tab-2">Tab 2 content</Tabs.Content>
</Tabs>API Reference
Extends the Radix Tabs primitive and includes all of its props.
Accessibility
The Tabs component supports all accessibility features of the Radix Tabs primitive.
Examples
Loading preview
The following example shows a disabled Tabs.Trigger component.
Loading preview
The following examples shows stretched Tabs.Trigger components with custom before and after elements.
Loading preview