export interface UseFloatingLabelOptions {
    /** Current input value. */
    value: string | undefined;
    /** Whether the input is disabled. */
    disabled?: boolean;
    /** Whether the input is read-only. */
    readOnly?: boolean;
}
export interface UseFloatingLabelReturn {
    /** Whether the input is currently focused. */
    isActive: boolean;
    /** Whether the input has a non-empty value. */
    isComplete: boolean;
    /** Event handlers to attach to the input element. */
    handlers: {
        onFocus: () => void;
        onBlur: () => void;
    };
    /**
     * Data attributes to spread on the `.tdds-*__track` element.
     *
     * Produces `data-active`, `data-complete`, and `data-disabled` with
     * `"true"` or `"false"` string values, matching Arrow's CSS targeting.
     */
    trackDataAttributes: Record<string, string>;
}
/**
 * Manages the floating label pattern used by Arrow form input components.
 *
 * Arrow's text field, text area, select, password, credit card, and search
 * components all use a "track" element with three data attributes that drive
 * label floating and state styling:
 *
 * - `data-active="true"` when the input is focused
 * - `data-complete="true"` when the input has a non-empty value
 * - `data-disabled="true"` when the component is disabled
 *
 * @example
 * const { handlers, trackDataAttributes } = useFloatingLabel({
 *   value: inputValue,
 *   disabled: false,
 * });
 *
 * <div className="tdds-text-field__track" {...trackDataAttributes}>
 *   <input onFocus={handlers.onFocus} onBlur={handlers.onBlur} />
 * </div>
 */
export declare function useFloatingLabel({ value, disabled, readOnly, }: UseFloatingLabelOptions): UseFloatingLabelReturn;
//# sourceMappingURL=useFloatingLabel.d.ts.map