UNPKG

@vsblty/ng-autocomplete

Version:

A fork of Angular autocomplete

246 lines (245 loc) 8.15 kB
import { AfterViewInit, ElementRef, EventEmitter, OnChanges, OnInit, Renderer2, SimpleChanges, TemplateRef } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import { Observable } from 'rxjs'; import * as i0 from "@angular/core"; export declare class AutocompleteComponent implements OnInit, OnChanges, AfterViewInit, ControlValueAccessor { private renderer; searchInput: ElementRef; filteredListElement: ElementRef; historyListElement: ElementRef; inputKeyUp$: Observable<any>; inputKeyDown$: Observable<any>; query: string; filteredList: any[]; historyList: any[]; isHistoryListVisible: boolean; elementRef: any; selectedIdx: number; toHighlight: string; notFound: boolean; isFocused: boolean; isOpen: boolean; isScrollToEnd: boolean; overlay: boolean; private manualOpen; private manualClose; /** * Data of items list. * It can be array of strings or array of objects. */ data: Array<any>; searchKeyword: string; placeholder: string; heading: string; initialValue: any; /** * History identifier of history list * When valid history identifier is given, then component stores selected item to local storage of user's browser. * If it is null then history is hidden. * History list is visible if at least one history item is stored. */ historyIdentifier: string; /** * Heading text of history list. * If it is null then history heading is hidden. */ historyHeading: string; historyListMaxNumber: number; notFoundText: string; isLoading: boolean; debounceTime: number; disabled: boolean; /** * The minimum number of characters the user must type before a search is performed. */ minQueryLength: number; /** * Focus first item in the list */ focusFirst: boolean; /** * Custom filter function */ customFilter: (items: any[], query: string) => any[]; /** * Custom result render function * @param value - selected value to be rendered inside input field */ selectedValueRender: (value: any) => string; /** Event that is emitted whenever an item from the list is selected. */ selected: EventEmitter<any>; /** Event that is emitted whenever an input is changed. */ inputChanged: EventEmitter<any>; /** Event that is emitted whenever an input is focused. */ readonly inputFocused: EventEmitter<void>; /** Event that is emitted whenever an input is cleared. */ readonly inputCleared: EventEmitter<void>; /** Event that is emitted when the autocomplete panel is opened. */ readonly opened: EventEmitter<void>; /** Event that is emitted when the autocomplete panel is closed. */ readonly closed: EventEmitter<void>; /** Event that is emitted when scrolled to the end of items. */ readonly scrolledToEnd: EventEmitter<void>; itemTemplate: TemplateRef<any>; notFoundTemplate: TemplateRef<any>; customTemplate: TemplateRef<any>; /** * Propagates new value when model changes */ propagateChange: any; onTouched: any; /** * Writes a new value from the form model into the view, * Updates model */ writeValue(value?: any): void; private defaultWriteValue; /** * Registers a handler that is called when something in the view has changed */ registerOnChange(fn: any): void; /** * Registers a handler specifically for when a control receives a touch event */ registerOnTouched(fn: () => void): void; /** * Event that is called when the value of an input element is changed */ onChange(event: any): void; constructor(elementRef: ElementRef, renderer: Renderer2); /** * Event that is called when the control status changes to or from DISABLED */ setDisabledState(isDisabled: boolean): void; ngOnInit(): void; ngAfterViewInit(): void; /** * Set initial value * @param value */ setInitialValue(value: any): void; /** * Update search results */ ngOnChanges(changes: SimpleChanges): void; /** * Items change */ handleItemsChange(): void; /** * Filter data */ filterList(): void; /** * Default filter function, used unless customFilter is provided */ defaultFilterFunction(): any[]; /** * Check if item is a string in the list. * @param item */ isTypeString(item: any): boolean; /** * Select item in the list. * @param item */ select(item: any): void; /** * Document click * @param e event */ handleClick(e: any): void; /** * Handle body overlay */ handleOverlay(): void; /** * Scroll items */ handleScroll(): void; /** * Define panel state */ setPanelState(event: any): void; /** * Manual controls */ open(): void; close(): void; focus(): void; clear(): void; /** * Remove search query */ remove(e: any): void; /** * Initialize historyList search */ initSearchHistory(): void; handleOpen(): void; handleClose(): void; handleFocus(e: any): void; scrollToEnd(): void; /** * Initialize keyboard events */ initEventStream(): void; /** * Listen keyboard events */ listenEventStream(): void; /** * on keyup == when input changed * @param e event */ onKeyUp(e: any): void; /** * Keyboard arrow top and arrow bottom * @param e event */ onFocusItem(e: any): void; /** * Scroll to focused item * * @param index */ scrollToFocusedItem(index: any): void; /** * Select item on enter click */ onHandleEnter(): void; /** * Esc click */ onEsc(): void; /** * Tab click */ onTab(): void; /** * Delete click */ onDelete(): void; /** * Select item to save in localStorage * @param selected */ saveHistory(selected: any): void; /** * Save item in localStorage * @param selected */ saveHistoryToLocalStorage(selected: any): void; /** * Remove item from localStorage * @param index * @param e event */ removeHistoryItem(index: any, e: any): void; /** * Reset localStorage * @param e event */ resetHistoryList(e: any): void; static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteComponent, "ng-autocomplete", never, { "data": { "alias": "data"; "required": false; }; "searchKeyword": { "alias": "searchKeyword"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "heading": { "alias": "heading"; "required": false; }; "initialValue": { "alias": "initialValue"; "required": false; }; "historyIdentifier": { "alias": "historyIdentifier"; "required": false; }; "historyHeading": { "alias": "historyHeading"; "required": false; }; "historyListMaxNumber": { "alias": "historyListMaxNumber"; "required": false; }; "notFoundText": { "alias": "notFoundText"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "minQueryLength": { "alias": "minQueryLength"; "required": false; }; "focusFirst": { "alias": "focusFirst"; "required": false; }; "customFilter": { "alias": "customFilter"; "required": false; }; "selectedValueRender": { "alias": "selectedValueRender"; "required": false; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; "notFoundTemplate": { "alias": "notFoundTemplate"; "required": false; }; }, { "selected": "selected"; "inputChanged": "inputChanged"; "inputFocused": "inputFocused"; "inputCleared": "inputCleared"; "opened": "opened"; "closed": "closed"; "scrolledToEnd": "scrolledToEnd"; }, ["customTemplate"], never, false, never>; }