import * as React from 'react';
import { type ComponentsOverrides } from '@mui/material/styles';
import { type CheckboxProps, type FormControlProps } from '@mui/material';
import { type ChoicesProps } from 'ra-core';
import type { CommonInputProps } from './CommonInputProps';
/**
 * An Input component for a checkbox group, using an array of objects for the options
 *
 * Pass possible options as an array of objects in the 'choices' attribute.
 *
 * The expected input must be an array of identifiers (e.g. [12, 31]) which correspond to
 * the 'optionValue' of 'choices' attribute objects.
 *
 * By default, the options are built from:
 *  - the 'id' property as the option value,
 *  - the 'name' property as the option text
 * @example
 * const choices = [
 *     { id: 12, name: 'Ray Hakt' },
 *     { id: 31, name: 'Ann Gullar' },
 *     { id: 42, name: 'Sean Phonee' },
 * ];
 * <CheckboxGroupInput source="recipients" choices={choices} />
 *
 * You can also customize the properties to use for the option name and value,
 * thanks to the 'optionText' and 'optionValue' attributes.
 * @example
 * const choices = [
 *    { _id: 123, full_name: 'Leo Tolstoi' },
 *    { _id: 456, full_name: 'Jane Austen' },
 * ];
 * <CheckboxGroupInput source="recipients" choices={choices} optionText="full_name" optionValue="_id" />
 *
 * `optionText` also accepts a function, so you can shape the option text at will:
 * @example
 * const choices = [
 *    { id: 123, first_name: 'Leo', last_name: 'Tolstoi' },
 *    { id: 456, first_name: 'Jane', last_name: 'Austen' },
 * ];
 * const optionRenderer = choice => `${choice.first_name} ${choice.last_name}`;
 * <CheckboxGroupInput source="recipients" choices={choices} optionText={optionRenderer} />
 *
 * `optionText` also accepts a React Element, that can access
 * the related choice through the `useRecordContext` hook. You can use Field components there.
 * @example
 * const choices = [
 *    { id: 123, first_name: 'Leo', last_name: 'Tolstoi' },
 *    { id: 456, first_name: 'Jane', last_name: 'Austen' },
 * ];
 * const FullNameField = () => {
 *     const record = useRecordContext();
 *     return <span>{record.first_name} {record.last_name}</span>;
 * };
 *
 * <CheckboxGroupInput source="recipients" choices={choices} optionText={<FullNameField />}/>
 *
 * The choices are translated by default, so you can use translation identifiers as choices:
 * @example
 * const choices = [
 *    { id: 'programming', name: 'myroot.category.programming' },
 *    { id: 'lifestyle', name: 'myroot.category.lifestyle' },
 *    { id: 'photography', name: 'myroot.category.photography' },
 * ];
 *
 * However, in some cases (e.g. inside a `<ReferenceArrayInput>`), you may not want
 * the choice to be translated. In that case, set the `translateChoice` prop to false.
 * @example
 * <CheckboxGroupInput source="tags" choices={choices} translateChoice={false}/>
 *
 * The object passed as `options` props is passed to the Material UI <Checkbox> components
 */
export declare const CheckboxGroupInput: (inProps: CheckboxGroupInputProps) => React.JSX.Element;
export type CheckboxGroupInputProps = Omit<CommonInputProps, 'source'> & ChoicesProps & CheckboxProps & FormControlProps & {
    options?: CheckboxProps;
    row?: boolean;
    source?: string;
    labelPlacement?: 'bottom' | 'end' | 'start' | 'top';
};
export declare const CheckboxGroupInputClasses: {
    label: string;
    helperText: string;
};
declare module '@mui/material/styles' {
    interface ComponentNameToClassKey {
        RaCheckboxGroupInput: 'root' | 'label' | 'helperText';
    }
    interface ComponentsPropsList {
        RaCheckboxGroupInput: Partial<CheckboxGroupInputProps>;
    }
    interface Components {
        RaCheckboxGroupInput?: {
            defaultProps?: ComponentsPropsList['RaCheckboxGroupInput'];
            styleOverrides?: ComponentsOverrides<Omit<Theme, 'components'>>['RaCheckboxGroupInput'];
        };
    }
}
//# sourceMappingURL=CheckboxGroupInput.d.ts.map