/**
 * @file SegmentedControl.tsx
 * @input Uses React, StyleX, SegmentedControlContext, useListFocus, useKeyboardHint
 * @output Exports SegmentedControl component and SegmentedControlProps type
 * @position Container wrapper; provides context to SegmentedControlItem children
 *
 * SYNC: When modified, update:
 * - /packages/core/src/SegmentedControl/SegmentedControl.doc.mjs
 * - /packages/core/src/SegmentedControl/index.ts
 * - /packages/core/src/SegmentedControl/SegmentedControl.test.tsx
 * - /packages/cli/assets/templates/blocks/components/SegmentedControl/ (showcase blocks)
 */
import React, { type ReactNode } from 'react';
import type { SegmentedControlSize, SegmentedControlLayout } from './SegmentedControlContext';
import type { BaseProps } from '../BaseProps';
export interface SegmentedControlProps extends Omit<BaseProps<HTMLDivElement>, 'onChange'> {
    ref?: React.Ref<HTMLDivElement>;
    /**
     * The currently selected value (controlled).
     */
    value: string;
    /**
     * Callback fired when a segment is selected.
     */
    onChange: (value: string) => void;
    /**
     * Accessible label for the radio group (used as aria-label, never rendered visually).
     */
    label: string;
    /**
     * Size variant for the control.
     * @default 'md'
     */
    size?: SegmentedControlSize;
    /**
     * Layout mode for segment sizing.
     * - `'hug'` (default): each segment hugs its content width.
     * - `'fill'`: segments stretch equally to fill the container width.
     * @default 'hug'
     */
    layout?: SegmentedControlLayout;
    /**
     * Whether the entire control is disabled.
     * @default false
     */
    isDisabled?: boolean;
    /**
     * Explains why the control is disabled. Applies to the whole-group disabled
     * state (`isDisabled`), not individual segments. When set together with
     * `isDisabled`, the control shows a tooltip with this text on hover and
     * keyboard focus, and stays focusable (via `aria-disabled`) so the reason is
     * discoverable by keyboard and assistive technology. Selection stays blocked.
     *
     * Use this instead of wrapping a disabled control in `Tooltip` — disabled
     * controls don't emit the pointer events an external tooltip needs.
     */
    disabledMessage?: string;
    /**
     * SegmentedControlItem children.
     */
    children: ReactNode;
}
/**
 * Segmented button group for single selection (radio group semantics).
 * Visually resembles a tab bar but controls a value, not a view.
 *
 * @example
 * ```
 * <SegmentedControl value={view} onChange={setView} label="View mode">
 *   <SegmentedControlItem value="grid" label="Grid" />
 *   <SegmentedControlItem value="list" label="List" />
 *   <SegmentedControlItem value="table" label="Table" />
 * </SegmentedControl>
 * ```
 */
export declare function SegmentedControl({ ref, value, onChange, label, size: sizeProp, layout, isDisabled, disabledMessage, children, xstyle, className, style, onKeyDown: onKeyDownProp, onFocus: onFocusProp, onBlur: onBlurProp, ...rest }: SegmentedControlProps): React.JSX.Element;
export declare namespace SegmentedControl {
    var displayName: string;
}
//# sourceMappingURL=SegmentedControl.d.ts.map