@elderbyte/ngx-starter 17.10.0 → 17.11.0-beta2

package/lib/common/data/filters/filter-commons.d.ts

@@ -0,0 +1,12 @@
+import { FilterValue } from './filter-value';
+/***************************************************************************
+ *                                                                         *
+ * Common functions                                                        *
+ *                                                                         *
+ **************************************************************************/
+export default class FilterCommons {
+    static isArrayAndNotEmpty(value: FilterValue): boolean;
+    static isArray(value: FilterValue): boolean;
+    static isNotEmptyArray(value: FilterValue): boolean;
+    static getValuesIfArrayElseEmpty(value: FilterValue): string[];
+}

package/lib/common/data/filters/filter-value.d.ts

@@ -0,0 +1 @@
+export type FilterValue = string | string[] | null;

package/lib/common/format/curency-format-util.d.ts

@@ -0,0 +1,24 @@
+import { CurrencyCode } from '../../components/currency/model/currency-code';
+import { Currency } from '../../components/currency/model/currency';
+export type CurrencyIndication = 'code' | 'symbol' | 'symbol-narrow' | string;
+export declare class CurrencyFormatUtil {
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    /**
+     * @param currency amount and ISO 4217 currency code to format
+     * @param locale locale code for formatting rules (e.g. en-US)
+     * @param indication determines currency indicator in output (e.g. USD100 vs $100). Will fall back to 'symbol' if missing.
+     * @param digitsInfo see DecimalPipe for documentation
+     */
+    static formatElderCurrency(currency: Currency, locale: string, indication?: CurrencyIndication, digitsInfo?: string): string;
+    static determineCurrencySymbol(currencyCode: CurrencyCode, locale: string): string;
+    /***************************************************************************
+     *                                                                         *
+     * Private methods                                                         *
+     *                                                                         *
+     **************************************************************************/
+    private static determineCurrencyIndicator;
+}

package/lib/common/format/duration-format-util.d.ts

@@ -0,0 +1,23 @@
+import { Duration, Period } from '@js-joda/core';
+import { PeriodDuration } from '../time/period-duration';
+export declare class DurationFormatUtil {
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    /**
+     * Converts any valid input of standard ISO 8601 duration format
+     * example input: PT2H10M12.1235675S, output: 2h, 10min, 12s, 124 ms
+     *
+     * a maximal input looks like this: P3Y6M4DT12H30M5S although
+     *  all arguments except P are optional, decimal numbers allowed
+     */
+    static formatDuration(value: string | Duration | Period | PeriodDuration, format?: string): string;
+    /***************************************************************************
+     *                                                                         *
+     * Private methods                                                         *
+     *                                                                         *
+     **************************************************************************/
+    private static toPeriodDuration;
+}

package/lib/common/format/iso-interval-format-util.d.ts

@@ -0,0 +1,22 @@
+import { Interval } from '../time/interval';
+import { ZoneId } from '@js-joda/core';
+export declare class IsoIntervalFormatUtil {
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    static formatIsoInterval(value: string | Interval, timezone: string | ZoneId, locale: string, format?: string, formatEnd?: string): string | null;
+    /***************************************************************************
+     *                                                                         *
+     * Private methods                                                         *
+     *                                                                         *
+     **************************************************************************/
+    private static determineDisplayMode;
+    private static formatSubDay;
+    private static formatFullDays;
+    private static formatDetailedInterval;
+    private static formatInstant;
+    private static formatDate;
+    private static isPartialDay;
+}

package/lib/common/format/public_api.d.ts

@@ -1,2 +1,5 @@
 export * from './bytes-per-second-format';
 export * from './bytes-format';
+export * from './curency-format-util';
+export * from './iso-interval-format-util';
+export * from './duration-format-util';

package/lib/components/badge/elder-badge.directive.d.ts

@@ -1,4 +1,4 @@
-import { ViewContainerRef, OnInit, DestroyRef } from '@angular/core';
+import { DestroyRef, OnInit, ViewContainerRef } from '@angular/core';
 import { BadgeAvatarSpec, BadgeColorSpec } from './elder-badge/elder-badge.component';
 import { DomSanitizer, SafeStyle } from '@angular/platform-browser';
 import { MatBadge } from '@angular/material/badge';
@@ -14,6 +14,7 @@ export declare class ElderBadgeDirective implements OnInit {
      * Fields                                                                  *
      *                                                                         *
      **************************************************************************/
+    private readonly log;
     private readonly value$;
     private readonly colorSpec$;
     private readonly avatarSpec$;
@@ -45,6 +46,14 @@ export declare class ElderBadgeDirective implements OnInit {
     set elderBadge(value: any);
     set colorSpec(spec: BadgeColorSpec);
     set avatarSpec(spec: BadgeAvatarSpec);
+    /***************************************************************************
+     *                                                                         *
+     * Private methods                                                         *
+     *                                                                         *
+     **************************************************************************/
+    private bindToElderBadge;
+    private replaceMatBadgeWithElderBadge;
+    private createElderBadgeComponent;
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderBadgeDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ElderBadgeDirective, "[elderBadge]", never, { "badgeColor": { "alias": "badgeColor"; "required": false; }; "badgeIcon": { "alias": "badgeIcon"; "required": false; }; "elderBadge": { "alias": "elderBadge"; "required": false; }; "colorSpec": { "alias": "colorSpec"; "required": false; }; "avatarSpec": { "alias": "avatarSpec"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/components/currency/elder-currency.pipe.d.ts

@@ -1,21 +1,24 @@
 import { PipeTransform } from '@angular/core';
-import { CurrencyPipe } from '@angular/common';
 import { Currency } from './model/currency';
+import { CurrencyIndication } from '../../common/format/curency-format-util';
 import * as i0 from "@angular/core";
 export declare class ElderCurrencyPipe implements PipeTransform {
-    private readonly currencyPipe;
+    private _locale;
     /***************************************************************************
      *                                                                         *
      * Constructor                                                             *
      *                                                                         *
      **************************************************************************/
-    constructor(currencyPipe: CurrencyPipe);
+    constructor(_locale: string);
     /***************************************************************************
      *                                                                         *
      * Public API                                                              *
      *                                                                         *
      **************************************************************************/
-    transform(currency: Currency, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): string;
+    /**
+     * @see formatElderCurrency
+     */
+    transform(currency: Currency, display?: CurrencyIndication, digitsInfo?: string, locale?: string): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderCurrencyPipe, never>;
     static ɵpipe: i0.ɵɵPipeDeclaration<ElderCurrencyPipe, "elderCurrency", true>;
 }

package/lib/components/forms/directives/elder-initial-value.directive.d.ts

@@ -1,5 +1,6 @@
 import { OnDestroy } from '@angular/core';
 import { NgModel } from '@angular/forms';
+import { Observable } from 'rxjs';
 import * as i0 from "@angular/core";
 /**
  * Search name adapter for input controls.
@@ -14,7 +15,7 @@ export declare class ElderInitialValueDirective implements OnDestroy {
     private readonly log;
     private initialValue$;
     private readonly destroy$;
-    private readonly initialDone$;
+    private readonly _initialDone$;
     /***************************************************************************
      *                                                                         *
      * Constructor                                                             *
@@ -31,7 +32,8 @@ export declare class ElderInitialValueDirective implements OnDestroy {
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
-    get valueChanges$(): import("rxjs").Observable<any>;
+    get initialDone$(): Observable<void>;
+    get valueChanges$(): Observable<any>;
     setValue(value: any): void;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderInitialValueDirective, [{ host: true; }]>;

package/lib/components/forms/search/domain/input/input-value.d.ts

@@ -0,0 +1 @@
+export type InputValue = string[] | string | null;

package/lib/components/forms/search/domain/input/search-input-state.d.ts

@@ -1,3 +1,4 @@
+import { Filter } from '../../../../../common/data/filters/filter';
 /**
  * Immutable representation of the state of an search input
  */
@@ -6,14 +7,18 @@ export declare class SearchInputState {
      * attribute The name name
      */
     readonly attribute: string;
+    /**
+     * queryKey The query key
+     */
+    readonly queryKey: string;
     /**
      * queryValue The query value as string. Supports multi string value.
      */
     readonly queryValue: string | string[] | null;
     /**
-     * queryKey The query key
+     * value of the input
      */
-    readonly queryKey: string;
+    readonly filters: Filter[];
     /**
      * pristine Has the user touched this?
      */
@@ -22,6 +27,7 @@ export declare class SearchInputState {
      * Was the input changed by a user interaction
      */
     readonly userEvent: boolean;
+    static of(attribute: string, queryKey: string, queryValue: string | string[] | null, filters: Filter[], pristine: boolean, userEvent: boolean): SearchInputState;
     static unknown(): SearchInputState;
     /***************************************************************************
      *                                                                         *
@@ -33,14 +39,18 @@ export declare class SearchInputState {
      * attribute The name name
      */
     attribute: string, 
+    /**
+     * queryKey The query key
+     */
+    queryKey: string, 
     /**
      * queryValue The query value as string. Supports multi string value.
      */
     queryValue: string | string[] | null, 
     /**
-     * queryKey The query key
+     * value of the input
      */
-    queryKey: string, 
+    filters: Filter[], 
     /**
      * pristine Has the user touched this?
      */

package/lib/components/forms/search/domain/input/search-input.d.ts

@@ -1,5 +1,6 @@
 import { Observable } from 'rxjs/internal/Observable';
 import { SearchInputState } from './search-input-state';
+import { Filter } from '../../../../../common/data/filters/filter';
 /**
  * Represents a single search control.
  */
@@ -8,6 +9,10 @@ export interface SearchInput {
      * The search input name
      */
     readonly name: string;
+    /**
+     * The search input name query key
+     */
+    readonly queryKey?: string;
     readonly state$: Observable<SearchInputState>;
     /**
      * States if the search name is cannot be changed.
@@ -17,5 +22,5 @@ export interface SearchInput {
      * Reset the name value
      */
     reset(): void;
-    setValue(value: string | string[] | null): void;
+    applyFilters(filters: Filter[]): void;
 }

package/lib/components/forms/search/elder-search-context.directive.d.ts

@@ -22,12 +22,13 @@ export declare class ElderSearchContextDirective implements OnInit, AfterViewIni
      *                                                                         *
      **************************************************************************/
     private readonly log;
-    private readonly filtersToApplyAtRegistration;
+    private readonly initialFilters;
+    private initialFiltersRegistered;
     private readonly _searchInputs$;
     private readonly _searchStates$;
     private readonly _filterContext$;
     private readonly _searchContext$;
-    private readonly searchContextId$;
+    private readonly _searchContextId$;
     /***************************************************************************
      *                                                                         *
      * Constructor                                                             *
@@ -48,6 +49,7 @@ export declare class ElderSearchContextDirective implements OnInit, AfterViewIni
      **************************************************************************/
     set searchContextId(contextId: string);
     get searchContextId(): string;
+    get searchContextId$(): Observable<string>;
     get searchContext$(): Observable<SearchContext>;
     get searchContext(): SearchContext;
     set filterContext(value: FilterContext | '');
@@ -83,6 +85,7 @@ export declare class ElderSearchContextDirective implements OnInit, AfterViewIni
      * Private                                                                 *
      *                                                                         *
      **************************************************************************/
+    searchInputs(): SearchInput[];
     private applyDefaultFiltersToSearchContext;
     private applyAsDefaultsUntilUserAction;
     private syncSearchInputsToSearchContext;
@@ -90,6 +93,8 @@ export declare class ElderSearchContextDirective implements OnInit, AfterViewIni
     private applyToBoundFilterContext;
     private applySearchContextToInputs;
     private applyFiltersToInputs;
+    private saveInitialFitlers;
+    private buildFilterValueMap;
     private searchInputsByName;
     private convertToFilters;
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderSearchContextDirective, never>;

package/lib/components/forms/search/elder-search-input.directive.d.ts

@@ -6,6 +6,8 @@ import { SearchInput } from './domain/input/search-input';
 import { SearchInputState } from './domain/input/search-input-state';
 import { LocalPagedDataSource } from '../../../common/data/datasource/local/local-paged-data-source';
 import { BooleanInput } from '@angular/cdk/coercion';
+import { InputFilterConverter } from './filter/input-filter-converter';
+import { Filter } from '../../../common/data/filters/filter';
 import * as i0 from "@angular/core";
 /**
  * Search name adapter for input controls.
@@ -13,16 +15,13 @@ import * as i0 from "@angular/core";
 export declare class ElderSearchInputDirective implements SearchInput, OnInit, AfterViewInit, OnDestroy {
     private searchContext;
     private ngModel;
-    private readonly initialValueDirective;
+    private readonly _initialValueDirective;
     /***************************************************************************
      *                                                                         *
      * Fields                                                                  *
      *                                                                         *
      **************************************************************************/
-    /**
-     * (Optional) Usually the control name is used, this allows a custom query key
-     */
-    queryKey: string;
+    private _queryKey$;
     /**
      * (Optional) Function which transforms the value object to a query param value
      */
@@ -38,7 +37,9 @@ export declare class ElderSearchInputDirective implements SearchInput, OnInit, A
      */
     fallbackValue: string | string[];
     valueAsId: BooleanInput;
+    private _inputConverter;
     private readonly _state$;
+    private readonly _name$;
     private _extractedName;
     private readonly destroy$;
     private readonly log;
@@ -61,8 +62,17 @@ export declare class ElderSearchInputDirective implements SearchInput, OnInit, A
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
+    /**
+     * (Optional) Usually the control name is used, this allows a custom query key
+     */
+    set queryKey(value: string);
+    get queryKey(): string;
+    get queryKey$(): Observable<string>;
+    set inputConverter(inputConverter: InputFilterConverter);
+    get initialDone$(): Observable<void>;
     get state$(): Observable<SearchInputState>;
     get name(): string;
+    get name$(): Observable<string>;
     get value(): any;
     get readonly(): boolean;
     private get hasFallback();
@@ -71,13 +81,14 @@ export declare class ElderSearchInputDirective implements SearchInput, OnInit, A
      * Public API                                                              *
      *                                                                         *
      **************************************************************************/
-    setValue(queryString: string | string[] | null): void;
+    applyFilters(filters: Filter[]): void;
     reset(): void;
     /***************************************************************************
      *                                                                         *
      * Private methods                                                         *
      *                                                                         *
      **************************************************************************/
+    private setInputValue;
     private get valueChanges$();
     private buildInputStateObservable;
     private buildInputState;
@@ -92,5 +103,5 @@ export declare class ElderSearchInputDirective implements SearchInput, OnInit, A
     private extractName;
     private concatIfNecessary;
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderSearchInputDirective, [null, { host: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ElderSearchInputDirective, "[elderSearchInput]", ["elderSearchInput"], { "queryKey": { "alias": "elderSearchInputKey"; "required": false; }; "valueTransform": { "alias": "elderSearchInputTransform"; "required": false; }; "resolvePath": { "alias": "elderSearchInput"; "required": false; }; "dataSource": { "alias": "dataSource"; "required": false; }; "fallbackValue": { "alias": "elderSearchInputFallback"; "required": false; }; "valueAsId": { "alias": "valueAsId"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ElderSearchInputDirective, "[elderSearchInput]", ["elderSearchInput"], { "valueTransform": { "alias": "elderSearchInputTransform"; "required": false; }; "resolvePath": { "alias": "elderSearchInput"; "required": false; }; "dataSource": { "alias": "dataSource"; "required": false; }; "fallbackValue": { "alias": "elderSearchInputFallback"; "required": false; }; "valueAsId": { "alias": "valueAsId"; "required": false; }; "queryKey": { "alias": "elderSearchInputKey"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/components/forms/search/filter/default-input-filter-converter.d.ts

@@ -0,0 +1,31 @@
+import { InputFilterConverter } from './input-filter-converter';
+import { InputValue } from '../domain/input/input-value';
+import { Filter } from '../../../../common/data/filters/filter';
+export default class DefaultInputFilterConverter implements InputFilterConverter {
+    private readonly queryKeyProviderFn;
+    /***************************************************************************
+     *                                                                         *
+     * Static Builders                                                         *
+     *                                                                         *
+     **************************************************************************/
+    static of(queryKeyProviderFn: () => string): DefaultInputFilterConverter;
+    /***************************************************************************
+     *                                                                         *
+     * Constructors                                                            *
+     *                                                                         *
+     **************************************************************************/
+    private constructor();
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    convertToFilters(inputValue: InputValue): Filter[];
+    convertToValue(filters: Filter[]): InputValue;
+    /***************************************************************************
+     *                                                                         *
+     * Private methods                                                         *
+     *                                                                         *
+     **************************************************************************/
+    private queryKey;
+}

package/lib/components/forms/search/filter/include-exclude-input-converter.d.ts

@@ -0,0 +1,78 @@
+import { InputFilterConverter } from './input-filter-converter';
+import { Filter } from '../../../../common/data/filters/filter';
+import { InputValue } from '../domain/input/input-value';
+import { Observable } from 'rxjs';
+import { ElderChipFilterEntity } from '../../../select/filter/elder-chips-filter.directive';
+export default class IncludeExcludeInputConverter implements InputFilterConverter {
+    readonly queryKey: string;
+    private includeSuffix;
+    private excludeSuffix;
+    /***************************************************************************
+     *                                                                         *
+     * Fields                                                                  *
+     *                                                                         *
+     **************************************************************************/
+    private readonly selections$;
+    private readonly _mergedSelections$;
+    /***************************************************************************
+     *                                                                         *
+     * Static Builders                                                         *
+     *                                                                         *
+     **************************************************************************/
+    static from(queryKey: string, includeSuffix: string, excludeSuffix: string): IncludeExcludeInputConverter;
+    /***************************************************************************
+     *                                                                         *
+     * Constructors                                                            *
+     *                                                                         *
+     **************************************************************************/
+    private constructor();
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    convertToValue(filters: Filter[]): InputValue;
+    convertToFilters(inputValue: InputValue): Filter[];
+    /***************************************************************************
+     *                                                                         *
+     * Properties                                                              *
+     *                                                                         *
+     **************************************************************************/
+    set selection(selection: Map<string, ElderChipFilterEntity>);
+    get mergedSelections$(): Observable<Map<string, ElderChipFilterEntity>>;
+    get includeQueryKey(): string;
+    get excludeQueryKey(): string;
+    /***************************************************************************
+     *                                                                         *
+     * Private Methods                                                         *
+     *                                                                         *
+     **************************************************************************/
+    private findValueOrDefault;
+    private convertFiltersToMap;
+    private flattenFilterValues;
+    private replaceEmptyArrayWithNull;
+    private validateArrayAndReturn;
+    private isIncluded;
+    private isExcluded;
+    private addAllSelections;
+    /***************************************************************************
+     *                                                                         *
+     * Split                                                                   *
+     *                                                                         *
+     **************************************************************************/
+    /**
+     * If the filter before split is an empty array, include will be set to empty and exclude to null
+     * Else, an empty array will always be set to null
+     */
+    private buildFilters;
+    private buildSplitIncludeValues;
+    private buildSplitExcludeValues;
+    /***************************************************************************
+     *                                                                         *
+     * Merge                                                                   *
+     *                                                                         *
+     **************************************************************************/
+    private mergeValues;
+    private buildMergeIncludeValues;
+    private buildMergeExcludeValues;
+}

package/lib/components/forms/search/filter/input-filter-converter.d.ts

@@ -0,0 +1,16 @@
+import { Filter } from '../../../../common/data/filters/filter';
+import { InputValue } from '../domain/input/input-value';
+export interface InputFilterConverter {
+    /**
+     * Convert the Input Value to one or more Filters.
+     * Multiple Filters are returned in special cases such as include/exclude.
+     * @param inputValue
+     */
+    convertToFilters(inputValue: InputValue): Filter[];
+    /**
+     * Pick the relevant filters and convert to the InputValue.
+     * Usually an Input consumes one filter, but advanced cases can consume more.
+     * @param filter
+     */
+    convertToValue(filter: Filter[]): InputValue;
+}

package/lib/components/input/autocomplete/elder-autocomplete/elder-autocomplete-option-selected.d.ts

@@ -1,8 +1,8 @@
-import { ElderAutocompleteComponent } from './elder-autocomplete.component';
+import { ElderSuggestionPanelComponent } from './elder-suggestion-panel.component';
 export declare class ElderAutocompleteOptionSelected<T = any, TId = any> {
-    readonly source: ElderAutocompleteComponent<T, TId>;
+    readonly source: ElderSuggestionPanelComponent<T, TId>;
     readonly entityId: TId;
     readonly entity: T;
     readonly optionValue: any;
-    constructor(source: ElderAutocompleteComponent<T, TId>, entityId: TId, entity: T, optionValue: any);
+    constructor(source: ElderSuggestionPanelComponent<T, TId>, entityId: TId, entity: T, optionValue: any);
 }

package/lib/components/input/autocomplete/elder-autocomplete/{elder-autocomplete.component.d.ts → elder-suggestion-panel.component.d.ts}

@@ -1,19 +1,23 @@
-import { NgZone, TemplateRef } from '@angular/core';
+import { DestroyRef, NgZone, TemplateRef } from '@angular/core';
 import { BehaviorSubject, Observable, Subject } from 'rxjs';
 import { IDataContext } from '../../../../common/data/data-context/data-context';
+import { BooleanInput } from '@angular/cdk/coercion';
 import { DataContextStatus } from '../../../../common/data/data-context/data-context-status';
 import { MatAutocomplete, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
 import { ElderAutocompleteOptionSelected } from './elder-autocomplete-option-selected';
+import { IDataSource } from '../../../../common/data/datasource/data-source';
 import * as i0 from "@angular/core";
 type TextResolverFn = (value: any) => string;
-export declare class ElderAutocompleteComponent<T = any, TId = any> {
+export declare class ElderSuggestionPanelComponent<T = any, TId = any> {
     private readonly zone;
+    private destroyRef;
     /***************************************************************************
      *                                                                         *
      * Fields                                                                  *
      *                                                                         *
      **************************************************************************/
     private readonly logger;
+    private readonly PAGE_SIZE;
     /**
      * Is this auto-complete enabled?
      */
@@ -35,28 +39,32 @@ export declare class ElderAutocompleteComponent<T = any, TId = any> {
      * The DataContext which holds the autocomplete suggestions.
      */
     readonly dataContext$: BehaviorSubject<IDataContext<T>>;
+    readonly dataSource$: BehaviorSubject<IDataSource<T>>;
     readonly triggerReload$: Subject<any>;
     readonly displayPropertyResolver$: BehaviorSubject<TextResolverFn>;
     readonly dataState$: Observable<DataContextStatus>;
     readonly availableSuggestions$: Observable<T[]>;
     readonly optionSelected: Subject<ElderAutocompleteOptionSelected<any, any>>;
+    private readonly hiddenOptionsCount$;
     /***************************************************************************
      *                                                                         *
      * Constructor                                                             *
      *                                                                         *
      **************************************************************************/
-    constructor(zone: NgZone);
+    constructor(zone: NgZone, destroyRef: DestroyRef);
     /***************************************************************************
      *                                                                         *
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
-    set enabled(value: boolean);
+    set enabled(value: BooleanInput);
     get enabled(): boolean;
     set valueTemplate(template: TemplateRef<any>);
     get valueTemplate(): TemplateRef<any>;
     set dataContext(data: IDataContext<T>);
     get dataContext(): IDataContext<T>;
+    set dataSource(dataSource: IDataSource<T>);
+    get dataSource(): IDataSource<T>;
     set displayPropertyResolver(resolver: TextResolverFn);
     /***************************************************************************
      *                                                                         *
@@ -71,6 +79,7 @@ export declare class ElderAutocompleteComponent<T = any, TId = any> {
     getId(value: T): TId;
     isOptionAvailable(option: T): boolean;
     isOptionVisible(option: T): boolean;
+    isOptionHidden(option: T): boolean;
     toOptionValue(option: T): any;
     /***************************************************************************
      *                                                                         *
@@ -81,7 +90,9 @@ export declare class ElderAutocompleteComponent<T = any, TId = any> {
      * TODO Duplicate in elder-select
      */
     private propertyStringValue;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ElderAutocompleteComponent<any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ElderAutocompleteComponent<any, any>, "elder-autocomplete", ["elderAutocomplete"], { "isOptionDisabledFn": { "alias": "isOptionDisabledFn"; "required": false; }; "isOptionHiddenFn": { "alias": "isOptionHiddenFn"; "required": false; }; "optionValueConverterFn": { "alias": "optionValueConverterFn"; "required": false; }; "enabled": { "alias": "enabled"; "required": false; }; "valueTemplate": { "alias": "valueTemplate"; "required": false; }; "dataContext": { "alias": "dataContext"; "required": false; }; "displayPropertyResolver": { "alias": "displayPropertyResolver"; "required": false; }; }, { "optionSelected": "optionSelected"; }, ["valueTemplateQuery"], never, true, never>;
+    private buildDataContextWithPageSize;
+    private calculatePageSize;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ElderSuggestionPanelComponent<any, any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ElderSuggestionPanelComponent<any, any>, "elder-suggestion-panel", ["elderSuggestionPanel"], { "isOptionDisabledFn": { "alias": "isOptionDisabledFn"; "required": false; }; "isOptionHiddenFn": { "alias": "isOptionHiddenFn"; "required": false; }; "optionValueConverterFn": { "alias": "optionValueConverterFn"; "required": false; }; "enabled": { "alias": "enabled"; "required": false; }; "valueTemplate": { "alias": "valueTemplate"; "required": false; }; "dataContext": { "alias": "dataContext"; "required": false; }; "dataSource": { "alias": "dataSource"; "required": false; }; "displayPropertyResolver": { "alias": "displayPropertyResolver"; "required": false; }; }, { "optionSelected": "optionSelected"; }, ["valueTemplateQuery"], never, true, never>;
 }
 export {};

package/lib/components/input/autocomplete/elder-autocomplete-many.directive.d.ts

@@ -1,6 +1,6 @@
 import { ElementRef, OnDestroy, OnInit } from '@angular/core';
 import { Subject } from 'rxjs';
-import { ElderAutocompleteComponent } from './elder-autocomplete/elder-autocomplete.component';
+import { ElderSuggestionPanelComponent } from './elder-autocomplete/elder-suggestion-panel.component';
 import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
 import { Filter } from '../../../common/data/filters/filter';
 import { Sort } from '../../../common/data/sort';
@@ -41,8 +41,8 @@ export declare class ElderAutocompleteManyDirective<T> implements OnInit, OnDest
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
-    set autocomplete(auto: ElderAutocompleteComponent);
-    get autocomplete(): ElderAutocompleteComponent;
+    set autocomplete(auto: ElderSuggestionPanelComponent);
+    get autocomplete(): ElderSuggestionPanelComponent;
     private get cursorPosition();
     private set cursorPosition(value);
     private get dataContext();