Design Docs
TabBottomBorder탭 하단에 표시되는 이동 가능한 보더 인디케이터 컴포넌트입니다.
Basic Tab with Border하단 보더가 있는 탭
선택된 탭: 홈
Custom Border Style커스텀 보더 스타일
선택된 탭: 홈
Props
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| selectedIndex | number | 0 | Yes | 현재 선택된 탭의 인덱스 |
| tabContainerRef | string | Yes | 탭 컨테이너의 ref (탭 아이템들의 부모 요소) | |
| borderCustomStyle | string | undefined | - | 보더 커스텀 스타일 |
Sub Components• tabContainerRef - tabContainerRef는 탭 버튼들의 부모 요소를 가리켜야 합니다.• Position - 탭 컨테이너는 position: relative가 필요합니다.• Animation - 보더는 선택된 탭의 너비와 위치에 자동으로 애니메이션됩니다.• Customization - borderCustomStyle로 보더의 색상, 두께, 스타일을 커스터마이징할 수 있습니다.