Installation
bash
npx axis-cli add tabsUsage
계정 설정을 변경할 수 있습니다.
tsx
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@ax/ui'
export function Example() {
return (
<Tabs defaultValue="account" className="w-[400px]">
<TabsList>
<TabsTrigger value="account">Account</TabsTrigger>
<TabsTrigger value="password">Password</TabsTrigger>
</TabsList>
<TabsContent value="account">
Account settings content here.
</TabsContent>
<TabsContent value="password">
Password settings content here.
</TabsContent>
</Tabs>
)
}Components
Tabs탭 루트 컨테이너
TabsList탭 트리거 목록 컨테이너
TabsTrigger탭 선택 버튼
TabsContent탭 콘텐츠 영역
Props
| Prop | Type | Default | Description |
|---|---|---|---|
defaultValue | string | - | 기본 선택 탭 |
value | string | - | 선택된 탭 (controlled) |
onValueChange | (value: string) => void | - | 탭 변경 콜백 |
orientation | "horizontal" | "vertical" | "horizontal" | 탭 방향 |