import React from "react";
import { FieldGroupProps } from "../FieldGroup";
import { FieldProps } from "../FieldBase";
export interface SelectOptionValue {
    value: string | undefined;
    label: string;
    keys?: string[];
    [key: string]: any;
}
export type RenderSelectOption<T extends SelectOptionValue = SelectOptionValue> = (props: T) => React.JSX.Element;
export type RenderSelectListPrepend<T extends SelectOptionValue = SelectOptionValue> = (context: {
    updateValue: (option: T) => void;
    setOpen: (open: boolean) => void;
    value: string | undefined;
    query: string;
    ListItem: React.ComponentType<React.ComponentPropsWithoutRef<"li">>;
}) => React.ReactNode;
export interface SelectFieldProps<T extends SelectOptionValue = SelectOptionValue> extends Pick<FieldProps<string>, "helperText" | "invalid">, FieldGroupProps {
    renderOption?: RenderSelectOption<T>;
    /**
     * @deprecated Use renderListPrepend instead
     */
    children?: React.ReactNode;
    /**
     * 見出し
     */
    label?: string;
    name?: string;
    defaultValue?: string;
    /**
     * valueの変更は、defaultValueが指定されていないときのみ反映されます。
     */
    value?: string;
    disabled?: boolean;
    style?: React.CSSProperties;
    id?: string;
    className?: string;
    /**
     * placeholder
     */
    placeholder?: string;
    /**
     * selecting data is required
     */
    required?: boolean;
    options?: T[];
    loadOptions?: SelectLoadOptions<T>;
    disabledInput?: boolean;
    readOnly?: boolean;
    /**
     * SelectFieldのOptionがクリックされた際に発火する関数。
     */
    onChange?: (value: T["value"], options: T) => void;
    onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
    loading?: boolean;
    originalInputTestId?: string;
    pseudoInputTestId?: string;
    /**
     * オプションの表示にPortalを利用するかどうかを指定します。
     * このpropがtrueの場合、Portalが無効化されます。
     * また初期値がtrueであることに注意してください。
     * つまり通常、オプションはこのコンポーネントの子要素としてレンダリングされます。
     * @default true
     */
    disablePortal?: boolean;
    /**
     * 見かけ上のinput要素に対するrefを利用できます。
     * 選択された値を取得する場合などは、inputHasValueRefを利用してください。
     */
    inputRef?: React.Ref<HTMLInputElement>;
    /**
     * 選択された値を保持しているinput要素に対するrefを利用できます。
     * 見えているinput要素にフォーカスしたい場合などは、inputRefを利用してください。
     */
    inputHasValueRef?: React.Ref<HTMLInputElement>;
    /**
     * オプションリストの先頭に追加コンテンツを表示する。
     * childrenの代替として使用可能で、より柔軟な制御が可能です。
     * これを利用する場合、childrenは無視されます。
     */
    renderListPrepend?: RenderSelectListPrepend<T>;
}
export declare const filterSelectOptionsByQuery: <T extends SelectOptionValue = SelectOptionValue>(options: T[], query: string) => import("./useSearch").WithSearchScore<T & {
    keys: string[];
    content: string | undefined;
}>[];
export type SelectLoadOptions<T extends SelectOptionValue = SelectOptionValue> = (args: {
    query: string;
    options?: T[];
    selectedOptions?: T[];
}) => Promise<T[] | undefined>;
export declare const SelectField: <T extends SelectOptionValue>(props: SelectFieldProps<T>) => import("@emotion/react/jsx-runtime").JSX.Element;