import { PassThroughProps, Size } from '../../../../types'; import { ReactElement, RefObject, MouseEvent } from 'react'; import { MultiSelectFieldChipProps, MultiSelectFieldOption } from '../types'; /** * Props for the MultiSelectFieldInput component * @property {string} [placeholder] - Placeholder text displayed when input is empty * @property {Extract} [size] - Size variant of the input * @property {boolean} [disableClearButton] - Hides the clear button when true * @property {boolean} [disableToggleButton] - Hides the toggle button when true * @property {boolean} [disabled] - Disables the input entirely * @property {boolean} [readOnly] - Cannot be modified but remains interactive * @property {boolean} [error] - Shows error styling on the input when true * @property {() => void} [onClear] - Callback fired when the clear button is clicked * @property {string} [id] - HTML id attribute for the input element * @property {RefObject} [inputWrapperRef] - Ref for the input wrapper div element * @property {PassThroughProps<"div">} [htmlInputWrapperProps] - Additional props passed to the wrapper div * @property {PassThroughProps<"input">} [inputProps] - Additional props passed to the input element * @property {PassThroughProps<"button">} [toggleButtonProps] - Additional props passed to the toggle button * @property {string | ReactElement} [prefix] - Content to display before the input * @property {string | ReactElement} [suffix] - Content to display after the input * @property {MultiSelectFieldOption[]} [selectedOptions] - Array of selected options to display as chips * @property {(option: MultiSelectFieldOption) => void} [onRemoveOption] - Callback when a chip is removed * @property {boolean} [singleRow] - When true, restricts the field to a single row height * @property {number} [maxChips] - Maximum number of chips to display before showing +N indicator (default: 10) */ export type MultiSelectFieldInputProps = { placeholder?: string; size?: Extract; disableClearButton?: boolean; disableToggleButton?: boolean; disabled?: boolean; readOnly?: boolean; error?: boolean; onClear?: () => void; id?: string; inputWrapperRef?: RefObject; htmlInputWrapperProps?: PassThroughProps<"div">; inputProps?: PassThroughProps<"input">; toggleButtonProps?: PassThroughProps<"button">; prefix?: string | ReactElement; suffix?: string | ReactElement; selectedOptions?: MultiSelectFieldOption[]; onRemoveOption?: (option: MultiSelectFieldOption) => void; singleRow?: boolean; maxChips?: number; getChipProps?: (option: MultiSelectFieldOption) => MultiSelectFieldChipProps; onWrapperClick?: (e: MouseEvent) => void; }; /** * Internal input component for the MultiSelectField that provides the text input, * chip display for selected options, and action buttons. * * Features: * - Text input for filtering options * - Chip display for selected options with remove functionality * - Optional clear button for removing all selections * - Optional toggle button for opening/closing the dropdown menu * - Supports multiple size variants (small, medium, large) * - Fully accessible with proper ARIA labels on buttons * - Supports pass-through props for customization of internal elements * - Optional prefix and suffix content * - Error state styling * - Single row mode with singleRow prop * - Chip count limiting with maxChips prop * * @example * handleRemove(option)} * onClear={() => handleClearAll()} * /> */ export declare const MultiSelectFieldInput: { ({ placeholder, size, disableClearButton, disableToggleButton, disabled, readOnly, error, onClear, id, inputWrapperRef, htmlInputWrapperProps, inputProps, toggleButtonProps, prefix, suffix, selectedOptions, onRemoveOption, singleRow, maxChips, getChipProps, onWrapperClick, }: MultiSelectFieldInputProps): import("react/jsx-runtime").JSX.Element; displayName: string; };