/**
 * Combobox — a text field that filters a list of options as you type.
 *
 * The difference from Select is where the typing happens, and it is not a
 * detail: a Select is a button that opens a list, and its optional filter lives
 * *inside* the list once it is open. A Combobox is the field itself. You are
 * already typing when the options appear, which is what you want when the value
 * is something you know the name of — a city, a repository, a tag — rather than
 * something you expect to recognise by scrolling.
 *
 * ```tsx
 * <Combobox value={framework} onValueChange={setFramework}>
 *   <Combobox.Item value="expo" label="Expo" />
 *   <Combobox.Item value="next" label="Next.js" />
 * </Combobox>
 * ```
 *
 * ## Two presentations, and why there is no sheet
 *
 * `overlay` (default) floats the list above the page through a portal, anchored
 * under the field and flipped above it when the keyboard leaves no room below.
 * `inline` expands the list in normal layout flow instead, which is right in a
 * form where nothing should be covered.
 *
 * There is deliberately no sheet presentation. A sheet takes the bottom of the
 * screen, which is exactly where the keyboard is, and the field you are typing
 * into would end up behind one or the other. Select can offer a sheet because
 * its trigger stops mattering once the list is open; a Combobox's never does.
 *
 * ## Filtering is yours to turn off
 *
 * Filtering happens here by default, matching case-insensitively on any part of
 * an option's label. That is the whole feature for a list you already have in
 * hand. When the options come from a server that is doing the matching itself,
 * pass `filter={false}` and render whatever came back — the field stops second-
 * guessing results it cannot see the query behind.
 *
 * ## Values it does not know about
 *
 * `allowCustomValue` lets the typed text become the value when it matches no
 * option, which is how a tag field works: the list is a set of suggestions
 * rather than the set of legal answers.
 */
import { type ReactNode } from 'react';
import { type ViewProps } from 'react-native';
export type ComboboxPresentation = 'overlay' | 'inline';
/** Which selection shape a `mode` produces. */
export type ComboboxMode = 'single' | 'multiple';
export interface ComboboxSelection {
    single: string | undefined;
    multiple: string[];
}
export interface ComboboxItemProps {
    value: string;
    label: string;
    /**
     * Shows the option but refuses it. Kept in the list rather than dropped from
     * it, because an option that vanishes reads as one that never existed.
     */
    disabled?: boolean;
    /** Anything to draw before the label — an avatar, a flag, a status dot. */
    start?: ReactNode;
    /** A second line under the label, for what the label alone cannot say. */
    description?: string;
}
/** Declarative option. Rendered inside whichever surface is presenting. */
declare function ComboboxItem({ value, label, disabled, start, description, }: ComboboxItemProps): import("react").JSX.Element;
declare namespace ComboboxItem {
    var displayName: string;
}
export interface ComboboxGroupProps {
    /**
     * Heading over the run of options. Announced as a header, so a screen reader
     * reaching the group is told what it is before walking into it.
     */
    label?: string;
    /** Extra classes for the group wrapper. */
    className?: string;
    /** Extra classes for the heading. */
    labelClassName?: string;
    children: ReactNode;
}
/**
 * A titled run of options.
 *
 * Presentational only: a grouped Combobox reports the same values a flat one
 * would, and `Combobox.Item` needs to know nothing about being inside one.
 */
declare function ComboboxGroup({ label, className, labelClassName, children, }: ComboboxGroupProps): import("react").JSX.Element;
declare namespace ComboboxGroup {
    var displayName: string;
}
export interface ComboboxProps<Mode extends ComboboxMode = 'single'> extends Omit<ViewProps, 'children' | 'onLayout'> {
    className?: string;
    /**
     * One value or several. `multiple` draws the chosen options as removable
     * chips in front of the input and keeps the list open between picks.
     */
    mode?: Mode;
    /** Controlled selection. Its shape follows `mode`. */
    value?: ComboboxSelection[Mode];
    /** Starting selection when uncontrolled. */
    defaultValue?: ComboboxSelection[Mode];
    onValueChange?: (value: ComboboxSelection[Mode]) => void;
    /**
     * Controlled query — the text actually in the field. Pair it with
     * `onInputValueChange` when the options are fetched for it.
     */
    inputValue?: string;
    /** Starting query when uncontrolled. */
    defaultInputValue?: string;
    onInputValueChange?: (value: string) => void;
    placeholder?: string;
    disabled?: boolean;
    /** Where the options appear. */
    presentation?: ComboboxPresentation;
    /**
     * Narrow the options to the query here. `true` matches case-insensitively on
     * any part of an option's label; pass a function to match on something else —
     * a description, an alias list, an initialism.
     *
     * Pass `false` when a server is doing the matching: the options you render
     * are then shown exactly as given, since a second filter over results the
     * field cannot see the query behind would only remove correct answers.
     */
    filter?: boolean | ((option: ComboboxItemProps, query: string) => boolean);
    /**
     * Let the typed text become the value when it matches no option, committed on
     * submit. Turns the list into a set of suggestions rather than the set of
     * legal answers — which is what a tag field is.
     */
    allowCustomValue?: boolean;
    /** Show a spinner in place of the list. For options still being fetched. */
    loading?: boolean;
    /** Shown in place of the list when nothing matches. */
    emptyMessage?: string;
    /** Shown in place of the list while `loading`. */
    loadingMessage?: string;
    /** Offer a ✕ that clears the query and the selection. */
    clearable?: boolean;
    /** Open the list as soon as the field takes focus, before anything is typed. */
    openOnFocus?: boolean;
    /** Called when the list opens or closes. */
    onOpenChange?: (open: boolean) => void;
    /**
     * Width of the floating list. `field` matches the field, `content` sizes to
     * the longest option, or pass a pixel value. `overlay` only.
     */
    contentWidth?: 'field' | 'content' | number;
    /** Gap between the field and the floating list. `overlay` only. */
    offset?: number;
    /** Extra classes for the list surface. */
    listClassName?: string;
    /** Accessible name for the field. */
    accessibilityLabel?: string;
    children: ReactNode;
}
declare function ComboboxRoot<Mode extends ComboboxMode = 'single'>({ className, mode, value, defaultValue, onValueChange, inputValue, defaultInputValue, onInputValueChange, placeholder, disabled, presentation, filter, allowCustomValue, loading, emptyMessage, loadingMessage, clearable, openOnFocus, onOpenChange, contentWidth, offset, listClassName, accessibilityLabel, children, ...props }: ComboboxProps<Mode>): import("react").JSX.Element;
export declare const Combobox: typeof ComboboxRoot & {
    Item: typeof ComboboxItem;
    Group: typeof ComboboxGroup;
};
export {};
//# sourceMappingURL=index.d.ts.map