import * as React from 'react';
export type SegmentedControlSize = 'medium' | 'small';
export type SegmentedControlWidthMode = 'flexible' | 'fixed' | 'auto';
export interface SegmentItem {
    /** 세그먼트의 고유 값 */
    value: string;
    /** 표시될 레이블 */
    label: string;
    /** 레이블 옆에 표시될 숫자 (optional) */
    number?: number;
    /** 비활성화 여부 */
    disabled?: boolean;
}
/**
 * SegmentedControl 컴포넌트
 *
 * 여러 옵션 중 하나를 선택할 수 있는 컴팩트한 UI 컴포넌트입니다.
 * 각 옵션은 버튼처럼 작동하며, 선택한 옵션이 강조 표시됩니다.
 *
 * ## 키보드 네비게이션
 * - Automatic Activation 패턴 사용 (화살표 키로 이동 시 바로 선택됨)
 * - Radio Group, macOS SegmentedControl과 동일한 UX
 * - 지원 키: ArrowLeft/Right, ArrowUp/Down, Home, End
 *
 * ## widthMode 사용 가이드
 *
 * ### flexible (기본값)
 * - 부모 컨테이너 너비의 100%를 차지하고, 세그먼트를 N등분
 * - 긴 텍스트는 말줄임(...)으로 처리
 * - 사용 예: 고정된 너비의 컨테이너 안에서 균등한 탭을 원할 때
 *
 * ### fixed
 * - 각 세그먼트가 segmentWidth 픽셀로 고정
 * - 전체 너비 = N개 × segmentWidth + padding(4px)
 * - 사용 예: 탭 개수/내용 상관없이 일정한 모양 원할 때, 숫자 뱃지가 있을 때
 *
 * ### auto
 * - 각 세그먼트가 자신의 텍스트 길이에 맞게 개별 너비 결정
 * - 짧은 텍스트는 좁게, 긴 텍스트는 넓게
 * - 사용 예: 텍스트 길이가 제각각이고 모두 보여줘야 할 때
 *
 * @example
 * ```tsx
 * // flexible: 400px 컨테이너에서 3등분
 * <div style={{ width: 400 }}>
 *   <SegmentedControl items={items} widthMode="flexible" />
 * </div>
 *
 * // fixed: 각 세그먼트 100px
 * <SegmentedControl items={items} widthMode="fixed" segmentWidth={100} />
 *
 * // auto: 텍스트 길이에 맞게
 * <SegmentedControl items={items} widthMode="auto" />
 * ```
 */
export interface SegmentedControlProps {
    /** 세그먼트 아이템 목록 */
    items: SegmentItem[];
    /** 현재 선택된 값 */
    value: string;
    /** 값 변경 핸들러 */
    onChange: (value: string) => void;
    /**
     * 컴포넌트 크기 (높이, 패딩, 폰트 결정)
     * - medium: 높이 36px, label-14-sb
     * - small: 높이 28px, label-13-sb
     * @default 'medium'
     */
    size?: SegmentedControlSize;
    /**
     * 너비 모드 (가로 너비 결정 방식)
     * - flexible: 부모 너비 100%, N등분, 긴 텍스트 truncate
     * - fixed: 각 세그먼트 segmentWidth px 고정
     * - auto: 각 세그먼트 텍스트 길이에 맞게 개별 너비
     * @default 'flexible'
     */
    widthMode?: SegmentedControlWidthMode;
    /**
     * widthMode='fixed'일 때 각 세그먼트의 고정 너비 (px)
     * @default 60
     */
    segmentWidth?: number;
    /** 추가 클래스명 */
    className?: string;
    /** 접근성을 위한 aria-label */
    'aria-label'?: string;
}
declare const SegmentedControl: {
    ({ items, value, onChange, size, widthMode, segmentWidth, className, "aria-label": ariaLabel, }: SegmentedControlProps): React.JSX.Element;
    displayName: string;
};
export { SegmentedControl };
//# sourceMappingURL=SegmentedControl.d.ts.map