Components

Tabs

Switch between mutually exclusive views without leaving the page.

Project overview content.

Usage

import { Tabs } from '@onersoft/design-system'

<Tabs.Root defaultValue="overview">
  <Tabs.List aria-label="Sections">
    <Tabs.Trigger value="overview">Overview</Tabs.Trigger>
    <Tabs.Trigger value="settings">Settings</Tabs.Trigger>
  </Tabs.List>
  <Tabs.Content value="overview">…</Tabs.Content>
  <Tabs.Content value="settings">…</Tabs.Content>
</Tabs.Root>

Parts

Root, List, Trigger, Content. Mirrors Radix Tabs. Root accepts defaultValue, value, onValueChange, orientation.

Switch

A binary on/off toggle for settings that take effect immediately.

Textarea

A multi-line text input. Defaults to vertical resize only.

On this page

UsageParts