baseui/select/select-component.d.ts

A React Component library implementing the Base design language

import * as React from 'react';
import type { Locale } from '../locale';
import type { SelectProps, SelectState, Value, Option, ChangeAction } from './types';
import type { SyntheticEvent, ChangeEvent } from 'react';
export declare function isInteractive(rootTarget: EventTarget, rootElement: Element): boolean;
declare class Select extends React.Component<SelectProps, SelectState> {
    static defaultProps: {
        'aria-label': any;
        'aria-describedby': any;
        'aria-errormessage': any;
        'aria-labelledby': any;
        autoFocus: boolean;
        backspaceRemoves: boolean;
        clearable: boolean;
        closeOnSelect: boolean;
        creatable: boolean;
        deleteRemoves: boolean;
        disabled: boolean;
        error: boolean;
        positive: boolean;
        escapeClearsValue: boolean;
        filterOptions: (options: Value, filterValue: string, excludeOptions?: Value, newProps?: Partial<{
            filterOption: (option: Readonly<{
                [x: string]: any;
                id?: string | number;
                label?: React.ReactNode;
                disabled?: boolean;
                clearableValue?: boolean;
                isCreatable?: boolean;
                __optgroup?: string;
            }>, filterValue: string) => boolean;
            ignoreCase: boolean;
            labelKey: string;
            matchPos: "start" | "any";
            matchProp: "label" | "value" | "any";
            trimFilter: boolean;
            valueKey: string;
        }>) => Readonly<{
            [x: string]: any;
            id?: string | number;
            label?: React.ReactNode;
            disabled?: boolean;
            clearableValue?: boolean;
            isCreatable?: boolean;
            __optgroup?: string;
        }>[];
        filterOutSelected: boolean;
        getOptionLabel: any;
        getValueLabel: any;
        ignoreCase: boolean;
        isLoading: boolean;
        labelKey: string;
        maxDropdownHeight: string;
        multi: boolean;
        onBlur: () => void;
        onBlurResetsInput: boolean;
        onChange: () => void;
        onFocus: () => void;
        onInputChange: () => void;
        onCloseResetsInput: boolean;
        onSelectResetsInput: boolean;
        onOpen: any;
        onClose: any;
        openOnClick: boolean;
        startOpen: boolean;
        options: any[];
        overrides: {};
        required: boolean;
        searchable: boolean;
        size: "default";
        type: "select";
        value: any[];
        valueKey: string;
    };
    anchor: React.RefObject<HTMLElement>;
    dropdown: React.RefObject<HTMLElement>;
    input?: HTMLInputElement;
    dragging: boolean;
    focusAfterClear: boolean;
    openAfterFocus: boolean;
    justSelected: boolean;
    options: Value;
    constructor(props: SelectProps);
    state: {
        activeDescendant: any;
        inputValue: string;
        isFocused: boolean;
        isOpen: boolean;
        isPseudoFocused: boolean;
    };
    isItMounted: boolean;
    componentDidMount(): void;
    componentDidUpdate(prevProps: SelectProps, prevState: SelectState): void;
    componentWillUnmount(): void;
    focus(): void;
    handleDropdownOpen(nextOpenState: boolean): void;
    handleSetInputValue(newInputValue: string): void;
    handleSetInputFocus(): void;
    handleSetInputBlur(): void;
    handleTouchOutside: (event: TouchEvent) => void;
    handleTouchMove: () => boolean;
    handleTouchStart: () => boolean;
    handleTouchEnd: (event: TouchEvent) => void;
    handleClick: (event: MouseEvent | TouchEvent) => void;
    closeMenu(): void;
    handleInputFocus: (event: SyntheticEvent<HTMLElement>) => void;
    handleBlur: (event: React.FocusEvent | MouseEvent) => void;
    handleClickOutside: (event: MouseEvent) => void;
    handleInputChange: (event: ChangeEvent<HTMLInputElement>) => void;
    handleKeyDown: (event: KeyboardEvent) => void;
    getOptionLabel: (locale: Locale, { option, }: {
        option: Option;
        optionState: {
            $selected: boolean;
            $disabled: boolean;
            $isHighlighted: boolean;
        };
    }) => React.ReactNode;
    getValueLabel: ({ option }: {
        option: Option;
    }) => React.ReactNode;
    /**
     * Extends the value into an array from the given options
     */
    getValueArray(value: Value): Array<Option>;
    setValue(value: Value, option: Option | undefined | null, type: ChangeAction): void;
    handleActiveDescendantChange: (id?: string) => void;
    handleInputRef: (input: HTMLInputElement) => void;
    selectValue: ({ item }: {
        item: Option;
    }) => void;
    addValue: (item: Option) => void;
    backspaceValue: () => void;
    popValue: () => Readonly<{
        [x: string]: any;
        id?: string | number;
        label?: React.ReactNode;
        disabled?: boolean;
        clearableValue?: boolean;
        isCreatable?: boolean;
        __optgroup?: string;
    }>;
    removeValue: (item: Option) => void;
    clearValue: (event: KeyboardEvent | MouseEvent | TouchEvent) => void;
    shouldShowPlaceholder: () => boolean;
    shouldShowValue: () => boolean;
    renderLoading(): React.JSX.Element;
    renderValue(valueArray: Value): React.ReactNode | undefined | null | Array<React.ReactNode | undefined | null>;
    renderInput(listboxId: string): React.JSX.Element;
    renderClear(): React.JSX.Element;
    renderArrow(): React.JSX.Element;
    renderSearch(): React.JSX.Element;
    filterOptions(excludeOptions?: Value | null): Value;
    getSharedProps(): {
        $clearable: boolean;
        $creatable: boolean;
        $disabled: boolean;
        $error: boolean;
        $positive: boolean;
        $isFocused: boolean;
        $isLoading: boolean;
        $isOpen: boolean;
        $isPseudoFocused: boolean;
        $multi: boolean;
        $required: boolean;
        $searchable: boolean;
        $size: "default" | "large" | "compact" | "mini";
        $type: "search" | "select";
        $isEmpty: boolean;
    };
    render(): React.JSX.Element;
}
export default Select;