UNPKG

2.2 kBTypeScriptView Raw
1import React from 'react';
2import { RenderTagProp, TagComponentProp } from './MultiselectTagList';
3import { BaseListboxInputProps, Filterable, PopupWidgetProps, Searchable, WidgetHTMLProps, WidgetProps } from './shared';
4import { DataItem, Value, WidgetHandle } from './types';
5export declare type MultiselectHandle = WidgetHandle;
6export declare type ChangeHandler<TDataItem> = (dataItem: TDataItem[], metadata: {
7 action: 'insert' | 'remove';
8 dataItem: TDataItem;
9 searchTerm?: string;
10 lastValue: Value;
11 originalEvent?: React.SyntheticEvent;
12}) => void;
13export interface MultiselectProps<TDataItem = DataItem> extends WidgetHTMLProps, WidgetProps, PopupWidgetProps, Filterable<TDataItem>, Searchable, Omit<BaseListboxInputProps<TDataItem, unknown[]>, 'onChange'> {
14 onChange?: ChangeHandler<TDataItem>;
15 onCreate?: (searchTerm: string) => void;
16 showPlaceholderWithValues?: boolean;
17 renderTagValue?: RenderTagProp<TDataItem>;
18 clearTagIcon?: React.ReactNode;
19 tagOptionComponent?: TagComponentProp;
20 showSelectedItemsInList?: boolean;
21}
22declare interface Multiselect {
23 <TDataItem = DataItem>(props: MultiselectProps<TDataItem> & React.RefAttributes<MultiselectHandle>): React.ReactElement | null;
24 displayName?: string;
25 propTypes?: any;
26}
27/**
28 * ---
29 * shortcuts:
30 * - { key: left arrow, label: move focus to previous tag }
31 * - { key: right arrow, label: move focus to next tag }
32 * - { key: delete, deselect focused tag }
33 * - { key: backspace, deselect next tag }
34 * - { key: alt + up arrow, label: close Multiselect }
35 * - { key: down arrow, label: open Multiselect, and move focus to next item }
36 * - { key: up arrow, label: move focus to previous item }
37 * - { key: home, label: move focus to first item }
38 * - { key: end, label: move focus to last item }
39 * - { key: enter, label: select focused item }
40 * - { key: ctrl + enter, label: create new tag from current searchTerm }
41 * - { key: any key, label: search list for item starting with key }
42 * ---
43 *
44 * A select listbox alternative.
45 *
46 * @public
47 */
48declare const Multiselect: Multiselect;
49export default Multiselect;
50//# sourceMappingURL=Multiselect.d.ts.map
\No newline at end of file