react-elegant-ui
Version:
Elegant UI components, made by BEM best practices for react
71 lines (70 loc) • 1.92 kB
TypeScript
/**
* Simply object for search
*/
export interface KeyboardSearchItem {
text?: string;
}
export type Predicate<T> = (search: string, item: T) => boolean;
/**
* Default predicate for match text with object
*
* This function check property from interface `KeyboardSearchItem`, then
* if your object is not have property `text` it will return `false` always
*/
export declare const defaultPredicate: <T extends KeyboardSearchItem>(searchText: string, item: T) => boolean;
export interface KeyboardInlineSearchParameters<T extends KeyboardSearchItem = KeyboardSearchItem> {
/**
* Handlers work only when enabled
*/
enabled: boolean;
/**
* List of items for navigate
*/
items: T[];
/**
* Index of active item from list
*/
cursor?: number;
/**
* Hook to set new index of active item
*/
setCursor?: (index: number) => void;
/**
* Predicate to check item match
*/
predicate?: Predicate<T>;
/**
* Reset accumulated input by press escape
*/
resetByEsc?: boolean;
/**
* Time in ms to reset accumulated input
*
* @default 500
*/
resetDelay?: number;
/**
* Search direction. With 1 up to down, with -1 down to up
*
* @default 1
*/
searchDirection?: 1 | -1;
/**
* Start from other end of items list when reach edge and not found nothing
*
* @default true
*/
loop?: boolean;
/**
* Define event phase
*
* @default true
*/
eventCapture?: boolean;
}
/**
* Global hook which implement inline search from keyboard
*
* It useful when u want fast navigate in items by input it names
*/
export declare const useInlineKeyboardSearch: <T extends {}>({ enabled, items, cursor, setCursor, predicate, resetByEsc, resetDelay, searchDirection, loop, eventCapture, }: KeyboardInlineSearchParameters<T>) => void;