UITabs

Preview

Uncontrolled

OverviewDetailsSettings

Overview content goes here.

With right actions

CodePreview

Copy

Source code view.

Props

Prop	Type	Default	Description
tabs	Array<{ value: string; label: string; content: ReactNode }>	required	Tab definitions
value	string	—	Controlled active tab
initialValue	string	first tab	Initial tab for uncontrolled mode
onChange	(value: string) => void	—	Called when tab changes
rightActions	ReactNode	—	Content rendered to the right of the tab list

Usage

import { UITabs } from "tango-api";

<UITabs
  tabs={[
    { value: "code", label: "Code", content: <CodeView /> },
    { value: "diff", label: "Diff", content: <DiffView /> },
  ]}
  value={activeTab}
  onChange={setActiveTab}
/>