UNPKG

4 kBTypeScriptView Raw
1import { ChangeEvent, ChangeEventHandler, FocusEventHandler, InputHTMLAttributes, KeyboardEvent, KeyboardEventHandler, MouseEvent, MouseEventHandler, ReactNode, RefCallback, SyntheticEvent } from 'react';
2import { SIZES } from './constants';
3export declare type AllowNew = boolean | ((options: Option[], state: TypeaheadPropsAndState) => boolean);
4export declare type FilterByCallback = (option: Option, state: TypeaheadPropsAndState) => boolean;
5export declare type Id = string;
6export declare type Option = string | Record<string, any>;
7export declare type OptionHandler = (option: Option) => void;
8export declare type LabelKey = string | ((option: Option) => string);
9export declare type SelectEvent<T> = MouseEvent<T> | KeyboardEvent<T>;
10export declare type SelectHint = (shouldSelectHint: boolean, event: KeyboardEvent<HTMLInputElement>) => boolean;
11export declare type Size = typeof SIZES[number];
12export declare type TypeaheadChildren = ReactNode | ((props: TypeaheadManagerChildProps) => ReactNode);
13export declare type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size'>;
14export interface TypeaheadInputProps extends InputProps {
15 inputClassName?: string;
16 inputRef: RefCallback<HTMLInputElement>;
17 referenceElementRef: RefCallback<HTMLElement>;
18}
19export interface RenderTokenProps {
20 disabled?: boolean;
21 labelKey: LabelKey;
22 onRemove?: OptionHandler;
23 tabIndex?: number;
24}
25export declare type RenderToken = (option: Option, props: RenderTokenProps, idx: number) => JSX.Element;
26export interface TypeaheadProps {
27 allowNew: AllowNew;
28 autoFocus: boolean;
29 caseSensitive: boolean;
30 children: TypeaheadChildren;
31 defaultInputValue: string;
32 defaultOpen: boolean;
33 defaultSelected: Option[];
34 emptyLabel?: ReactNode;
35 filterBy: string[] | FilterByCallback;
36 highlightOnlyResult: boolean;
37 id?: Id;
38 ignoreDiacritics: boolean;
39 inputProps?: InputProps;
40 labelKey: LabelKey;
41 maxResults: number;
42 minLength: number;
43 multiple: boolean;
44 onBlur: FocusEventHandler<HTMLInputElement>;
45 onChange?: (selected: Option[]) => void;
46 onFocus: (event: SyntheticEvent<HTMLInputElement>) => void;
47 onInputChange: (text: string, event: ChangeEvent<HTMLInputElement>) => void;
48 onKeyDown: KeyboardEventHandler<HTMLInputElement>;
49 onMenuToggle: (isOpen: boolean) => void;
50 onPaginate: (event: SelectEvent<HTMLElement>, shownResults: number) => void;
51 open?: boolean;
52 options: Option[];
53 paginate: boolean;
54 selected?: Option[];
55 selectHint?: SelectHint;
56}
57export interface TypeaheadState {
58 activeIndex: number;
59 activeItem?: Option;
60 initialItem?: Option;
61 isFocused: boolean;
62 selected: Option[];
63 showMenu: boolean;
64 shownResults: number;
65 text: string;
66}
67export declare type TypeaheadPropsAndState = Omit<TypeaheadProps, 'onChange'> & TypeaheadState;
68export interface TypeaheadManagerChildProps {
69 activeIndex: number;
70 getInputProps: (props?: InputProps) => TypeaheadInputProps;
71 hideMenu: () => void;
72 isMenuShown: boolean;
73 labelKey: LabelKey;
74 onClear: () => void;
75 onHide: () => void;
76 onRemove: OptionHandler;
77 results: Option[];
78 selected: Option[];
79 text: string;
80 toggleMenu: () => void;
81}
82export interface TypeaheadManagerProps extends TypeaheadPropsAndState {
83 hideMenu: () => void;
84 inputNode: HTMLInputElement | null;
85 inputRef: RefCallback<HTMLInputElement>;
86 isMenuShown: boolean;
87 onActiveItemChange: OptionHandler;
88 onAdd: OptionHandler;
89 onChange: ChangeEventHandler<HTMLInputElement>;
90 onClear: () => void;
91 onClick: MouseEventHandler<HTMLInputElement>;
92 onHide: () => void;
93 onInitialItemChange: (option?: Option) => void;
94 onMenuItemClick: (option: Option, event: SelectEvent<HTMLElement>) => void;
95 onRemove: OptionHandler;
96 placeholder?: string;
97 results: Option[];
98 setItem: (item: Option, position: number) => void;
99 toggleMenu: () => void;
100}