ng2-completer - npm Package Compare versions

Comparing version 9.0.0 to 9.0.1

esm2015/ng2-completer.js

@@ -5,8 +5,9 @@ /**
  */
-import { EventEmitter, ɵɵdefineInjectable, ɵɵinject, ɵɵdefineDirective, ɵɵdirectiveInject, ElementRef, NgZone, ɵɵlistener, TemplateRef, ViewContainerRef, ChangeDetectorRef, Renderer2, ɵɵdefineComponent, ɵɵelementStart, ɵɵtemplate, ɵɵelementEnd, ɵɵproperty, ɵɵpureFunction2, ɵɵadvance, ɵɵtext, ɵɵnextContext, ɵɵtextInterpolate, forwardRef, ɵɵviewQuery, ɵɵqueryRefresh, ɵɵloadQuery, ɵɵProvidersFeature, ɵɵattribute, ɵɵelement, ɵɵpureFunction1, ɵɵpropertyInterpolate, ɵɵsanitizeUrl, ɵɵdefineNgModule, ɵɵdefineInjector, ɵɵsetNgModuleScope } from '@angular/core';
+import { EventEmitter, Injectable, Output, Directive, HostListener, Host, ElementRef, NgZone, Input, TemplateRef, ViewContainerRef, ChangeDetectorRef, Renderer2, Component, forwardRef, ViewChild, NgModule } from '@angular/core';
 import { Subject, Observable, timer } from 'rxjs';
 import { catchError, map, take } from 'rxjs/operators';
+import { __decorate, __metadata, __param } from 'tslib';
 import { HttpClient } from '@angular/common/http';
-import { NgModel, NG_VALUE_ACCESSOR, FormControl, DefaultValueAccessor, NgControlStatus, MaxLengthValidator, FormsModule } from '@angular/forms';
-import { NgClass, NgForOf, NgIf, CommonModule } from '@angular/common';
+import { NgModel, NG_VALUE_ACCESSOR, FormControl, FormsModule } from '@angular/forms';
+import { CommonModule } from '@angular/common';
 
@@ -239,11 +240,12 @@ const MAX_CHARS = 524288; // the default max length per the html maxlength attribute
 
-class LocalDataFactory {
+let LocalDataFactory = class LocalDataFactory {
     create() {
         return new LocalData();
     }
-}
-LocalDataFactory.ɵfac = function LocalDataFactory_Factory(t) { return new (t || LocalDataFactory)(); };
-LocalDataFactory.ɵprov = ɵɵdefineInjectable({ token: LocalDataFactory, factory: LocalDataFactory.ɵfac });
+};
+LocalDataFactory = __decorate([
+    Injectable()
+], LocalDataFactory);
 
-class RemoteDataFactory {
+let RemoteDataFactory = class RemoteDataFactory {
     constructor(http) {
@@ -255,7 +257,9 @@ this.http = http;
     }
-}
-RemoteDataFactory.ɵfac = function RemoteDataFactory_Factory(t) { return new (t || RemoteDataFactory)(ɵɵinject(HttpClient)); };
-RemoteDataFactory.ɵprov = ɵɵdefineInjectable({ token: RemoteDataFactory, factory: RemoteDataFactory.ɵfac });
+};
+RemoteDataFactory = __decorate([
+    Injectable(),
+    __metadata("design:paramtypes", [HttpClient])
+], RemoteDataFactory);
 
-class CompleterService {
+let CompleterService = class CompleterService {
     constructor(localDataFactory, // Using any instead of () => LocalData because of AoT errors
@@ -281,7 +285,11 @@ remoteDataFactory // Using any instead of () => LocalData because of AoT errors
     }
-}
-CompleterService.ɵfac = function CompleterService_Factory(t) { return new (t || CompleterService)(ɵɵinject(LocalDataFactory), ɵɵinject(RemoteDataFactory)); };
-CompleterService.ɵprov = ɵɵdefineInjectable({ token: CompleterService, factory: CompleterService.ɵfac });
+};
+CompleterService = __decorate([
+    Injectable(),
+    __metadata("design:paramtypes", [LocalDataFactory,
+        RemoteDataFactory // Using any instead of () => LocalData because of AoT errors
+    ])
+], CompleterService);
 
-class CtrCompleter {
+let CtrCompleter = class CtrCompleter {
     constructor() {
@@ -397,5 +405,24 @@ this.selected = new EventEmitter();
     }
-}
-CtrCompleter.ɵfac = function CtrCompleter_Factory(t) { return new (t || CtrCompleter)(); };
-CtrCompleter.ɵdir = ɵɵdefineDirective({ type: CtrCompleter, selectors: [["", "ctrCompleter", ""]], outputs: { selected: "selected", highlighted: "highlighted", opened: "opened", dataSourceChange: "dataSourceChange" } });
+};
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CtrCompleter.prototype, "selected", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CtrCompleter.prototype, "highlighted", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CtrCompleter.prototype, "opened", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CtrCompleter.prototype, "dataSourceChange", void 0);
+CtrCompleter = __decorate([
+    Directive({
+        selector: "[ctrCompleter]",
+    })
+], CtrCompleter);
 
@@ -408,3 +435,3 @@ class CtrRowItem {
 }
-class CtrDropdown {
+let CtrDropdown = class CtrDropdown {
     constructor(completer, el, zone) {
@@ -545,11 +572,20 @@ this.completer = completer;
     dropdownRowOffsetHeight(row) {
-        let css = getComputedStyle(row.parentElement);
+        const css = getComputedStyle(row.parentElement);
         return row.parentElement.offsetHeight +
             parseInt(css.marginTop, 10) + parseInt(css.marginBottom, 10);
     }
-}
-CtrDropdown.ɵfac = function CtrDropdown_Factory(t) { return new (t || CtrDropdown)(ɵɵdirectiveInject(CtrCompleter, 1), ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(NgZone)); };
-CtrDropdown.ɵdir = ɵɵdefineDirective({ type: CtrDropdown, selectors: [["", "ctrDropdown", ""]], hostBindings: function CtrDropdown_HostBindings(rf, ctx) { if (rf & 1) {
-        ɵɵlistener("mousedown", function CtrDropdown_mousedown_HostBindingHandler($event) { return ctx.onMouseDown($event); });
-    } } });
+};
+__decorate([
+    HostListener("mousedown", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrDropdown.prototype, "onMouseDown", null);
+CtrDropdown = __decorate([
+    Directive({
+        selector: "[ctrDropdown]",
+    }),
+    __param(0, Host()),
+    __metadata("design:paramtypes", [CtrCompleter, ElementRef, NgZone])
+], CtrDropdown);
 
@@ -569,3 +605,3 @@ // keyboard events
 const KEY_F12 = 123;
-class CtrInput {
+let CtrInput = class CtrInput {
     constructor(completer, ngModel, el) {
@@ -751,3 +787,3 @@ this.completer = completer;
         if (this.fillHighlighted) {
-            if (this._displayStr != this.searchStr) {
+            if (this._displayStr !== this.searchStr) {
                 this._displayStr = this.searchStr;
@@ -777,7 +813,82 @@ this.ngModelChange.emit(this.searchStr);
     }
-}
-CtrInput.ɵfac = function CtrInput_Factory(t) { return new (t || CtrInput)(ɵɵdirectiveInject(CtrCompleter, 1), ɵɵdirectiveInject(NgModel), ɵɵdirectiveInject(ElementRef)); };
-CtrInput.ɵdir = ɵɵdefineDirective({ type: CtrInput, selectors: [["", "ctrInput", ""]], hostBindings: function CtrInput_HostBindings(rf, ctx) { if (rf & 1) {
-        ɵɵlistener("keyup", function CtrInput_keyup_HostBindingHandler($event) { return ctx.keyupHandler($event); })("paste", function CtrInput_paste_HostBindingHandler($event) { return ctx.pasteHandler($event); })("keydown", function CtrInput_keydown_HostBindingHandler($event) { return ctx.keydownHandler($event); })("blur", function CtrInput_blur_HostBindingHandler($event) { return ctx.onBlur($event); })("focus", function CtrInput_focus_HostBindingHandler() { return ctx.onfocus(); })("click", function CtrInput_click_HostBindingHandler($event) { return ctx.onClick($event); });
-    } }, inputs: { clearSelected: "clearSelected", clearUnselected: "clearUnselected", overrideSuggested: "overrideSuggested", fillHighlighted: "fillHighlighted", openOnFocus: "openOnFocus", openOnClick: "openOnClick", selectOnClick: "selectOnClick", selectOnFocus: "selectOnFocus" }, outputs: { ngModelChange: "ngModelChange" } });
+};
+__decorate([
+    Input("clearSelected"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "clearSelected", void 0);
+__decorate([
+    Input("clearUnselected"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "clearUnselected", void 0);
+__decorate([
+    Input("overrideSuggested"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "overrideSuggested", void 0);
+__decorate([
+    Input("fillHighlighted"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "fillHighlighted", void 0);
+__decorate([
+    Input("openOnFocus"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "openOnFocus", void 0);
+__decorate([
+    Input("openOnClick"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "openOnClick", void 0);
+__decorate([
+    Input("selectOnClick"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "selectOnClick", void 0);
+__decorate([
+    Input("selectOnFocus"),
+    __metadata("design:type", Object)
+], CtrInput.prototype, "selectOnFocus", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], CtrInput.prototype, "ngModelChange", void 0);
+__decorate([
+    HostListener("keyup", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrInput.prototype, "keyupHandler", null);
+__decorate([
+    HostListener("paste", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrInput.prototype, "pasteHandler", null);
+__decorate([
+    HostListener("keydown", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrInput.prototype, "keydownHandler", null);
+__decorate([
+    HostListener("blur", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrInput.prototype, "onBlur", null);
+__decorate([
+    HostListener("focus", []),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], CtrInput.prototype, "onfocus", null);
+__decorate([
+    HostListener("click", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrInput.prototype, "onClick", null);
+CtrInput = __decorate([
+    Directive({
+        selector: "[ctrInput]",
+    }),
+    __param(0, Host()),
+    __metadata("design:paramtypes", [CtrCompleter, NgModel, ElementRef])
+], CtrInput);
 
@@ -792,3 +903,3 @@ class CtrListContext {
 }
-class CtrList {
+let CtrList = class CtrList {
     constructor(completer, templateRef, viewContainer, cd, zone) {
@@ -824,3 +935,4 @@ this.completer = completer;
     set initialValue(value) {
-        if (this._dataService && typeof this._dataService.convertToItem === "function") {
+        if (this._dataService &&
+            typeof this._dataService.convertToItem === "function") {
             this.zone.run(() => {
@@ -838,3 +950,5 @@ const initialItem = this._dataService && this._dataService.convertToItem(value);
     search(term) {
-        if (!isNil(term) && term.length >= this.ctrListMinSearchLength && this.term !== term) {
+        if (!isNil(term) &&
+            term.length >= this.ctrListMinSearchLength &&
+            this.term !== term) {
             if (this.searchTimer) {
@@ -855,3 +969,5 @@ this.searchTimer.unsubscribe();
             }
-            this.searchTimer = timer(this.ctrListPause).pipe(take(1)).subscribe(() => {
+            this.searchTimer = timer(this.ctrListPause)
+                .pipe(take(1))
+                .subscribe(() => {
                 this.searchTimerComplete(term);
@@ -869,3 +985,5 @@ });
         }
-        this.clearTimer = timer(CLEAR_TIMEOUT).pipe(take(1)).subscribe(() => {
+        this.clearTimer = timer(CLEAR_TIMEOUT)
+            .pipe(take(1))
+            .subscribe(() => {
             this._clear();
@@ -938,11 +1056,13 @@ });
         if (this._dataService) {
-            this._dataService
-                .subscribe((results) => {
+            this._dataService.subscribe((results) => {
                 this.ctx.searchInitialized = true;
                 this.ctx.searching = false;
                 this.ctx.results = results;
-                if (this.ctrListAutoMatch && results &&
-                    results.length === 1 && results[0].title &&
+                if (this.ctrListAutoMatch &&
+                    results &&
+                    results.length === 1 &&
+                    results[0].title &&
                     !isNil(this.term) &&
-                    results[0].title.toLocaleLowerCase() === this.term.toLocaleLowerCase()) {
+                    results[0].title.toLocaleLowerCase() ===
+                        this.term.toLocaleLowerCase()) {
                     // Do automatch
@@ -957,3 +1077,5 @@ this.completer.onSelected(results[0]);
             }, (error) => {
+                // tslint:disable-next-line:no-console
                 console.error(error);
+                // tslint:disable-next-line:no-console
                 console.error("Unexpected error in dataService: errors should be handled by the dataService Observable");
@@ -974,7 +1096,46 @@ return [];
     }
-}
-CtrList.ɵfac = function CtrList_Factory(t) { return new (t || CtrList)(ɵɵdirectiveInject(CtrCompleter, 1), ɵɵdirectiveInject(TemplateRef), ɵɵdirectiveInject(ViewContainerRef), ɵɵdirectiveInject(ChangeDetectorRef), ɵɵdirectiveInject(NgZone)); };
-CtrList.ɵdir = ɵɵdefineDirective({ type: CtrList, selectors: [["", "ctrList", ""]], inputs: { ctrListMinSearchLength: "ctrListMinSearchLength", ctrListPause: "ctrListPause", ctrListAutoMatch: "ctrListAutoMatch", ctrListAutoHighlight: "ctrListAutoHighlight", ctrListDisplaySearching: "ctrListDisplaySearching", dataService: ["ctrList", "dataService"], initialValue: ["ctrListInitialValue", "initialValue"] } });
+};
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CtrList.prototype, "ctrListMinSearchLength", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CtrList.prototype, "ctrListPause", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CtrList.prototype, "ctrListAutoMatch", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CtrList.prototype, "ctrListAutoHighlight", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CtrList.prototype, "ctrListDisplaySearching", void 0);
+__decorate([
+    Input("ctrList"),
+    __metadata("design:type", Object),
+    __metadata("design:paramtypes", [Object])
+], CtrList.prototype, "dataService", null);
+__decorate([
+    Input("ctrListInitialValue"),
+    __metadata("design:type", Object),
+    __metadata("design:paramtypes", [Object])
+], CtrList.prototype, "initialValue", null);
+CtrList = __decorate([
+    Directive({
+        selector: "[ctrList]",
+    }),
+    __param(0, Host()),
+    __metadata("design:paramtypes", [CtrCompleter,
+        TemplateRef,
+        ViewContainerRef,
+        ChangeDetectorRef,
+        NgZone])
+], CtrList);
 
-class CtrRow {
+let CtrRow = class CtrRow {
     constructor(el, renderer, dropdown) {
@@ -1024,21 +1185,40 @@ this.el = el;
     }
-}
-CtrRow.ɵfac = function CtrRow_Factory(t) { return new (t || CtrRow)(ɵɵdirectiveInject(ElementRef), ɵɵdirectiveInject(Renderer2), ɵɵdirectiveInject(CtrDropdown, 1)); };
-CtrRow.ɵdir = ɵɵdefineDirective({ type: CtrRow, selectors: [["", "ctrRow", ""]], hostBindings: function CtrRow_HostBindings(rf, ctx) { if (rf & 1) {
-        ɵɵlistener("click", function CtrRow_click_HostBindingHandler($event) { return ctx.onClick($event); })("mouseenter", function CtrRow_mouseenter_HostBindingHandler($event) { return ctx.onMouseEnter($event); })("mousedown", function CtrRow_mousedown_HostBindingHandler($event) { return ctx.onMouseDown($event); });
-    } }, inputs: { ctrRow: "ctrRow", dataItem: "dataItem" } });
+};
+__decorate([
+    Input(),
+    __metadata("design:type", Number),
+    __metadata("design:paramtypes", [Number])
+], CtrRow.prototype, "ctrRow", null);
+__decorate([
+    Input(),
+    __metadata("design:type", Object),
+    __metadata("design:paramtypes", [Object])
+], CtrRow.prototype, "dataItem", null);
+__decorate([
+    HostListener("click", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrRow.prototype, "onClick", null);
+__decorate([
+    HostListener("mouseenter", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrRow.prototype, "onMouseEnter", null);
+__decorate([
+    HostListener("mousedown", ["$event"]),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CtrRow.prototype, "onMouseDown", null);
+CtrRow = __decorate([
+    Directive({
+        selector: "[ctrRow]",
+    }),
+    __param(2, Host()),
+    __metadata("design:paramtypes", [ElementRef, Renderer2, CtrDropdown])
+], CtrRow);
 
-function CompleterListItemCmp_span_1_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "span", 2);
-    ɵɵtext(1);
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const part_r1 = ctx.$implicit;
-    const ctx_r0 = ɵɵnextContext();
-    ɵɵproperty("ngClass", part_r1.isMatch ? ctx_r0.matchClass : null);
-    ɵɵadvance(1);
-    ɵɵtextInterpolate(part_r1.text);
-} }
-const _c0 = function (a0, a1) { return { "completer-title": a0, "completer-description": a1 }; };
-class CompleterListItemCmp {
+let CompleterListItemCmp = class CompleterListItemCmp {
     constructor() {
@@ -1077,118 +1257,28 @@ this.text = "";
     }
-}
-CompleterListItemCmp.ɵfac = function CompleterListItemCmp_Factory(t) { return new (t || CompleterListItemCmp)(); };
-CompleterListItemCmp.ɵcmp = ɵɵdefineComponent({ type: CompleterListItemCmp, selectors: [["completer-list-item"]], inputs: { text: "text", searchStr: "searchStr", matchClass: "matchClass", type: "type" }, decls: 2, vars: 5, consts: [[1, "completer-list-item-holder", 3, "ngClass"], ["class", "completer-list-item", 3, "ngClass", 4, "ngFor", "ngForOf"], [1, "completer-list-item", 3, "ngClass"]], template: function CompleterListItemCmp_Template(rf, ctx) { if (rf & 1) {
-        ɵɵelementStart(0, "span", 0);
-        ɵɵtemplate(1, CompleterListItemCmp_span_1_Template, 2, 2, "span", 1);
-        ɵɵelementEnd();
-    } if (rf & 2) {
-        ɵɵproperty("ngClass", ɵɵpureFunction2(2, _c0, ctx.type === "title", ctx.type === "description"));
-        ɵɵadvance(1);
-        ɵɵproperty("ngForOf", ctx.parts);
-    } }, directives: [NgClass, NgForOf], encapsulation: 2 });
+};
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], CompleterListItemCmp.prototype, "text", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], CompleterListItemCmp.prototype, "searchStr", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], CompleterListItemCmp.prototype, "matchClass", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], CompleterListItemCmp.prototype, "type", void 0);
+CompleterListItemCmp = __decorate([
+    Component({
+        selector: "completer-list-item",
+        template: `<span class="completer-list-item-holder" [ngClass]= "{'completer-title': type === 'title', 'completer-description': type === 'description'}" >
+        <span class="completer-list-item" *ngFor="let part of parts" [ngClass]= "part.isMatch ? matchClass : null">{{part.text}}</span>
+    </span>`
+    })
+], CompleterListItemCmp);
 
-const _c0$1 = ["ctrInput"];
-function CompleterCmp_div_3_div_1_div_1_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 10);
-    ɵɵtext(1);
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r9 = ɵɵnextContext(3);
-    ɵɵadvance(1);
-    ɵɵtextInterpolate(ctx_r9._textSearching);
-} }
-function CompleterCmp_div_3_div_1_div_2_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 11);
-    ɵɵtext(1);
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r10 = ɵɵnextContext(3);
-    ɵɵadvance(1);
-    ɵɵtextInterpolate(ctx_r10._textNoResults);
-} }
-function CompleterCmp_div_3_div_1_div_3_div_2_img_1_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelement(0, "img", 21);
-} if (rf & 2) {
-    const item_r12 = ɵɵnextContext(2).$implicit;
-    ɵɵpropertyInterpolate("src", item_r12.image, ɵɵsanitizeUrl);
-} }
-function CompleterCmp_div_3_div_1_div_3_div_2_div_2_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelement(0, "div", 22);
-} }
-function CompleterCmp_div_3_div_1_div_3_div_2_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 18);
-    ɵɵtemplate(1, CompleterCmp_div_3_div_1_div_3_div_2_img_1_Template, 1, 1, "img", 19);
-    ɵɵtemplate(2, CompleterCmp_div_3_div_1_div_3_div_2_div_2_Template, 1, 0, "div", 20);
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r12 = ɵɵnextContext().$implicit;
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", item_r12.image != "");
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", item_r12.image === "");
-} }
-function CompleterCmp_div_3_div_1_div_3_completer_list_item_5_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelement(0, "completer-list-item", 23);
-} if (rf & 2) {
-    const item_r12 = ɵɵnextContext().$implicit;
-    const ctx_r15 = ɵɵnextContext(3);
-    ɵɵproperty("text", item_r12.description)("matchClass", ctx_r15.matchClass)("searchStr", ctx_r15.searchStr)("type", "description");
-} }
-const _c1 = function (a0) { return { "completer-item-text-image": a0 }; };
-function CompleterCmp_div_3_div_1_div_3_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 12);
-    ɵɵelementStart(1, "div", 13);
-    ɵɵtemplate(2, CompleterCmp_div_3_div_1_div_3_div_2_Template, 3, 2, "div", 14);
-    ɵɵelementStart(3, "div", 15);
-    ɵɵelement(4, "completer-list-item", 16);
-    ɵɵtemplate(5, CompleterCmp_div_3_div_1_div_3_completer_list_item_5_Template, 1, 4, "completer-list-item", 17);
-    ɵɵelementEnd();
-    ɵɵelementEnd();
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r12 = ctx.$implicit;
-    const rowIndex_r13 = ctx.index;
-    const ctx_r11 = ɵɵnextContext(3);
-    ɵɵadvance(1);
-    ɵɵproperty("ctrRow", rowIndex_r13)("dataItem", item_r12);
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", item_r12.image || item_r12.image === "");
-    ɵɵadvance(1);
-    ɵɵproperty("ngClass", ɵɵpureFunction1(9, _c1, item_r12.image || item_r12.image === ""));
-    ɵɵadvance(1);
-    ɵɵproperty("text", item_r12.title)("matchClass", ctx_r11.matchClass)("searchStr", ctx_r11.searchStr)("type", "title");
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", item_r12.description && item_r12.description != "");
-} }
-function CompleterCmp_div_3_div_1_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 6);
-    ɵɵtemplate(1, CompleterCmp_div_3_div_1_div_1_Template, 2, 1, "div", 7);
-    ɵɵtemplate(2, CompleterCmp_div_3_div_1_div_2_Template, 2, 1, "div", 8);
-    ɵɵtemplate(3, CompleterCmp_div_3_div_1_div_3_Template, 6, 11, "div", 9);
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r21 = ɵɵnextContext();
-    const searchActive_r5 = ctx_r21.searching;
-    const items_r4 = ctx_r21.results;
-    const ctx_r8 = ɵɵnextContext();
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", searchActive_r5 && ctx_r8.displaySearching);
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", !searchActive_r5 && (!items_r4 || (items_r4 == null ? null : items_r4.length) === 0));
-    ɵɵadvance(1);
-    ɵɵproperty("ngForOf", items_r4);
-} }
-function CompleterCmp_div_3_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 4);
-    ɵɵtemplate(1, CompleterCmp_div_3_div_1_Template, 4, 3, "div", 5);
-    ɵɵelementEnd();
-} if (rf & 2) {
-    const items_r4 = ctx.results;
-    const searchActive_r5 = ctx.searching;
-    const isInitialized_r6 = ctx.searchInitialized;
-    const isOpen_r7 = ctx.isOpen;
-    const ctx_r3 = ɵɵnextContext();
-    ɵɵadvance(1);
-    ɵɵproperty("ngIf", isInitialized_r6 && isOpen_r7 && ((items_r4 == null ? null : items_r4.length) > 0 || ctx_r3.displayNoResults && !searchActive_r5 || searchActive_r5 && ctx_r3.displaySearching));
-} }
 const noop = () => {
@@ -1202,3 +1292,3 @@ return;
 };
-class CompleterCmp {
+let CompleterCmp = class CompleterCmp {
     constructor(completerService, cdr) {
@@ -1268,2 +1358,15 @@ this.completerService = completerService;
         }
+        if (!this.completer) {
+            return;
+        }
+        this.completer.selected.subscribe((item) => {
+            this.selected.emit(item);
+        });
+        this.completer.highlighted.subscribe((item) => {
+            this.highlighted.emit(item);
+        });
+        this.completer.opened.subscribe((isOpen) => {
+            this._open = isOpen;
+            this.opened.emit(isOpen);
+        });
     }
@@ -1320,17 +1423,2 @@ ngAfterViewChecked() {
     }
-    ngOnInit() {
-        if (!this.completer) {
-            return;
-        }
-        this.completer.selected.subscribe((item) => {
-            this.selected.emit(item);
-        });
-        this.completer.highlighted.subscribe((item) => {
-            this.highlighted.emit(item);
-        });
-        this.completer.opened.subscribe((isOpen) => {
-            this._open = isOpen;
-            this.opened.emit(isOpen);
-        });
-    }
     onBlur() {
@@ -1391,26 +1479,260 @@ this.blurEvent.emit();
     }
-}
-CompleterCmp.ɵfac = function CompleterCmp_Factory(t) { return new (t || CompleterCmp)(ɵɵdirectiveInject(CompleterService), ɵɵdirectiveInject(ChangeDetectorRef)); };
-CompleterCmp.ɵcmp = ɵɵdefineComponent({ type: CompleterCmp, selectors: [["ng2-completer"]], viewQuery: function CompleterCmp_Query(rf, ctx) { if (rf & 1) {
-        ɵɵviewQuery(CtrCompleter, true);
-        ɵɵviewQuery(_c0$1, true);
-    } if (rf & 2) {
-        var _t;
-        ɵɵqueryRefresh(_t = ɵɵloadQuery()) && (ctx.completer = _t.first);
-        ɵɵqueryRefresh(_t = ɵɵloadQuery()) && (ctx.ctrInput = _t.first);
-    } }, inputs: { dataService: "dataService", inputName: "inputName", inputId: "inputId", pause: "pause", minSearchLength: "minSearchLength", maxChars: "maxChars", overrideSuggested: "overrideSuggested", clearSelected: "clearSelected", clearUnselected: "clearUnselected", fillHighlighted: "fillHighlighted", placeholder: "placeholder", matchClass: "matchClass", fieldTabindex: "fieldTabindex", autoMatch: "autoMatch", disableInput: "disableInput", inputClass: "inputClass", autofocus: "autofocus", openOnFocus: "openOnFocus", openOnClick: "openOnClick", selectOnClick: "selectOnClick", selectOnFocus: "selectOnFocus", initialValue: "initialValue", autoHighlight: "autoHighlight", datasource: "datasource", textNoResults: "textNoResults", textSearching: "textSearching" }, outputs: { selected: "selected", highlighted: "highlighted", blurEvent: "blur", click: "click", focusEvent: "focus", opened: "opened", keyup: "keyup", keydown: "keydown" }, features: [ɵɵProvidersFeature([COMPLETER_CONTROL_VALUE_ACCESSOR])], decls: 4, vars: 23, consts: [["ctrCompleter", "", 1, "completer-holder"], ["type", "search", "ctrInput", "", "autocomplete", "off", "autocorrect", "off", "autocapitalize", "off", 1, "completer-input", 3, "ngClass", "ngModel", "placeholder", "tabindex", "disabled", "clearSelected", "clearUnselected", "overrideSuggested", "openOnFocus", "fillHighlighted", "openOnClick", "selectOnClick", "selectOnFocus", "ngModelChange", "blur", "focus", "keyup", "keydown", "click"], ["ctrInput", ""], ["class", "completer-dropdown-holder", 4, "ctrList", "ctrListMinSearchLength", "ctrListPause", "ctrListAutoMatch", "ctrListInitialValue", "ctrListAutoHighlight", "ctrListDisplaySearching"], [1, "completer-dropdown-holder"], ["class", "completer-dropdown", "ctrDropdown", "", 4, "ngIf"], ["ctrDropdown", "", 1, "completer-dropdown"], ["class", "completer-searching", 4, "ngIf"], ["class", "completer-no-results", 4, "ngIf"], ["class", "completer-row-wrapper", 4, "ngFor", "ngForOf"], [1, "completer-searching"], [1, "completer-no-results"], [1, "completer-row-wrapper"], [1, "completer-row", 3, "ctrRow", "dataItem"], ["class", "completer-image-holder", 4, "ngIf"], [1, "completer-item-text", 3, "ngClass"], [1, "completer-title", 3, "text", "matchClass", "searchStr", "type"], ["class", "completer-description", 3, "text", "matchClass", "searchStr", "type", 4, "ngIf"], [1, "completer-image-holder"], ["class", "completer-image", 3, "src", 4, "ngIf"], ["class", "completer-image-default", 4, "ngIf"], [1, "completer-image", 3, "src"], [1, "completer-image-default"], [1, "completer-description", 3, "text", "matchClass", "searchStr", "type"]], template: function CompleterCmp_Template(rf, ctx) { if (rf & 1) {
-        ɵɵelementStart(0, "div", 0);
-        ɵɵelementStart(1, "input", 1, 2);
-        ɵɵlistener("ngModelChange", function CompleterCmp_Template_input_ngModelChange_1_listener($event) { return ctx.searchStr = $event; })("ngModelChange", function CompleterCmp_Template_input_ngModelChange_1_listener($event) { return ctx.onChange($event); })("blur", function CompleterCmp_Template_input_blur_1_listener() { return ctx.onBlur(); })("focus", function CompleterCmp_Template_input_focus_1_listener() { return ctx.onFocus(); })("keyup", function CompleterCmp_Template_input_keyup_1_listener($event) { return ctx.onKeyup($event); })("keydown", function CompleterCmp_Template_input_keydown_1_listener($event) { return ctx.onKeydown($event); })("click", function CompleterCmp_Template_input_click_1_listener($event) { return ctx.onClick($event); });
-        ɵɵelementEnd();
-        ɵɵtemplate(3, CompleterCmp_div_3_Template, 2, 1, "div", 3);
-        ɵɵelementEnd();
-    } if (rf & 2) {
-        ɵɵadvance(1);
-        ɵɵproperty("ngClass", ctx.inputClass)("ngModel", ctx.searchStr)("placeholder", ctx.placeholder)("tabindex", ctx.fieldTabindex)("disabled", ctx.disableInput)("clearSelected", ctx.clearSelected)("clearUnselected", ctx.clearUnselected)("overrideSuggested", ctx.overrideSuggested)("openOnFocus", ctx.openOnFocus)("fillHighlighted", ctx.fillHighlighted)("openOnClick", ctx.openOnClick)("selectOnClick", ctx.selectOnClick)("selectOnFocus", ctx.selectOnFocus);
-        ɵɵattribute("id", ctx.inputId.length > 0 ? ctx.inputId : null)("name", ctx.inputName)("maxlength", ctx.maxChars);
-        ɵɵadvance(2);
-        ɵɵproperty("ctrList", ctx.dataService)("ctrListMinSearchLength", ctx.minSearchLength)("ctrListPause", ctx.pause)("ctrListAutoMatch", ctx.autoMatch)("ctrListInitialValue", ctx.initialValue)("ctrListAutoHighlight", ctx.autoHighlight)("ctrListDisplaySearching", ctx.displaySearching);
-    } }, directives: [CtrCompleter, DefaultValueAccessor, CtrInput, NgClass, NgControlStatus, NgModel, MaxLengthValidator, CtrList, NgIf, CtrDropdown, NgForOf, CtrRow, CompleterListItemCmp], styles: [".completer-dropdown[_ngcontent-%COMP%] {\n        border-color: #ececec;\n        border-width: 1px;\n        border-style: solid;\n        border-radius: 2px;\n        width: 250px;\n        padding: 6px;\n        cursor: pointer;\n        z-index: 9999;\n        position: absolute;\n        margin-top: -6px;\n        background-color: #ffffff;\n    }\n\n    .completer-row[_ngcontent-%COMP%] {\n        padding: 5px;\n        color: #000000;\n        margin-bottom: 4px;\n        clear: both;\n        display: inline-block;\n        width: 103%;\n    }\n\n    .completer-selected-row[_ngcontent-%COMP%] {\n        background-color: lightblue;\n        color: #ffffff;\n    }\n\n    .completer-description[_ngcontent-%COMP%] {\n        font-size: 14px;\n    }\n\n    .completer-image-default[_ngcontent-%COMP%] {\n        width: 16px;\n        height: 16px;\n        background-image: url(\"demo/res/img/default.png\");\n    }\n\n    .completer-image-holder[_ngcontent-%COMP%] {\n        float: left;\n        width: 10%;\n    }\n    .completer-item-text-image[_ngcontent-%COMP%] {\n        float: right;\n        width: 90%;\n    }"] });
+};
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "dataService", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "inputName", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], CompleterCmp.prototype, "inputId", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "pause", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "minSearchLength", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "maxChars", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "overrideSuggested", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "clearSelected", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "clearUnselected", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "fillHighlighted", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "placeholder", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "matchClass", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "fieldTabindex", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "autoMatch", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "disableInput", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "inputClass", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "autofocus", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "openOnFocus", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "openOnClick", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "selectOnClick", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "selectOnFocus", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "initialValue", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "autoHighlight", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "selected", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "highlighted", void 0);
+__decorate([
+    Output("blur"),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "blurEvent", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "click", void 0);
+__decorate([
+    Output("focus"),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "focusEvent", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "opened", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], CompleterCmp.prototype, "keyup", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], CompleterCmp.prototype, "keydown", void 0);
+__decorate([
+    ViewChild(CtrCompleter, { static: false }),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "completer", void 0);
+__decorate([
+    ViewChild("ctrInput", { static: false }),
+    __metadata("design:type", Object)
+], CompleterCmp.prototype, "ctrInput", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object),
+    __metadata("design:paramtypes", [Object])
+], CompleterCmp.prototype, "datasource", null);
+__decorate([
+    Input(),
+    __metadata("design:type", String),
+    __metadata("design:paramtypes", [String])
+], CompleterCmp.prototype, "textNoResults", null);
+__decorate([
+    Input(),
+    __metadata("design:type", String),
+    __metadata("design:paramtypes", [String])
+], CompleterCmp.prototype, "textSearching", null);
+CompleterCmp = __decorate([
+    Component({
+        selector: "ng2-completer",
+        template: `
+        <div class="completer-holder" ctrCompleter>
+            <input #ctrInput [attr.id]="inputId.length > 0 ? inputId : null" type="search"
+                class="completer-input" ctrInput [ngClass]="inputClass"
+                [(ngModel)]="searchStr" (ngModelChange)="onChange($event)"
+                [attr.name]="inputName" [placeholder]="placeholder"
+                [attr.maxlength]="maxChars" [tabindex]="fieldTabindex" [disabled]="disableInput"
+                [clearSelected]="clearSelected" [clearUnselected]="clearUnselected"
+                [overrideSuggested]="overrideSuggested" [openOnFocus]="openOnFocus" [fillHighlighted]="fillHighlighted"
+                [openOnClick]="openOnClick" [selectOnClick]="selectOnClick" [selectOnFocus]="selectOnFocus"
+                (blur)="onBlur()" (focus)="onFocus()" (keyup)="onKeyup($event)"
+                (keydown)="onKeydown($event)" (click)="onClick($event)"
+                autocomplete="off" autocorrect="off" autocapitalize="off" />
 
+            <div class="completer-dropdown-holder"
+                *ctrList="dataService;
+                    minSearchLength: minSearchLength;
+                    pause: pause;
+                    autoMatch: autoMatch;
+                    initialValue: initialValue;
+                    autoHighlight: autoHighlight;
+                    displaySearching: displaySearching;
+                    let items = results;
+                    let searchActive = searching;
+                    let isInitialized = searchInitialized;
+                    let isOpen = isOpen;">
+                <div class="completer-dropdown" ctrDropdown
+                    *ngIf="isInitialized && isOpen && (( items?.length > 0|| (displayNoResults && !searchActive)) || (searchActive && displaySearching))">
+                    <div *ngIf="searchActive && displaySearching" class="completer-searching">{{ _textSearching }}</div>
+                    <div *ngIf="!searchActive && (!items || items?.length === 0)"
+                    class="completer-no-results">{{ _textNoResults }}</div>
+                    <div class="completer-row-wrapper" *ngFor="let item of items; let rowIndex=index">
+                        <div class="completer-row" [ctrRow]="rowIndex" [dataItem]="item">
+                            <div *ngIf="item.image || item.image === ''" class="completer-image-holder">
+                                <img *ngIf="item.image != ''" src="{{item.image}}" class="completer-image" />
+                                <div *ngIf="item.image === ''" class="completer-image-default"></div>
+                            </div>
+                            <div class="completer-item-text"
+                            [ngClass]="{'completer-item-text-image': item.image || item.image === '' }">
+                                <completer-list-item
+                                class="completer-title" [text]="item.title" [matchClass]="matchClass"
+                                [searchStr]="searchStr" [type]="'title'"></completer-list-item>
+                                <completer-list-item *ngIf="item.description && item.description != ''"
+                                class="completer-description" [text]="item.description"
+                                    [matchClass]="matchClass" [searchStr]="searchStr" [type]="'description'">
+                                </completer-list-item>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    `,
+        styles: [`
+    .completer-dropdown {
+        border-color: #ececec;
+        border-width: 1px;
+        border-style: solid;
+        border-radius: 2px;
+        width: 250px;
+        padding: 6px;
+        cursor: pointer;
+        z-index: 9999;
+        position: absolute;
+        margin-top: -6px;
+        background-color: #ffffff;
+    }
+
+    .completer-row {
+        padding: 5px;
+        color: #000000;
+        margin-bottom: 4px;
+        clear: both;
+        display: inline-block;
+        width: 103%;
+    }
+
+    .completer-selected-row {
+        background-color: lightblue;
+        color: #ffffff;
+    }
+
+    .completer-description {
+        font-size: 14px;
+    }
+
+    .completer-image-default {
+        width: 16px;
+        height: 16px;
+        background-image: url("demo/res/img/default.png");
+    }
+
+    .completer-image-holder {
+        float: left;
+        width: 10%;
+    }
+    .completer-item-text-image {
+        float: right;
+        width: 90%;
+    }
+    `],
+        providers: [COMPLETER_CONTROL_VALUE_ACCESSOR]
+    }),
+    __metadata("design:paramtypes", [CompleterService, ChangeDetectorRef])
+], CompleterCmp);
+
+var Ng2CompleterModule_1;
 const providers = [
@@ -1421,6 +1743,6 @@ CompleterService,
 ];
-class Ng2CompleterModule {
+let Ng2CompleterModule = Ng2CompleterModule_1 = class Ng2CompleterModule {
     static forRoot() {
         return {
-            ngModule: Ng2CompleterModule,
+            ngModule: Ng2CompleterModule_1,
             providers
@@ -1431,28 +1753,36 @@ };
         return {
-            ngModule: Ng2CompleterModule,
+            ngModule: Ng2CompleterModule_1,
             providers
         };
     }
-}
-Ng2CompleterModule.ɵmod = ɵɵdefineNgModule({ type: Ng2CompleterModule });
-Ng2CompleterModule.ɵinj = ɵɵdefineInjector({ factory: function Ng2CompleterModule_Factory(t) { return new (t || Ng2CompleterModule)(); }, providers: providers, imports: [[
+};
+Ng2CompleterModule = Ng2CompleterModule_1 = __decorate([
+    NgModule({
+        declarations: [
+            CompleterListItemCmp,
+            CtrCompleter,
+            CtrDropdown,
+            CtrInput,
+            CtrList,
+            CtrRow,
+            CompleterCmp
+        ],
+        exports: [
+            CompleterListItemCmp,
+            CtrCompleter,
+            CtrDropdown,
+            CtrInput,
+            CtrList,
+            CtrRow,
+            CompleterCmp
+        ],
+        imports: [
             CommonModule,
             FormsModule
-        ]] });
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && ɵɵsetNgModuleScope(Ng2CompleterModule, { declarations: [CompleterListItemCmp,
-        CtrCompleter,
-        CtrDropdown,
-        CtrInput,
-        CtrList,
-        CtrRow,
-        CompleterCmp], imports: [CommonModule,
-        FormsModule], exports: [CompleterListItemCmp,
-        CtrCompleter,
-        CtrDropdown,
-        CtrInput,
-        CtrList,
-        CtrRow,
-        CompleterCmp] }); })();
+        ],
+        providers
+    })
+], Ng2CompleterModule);
 
-export { CompleterCmp, CompleterListItemCmp, CompleterService, CtrCompleter, CtrDropdown, CtrInput, CtrList, CtrRow, LocalData, LocalDataFactory, Ng2CompleterModule, RemoteData, RemoteDataFactory };
+export { CompleterCmp, CompleterListItemCmp, CompleterService, CtrCompleter, CtrDropdown, CtrInput, CtrList, CtrRow, LocalData, LocalDataFactory, Ng2CompleterModule, RemoteData, RemoteDataFactory, CtrListContext as ɵa, CompleterBaseData as ɵb };
 //# sourceMappingURL=ng2-completer.js.map

ng2-completer.d.ts

 /**
  * Generated bundle index. Do not edit.
  */
-/// <amd-module name="ng2-completer" />
 export * from './public_api';
+export { CtrListContext as ɵa } from './src/directives/ctr-list';
+export { CompleterBaseData as ɵb } from './src/services/completer-base-data';

package.json

 {
   "name": "ng2-completer",
-  "version": "9.0.0",
+  "version": "9.0.1",
   "description": "angular autocomplete/typeahead component",
@@ -19,4 +19,3 @@ "main": "./bundles/ng2-completer.umd.js",
     "start": "cross-env webpack-dev-server --inline --progress --port 8080",
-    "deploy:gh-pages": "npm run build:demo:prod && cross-env ./node_modules/.bin/gh-pages -d dist/demo",
-    "postinstall": "ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points"
+    "deploy:gh-pages": "npm run build:demo:prod && cross-env ./node_modules/.bin/gh-pages -d dist/demo"
   },
@@ -23,0 +22,0 @@ "typings": "./ng2-completer.d.ts",

README.md

@@ -9,2 +9,6 @@ # ng2-completer
 
+## help needed
+I don't use this library much anymore and don't have time to properly maintain it.
+If you are currently using ng2-completer and interested to maintain it please let me know!
+
 ## Installation
@@ -11,0 +15,0 @@

src/components/completer-cmp.d.ts

@@ -1,2 +0,2 @@
-import { AfterViewChecked, ChangeDetectorRef, EventEmitter, OnInit, AfterViewInit, ElementRef } from "@angular/core";
+import { AfterViewChecked, ChangeDetectorRef, EventEmitter, AfterViewInit, ElementRef } from "@angular/core";
 import { ControlValueAccessor, FormControl } from "@angular/forms";
@@ -7,4 +7,3 @@ import { CtrCompleter } from "../directives/ctr-completer";
 import { CompleterItem } from "./completer-item";
-import * as i0 from "@angular/core";
-export declare class CompleterCmp implements OnInit, ControlValueAccessor, AfterViewChecked, AfterViewInit {
+export declare class CompleterCmp implements ControlValueAccessor, AfterViewChecked, AfterViewInit {
     private completerService;
@@ -70,3 +69,2 @@ private cdr;
     set textSearching(text: string);
-    ngOnInit(): void;
     onBlur(): void;
@@ -83,4 +81,2 @@ onFocus(): void;
     isOpen(): boolean;
-    static ɵfac: i0.ɵɵFactoryDef<CompleterCmp>;
-    static ɵcmp: i0.ɵɵComponentDefWithMeta<CompleterCmp, "ng2-completer", never, { "dataService": "dataService"; "inputName": "inputName"; "inputId": "inputId"; "pause": "pause"; "minSearchLength": "minSearchLength"; "maxChars": "maxChars"; "overrideSuggested": "overrideSuggested"; "clearSelected": "clearSelected"; "clearUnselected": "clearUnselected"; "fillHighlighted": "fillHighlighted"; "placeholder": "placeholder"; "matchClass": "matchClass"; "fieldTabindex": "fieldTabindex"; "autoMatch": "autoMatch"; "disableInput": "disableInput"; "inputClass": "inputClass"; "autofocus": "autofocus"; "openOnFocus": "openOnFocus"; "openOnClick": "openOnClick"; "selectOnClick": "selectOnClick"; "selectOnFocus": "selectOnFocus"; "initialValue": "initialValue"; "autoHighlight": "autoHighlight"; "datasource": "datasource"; "textNoResults": "textNoResults"; "textSearching": "textSearching"; }, { "selected": "selected"; "highlighted": "highlighted"; "blurEvent": "blur"; "click": "click"; "focusEvent": "focus"; "opened": "opened"; "keyup": "keyup"; "keydown": "keydown"; }, never>;
 }

src/components/completer-list-item-cmp.d.ts

 import { OnInit } from "@angular/core";
-import * as i0 from "@angular/core";
 export interface MatchPart {
@@ -14,4 +13,2 @@ isMatch: boolean;
     ngOnInit(): void;
-    static ɵfac: i0.ɵɵFactoryDef<CompleterListItemCmp>;
-    static ɵcmp: i0.ɵɵComponentDefWithMeta<CompleterListItemCmp, "completer-list-item", never, { "text": "text"; "searchStr": "searchStr"; "matchClass": "matchClass"; "type": "type"; }, {}, never>;
 }

src/directives/ctr-completer.d.ts

 import { EventEmitter } from "@angular/core";
 import { CompleterItem } from "../components/completer-item";
-import * as i0 from "@angular/core";
 export interface CompleterList {
@@ -48,4 +47,2 @@ search(term: string): void;
     get hasSelected(): boolean;
-    static ɵfac: i0.ɵɵFactoryDef<CtrCompleter>;
-    static ɵdir: i0.ɵɵDirectiveDefWithMeta<CtrCompleter, "[ctrCompleter]", never, {}, { "selected": "selected"; "highlighted": "highlighted"; "opened": "opened"; "dataSourceChange": "dataSourceChange"; }, never>;
 }

src/directives/ctr-dropdown.d.ts

 import { AfterViewInit, ElementRef, OnDestroy, NgZone } from "@angular/core";
 import { CompleterItem } from "../components/completer-item";
 import { CtrCompleter, CompleterDropdown } from "./ctr-completer";
-import * as i0 from "@angular/core";
 export interface CtrRowElement {
@@ -40,4 +39,2 @@ setHighlighted(selected: boolean): void;
     private dropdownRowOffsetHeight;
-    static ɵfac: i0.ɵɵFactoryDef<CtrDropdown>;
-    static ɵdir: i0.ɵɵDirectiveDefWithMeta<CtrDropdown, "[ctrDropdown]", never, {}, {}, never>;
 }

src/directives/ctr-input.d.ts

 import { ElementRef, EventEmitter } from "@angular/core";
 import { NgModel } from "@angular/forms";
 import { CtrCompleter } from "./ctr-completer";
-import * as i0 from "@angular/core";
 export declare class CtrInput {
@@ -33,4 +32,2 @@ private completer;
     private doBlur;
-    static ɵfac: i0.ɵɵFactoryDef<CtrInput>;
-    static ɵdir: i0.ɵɵDirectiveDefWithMeta<CtrInput, "[ctrInput]", never, { "clearSelected": "clearSelected"; "clearUnselected": "clearUnselected"; "overrideSuggested": "overrideSuggested"; "fillHighlighted": "fillHighlighted"; "openOnFocus": "openOnFocus"; "openOnClick": "openOnClick"; "selectOnClick": "selectOnClick"; "selectOnFocus": "selectOnFocus"; }, { "ngModelChange": "ngModelChange"; }, never>;
 }

src/directives/ctr-list.d.ts

@@ -5,3 +5,2 @@ import { ChangeDetectorRef, OnInit, TemplateRef, ViewContainerRef, NgZone } from "@angular/core";
 import { CompleterList, CtrCompleter } from "./ctr-completer";
-import * as i0 from "@angular/core";
 export declare class CtrListContext {
@@ -45,4 +44,2 @@ results: CompleterItem[] | null;
     private dataServiceSubscribe;
-    static ɵfac: i0.ɵɵFactoryDef<CtrList>;
-    static ɵdir: i0.ɵɵDirectiveDefWithMeta<CtrList, "[ctrList]", never, { "ctrListMinSearchLength": "ctrListMinSearchLength"; "ctrListPause": "ctrListPause"; "ctrListAutoMatch": "ctrListAutoMatch"; "ctrListAutoHighlight": "ctrListAutoHighlight"; "ctrListDisplaySearching": "ctrListDisplaySearching"; "dataService": "ctrList"; "initialValue": "ctrListInitialValue"; }, {}, never>;
 }

src/directives/ctr-row.d.ts

 import { ElementRef, Renderer2, OnDestroy } from "@angular/core";
 import { CompleterItem } from "../components/completer-item";
 import { CtrDropdown, CtrRowElement } from "./ctr-dropdown";
-import * as i0 from "@angular/core";
 export declare class CtrRow implements CtrRowElement, OnDestroy {
@@ -22,4 +21,2 @@ private el;
     getDataItem(): CompleterItem | null;
-    static ɵfac: i0.ɵɵFactoryDef<CtrRow>;
-    static ɵdir: i0.ɵɵDirectiveDefWithMeta<CtrRow, "[ctrRow]", never, { "ctrRow": "ctrRow"; "dataItem": "dataItem"; }, {}, never>;
 }

src/modules/ng2-completer.module.d.ts

 import { ModuleWithProviders } from "@angular/core";
-import * as i0 from "@angular/core";
-import * as i1 from "../components/completer-list-item-cmp";
-import * as i2 from "../directives/ctr-completer";
-import * as i3 from "../directives/ctr-dropdown";
-import * as i4 from "../directives/ctr-input";
-import * as i5 from "../directives/ctr-list";
-import * as i6 from "../directives/ctr-row";
-import * as i7 from "../components/completer-cmp";
-import * as i8 from "@angular/common";
-import * as i9 from "@angular/forms";
 export declare class Ng2CompleterModule {
-    static forRoot(): i0.ModuleWithProviders<Ng2CompleterModule>;
-    static forChild(): i0.ModuleWithProviders<Ng2CompleterModule>;
-    static ɵmod: i0.ɵɵNgModuleDefWithMeta<Ng2CompleterModule, [typeof i1.CompleterListItemCmp, typeof i2.CtrCompleter, typeof i3.CtrDropdown, typeof i4.CtrInput, typeof i5.CtrList, typeof i6.CtrRow, typeof i7.CompleterCmp], [typeof i8.CommonModule, typeof i9.FormsModule], [typeof i1.CompleterListItemCmp, typeof i2.CtrCompleter, typeof i3.CtrDropdown, typeof i4.CtrInput, typeof i5.CtrList, typeof i6.CtrRow, typeof i7.CompleterCmp]>;
-    static ɵinj: i0.ɵɵInjectorDef<Ng2CompleterModule>;
+    static forRoot(): ModuleWithProviders;
+    static forChild(): ModuleWithProviders;
 }

src/services/completer-service.d.ts

@@ -6,3 +6,2 @@ import { Observable } from "rxjs";
 import { RemoteDataFactory } from "./remote-data-factory";
-import * as i0 from "@angular/core";
 export declare class CompleterService {
@@ -15,4 +14,2 @@ private localDataFactory;
     remote(url: string | null, searchFields?: string | null, titleField?: string | null): RemoteData;
-    static ɵfac: i0.ɵɵFactoryDef<CompleterService>;
-    static ɵprov: i0.ɵɵInjectableDef<CompleterService>;
 }

src/services/local-data-factory.d.ts

 import { LocalData } from "./local-data";
-import * as i0 from "@angular/core";
 export declare class LocalDataFactory {
     create(): LocalData;
-    static ɵfac: i0.ɵɵFactoryDef<LocalDataFactory>;
-    static ɵprov: i0.ɵɵInjectableDef<LocalDataFactory>;
 }

src/services/remote-data-factory.d.ts

 import { HttpClient } from "@angular/common/http";
 import { RemoteData } from "./remote-data";
-import * as i0 from "@angular/core";
 export declare class RemoteDataFactory {
@@ -8,4 +7,2 @@ private http;
     create(): RemoteData;
-    static ɵfac: i0.ɵɵFactoryDef<RemoteDataFactory>;
-    static ɵprov: i0.ɵɵInjectableDef<RemoteDataFactory>;
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Install scripts

Supply chain risk

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

901623

increased by4.25%

Number of package files

32

increased by3.23%

Lines of code

6784

increased by11.74%

Number of lines in readme file

214

increased by1.9%

Number of high supply chain risk alerts

0

decreased by-100%

Number of low supply chain risk alerts

4

decreased by-20%

No dependency changes