import { type CSSProperties, type HTMLAttributes, type InputHTMLAttributes, type LabelHTMLAttributes, type ReactNode } from "react";
import { type PropsWithRef } from "../types.js";
import { type InputToggleSize } from "./inputToggleStyles.js";
import { type FormComponentStates, type FormMessageContainerExtension } from "./types.js";
/**
 * @remarks \@since 6.0.0
 */
export interface InputToggleIconProps {
    /**
     * @see {@link InputToggleSize}
     * @defaultValue `"normal"`
     */
    size?: InputToggleSize;
    /**
     * The icon to use while unchecked. This defaults to the unchecked
     * checkbox/radio icon from the `ICON_CONFIG`.
     *
     * @defaultValue `getIcon(props.type)`
     */
    icon?: ReactNode;
    /**
     * The icon to use while unchecked. This defaults to the unchecked
     * checkbox/radio icon from the `ICON_CONFIG`.
     *
     * @defaultValue `getIcon(``${props.type}Checked``)`
     */
    checkedIcon?: ReactNode;
    /**
     * Any props that should be passed to the `<span>` that surrounds the current
     * icon element.
     */
    iconProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;
    /**
     * Optional style to set on the `<span>` that surrounds the current icon
     * element.
     */
    iconStyle?: CSSProperties;
    /**
     * Optional className to set on the `<span>` that surrounds the current icon
     * element.
     */
    iconClassName?: string;
}
/**
 * @remarks \@since 6.0.0
 */
export interface InputToggleLabelProps {
    /**
     * An optional label to display with the checkbox. If this is omitted, it is
     * recommended to provide an `aria-label` for accessibility.
     */
    label?: ReactNode;
    /**
     * Any props that should be passed to the `<Label>` component.
     *
     * Note: If `style` or `className` are provided in this object, they will be
     * ignored. Use the top-level `style` and `className` props instead.
     *
     * @example
     * ```
     *  // bad
     * labelProps={{
     *   "aria-label": "checkbox",
     *   style: { color: "red" },
     *   className: "custom"
     * }}
     *
     * // good
     * style={{ color: "red" }}
     * className="custom"
     * labelProps={{
     *   "aria-label": "checkbox",
     * }}
     * ```
     */
    labelProps?: PropsWithRef<LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>;
    /**
     * @see {@link LabelClassNameOptions.gap}
     * @defaultValue `false`
     */
    disableLabelGap?: boolean;
    /**
     * Set this to `true` to swap the position of the {@link label} and the current
     * icon. This prop can be used with the {@link stacked} prop to change the
     * position if the icon and label:
     *
     * ____________________________________
     * | stacked | iconAfter | position   |
     * ____________________________________
     * |         |           | icon label |
     * ____________________________________
     * |         | X         | label icon |
     * ____________________________________
     * | X       |           | icon       |
     * |         |           | label      |
     * ____________________________________
     * | X       | X         | label      |
     * |         |           | icon       |
     * ____________________________________
     *
     *
     * @defaultValue `false`
     */
    iconAfter?: boolean;
    /**
     * Set this to `true` if the label should be stacked instead of inline with
     * the current icon.
     *
     * @see {@link iconAfter}
     * @defaultValue `false`
     */
    stacked?: boolean;
}
/**
 * @remarks \@since 6.0.0
 */
export interface BaseInputToggleProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size">, FormMessageContainerExtension, FormComponentStates, InputToggleIconProps, InputToggleLabelProps {
    /**
     * @see https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing
     * @defaultValue `type === "checkbox" ? "off" : undefined`
     */
    autoComplete?: string;
}
/**
 * @remarks
 * \@since 2.8.5
 * \@since 6.0.0 Removed the `aria-controls` prop and added the
 * `indeterminateIcon` prop.
 */
export interface IndeterminateCheckboxProps {
    /**
     * Set this value to `true` if the checkbox is in an "indeterminate" state:
     *
     * - this checkbox controls the select all/select none behavior of other
     *   checkboxes in a group
     * - at least one of the checkboxes have been checked
     *   - the `checked` prop for this Checkbox should also be `true`
     *
     * You should normally use the `useCheckboxGroup` hook to handle this
     * behavior.
     *
     * @defaultValue `false`
     */
    indeterminate?: boolean;
    /**
     * The icon to display when the checkbox is checked and the
     * {@link indeterminate} prop is `true`.
     *
     * @defaultValue `getIcon("checkboxIndeterminate")`
     * @remarks \@since 6.0.0
     */
    indeterminateIcon?: ReactNode;
}
export interface CheckboxProps extends BaseInputToggleProps, IndeterminateCheckboxProps {
}
/** @remarks \@since 6.0.0 */
export interface CheckboxInputToggleProps extends CheckboxProps {
    type: "checkbox";
}
export interface RadioProps extends BaseInputToggleProps {
    /**
     * The value for the radio button.
     *
     * @remarks \@since 6.0.0 This is now optional and no longer supports
     * `string[]` since there isn't much of a use case for array values.
     */
    value?: string | number;
}
/** @remarks \@since 6.0.0 */
export interface RadioInputToggleProps extends RadioProps {
    type: "radio";
}
/**
 * @remarks \@since 6.0.0 Updated to be a union between
 * `CheckboxInputToggleProps` and `RadioInputToggleProps`
 */
export type InputToggleProps = CheckboxInputToggleProps | RadioInputToggleProps;
/**
 * **Client Component**
 *
 * @remarks \@since 6.0.0 Now supports the `FormMessage` behavior and requires
 * different icons for each checked state.
 */
export declare const InputToggle: import("react").ForwardRefExoticComponent<InputToggleProps & import("react").RefAttributes<HTMLInputElement>>;
