lucid-ui/dist/components/SearchableMultiSelect/SearchableMultiSelect.d.ts

A UI component library from AppNexus.

import React from 'react';
import { propsSearch } from '../../util/text-manipulation';
import { StandardProps, Overwrite } from '../../util/component-types';
import { ISearchFieldProps } from '../SearchField/SearchField';
import { IDropMenuProps, IDropMenuState, IDropMenuOptionProps, IDropMenuOptionGroupProps, IOptionsData, DropMenuDumb as DropMenu } from '../DropMenu/DropMenu';
import { ISelectionProps, ISelectionLabelProps } from '../Selection/Selection';
import * as reducers from './SearchableMultiSelect.reducers';
interface ISearchableSingleSelectOptionGroupProps extends IDropMenuOptionGroupProps {
    Selected?: React.ReactNode;
}
declare type ISearchableMultiSelectOptionSelectionProps = Partial<ISelectionProps>;
/** Option Child Component */
export interface ISearchableMultiSelectOptionProps extends IDropMenuOptionProps {
    Selection?: ISearchableMultiSelectOptionSelectionProps;
    description?: string;
    name?: string;
    Selected?: React.ReactNode;
}
export declare type Size = 'large' | 'medium' | 'small';
export interface ISearchableMultiSelectPropsRaw extends StandardProps {
    isDisabled: boolean;
    isLoading: boolean;
    maxMenuHeight?: string | null;
    hasRemoveAll: boolean;
    hasSelectAll: boolean;
    selectAllText?: string;
    hasSelections: boolean;
    searchText: string;
    initialState?: any;
    responsiveMode: Size;
    selectedIndices: number[];
    SearchField?: React.ReactNode;
    DropMenu: IDropMenuProps;
    Option?: ISearchableMultiSelectOptionProps;
    OptionGroup?: IDropMenuOptionGroupProps;
    SelectionLabel?: ISelectionLabelProps;
    Error: React.ReactNode;
    onSelect: (optionIndices: number[] | number, { props, event, }: {
        props: IDropMenuOptionProps | undefined;
        event: React.KeyboardEvent | React.MouseEvent;
    }) => void;
    onSearch: (searchText: string, firstVisibleIndex: number | null, { props, event, }: {
        props: IDropMenuOptionProps;
        event: React.KeyboardEvent | React.MouseEvent;
    }) => void;
    optionFilter: (searchValue: string, props: any) => boolean;
    onRemoveAll: ({ props, event, }: {
        props: IDropMenuOptionProps;
        event: React.KeyboardEvent | React.MouseEvent;
    }) => void;
}
export declare type ISearchableMultiSelectProps = Overwrite<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ISearchableMultiSelectPropsRaw>;
export interface ISearchableMultiSelectState {
    DropMenu: IDropMenuState;
    selectedIndices: number[];
    searchText: string | null;
    optionGroups: IDropMenuOptionGroupProps[];
    flattenedOptionsData: IOptionsData[];
    ungroupedOptionData: IOptionsData[];
    optionGroupDataLookup: {
        [key: number]: IOptionsData[];
    };
}
declare class SearchableMultiSelect extends React.Component<ISearchableMultiSelectProps, ISearchableMultiSelectState> {
    static displayName: string;
    static peek: {
        description: string;
        categories: string[];
        madeFrom: string[];
    };
    static defaultProps: {
        isDisabled: boolean;
        isLoading: boolean;
        hasRemoveAll: boolean;
        hasSelections: boolean;
        hasSelectAll: boolean;
        selectAllText: string;
        searchText: string;
        responsiveMode: "large";
        selectedIndices: never[];
        DropMenu: {
            isDisabled: boolean;
            isExpanded: boolean;
            direction: "down";
            alignment: "start";
            selectedIndices: never[];
            focusedIndex: null;
            flyOutStyle: {
                maxHeight: string;
            };
            onExpand: (...args: any[]) => void;
            onCollapse: (...args: any[]) => void;
            onSelect: (...args: any[]) => void;
            onFocusNext: (...args: any[]) => void;
            onFocusPrev: (...args: any[]) => void;
            onFocusOption: (...args: any[]) => void;
            portalId: string;
            optionContainerStyle: {};
            ContextMenu: {
                direction: string;
                directonOffset: number;
                minWidthOffset: number;
                alignment: string;
                getAlignmentOffset: () => number;
                isExpanded: boolean;
                onClickOut: null;
                portalId: null;
            };
        };
        Error: null;
        optionFilter: typeof propsSearch;
        onSearch: (...args: any[]) => void;
        onRemoveAll: (...args: any[]) => void;
        onSelect: (...args: any[]) => void;
    };
    static reducers: typeof reducers;
    static Option: {
        (_props: ISearchableMultiSelectOptionProps): null;
        displayName: string;
        peek: {
            description: string;
        };
        Selection: {
            (_props: ISelectionProps): null;
            displayName: string;
            propTypes: {
                className: any;
                kind: any;
                isTop: any;
                isFilled: any;
                isRemovable: any;
                hasBackground: any;
                isBold: any;
                onRemove: any;
                Label: any;
                Icon: any;
                children: any;
                responsiveMode: any;
            };
            propName: string;
            peek: {
                description: string;
            };
        };
        Selected: {
            (_props: {
                children?: React.ReactNode;
            }): null;
            displayName: string;
            peek: {
                description: string;
            };
            propName: string;
            propTypes: {};
        };
        propName: string;
        propTypes: {
            isDisabled: any;
            isHidden: any;
            isWrapped: any;
            Selected: any;
            Selection: any;
            value: any;
            filterText: any;
        };
        defaultProps: {
            isDisabled: boolean;
            isHidden: boolean;
            isWrapped: boolean;
        };
    };
    static OptionGroup: {
        (_props: ISearchableSingleSelectOptionGroupProps): null;
        displayName: string;
        peek: {
            description: string;
        };
        propName: string;
        propTypes: {
            isHidden: any;
        };
        defaultProps: {
            isHidden: boolean;
        };
        Selected: {
            (_props: {
                children?: React.ReactNode;
            }): null;
            displayName: string;
            peek: {
                description: string;
            };
            propName: string;
            propTypes: {};
        };
    };
    static SearchField: {
        (_props: ISearchFieldProps): null;
        displayName: string;
        peek: {
            description: string;
        };
        propName: string;
        propTypes: {
            onChange: any;
            onChangeDebounced: any;
            debounceLevel: any;
            onSubmit: any;
            value: any;
            isValid: any;
            isDisabled: any;
            placeholder: any;
            className: any;
            Icon: any;
            TextField: any;
        };
        defaultProps: {
            isDisabled: boolean;
            onChange: (...args: any[]) => void;
            onChangeDebounced: (...args: any[]) => void;
            debounceLevel: number;
            onSubmit: (...args: any[]) => void;
            value: string;
        };
    };
    static NullOption: {
        (_props: import("../DropMenu/DropMenu").IDropMenuNullOptionProps): null;
        displayName: string;
        peek: {
            description: string;
        };
        propName: string;
        propTypes: {};
    };
    static FixedOption: {
        (_props: import("../DropMenu/DropMenu").IDropMenuFixedOptionProps): null;
        displayName: string;
        peek: {
            description: string;
        };
        propName: string;
        propTypes: {
            isDisabled: any;
            isHidden: any;
            isWrapped: any;
        };
        defaultProps: {
            isDisabled: boolean;
            isHidden: boolean;
            isWrapped: boolean;
        };
    };
    static DropMenu: typeof DropMenu;
    static SelectionLabel: import("../../util/component-types").FC<ISelectionLabelProps>;
    static propTypes: {
        children: any;
        className: any;
        isDisabled: any;
        isLoading: any;
        maxMenuHeight: any;
        onSearch: any;
        onSelect: any;
        onRemoveAll: any;
        optionFilter: any;
        searchText: any;
        selectedIndices: any;
        DropMenu: any;
        Option: any;
        responsiveMode: any;
        hasRemoveAll: any;
        hasSelections: any;
        hasSelectAll: any;
        selectAllText: any;
        Error: any;
        FixedOption: any;
        NullOption: any;
        OptionGroup: any;
        SearchField: any;
        Label: any;
    };
    handleDropMenuSelect: (optionIndex: number | null, { event, props, }: {
        props: IDropMenuOptionProps | undefined;
        event: React.KeyboardEvent | React.MouseEvent;
    }) => void;
    handleSelectAll: ({ event, props, }: {
        event: React.KeyboardEvent | React.MouseEvent;
        props: IDropMenuOptionProps | undefined;
    }) => void;
    handleSelectionRemove: ({ event, props, props: { callbackId: optionIndex }, }: {
        event: React.KeyboardEvent | React.MouseEvent;
        props: any;
    }) => void;
    handleRemoveAll: ({ event, props, }: {
        event: React.KeyboardEvent | React.MouseEvent;
        props: IDropMenuOptionProps;
    }) => void;
    handleSearch: (searchText: string, { event }: {
        event: React.KeyboardEvent | React.MouseEvent;
    }) => void;
    UNSAFE_componentWillMount(): void;
    UNSAFE_componentWillReceiveProps(nextProps: ISearchableMultiSelectProps): void;
    renderUnderlinedChildren: (childText: string, searchText: string) => any;
    renderOption: ({ optionProps, optionIndex, }: {
        optionProps: ISearchableMultiSelectOptionProps;
        optionIndex: number;
    }) => React.ReactElement;
    renderOptions: () => React.ReactElement[] | React.ReactElement | null;
    render: () => JSX.Element;
}
declare const _default: typeof SearchableMultiSelect & import("../../util/state-management").IHybridComponent<Overwrite<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ISearchableMultiSelectPropsRaw>, ISearchableMultiSelectState>;
export default _default;
export { SearchableMultiSelect as SearchableMultiSelectDumb };