@hxui/angular
Version:
An Angular library based on the [HXUI design system](https://hxui.io).
97 lines (96 loc) • 6.36 kB
TypeScript
import { Overlay } from '@angular/cdk/overlay';
import { ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, TemplateRef, ViewContainerRef } from '@angular/core';
import { NgControl } from '@angular/forms';
import { TypeaheadMatch } from './typeahead-match.class';
import * as i0 from "@angular/core";
export declare class TypeaheadDirective implements OnInit, OnDestroy {
ngControl: NgControl;
overlay: Overlay;
private _ngZone;
private _elementRef;
private _viewContainerRef;
/** options source, can be Array of strings, objects or an Observable for external matching process */
hxaTypeahead: any;
/** minimal no of characters that needs to be entered before typeahead kicks-in. When set to 0, typeahead shows on focus with full list of options (limited as normal by typeaheadOptionsLimit) */
typeaheadMinLength: number;
/** minimal wait time after last character typed before typeahead kicks-in */
typeaheadWaitMs: number;
/** maximum length of options items list */
typeaheadOptionsLimit: number;
/** when options source is an array of objects, the name of field that contains the options value, we use array item as option in case of this field is missing. Supports nested properties and methods. */
typeaheadOptionField: string;
/** when options source is an array of objects, the name of field that contains the group value, matches are grouped by this field when set. */
typeaheadGroupField: string;
/** should be used only in case of typeahead attribute is array. If true - loading of options will be async, otherwise - sync. true make sense if options array is large. */
typeaheadAsync: boolean;
/** match latin symbols. If true the word súper would match super and vice versa. */
typeaheadLatinize: boolean;
/** break words with spaces. If true the text "exact phrase" here match would match with match exact phrase here but not with phrase here exact match (kind of "google style"). */
typeaheadSingleWords: boolean;
/** should be used only in case typeaheadSingleWords attribute is true. Sets the word delimiter to break words. Defaults to space. */
typeaheadWordDelimiters: string;
/** should be used only in case typeaheadSingleWords attribute is true. Sets the word delimiter to match exact phrase. Defaults to simple and double quotes. */
typeaheadPhraseDelimiters: string;
/** used to specify a custom item template. Template variables exposed are called item and index; */
typeaheadItemTemplate: TemplateRef<any>;
/** used to specify a custom options list template. Template variables: matches, itemTemplate, query */
optionsListTemplate: TemplateRef<any>;
disabled: boolean;
offsetY: number;
offsetX: number;
placement: 'top' | 'bottom' | 'left' | 'right';
maxWidthRelativeTo: string;
minWidthRelativeTo: string;
maxHeight: string;
/** fired when 'busy' state of this component was changed, fired on async mode only, returns boolean */
typeaheadLoading: EventEmitter<boolean>;
/** fired on every key event and returns true in case of matches are not detected */
typeaheadNoResults: EventEmitter<boolean>;
/** fired when option was selected, return object with data of this option */
typeaheadOnSelect: EventEmitter<TypeaheadMatch>;
/** fired when blur event occurres. returns the active item */
typeaheadOnBlur: EventEmitter<any>;
isTypeaheadOptionsListActive: boolean;
protected keyUpEventEmitter: EventEmitter<any>;
protected _matches: TypeaheadMatch[];
private _overlayRef;
private _typeaheadInstance;
private _portal;
private readonly _destroyed;
onChange(e: any): void;
onFocus(): void;
onBlur(): void;
onKeydown(e: any): void;
constructor(ngControl: NgControl, overlay: Overlay, _ngZone: NgZone, _elementRef: ElementRef, _viewContainerRef: ViewContainerRef);
ngOnInit(): void;
changeModel(match: TypeaheadMatch): void;
get matches(): any[];
show(delay?: number): void;
hide(): void;
private _hide;
ngOnDestroy(): void;
protected asyncActions(): void;
protected syncActions(): void;
protected normalizeOption(option: any): string;
protected normalizeQuery(value: string): any;
protected testMatch(match: string, test: any): boolean;
protected finalizeAsyncCall(matches: any[]): void;
protected prepareMatches(options: any[]): void;
protected hasMatches(): boolean;
private _createOverlay;
private _setWidthsRelativeTo;
private _updatePosition;
/**
* Returns the origin position and a fallback position based on the user's position preference.
* The fallback position is the inverse of the origin (e.g. `'bottom' -> 'top'`).
*/
private _getOrigin;
/** Returns the overlay position and a fallback position based on the user's preference */
private _getOverlayPosition;
private _invertPosition;
private _detach;
/** Updates the container and repositions the overlay according to the new content length */
private _updateContainer;
static ɵfac: i0.ɵɵFactoryDeclaration<TypeaheadDirective, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<TypeaheadDirective, "[hxaTypeahead]", ["hx-typeahead"], { "hxaTypeahead": "hxaTypeahead"; "typeaheadMinLength": "typeaheadMinLength"; "typeaheadWaitMs": "typeaheadWaitMs"; "typeaheadOptionsLimit": "typeaheadOptionsLimit"; "typeaheadOptionField": "typeaheadOptionField"; "typeaheadGroupField": "typeaheadGroupField"; "typeaheadAsync": "typeaheadAsync"; "typeaheadLatinize": "typeaheadLatinize"; "typeaheadSingleWords": "typeaheadSingleWords"; "typeaheadWordDelimiters": "typeaheadWordDelimiters"; "typeaheadPhraseDelimiters": "typeaheadPhraseDelimiters"; "typeaheadItemTemplate": "typeaheadItemTemplate"; "optionsListTemplate": "optionsListTemplate"; "disabled": "disabled"; "offsetY": "offsetY"; "offsetX": "offsetX"; "placement": "placement"; "maxWidthRelativeTo": "maxWidthRelativeTo"; "minWidthRelativeTo": "minWidthRelativeTo"; "maxHeight": "maxHeight"; }, { "typeaheadLoading": "typeaheadLoading"; "typeaheadNoResults": "typeaheadNoResults"; "typeaheadOnSelect": "typeaheadOnSelect"; "typeaheadOnBlur": "typeaheadOnBlur"; }, never>;
}