import type { ComponentType } from 'react';
import React from 'react';
import type { GroupBase, OptionProps, OptionsOrGroups, Props as ReactSelectProps } from 'react-select';
interface SelectboxOption {
    label: string;
    value: string;
}
declare module 'react-select/dist/declarations/src/Select' {
    interface Props<Option extends SelectboxOption = SelectboxOption, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> {
        errorState?: boolean;
    }
}
interface Props<Option extends SelectboxOption = SelectboxOption, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> {
    /**
     * Unique ID for the select element
     */
    inputId: ReactSelectProps['inputId'];
    /**
     * Array of options that populate the select menu
     */
    options: OptionsOrGroups<Option, Group>;
    /**
     * Default value of select menu
     *
     * @default undefined
     */
    value?: ReactSelectProps<Option>['value'];
    /**
     * Text of the select element label
     */
    label?: string;
    /**
     * Text of placeholder for the select value
     */
    placeholder?: ReactSelectProps['placeholder'];
    /**
     * Text to display when there are no options
     */
    noOptionsText?: string;
    /**
     * On select change callback
     */
    onChange: ReactSelectProps<Option, IsMulti>['onChange'];
    /**
     * On input change callback
     */
    onInputChange?: ReactSelectProps['onInputChange'];
    /**
     * Allows to attach selectbox options menu to specific HTML element
     * Useful when used in modals
     *
     * @default selectbox-container
     */
    menuPortalTarget?: ReactSelectProps['menuPortalTarget'];
    /**
     * Allows to place selectbox options menu above or below the selectbox control
     *
     * @param {MenuPlacement} top Opens options menu above the control
     * @param {MenuPlacement} bottom Opens options menu below the control
     *
     * @default 'auto'
     */
    menuPlacement?: ReactSelectProps['menuPlacement'];
    /**
     * Displays loading indicator (PixelLoader) instead of selectbox
     *
     * @default false
     */
    isLoading?: boolean;
    /**
     * Allows to enable search functionality
     *
     * @default false
     */
    isSearchable?: boolean;
    /**
     * Allows to clear selected value
     *
     * @default false
     */
    isClearable?: boolean;
    /**
     * Allows to select multiple options
     *
     * @default false
     */
    isMulti?: IsMulti;
    /**
     * Allows to disable the component functionality
     *
     * @default false
     */
    isDisabled?: boolean;
    /**
     * Allows to set selectbox as mandatory
     *
     * @default false
     */
    isRequired?: boolean;
    /**
     * Allows to set selectbox to error state
     *
     * @default false
     */
    error?: boolean;
    /**
     * Text of the error message when selectbox is in error state
     */
    errorMessage?: string;
    /**
     * Allows to pass a custom className
     */
    className?: string;
    /**
     * Allows to pass testid string for testing purposes
     */
    'data-testid'?: string;
    /**
     * Screen reader label describing the purpose of the SelectBox,
     */
    ariaLabel?: string;
    /**
     * Allows to pass a screen reader label for the loading indicator
     */
    loadingLabel?: string;
    /**
     * Allows to pass custom styles
     */
    styles?: ReactSelectProps<Option, IsMulti, Group>['styles'];
    /**
     * Allows to pass custom option component
     */
    optionComponent?: ComponentType<OptionProps<Option, IsMulti, Group>>;
}
declare const SelectBox: <Option extends SelectboxOption = SelectboxOption, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ noOptionsText, "data-testid": dataTestId, ...props }: Props<Option, IsMulti, Group>) => React.JSX.Element;
export default SelectBox;