import type { InputStatus } from '../Field/types';
import type { BaseProps } from '../BaseProps';
import type { SizeValue } from '../utils/types';
export interface SliderBaseProps extends Omit<BaseProps<HTMLDivElement>, 'onChange'> {
    /** Ref forwarded to the root element */
    ref?: React.Ref<HTMLDivElement>;
    /** Label text for the slider (always rendered for accessibility). */
    label: string;
    /** Whether to visually hide the label (still accessible to screen readers). @default false */
    isLabelHidden?: boolean;
    /** Description text displayed below the label. */
    description?: string;
    /** Whether the slider is disabled. @default false */
    isDisabled?: boolean;
    /**
     * Explains why the slider is disabled. When set together with `isDisabled`,
     * the slider shows a tooltip with this text on hover and keyboard focus, and
     * the thumb stays focusable (via `aria-disabled`) so the reason is
     * discoverable by keyboard and assistive technology. Value changes stay
     * blocked.
     *
     * Use this instead of wrapping a disabled slider in `Tooltip` — disabled
     * controls don't emit the pointer events an external tooltip needs.
     *
     * @example
     * ```
     * <Slider
     *   label="Volume"
     *   value={50}
     *   isDisabled
     *   disabledMessage="Volume is locked while sharing your screen"
     * />
     * ```
     */
    disabledMessage?: string;
    /** Whether the field is optional. @default false */
    isOptional?: boolean;
    /** Whether the field is required. @default false */
    isRequired?: boolean;
    /** Status indicator for the slider. */
    status?: InputStatus;
    /**
     * Width of the field. Numbers are treated as pixels, strings are used as-is
     * (e.g. `'100%'`). Sizes the whole field (label, control, and status) so they
     * stay aligned, unlike setting width via `xstyle`/`className`/`style`.
     */
    width?: SizeValue;
    /** Tooltip text to display in an info icon at the end of the label. */
    labelTooltip?: string;
    /** Minimum value. @default 0 */
    min?: number;
    /** Maximum value. @default 100 */
    max?: number;
    /** Step increment. @default 1 */
    step?: number;
    /** Orientation of the slider. @default "horizontal" */
    orientation?: 'horizontal' | 'vertical';
    /** Custom value formatting function for display and aria-valuetext. */
    formatValue?: (value: number) => string;
    /** How the current value is displayed. @default "tooltip" */
    valueDisplay?: 'tooltip' | 'text' | 'none';
    /** Tick marks at specified positions with optional labels. */
    marks?: {
        value: number;
        label?: string;
    }[];
    /**
     * The HTML name attribute for form submissions. When set, the slider
     * renders hidden inputs carrying the current value (two in range mode,
     * matching how paired native range inputs submit).
     */
    htmlName?: string;
    /** Test ID for the root element. */
    'data-testid'?: string;
}
export interface SliderSingleProps extends SliderBaseProps {
    /** Current value (single thumb mode). */
    value: number;
    /** Callback fired on value change during drag. */
    onChange?: (value: number) => void;
    /** Callback fired when drag ends (on pointer up or keyboard). */
    onChangeEnd?: (value: number) => void;
}
export interface SliderRangeProps extends SliderBaseProps {
    /** Current value (range mode: [min, max]). */
    value: [number, number];
    /** Callback fired on value change during drag. */
    onChange?: (value: [number, number]) => void;
    /** Callback fired when drag ends (on pointer up or keyboard). */
    onChangeEnd?: (value: [number, number]) => void;
    /** Minimum number of steps between thumbs. */
    minStepsBetweenThumbs?: number;
}
export type SliderProps = SliderSingleProps | SliderRangeProps;
/**
 * A slider component for selecting numeric values or ranges.
 *
 * @example
 * ```
 * <Slider label="Volume" value={50} onChange={setValue} />
 * <Slider label="Price range" value={[20, 80]} onChange={setRange} />
 * ```
 */
export declare function Slider({ ref, ...props }: SliderProps): import("react").JSX.Element;
export declare namespace Slider {
    var displayName: string;
}
//# sourceMappingURL=Slider.d.ts.map