@elderbyte/ngx-starter 17.10.0 → 17.11.0-beta

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/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/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 { InputConverter } from './filter/input-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,10 +37,24 @@ 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;
+    /***************************************************************************
+     *                                                                         *
+     * 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 filterSplitterMeger(inputConverter: InputConverter);
     /***************************************************************************
      *                                                                         *
      * Constructor                                                             *
@@ -61,8 +74,10 @@ export declare class ElderSearchInputDirective implements SearchInput, OnInit, A
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
+    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 +86,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 +108,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-converter.d.ts

@@ -0,0 +1,20 @@
+import { InputConverter } from './input-converter';
+import { InputValue } from '../domain/input/input-value';
+import { Filter } from '../../../../common/data/filters/filter';
+export default class DefaultInputConverter implements InputConverter {
+    readonly queryKey: string;
+    /***************************************************************************
+     *                                                                         *
+     * Static Builders                                                         *
+     *                                                                         *
+     **************************************************************************/
+    static of(queryKey: string): DefaultInputConverter;
+    /***************************************************************************
+     *                                                                         *
+     * Constructors                                                            *
+     *                                                                         *
+     **************************************************************************/
+    private constructor();
+    convertToFilters(inputValue: InputValue): Filter[];
+    convertToValue(filters: Filter[]): InputValue;
+}

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

@@ -0,0 +1,78 @@
+import { InputConverter } from './input-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 InputConverter {
+    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-converter.d.ts

@@ -0,0 +1,7 @@
+import { Filter } from '../../../../common/data/filters/filter';
+import { InputValue } from '../domain/input/input-value';
+export interface InputConverter {
+    queryKey: string;
+    convertToFilters(inputValue: InputValue): 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();

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

@@ -1,6 +1,6 @@
 import { OnDestroy, OnInit } from '@angular/core';
 import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
-import { ElderAutocompleteComponent } from './elder-autocomplete/elder-autocomplete.component';
+import { ElderSuggestionPanelComponent } from './elder-autocomplete/elder-suggestion-panel.component';
 import { Subject } from 'rxjs';
 import { Filter } from '../../../common/data/filters/filter';
 import { IDataContext } from '../../../common/data/data-context/data-context';
@@ -46,8 +46,8 @@ export declare class ElderAutocompleteDirective implements OnInit, OnDestroy {
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
-    set autocomplete(auto: ElderAutocompleteComponent);
-    get autocomplete(): ElderAutocompleteComponent;
+    set autocomplete(auto: ElderSuggestionPanelComponent);
+    get autocomplete(): ElderSuggestionPanelComponent;
     get dataContext(): IDataContext<any>;
     /***************************************************************************
      *                                                                         *

package/lib/components/input/autocomplete/elder-autocomplete.module.d.ts

@@ -6,14 +6,14 @@ import * as i4 from "@angular/material/autocomplete";
 import * as i5 from "../../infinitescroll/elder-infinite-scroll.module";
 import * as i6 from "@angular/material/icon";
 import * as i7 from "@angular/material/progress-bar";
-import * as i8 from "./elder-autocomplete/elder-autocomplete.component";
+import * as i8 from "./elder-autocomplete/elder-suggestion-panel.component";
 import * as i9 from "./elder-autocomplete.directive";
 import * as i10 from "./elder-autocomplete-many.directive";
-export { ElderAutocompleteComponent } from './elder-autocomplete/elder-autocomplete.component';
+export { ElderSuggestionPanelComponent } from './elder-autocomplete/elder-suggestion-panel.component';
 export { ElderAutocompleteManyDirective } from './elder-autocomplete-many.directive';
 export { ElderAutocompleteDirective } from './elder-autocomplete.directive';
 export declare class ElderAutocompleteModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderAutocompleteModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ElderAutocompleteModule, never, [typeof i1.CommonModule, typeof i2.ReactiveFormsModule, typeof i3.MatInputModule, typeof i4.MatAutocompleteModule, typeof i5.ElderInfiniteScrollModule, typeof i6.MatIconModule, typeof i7.MatProgressBarModule, typeof i8.ElderAutocompleteComponent, typeof i9.ElderAutocompleteDirective, typeof i10.ElderAutocompleteManyDirective], [typeof i8.ElderAutocompleteComponent, typeof i9.ElderAutocompleteDirective, typeof i10.ElderAutocompleteManyDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ElderAutocompleteModule, never, [typeof i1.CommonModule, typeof i2.ReactiveFormsModule, typeof i3.MatInputModule, typeof i4.MatAutocompleteModule, typeof i5.ElderInfiniteScrollModule, typeof i6.MatIconModule, typeof i7.MatProgressBarModule, typeof i8.ElderSuggestionPanelComponent, typeof i9.ElderAutocompleteDirective, typeof i10.ElderAutocompleteManyDirective], [typeof i8.ElderSuggestionPanelComponent, typeof i9.ElderAutocompleteDirective, typeof i10.ElderAutocompleteManyDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ElderAutocompleteModule>;
 }

package/lib/components/select/auto/elder-auto-select-first.directive.d.ts

@@ -1,8 +1,10 @@
 import { AfterViewInit } from '@angular/core';
 import { ElderSelectComponent } from '../single/elder-select/elder-select.component';
+import { ElderAutoSelectFirstService } from './elder-auto-select-first.service';
 import * as i0 from "@angular/core";
 export declare class ElderAutoSelectFirstDirective<TEntity = any, TId = any> implements AfterViewInit {
     readonly elderSelect: ElderSelectComponent<TEntity, TId, any>;
+    private readonly autoSelectFirstService;
     /***************************************************************************
      *                                                                         *
      * Fields                                                                  *
@@ -15,7 +17,7 @@ export declare class ElderAutoSelectFirstDirective<TEntity = any, TId = any> imp
      * Constructor                                                             *
      *                                                                         *
      **************************************************************************/
-    constructor(elderSelect: ElderSelectComponent<TEntity, TId, any>);
+    constructor(elderSelect: ElderSelectComponent<TEntity, TId, any>, autoSelectFirstService: ElderAutoSelectFirstService<TEntity>);
     /***************************************************************************
      *                                                                         *
      * Life Cycle                                                              *
@@ -34,6 +36,12 @@ export declare class ElderAutoSelectFirstDirective<TEntity = any, TId = any> imp
     set autoSelectFirstEnabled(val: boolean | string);
     set enabled(val: boolean);
     get enabled(): boolean;
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    forceReloadFirst(): void;
     /***************************************************************************
      *                                                                         *
      * Private methods                                                         *

package/lib/components/select/auto/elder-auto-select-first.service.d.ts

@@ -0,0 +1,23 @@
+import { BehaviorSubject } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare class ElderAutoSelectFirstService<TEntity> {
+    private readonly _firstItem$;
+    private readonly _enabled$;
+    constructor();
+    /***************************************************************************
+     *                                                                         *
+     * Public API                                                              *
+     *                                                                         *
+     **************************************************************************/
+    suggestFirstItem(entity: TEntity): void;
+    /***************************************************************************
+     *                                                                         *
+     * Properties                                                              *
+     *                                                                         *
+     **************************************************************************/
+    set enabled(enabled: boolean);
+    get enabled$(): import("rxjs").Observable<boolean>;
+    get firstItem$(): BehaviorSubject<TEntity>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ElderAutoSelectFirstService<any>, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ElderAutoSelectFirstService<any>>;
+}