mui-spfx-controls/lib/components/PeoplePicker/IPeoplePickerProps.d.ts

SPFx component library built with MUI

import { WebPartContext } from '@microsoft/sp-webpart-base';
import { AutocompleteProps, ChipOwnProps, TextFieldProps, TextFieldVariants } from '@mui/material';
import { PrincipalSource, PrincipalType } from '@pnp/sp';
import { IPeoplePickerEntity as IBasePeoplePickerEntity } from '@pnp/sp/profiles';
import { ReactNode } from 'react';
/**
 * Base properties for the Autocomplete component in PeoplePicker.
 */
type AutocompleteBaseProps = AutocompleteProps<IPeoplePickerEntity | IPeoplePickerEntity[], boolean, boolean, true>;
/**
 * Extended People Picker entity that includes an image field.
 */
export interface IPeoplePickerEntity extends IBasePeoplePickerEntity {
    /** Image URL associated with the person */
    Image: string;
}
/**
 * Base properties for the PeoplePicker component.
 */
interface IPeoplePickerBaseProps {
    /** SharePoint WebPart context */
    context: WebPartContext;
    /** Label for the PeoplePicker input */
    label?: string;
    /** Whether multiple people can be selected */
    multiple?: boolean;
    /** Whether the field is required */
    required?: boolean;
    /** Maximum number of suggestions displayed */
    searchSuggestionLimit?: number;
    /** Maximum number of people that can be selected */
    personSelectionLimit?: number;
    /** The source from which people or groups are retrieved */
    principalSource?: PrincipalSource;
    /** Specifies the type of principal (user, security group, distribution list, etc.) to retrieve */
    principalType?: PrincipalType;
    /** Whether the component is in a loading state */
    loading?: boolean;
    /** Whether the PeoplePicker is disabled */
    disabled?: boolean;
    /** Variant of the text field */
    variant?: TextFieldVariants;
    /** Custom render function for the input field */
    renderInput?: AutocompleteBaseProps['renderInput'];
    /** Variant of the selected tag */
    tagVariant?: ChipOwnProps['variant'];
    /** Color of the text field */
    color?: TextFieldProps['color'];
    /** Color of the selected tag */
    tagColor?: ChipOwnProps['color'];
    /** Size of the input field */
    size?: AutocompleteBaseProps['size'];
    /** MUI system styling (sx prop) */
    sx?: AutocompleteBaseProps['sx'];
    /** Name attribute for the input field */
    name?: TextFieldProps['name'];
    /** Whether the input field takes the full width */
    fullWidth?: TextFieldProps['fullWidth'];
    /** Custom loading component */
    LoadingComponent?: ReactNode;
}
/**
 * Properties for the PeoplePicker component.
 * Supports both single and multiple selection modes.
 */
export interface IPeoplePickerProps extends IPeoplePickerBaseProps {
    /** Enables multiple selection */
    multiple?: boolean;
    /** Current selected value(s) */
    value?: IPeoplePickerEntity | IPeoplePickerEntity[];
    /** Default selected value(s) */
    defaultValue?: IPeoplePickerEntity | IPeoplePickerEntity[];
    /** Callback function triggered when selection changes */
    onChange?: (value: IPeoplePickerEntity | IPeoplePickerEntity[]) => void;
}
export {};
//# sourceMappingURL=IPeoplePickerProps.d.ts.map