import React from 'react';
import type { ComboboxOption } from './Combobox.js';
export type MultiSelectSize = 'sm' | 'md' | 'lg';
/** The same shape as Combobox's option, so a list moves between the two. */
export type MultiSelectOption = ComboboxOption;
export interface MultiSelectProps {
    /** The full option list. Filtering happens here, against what is typed. */
    options: readonly MultiSelectOption[];
    /** Field label. Required for a usable control — see `a11y.requires`. */
    label?: React.ReactNode;
    /** Names the field, and its tags, when there is no visible `label`. */
    'aria-label'?: string;
    /** Helper text below the field. */
    description?: React.ReactNode;
    /** Replaces the helper text when `isInvalid` is set. */
    errorMessage?: React.ReactNode;
    isInvalid?: boolean;
    isDisabled?: boolean;
    isReadOnly?: boolean;
    /** At least one value must be chosen. */
    isRequired?: boolean;
    /** Matches Input's `Size` variant: Small, Medium, Large. */
    size?: MultiSelectSize;
    placeholder?: string;
    /** The selected values (controlled), in the order they were chosen. */
    value?: readonly string[];
    /** The initially selected values (uncontrolled). */
    defaultValue?: readonly string[];
    /** Receives the whole new selection. */
    onChange?: (value: string[]) => void;
    /** Controlled filter text. Usually only needed for remote filtering. */
    inputValue?: string;
    onInputChange?: (value: string) => void;
    /**
     * Leave the tags out, when the chosen values are already on screen as
     * removable tags — a table's active-filters row. The values are still read
     * with the field, and still marked in the list.
     */
    hideTags?: boolean;
    /** Shown in place of the list when nothing matches. */
    emptyLabel?: React.ReactNode;
    /** Accessible label for the disclosure button. */
    buttonLabel?: string;
    /** Posts every selected value under this name, for an uncontrolled form. */
    name?: string;
    /** Class names for the field box (`.ion-input`). */
    className?: string;
    /** Class names for the `.ion-field` wrapper. */
    wrapperClassName?: string;
    id?: string;
}
/**
 * MultiSelect — a text field that filters a list, with any number of selected
 * values shown as removable tags beneath it.
 *
 * WHY IT IS ITS OWN COMPONENT, NOT `Combobox selectionMode="multiple"`
 *
 * The two differ in what the field holds. Combobox's input shows the chosen
 * label — typing edits the value. Here the input only ever holds the filter
 * text, the value lives in the tags, and choosing an option leaves the list
 * open for the next one. One prop switching the meaning of the text in the
 * box is the kind of contract agents get wrong in generated code.
 *
 * WHAT REACT ARIA GIVES IT
 *
 * `useComboBoxState` and `useComboBox` in `selectionMode: 'multiple'`: the
 * listbox is `aria-multiselectable`, Enter and click toggle an option without
 * closing the list, the filter text clears after each pick, and native
 * `required` is set only while nothing is chosen — "at least one", the same
 * rule CheckboxGroup enforces.
 *
 * WHAT IT ADDS
 *
 *   - The tags. A TagGroup under the field, named by the field's label, one
 *     tab stop, Delete or the × to remove. The selection must be visible with
 *     the list closed, and "3 selected" hides which three.
 *   - The value is announced with the field. React Aria points the input's
 *     `aria-describedby` at a value element; this fills it with the chosen
 *     labels joined by `Intl.ListFormat`, so "Billing, Legal and Ops" is read
 *     in the user's language with no string shipped for it.
 *   - Backspace in an empty field removes the last value, which is what
 *     every tag input on the web has taught people to expect.
 *   - Focus lands back in the field when the last tag is removed, instead of
 *     falling to <body> with the TagGroup that held it.
 */
export declare function MultiSelect({ options, label, 'aria-label': ariaLabel, description, errorMessage, isInvalid, isDisabled, isReadOnly, isRequired, size, placeholder, value, defaultValue, onChange, inputValue, onInputChange, hideTags, emptyLabel, buttonLabel, name, className, wrapperClassName, id, }: MultiSelectProps): React.JSX.Element;
export declare namespace MultiSelect {
    var displayName: string;
}
//# sourceMappingURL=MultiSelect.d.ts.map