ngx-bootstrap/typeahead/types/ngx-bootstrap-typeahead.d.ts

Angular Bootstrap

import * as _angular_core from '@angular/core';
import { TemplateRef, OnDestroy, ElementRef, Renderer2, ChangeDetectorRef, OnInit, EventEmitter, ViewContainerRef } from '@angular/core';
import { NgControl } from '@angular/forms';
import { ComponentLoaderFactory } from 'ngx-bootstrap/component-loader';
import { Subscription, Observable } from 'rxjs';
import { PositioningService } from 'ngx-bootstrap/positioning';
import * as i1 from '@angular/common';

declare const latinMap: {
    [key: string]: string;
};

declare class TypeaheadMatch<ItemType = any> {
    readonly value: string;
    readonly item: ItemType;
    protected header: boolean;
    constructor(item: ItemType, value?: string, header?: boolean);
    isHeader(): boolean;
    toString(): string;
}

/**
 * A context for the `optionsListTemplate`
 * input template in case you want to override default one
 */
interface TypeaheadOptionListContext {
    /** All matches */
    matches: TypeaheadMatch[];
    /** Item template */
    itemTemplate: TemplateRef<TypeaheadOptionItemContext>;
    /** Search query */
    query: string[] | string;
    /** Typeahead template methods */
    $implicit: TypeaheadTemplateMethods;
}
/**
 * A context for the `typeaheadItemTemplate`
 * input template in case you want to override default one
 */
interface TypeaheadOptionItemContext {
    /** Item */
    item: unknown;
    /** Item index */
    index: number;
    /** Typeahead match */
    match: TypeaheadMatch;
    /** Search query */
    query: string[] | string;
}
/**
 * Methods for `optionsListTemplate` context
 */
interface TypeaheadTemplateMethods {
    /** Function to select an option by click event */
    selectMatch(value: TypeaheadMatch, e?: Event): void;
    /** Function to select an option by mouseenter event */
    selectActive(value: TypeaheadMatch): void;
    /** Function to check if an option is active */
    isActive(value: TypeaheadMatch): boolean;
}

declare class TypeaheadContainerComponent implements OnDestroy {
    private positionService;
    private renderer;
    element: ElementRef;
    private changeDetectorRef;
    readonly activeChangeEvent: _angular_core.OutputEmitterRef<string>;
    parent?: TypeaheadDirective;
    query?: string[] | string;
    isFocused: boolean;
    top?: string;
    left?: string;
    display?: string;
    placemen?: string;
    dropup?: boolean;
    guiHeight?: string;
    needScrollbar?: boolean;
    animationState?: string;
    positionServiceSubscription: Subscription;
    height: number;
    popupId: string;
    get typeaheadTemplateMethods(): TypeaheadTemplateMethods;
    protected _active?: TypeaheadMatch;
    protected _matches: TypeaheadMatch[];
    private ulElement?;
    private liElements?;
    constructor(positionService: PositioningService, renderer: Renderer2, element: ElementRef, changeDetectorRef: ChangeDetectorRef);
    get active(): TypeaheadMatch | undefined;
    set active(active: TypeaheadMatch | undefined);
    get matches(): TypeaheadMatch[];
    set matches(value: TypeaheadMatch[]);
    get isTopPosition(): boolean;
    get optionsListTemplate(): TemplateRef<TypeaheadOptionListContext> | undefined;
    get isAnimated(): boolean;
    get adaptivePosition(): boolean;
    get typeaheadScrollable(): boolean;
    get typeaheadOptionsInScrollableView(): number;
    get typeaheadIsFirstItemActive(): boolean;
    get itemTemplate(): TemplateRef<TypeaheadOptionItemContext> | undefined;
    get canSelectItemsOnBlur(): boolean;
    selectActiveMatch(isActiveItemChanged?: boolean): void;
    activeChanged(): void;
    prevActiveMatch(): void;
    nextActiveMatch(): void;
    selectActive(value: TypeaheadMatch): void;
    highlight(match: TypeaheadMatch, query: string[] | string): string;
    focusLost(): void;
    isActive(value: TypeaheadMatch): boolean;
    selectMatch(value?: TypeaheadMatch, event?: Event): boolean;
    setScrollableMode(): void;
    scrollPrevious(index: number): void;
    scrollNext(index: number): void;
    ngOnDestroy(): void;
    protected setActive(value?: TypeaheadMatch): void;
    private isScrolledIntoView;
    private scrollToBottom;
    private scrollToTop;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TypeaheadContainerComponent, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TypeaheadContainerComponent, "typeahead-container", never, {}, { "activeChangeEvent": "activeChange"; }, never, never, true, never>;
}

interface TypeaheadOrder {
    /** field for sorting */
    field?: string;
    /** ordering direction, could be 'asc' or 'desc' */
    direction: 'asc' | 'desc';
}

/** Default values provider for typeahead */
declare class TypeaheadConfig {
    /** sets use adaptive position */
    adaptivePosition: boolean;
    /** turn on/off animation */
    isAnimated: boolean;
    /** used to hide results on blur */
    hideResultsOnBlur: boolean;
    /** if true, typeahead will cancel async request on blur */
    cancelRequestOnFocusLost: boolean;
    /** used to choose the first item in typeahead container */
    selectFirstItem: boolean;
    /** used to active/inactive the first item in typeahead container */
    isFirstItemActive: boolean;
    /** used to choose set minimal no of characters that needs to
     * be entered before typeahead kicks-in
     */
    minLength: number;
    /**
     * used to choose item on blur event
     */
    selectItemOnBlur: boolean;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TypeaheadConfig, never>;
    static ɵprov: _angular_core.ɵɵInjectableDeclaration<TypeaheadConfig>;
}

type TypeaheadOption = string | Record<string | number, any>;
type TypeaheadOptionArr = TypeaheadOption[] | Observable<TypeaheadOption>;
declare class TypeaheadDirective implements OnInit, OnDestroy {
    private changeDetection;
    private element;
    private ngControl;
    private renderer;
    /** options source, can be Array of strings, objects or
     * an Observable for external matching process
     */
    readonly typeahead: _angular_core.InputSignal<TypeaheadOptionArr | undefined>;
    /** 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)
     */
    readonly typeaheadMinLength: _angular_core.InputSignal<number>;
    /** sets use adaptive position */
    readonly adaptivePosition: _angular_core.InputSignal<boolean>;
    /** turn on/off animation */
    readonly isAnimated: _angular_core.InputSignal<boolean>;
    /** minimal wait time after last character typed before typeahead kicks-in */
    readonly typeaheadWaitMs: _angular_core.InputSignal<number>;
    /** maximum length of options items list. The default value is 20 */
    readonly typeaheadOptionsLimit: _angular_core.InputSignal<number | undefined>;
    /** 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.
     */
    readonly typeaheadOptionField: _angular_core.InputSignal<string | undefined>;
    /** 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.
     */
    readonly typeaheadGroupField: _angular_core.InputSignal<string | undefined>;
    /** Used to specify a custom order of matches. When options source is an array of objects
     * a field for sorting has to be set up. In case of options source is an array of string,
     * a field for sorting is absent. The ordering direction could be changed to ascending or descending.
     */
    readonly typeaheadOrderBy: _angular_core.InputSignal<TypeaheadOrder | undefined>;
    /** should be used only in case of typeahead attribute is Observable of array.
     * If true - loading of options will be async, otherwise - sync.
     * true make sense if options array is large.
     */
    readonly typeaheadAsync: _angular_core.InputSignal<boolean | undefined>;
    /** match latin symbols.
     * If true the word súper would match super and vice versa.
     */
    readonly typeaheadLatinize: _angular_core.InputSignal<boolean>;
    /** Can be use to search words by inserting a single white space between each characters
     *  for example 'C a l i f o r n i a' will match 'California'.
     */
    readonly typeaheadSingleWords: _angular_core.InputSignal<boolean>;
    /** should be used only in case typeaheadSingleWords attribute is true.
     * Sets the word delimiter to break words. Defaults to space.
     */
    readonly typeaheadWordDelimiters: _angular_core.InputSignal<string>;
    /** Can be used to conduct a search of multiple items and have suggestion not for the
     * whole value of the input but for the value that comes after a delimiter provided via
     * typeaheadMultipleSearchDelimiters attribute. This option can only be used together with
     * typeaheadSingleWords option if typeaheadWordDelimiters and typeaheadPhraseDelimiters
     * are different from typeaheadMultipleSearchDelimiters to avoid conflict in determining
     * when to delimit multiple searches and when a single word.
     */
    readonly typeaheadMultipleSearch: _angular_core.InputSignal<boolean | undefined>;
    /** should be used only in case typeaheadMultipleSearch attribute is true.
     * Sets the multiple search delimiter to know when to start a new search. Defaults to comma.
     * If space needs to be used, then explicitly set typeaheadWordDelimiters to something else than space
     * because space is used by default OR set typeaheadSingleWords attribute to false if you don't need
     * to use it together with multiple search.
     */
    readonly typeaheadMultipleSearchDelimiters: _angular_core.InputSignal<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.
     */
    readonly typeaheadPhraseDelimiters: _angular_core.InputSignal<string>;
    /** used to specify a custom item template.
     * Template variables exposed are called item and index;
     */
    readonly typeaheadItemTemplate: _angular_core.InputSignal<TemplateRef<TypeaheadOptionItemContext> | undefined>;
    /** used to specify a custom options list template.
     * Template variables: matches, itemTemplate, query
     */
    readonly optionsListTemplate: _angular_core.InputSignal<TemplateRef<TypeaheadOptionListContext> | undefined>;
    /** specifies if typeahead is scrollable  */
    readonly typeaheadScrollable: _angular_core.InputSignal<boolean>;
    /** specifies number of options to show in scroll view  */
    readonly typeaheadOptionsInScrollableView: _angular_core.InputSignal<number>;
    /** used to hide result on blur */
    readonly typeaheadHideResultsOnBlur: _angular_core.InputSignal<boolean>;
    /** fired when an options list was opened and the user clicked Tab
     * If a value equal true, it will be chosen first or active item in the list
     * If value equal false, it will be chosen an active item in the list or nothing
     */
    readonly typeaheadSelectFirstItem: _angular_core.InputSignal<boolean>;
    /** makes active first item in a list */
    readonly typeaheadIsFirstItemActive: _angular_core.InputSignal<boolean>;
    /** fired when 'busy' state of this component was changed,
     * fired on async mode only, returns boolean
     */
    readonly typeaheadLoading: _angular_core.OutputEmitterRef<boolean>;
    /** fired on every key event and returns true
     * in case of matches are not detected
     */
    readonly typeaheadNoResults: _angular_core.OutputEmitterRef<boolean>;
    /** fired when option was selected, return object with data of this option. */
    readonly typeaheadOnSelect: _angular_core.OutputEmitterRef<TypeaheadMatch<any>>;
    /** fired when option was previewed, return object with data of this option. */
    readonly typeaheadOnPreview: _angular_core.OutputEmitterRef<TypeaheadMatch<any> | undefined>;
    /** fired when blur event occurs. returns the active item */
    readonly typeaheadOnBlur: _angular_core.OutputEmitterRef<TypeaheadMatch<any> | undefined>;
    /**
     * A selector specifying the element the typeahead should be appended to.
     */
    readonly container: _angular_core.InputSignal<string | undefined>;
    /** This attribute indicates that the dropdown should be opened upwards */
    readonly dropup: _angular_core.InputSignal<boolean>;
    /** if false restrict model values to the ones selected from the popup only will be provided */
    /** if false the first match automatically will not be focused as you type */
    /** format the ng-model result after selection */
    /** if true automatically select an item when there is one option that exactly matches the user input */
    /**  if true select the currently highlighted match on blur */
    /**  if false don't focus the input element the typeahead directive is associated with on selection */
    activeDescendant?: string;
    isOpen: boolean;
    popupId: string;
    list: string;
    _container?: TypeaheadContainerComponent;
    isActiveItemChanged: boolean;
    isFocused: boolean;
    cancelRequestOnFocusLost: boolean;
    selectItemOnBlur: boolean;
    protected keyUpEventEmitter: EventEmitter<string>;
    protected placement: string;
    protected _matches: TypeaheadMatch[];
    private _typeahead;
    private _subscriptions;
    private _allEnteredValue?;
    private _outsideClickListener;
    private _typeaheadMinLengthValue;
    private _typeaheadAsyncValue?;
    constructor(cis: ComponentLoaderFactory, config: TypeaheadConfig, changeDetection: ChangeDetectorRef, element: ElementRef, ngControl: NgControl, renderer: Renderer2, viewContainerRef: ViewContainerRef);
    get matches(): TypeaheadMatch[];
    ngOnInit(): void;
    onInput(e: any): void;
    onChange(event: KeyboardEvent): void;
    onFocus(): void;
    onBlur(): void;
    onKeydown(event: KeyboardEvent): void;
    changeModel(match?: TypeaheadMatch): void;
    show(): void;
    hide(): void;
    onOutsideClick(): void;
    ngOnDestroy(): void;
    protected asyncActions(): void;
    protected syncActions(): void;
    protected normalizeOption(option: TypeaheadOption): string;
    protected tokenizeQuery(currentQuery: string | string[]): string | string[];
    protected normalizeQuery(value: string): string | string[];
    protected testMatch(match: string, test: string[] | string): boolean;
    protected finalizeAsyncCall(matches?: TypeaheadOption | TypeaheadOption[]): void;
    protected prepareMatches(options: TypeaheadOption | TypeaheadOption[]): void;
    protected orderMatches(options: TypeaheadOption[]): TypeaheadOption[];
    protected hasMatches(): boolean;
    protected checkDelimitersConflict(): void;
    protected haveCommonCharacters(str1: string, str2: string): boolean;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TypeaheadDirective, never>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TypeaheadDirective, "[typeahead]", ["bs-typeahead"], { "typeahead": { "alias": "typeahead"; "required": false; "isSignal": true; }; "typeaheadMinLength": { "alias": "typeaheadMinLength"; "required": false; "isSignal": true; }; "adaptivePosition": { "alias": "adaptivePosition"; "required": false; "isSignal": true; }; "isAnimated": { "alias": "isAnimated"; "required": false; "isSignal": true; }; "typeaheadWaitMs": { "alias": "typeaheadWaitMs"; "required": false; "isSignal": true; }; "typeaheadOptionsLimit": { "alias": "typeaheadOptionsLimit"; "required": false; "isSignal": true; }; "typeaheadOptionField": { "alias": "typeaheadOptionField"; "required": false; "isSignal": true; }; "typeaheadGroupField": { "alias": "typeaheadGroupField"; "required": false; "isSignal": true; }; "typeaheadOrderBy": { "alias": "typeaheadOrderBy"; "required": false; "isSignal": true; }; "typeaheadAsync": { "alias": "typeaheadAsync"; "required": false; "isSignal": true; }; "typeaheadLatinize": { "alias": "typeaheadLatinize"; "required": false; "isSignal": true; }; "typeaheadSingleWords": { "alias": "typeaheadSingleWords"; "required": false; "isSignal": true; }; "typeaheadWordDelimiters": { "alias": "typeaheadWordDelimiters"; "required": false; "isSignal": true; }; "typeaheadMultipleSearch": { "alias": "typeaheadMultipleSearch"; "required": false; "isSignal": true; }; "typeaheadMultipleSearchDelimiters": { "alias": "typeaheadMultipleSearchDelimiters"; "required": false; "isSignal": true; }; "typeaheadPhraseDelimiters": { "alias": "typeaheadPhraseDelimiters"; "required": false; "isSignal": true; }; "typeaheadItemTemplate": { "alias": "typeaheadItemTemplate"; "required": false; "isSignal": true; }; "optionsListTemplate": { "alias": "optionsListTemplate"; "required": false; "isSignal": true; }; "typeaheadScrollable": { "alias": "typeaheadScrollable"; "required": false; "isSignal": true; }; "typeaheadOptionsInScrollableView": { "alias": "typeaheadOptionsInScrollableView"; "required": false; "isSignal": true; }; "typeaheadHideResultsOnBlur": { "alias": "typeaheadHideResultsOnBlur"; "required": false; "isSignal": true; }; "typeaheadSelectFirstItem": { "alias": "typeaheadSelectFirstItem"; "required": false; "isSignal": true; }; "typeaheadIsFirstItemActive": { "alias": "typeaheadIsFirstItemActive"; "required": false; "isSignal": true; }; "container": { "alias": "container"; "required": false; "isSignal": true; }; "dropup": { "alias": "dropup"; "required": false; "isSignal": true; }; }, { "typeaheadLoading": "typeaheadLoading"; "typeaheadNoResults": "typeaheadNoResults"; "typeaheadOnSelect": "typeaheadOnSelect"; "typeaheadOnPreview": "typeaheadOnPreview"; "typeaheadOnBlur": "typeaheadOnBlur"; }, never, never, true, never>;
}

declare class TypeaheadOptions {
    placement: string;
    animation: boolean;
    typeaheadRef: TypeaheadDirective;
    constructor(options: TypeaheadOptions);
}

declare function latinize(str: string): string;
declare function escapeRegexp(queryToEscape: string): string;
declare function tokenize(str: string, wordRegexDelimiters?: string, phraseRegexDelimiters?: string, delimitersForMultipleSearch?: string): Array<string>;
declare function getValueFromObject(object: string | Record<string | number, any>, option?: string): string;

declare class TypeaheadModule {
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TypeaheadModule, never>;
    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<TypeaheadModule, never, [typeof i1.CommonModule, typeof TypeaheadContainerComponent, typeof TypeaheadDirective], [typeof TypeaheadContainerComponent, typeof TypeaheadDirective]>;
    static ɵinj: _angular_core.ɵɵInjectorDeclaration<TypeaheadModule>;
}

export { TypeaheadConfig, TypeaheadContainerComponent, TypeaheadDirective, TypeaheadMatch, TypeaheadModule, TypeaheadOptions, escapeRegexp, getValueFromObject, latinMap, latinize, tokenize };
export type { TypeaheadOptionItemContext, TypeaheadOptionListContext, TypeaheadOrder, TypeaheadTemplateMethods };