reopt design
DocsExploreTemplatesCanvasToolsPricing
Login
opt-uiopt-chartsopt-datagridopt-editoropt-calendaropt-filemanageropt-chatopt-shellbrandapp-ui
Overview205Core74Shells99Blocks32
ContentTabs
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • About
  • Contact
  • Terms of Service
  • Privacy Policy

reopt Inc.Business registration no. 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

ContentTabs

Shell

Switch between content panels with a wrapper around the Tabs primitive.

navdisplay
Related docs
bun add @reopt-ai/opt-ui
Install and import
bash
bun add @reopt-ai/opt-ui
tsx
import { ContentTabs } from "@reopt-ai/opt-ui";

Live preview

Change the width and theme, then interact with the components.

100%

기본 사용

프로젝트 개요 콘텐츠입니다.

기본 선택 탭 설정

설정 탭이 기본 선택됩니다.

ContentTabs

PropTypeDefaultDescription
tabsRequiredTabDef[]—탭 정의 배열. { id, label, content }
defaultTabIdstring—초기 선택 탭 ID. 미지정 시 첫 탭

컴포넌트 의존 관계

깊이
▲ USED BY (3)▼ USES (1)debug-workspacetest-analyticsworkflow-run-historyContentTabstabs
View test results

테스트 커버리지

2026년 7월 9일3/3 통과
3성공
0실패
3전체
  • 탭 레이블을 렌더링한다
  • 첫 번째 탭이 기본 선택된다
  • defaultTabId로 초기 탭을 지정할 수 있다

Blocks that use this component

opt-ui

DebugWorkspace

Blocks

Debug E2E tests with a test-list sidebar and tabs for video, screenshots, network, console, and traces.

opt-ui

TestAnalytics

Blocks

Analyze test quality with summary cards and six tabs covering overview, stability, failures, flaky tests, performance, and advanced metrics.

opt-ui

WorkflowRunHistory

Blocks

Browse workflow runs with search and status filters, a DataTable, and tabbed detail dialogs.

Related components

opt-ui

Tabs

Core

Organize tab panels with Root, TabList, Tab, and TabPanel components.

opt-ui

SidebarNav

Shells

Navigate a sidebar with Composite keyboard support and automatic pathname synchronization.

opt-ui

AppMenubar

Shells

Use a desktop-style menu bar with checkbox and radio menu items.

opt-ui

CommandPalette

Shells

Find commands with a Cmd+K-style palette combining Dialog, Combobox, and fuzzy search.

opt-ui

CommandPaletteTrigger

Shells

Open CommandPalette with an automatically bound Cmd+K shortcut.

opt-ui

ProjectSwitcher

Shells

Search and switch projects with a fuzzy-search combobox.

PreviousPageAsideNextDashboardGrid