UNPKG

@engie-group/fluid-design-system-angular

Version:

Fluid Design System Angular

293 lines (292 loc) 8.12 kB
import { AfterContentInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, QueryList, Renderer2, TemplateRef } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import { FormItemComponent } from '../form-item/form-item.component'; import { ListItemComponent } from '../list-item/list-item.component'; import { AutocompleteOption } from './autocomplete.model'; import * as i0 from "@angular/core"; export declare class AutocompleteComponent extends FormItemComponent implements ControlValueAccessor, AfterContentInit, OnDestroy { private renderer; private elementRef; private cdr; private _document; private readonly INPUT_BORDER_IN_PX; private readonly LIST_OFFSET_IN_PX; /** * @ignore */ private unsubscribe; /** * @ignore */ private _parentElement; /** * @ignore */ private _onChange; /** * @ignore */ protected _onTouched: () => void; /** * @ignore */ private clickListenerDisposeFct; /** * @ignore */ private scrollListenerDisposeFct; /** * Bandaid hack to prevent a weird focusout event bug happening when * `appendTo` is set and an item is selected. For *some* reason, the focusout * event is triggered multiple times when opening the list, which causes * unexpected behavior. * * This variable allows to temporarily "disables" the `handleFocusout` handler. * * FIXME: Find an actual solution to this problem instead of a bandaid hack. * @ignore */ private ignoreFocusout; /** * @ignore */ isOpen: boolean; /** * @ignore */ isFiltered: boolean; /** * @ignore */ selectedValue: AutocompleteOption; /** * @ignore */ filteredData: AutocompleteOption[]; /** * Input search text * @ignore */ searchText: string; /** * Index of currently selected suggestion. -1 if no suggestion is currently selected * @ignore */ focusIndex: number; protected activeIndex: number; /** * Id of currently selected item. Null if no suggestion is currently selected * @ignore */ protected focusedItemId: string | null; /** * Live zone content. It will be announced by assistive technologies everytime it is changed. * @ignore */ liveZoneContent: string; /** * Dropdown icon name */ iconName: string; /** * Whether to show number of results or no */ showNumberOfResults: boolean; /** * No results message to display */ noResultMessage: string; /** * Result message, formatted like `{numberOfResults} {resultsNumberMessage}` */ resultsNumberMessage: string; /** * Whether to show number of results or no */ showNoResultsMessage: boolean; /** * Limit of results to show on search */ searchLimit?: number; /** * Selector that points to dom node where the list should be rendered */ appendTo: string; /** * Track by Function */ trackByFn: (index: number, option: AutocompleteOption) => any; /** * @ignore */ _data: AutocompleteOption[]; /** * Autocomplete data */ set data(value: AutocompleteOption[]); get data(): AutocompleteOption[]; /** * Suggestion list text alternative for assistive technologies. */ listLabel: string; /** * Instructions on how to navigate the list. It is append after the input label. * @example "Use the UP / DOWN arrows to navigate within the suggestion list. Press Enter to select an option. On touch devices, use swipe to navigate and double tap to select an option" */ inputInstructions: string; /** * Emits value of searched value on input type */ search: EventEmitter<string>; /** * @ignore */ inputRef: ElementRef; /** * @ignore */ optionsList: ElementRef; /** * Option items * @ignore */ selectOptions: QueryList<ListItemComponent>; /** * @ignore */ optionLabelTemplate: TemplateRef<any>; /** * @ignore */ searchResultsTemplate: TemplateRef<any>; /** * @ignore */ noResultTemplate: TemplateRef<any>; constructor(renderer: Renderer2, elementRef: ElementRef<HTMLElement>, cdr: ChangeDetectorRef, _document: any); /** * @ignore */ ngAfterContentInit(): void; /** * @ignore */ ngOnDestroy(): void; /** * Content of hint item and hidden. * @ignore */ private createResultsMessageContent; /** * Update displayed suggestions and update live zone * @private */ private updateList; private processActiveOption; get interactedItemIndex(): number; private scrollOnListOpening; private appendAndComputeListPosition; /** * @private */ private computeListPosition; /** * @ignore */ private removeAppendedElementFromParent; /** * @ignore */ private initScrollListener; /** * @ignore */ getAdditionalClass(): string; /** * Implemented as part of ControlValueAccessor. * @ignore */ registerOnChange(fn: any): void; /** * Implemented as part of ControlValueAccessor. * @ignore */ registerOnTouched(fn: any): void; /** * Implemented as part of ControlValueAccessor. * @ignore */ setDisabledState(isDisabled: boolean): void; /** * Implemented as part of ControlValueAccessor. * @ignore */ writeValue(value: AutocompleteOption): void; /** Open the suggestion list. */ openList(): void; /** Close the suggestion list. */ closeList(): void; /** * Toggle the suggestion list. * @ignore */ handleInputClick(): void; /** * Handle input change and save searchText * @ignore */ handleInputEvent(event: InputEvent): void; /** * @ignore */ getItemId(index: number): string; /** * @ignore */ getListId(): string; /** * @ignore */ getInstructionsId(): string; /** * @ignore */ private focusFocusedOption; /** * @ignore */ private selectNextOption; /** * @ignore */ private selectPreviousOption; /** * @ignore */ private unselectOption; /** * @ignore */ handleKeydownEvent(e: KeyboardEvent): void; /** * @ignore */ private getMatchinOption; /** * @ignore */ selectItem(option: AutocompleteOption): void; /** * Closes the suggestion list if the focus is moved outside of the autocomplete. * @ignore */ handleFocusout(e: FocusEvent): void; /** * @ignore * @param index * @param option */ trackByOption(index: number, option: AutocompleteOption): any; static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteComponent, "nj-autocomplete", never, { "iconName": { "alias": "iconName"; "required": false; }; "showNumberOfResults": { "alias": "showNumberOfResults"; "required": false; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; }; "resultsNumberMessage": { "alias": "resultsNumberMessage"; "required": false; }; "showNoResultsMessage": { "alias": "showNoResultsMessage"; "required": false; }; "searchLimit": { "alias": "searchLimit"; "required": false; }; "appendTo": { "alias": "appendTo"; "required": false; }; "trackByFn": { "alias": "trackByFn"; "required": false; }; "data": { "alias": "data"; "required": false; }; "listLabel": { "alias": "listLabel"; "required": false; }; "inputInstructions": { "alias": "inputInstructions"; "required": false; }; }, { "search": "search"; }, ["optionLabelTemplate", "searchResultsTemplate", "noResultTemplate"], ["[njFormLabel]", "[njFormSubscript]", "[njAutocompleteAdditional]"], true, never>; }