Segmented Control

세그먼티드 컨트롤은 서로 배타적인 옵션 중 하나를 선택하는 컴포넌트입니다. 짧은 옵션 그룹에서 현재 선택을 명확히 보여줄 때 적합합니다.

Figma 컴포넌트: Segmented_control

Hug

콘텐츠 너비에 맞춰 좁게 표시되는 기본 형태입니다.

전체 너비를 사용하며 각 세그먼트가 균등하게 채워집니다.

2개부터 8개까지 자유롭게 구성할 수 있습니다. 가독성을 위해 보통 5개 이하를 권장합니다.

sm과 md 두 가지 사이즈를 지원합니다.

Prop	Type	Default	Description
`items`	{ label: string, current?: boolean }[]	`[]`	세그먼트 항목 배열
`size`	'sm' \| 'md'	`'md'`	컨트롤 사이즈
`fullWidth`	boolean	`false`	전체 너비 사용 여부 (Fill 스타일)
`onChange`	(item, index) => void	`-`	세그먼트 클릭 시 호출되는 핸들러