@payfit/unity-components/dist/esm/components/checkbox/Checkbox.d.ts

import { ReactNode } from 'react';
import { CheckboxFieldProps as AriaCheckboxFieldProps } from 'react-aria-components/Checkbox';
export interface CheckboxProps extends Omit<AriaCheckboxFieldProps, 'className'> {
    /**
     * The content to display as the checkbox label.
     * This is required for accessibility.
     */
    children: ReactNode;
    /**
     * Additional text displayed below the checkbox to provide context or guidance.
     * Can contain rich content like links or formatted text.
     */
    helperText?: ReactNode;
    /**
     * Error message displayed when the checkbox is in an invalid state.
     * Only shown when `isInvalid` is true.
     */
    feedbackText?: ReactNode;
    /**
     * Controls how the required state is displayed.
     * - 'required': Shows an asterisk (*) when isRequired is true
     * - 'optional': Shows "(optional)" text when isRequired is false
     * @default 'required'
     */
    requiredVariant?: 'required' | 'optional';
    /**
     * Whether the checkbox is disabled.
     * When true, the checkbox cannot be interacted with and appears dimmed.
     * @default false
     */
    isDisabled?: boolean;
    /**
     * Whether the checkbox is in a read-only state.
     * When true, the checkbox cannot be modified but maintains normal appearance and can be focused.
     * @default false
     */
    isReadOnly?: boolean;
    /**
     * Whether the checkbox is in an invalid state.
     * Use this for form validation feedback.
     * @default false
     */
    isInvalid?: boolean;
    /**
     * Whether the checkbox is required.
     * This affects form validation and the display of required/optional indicators.
     * @default false
     */
    isRequired?: boolean;
    /**
     * Whether the checkbox is selected (controlled).
     * Use this with `onChange` for controlled checkbox state.
     */
    isSelected?: boolean;
    /**
     * The default selected state (uncontrolled).
     * Use this when you don't need to control the checkbox state.
     * @default false
     */
    defaultSelected?: boolean;
    /**
     * Whether the checkbox is in an indeterminate state.
     * Useful for parent checkboxes in a tree structure.
     * @default false
     */
    isIndeterminate?: boolean;
    /**
     * Handler called when the checkbox's selected state changes.
     * @param isSelected The new selected state
     */
    onChange?: (isSelected: boolean) => void;
    /**
     * Handler called when the checkbox receives focus.
     */
    onFocus?: () => void;
    /**
     * Handler called when the checkbox loses focus.
     */
    onBlur?: () => void;
    /**
     * The name of the checkbox when used in a form.
     */
    name?: string;
    /**
     * The value of the checkbox when used in a form.
     */
    value?: string;
}
/**
 * The `Checkbox` component is an accessible form control that allows users to select multiple options from a set.
 * It follows WAI-ARIA checkbox patterns and is built on top of React Aria Components.
 * @param {CheckboxProps} props - The props for the `Checkbox` component
 * @example
 * ```tsx
 * import { Checkbox } from '@payfit/unity-components'
 *
 * <Checkbox>Accept terms and conditions</Checkbox>
 * ```
 * @see {@link CheckboxProps} for all available props
 */
declare const Checkbox: import('react').ForwardRefExoticComponent<CheckboxProps & import('react').RefAttributes<HTMLLabelElement>>;
export { Checkbox };