ng2-tag-input - npm Package Compare versions

Comparing version 0.8.1 to 0.8.3

dist/modules/components/dropdown/tag-input-dropdown.component.d.ts

 import { TemplateRef, QueryList } from '@angular/core';
 import { TagInputComponent } from '../tag-input';
-import { Ng2Dropdown, Ng2MenuItem } from 'ng2-material-dropdown';
+import { Ng2Dropdown, Ng2MenuItem, DropdownStateService } from 'ng2-material-dropdown';
 import { EventEmitter } from '@angular/core';
@@ -15,3 +15,2 @@ import { TagModel } from '../helpers/accessor';
     focusFirstElement: boolean;
-    autocompleteItems: TagModel[];
     showDropdownIfEmpty: boolean;
@@ -24,4 +23,6 @@ autocompleteObservable: (text: string) => Observable<any>;
     private matchingFn;
+    appendToBody: boolean;
     private items;
     private _autocompleteItems;
+    autocompleteItems: TagModel[];
     constructor(tagInput: TagInputComponent);
@@ -34,3 +35,3 @@ ngOnInit(): void;
     readonly selectedItem: Ng2MenuItem;
-    readonly state: any;
+    readonly state: DropdownStateService;
     private addNewItem(item);
@@ -37,0 +38,0 @@ show(): void;

dist/modules/components/dropdown/tag-input-dropdown.component.js

@@ -35,2 +35,3 @@ "use strict";
         };
+        this.appendToBody = true;
         this.items = [];
@@ -41,7 +42,4 @@ this._autocompleteItems = [];
         get: function () {
-            return this._autocompleteItems;
-        },
-        set: function (items) {
             var _this = this;
-            this._autocompleteItems = items ? items.map(function (item) {
+            return this._autocompleteItems ? this._autocompleteItems.map(function (item) {
                 return typeof item !== 'string' ? item : (_a = {}, _a[_this.displayBy] = item, _a[_this.identifyBy] = item, _a);
@@ -51,2 +49,5 @@ var _a;
         },
+        set: function (items) {
+            this._autocompleteItems = items;
+        },
         enumerable: true,
@@ -124,7 +125,8 @@ configurable: true
         ];
-        var showDropdown = (assertions.filter(function (item) { return item; }).length === assertions.length) || showDropdownIfEmpty;
+        var showDropdown = (assertions.filter(function (item) { return item; }).length === assertions.length) ||
+            showDropdownIfEmpty;
         var hideDropdown = this.isVisible && (!hasItems || !hasMinimumText);
         this.setItems(items);
         if (showDropdown) {
-            this.dropdown.toggleMenu(position);
+            this.dropdown.show(position);
         }
@@ -198,7 +200,2 @@ else if (hideDropdown) {
     core_1.Input(),
-    __metadata("design:type", Array),
-    __metadata("design:paramtypes", [Array])
-], TagInputDropdown.prototype, "autocompleteItems", null);
-__decorate([
-    core_1.Input(),
     __metadata("design:type", Boolean)
@@ -231,2 +228,11 @@ ], TagInputDropdown.prototype, "showDropdownIfEmpty", void 0);
 __decorate([
+    core_1.Input(),
+    __metadata("design:type", Boolean)
+], TagInputDropdown.prototype, "appendToBody", void 0);
+__decorate([
+    core_1.Input(),
+    __metadata("design:type", Array),
+    __metadata("design:paramtypes", [Array])
+], TagInputDropdown.prototype, "autocompleteItems", null);
+__decorate([
     core_1.HostListener('window:scroll'),
@@ -233,0 +239,0 @@ __metadata("design:type", Function),

dist/modules/components/dropdown/tag-input-dropdown.component.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"TagInputDropdown":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-dropdown","templateUrl":"./tag-input-dropdown.template.html"}]}],"members":{"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ng2-material-dropdown","name":"Ng2Dropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"}]}]}],"offset":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"focusFirstElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"showDropdownIfEmpty":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteObservable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"minimumTextLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"limitItemsTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"displayBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"identifyBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"matchingFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}]],"parameters":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"updatePosition":[{"__symbolic":"method"}],"onHide":[{"__symbolic":"method"}],"onItemClicked":[{"__symbolic":"method"}],"addNewItem":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"getMatchingItems":[{"__symbolic":"method"}],"setItems":[{"__symbolic":"method"}],"resetItems":[{"__symbolic":"method"}],"scrollListener":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:scroll"]}]}],"populateItems":[{"__symbolic":"method"}],"getItemsFromObservable":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TagInputDropdown":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-dropdown","templateUrl":"./tag-input-dropdown.template.html"}]}],"members":{"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ng2-material-dropdown","name":"Ng2Dropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"}]}]}],"offset":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"focusFirstElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"showDropdownIfEmpty":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteObservable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"minimumTextLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"limitItemsTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"displayBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"identifyBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"matchingFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}]],"parameters":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"updatePosition":[{"__symbolic":"method"}],"onHide":[{"__symbolic":"method"}],"onItemClicked":[{"__symbolic":"method"}],"addNewItem":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"getMatchingItems":[{"__symbolic":"method"}],"setItems":[{"__symbolic":"method"}],"resetItems":[{"__symbolic":"method"}],"scrollListener":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:scroll"]}]}],"populateItems":[{"__symbolic":"method"}],"getItemsFromObservable":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"TagInputDropdown":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-dropdown","templateUrl":"./tag-input-dropdown.template.html"}]}],"members":{"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ng2-material-dropdown","name":"Ng2Dropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"}]}]}],"offset":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"focusFirstElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"showDropdownIfEmpty":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteObservable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"minimumTextLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"limitItemsTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"displayBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"identifyBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"matchingFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"appendToBody":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}]],"parameters":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"updatePosition":[{"__symbolic":"method"}],"onHide":[{"__symbolic":"method"}],"onItemClicked":[{"__symbolic":"method"}],"addNewItem":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"getMatchingItems":[{"__symbolic":"method"}],"setItems":[{"__symbolic":"method"}],"resetItems":[{"__symbolic":"method"}],"scrollListener":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:scroll"]}]}],"populateItems":[{"__symbolic":"method"}],"getItemsFromObservable":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TagInputDropdown":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-dropdown","templateUrl":"./tag-input-dropdown.template.html"}]}],"members":{"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ng2-material-dropdown","name":"Ng2Dropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"}]}]}],"offset":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"focusFirstElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"showDropdownIfEmpty":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteObservable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"minimumTextLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"limitItemsTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"displayBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"identifyBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"matchingFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"appendToBody":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"autocompleteItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}]],"parameters":[{"__symbolic":"reference","module":"../tag-input","name":"TagInputComponent"}]}],"ngOnInit":[{"__symbolic":"method"}],"updatePosition":[{"__symbolic":"method"}],"onHide":[{"__symbolic":"method"}],"onItemClicked":[{"__symbolic":"method"}],"addNewItem":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"getMatchingItems":[{"__symbolic":"method"}],"setItems":[{"__symbolic":"method"}],"resetItems":[{"__symbolic":"method"}],"scrollListener":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:scroll"]}]}],"populateItems":[{"__symbolic":"method"}],"getItemsFromObservable":[{"__symbolic":"method"}]}}}}]

dist/modules/components/tag-input-form/tag-input-form.component.d.ts

@@ -23,2 +23,3 @@ import { EventEmitter, Renderer } from '@angular/core';
     focus(): void;
+    blur(): void;
     getElementPosition(): ClientRect;
@@ -25,0 +26,0 @@ destroy(): void;

dist/modules/components/tag-input-form/tag-input-form.component.js

@@ -50,2 +50,5 @@ "use strict";
     };
+    TagInputForm.prototype.blur = function () {
+        this.renderer.invokeElementMethod(this.input.nativeElement, 'blur');
+    };
     TagInputForm.prototype.getElementPosition = function () {
@@ -52,0 +55,0 @@ return this.input.nativeElement.getBoundingClientRect();

dist/modules/components/tag-input-form/tag-input-form.component.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"TagInputForm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-form","styleUrls":["./tag-input-form.style.scss"],"templateUrl":"./tag-input-form.template.html"}]}],"members":{"onSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeyup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeydown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["input"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnInit":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"getErrorMessages":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"getElementPosition":[{"__symbolic":"method"}],"destroy":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TagInputForm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-form","styleUrls":["./tag-input-form.style.scss"],"templateUrl":"./tag-input-form.template.html"}]}],"members":{"onSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeyup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeydown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["input"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnInit":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"getErrorMessages":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"getElementPosition":[{"__symbolic":"method"}],"destroy":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"TagInputForm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-form","styleUrls":["./tag-input-form.style.scss"],"templateUrl":"./tag-input-form.template.html"}]}],"members":{"onSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeyup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeydown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["input"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnInit":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"getErrorMessages":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"blur":[{"__symbolic":"method"}],"getElementPosition":[{"__symbolic":"method"}],"destroy":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TagInputForm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input-form","styleUrls":["./tag-input-form.style.scss"],"templateUrl":"./tag-input-form.template.html"}]}],"members":{"onSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeyup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onKeydown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["input"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnInit":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"getErrorMessages":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"blur":[{"__symbolic":"method"}],"getElementPosition":[{"__symbolic":"method"}],"destroy":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}]}}}}]

dist/modules/components/tag-input.js

@@ -99,9 +99,10 @@ "use strict";
             var displayBy = isFromAutocomplete ? _this.dropdown.displayBy : _this.displayBy;
-            return item === tag[identifyBy] ||
+            return _this.getItemValue(item) === tag[identifyBy] ||
                 item[_this.identifyBy] === tag[identifyBy] ||
                 item[_this.displayBy] === tag[displayBy];
         });
-        if (!this.allowDupes && !!dupe && this.blinkIfDupe) {
-            var item = this.tags.find(function (item) {
-                return _this.getItemValue(item.model) === _this.getItemValue(dupe);
+        var hasDupe = !!dupe && dupe !== undefined;
+        if (!this.allowDupes && hasDupe && this.blinkIfDupe) {
+            var item = this.tags.find(function (_tag) {
+                return _this.getItemValue(_tag.model) === _this.getItemValue(dupe);
             });
@@ -114,3 +115,3 @@ if (item) {
         var assertions = [
-            dupe === undefined || this.allowDupes === true,
+            !hasDupe || this.allowDupes === true,
             this.maxItemsReached === false,
@@ -134,3 +135,3 @@ ((fromAutocomplete) || this.onlyFromAutocomplete === false)
     TagInputComponent.prototype.selectItem = function (item) {
-        if (this.readonly || !item || item === this.selectedTag) {
+        if (this.readonly || !item) {
             return;
@@ -195,6 +196,6 @@ }
     TagInputComponent.prototype.hasErrors = function () {
-        return this.inputForm && this.inputForm.hasErrors() ? true : false;
+        return this.inputForm && this.inputForm.hasErrors();
     };
     TagInputComponent.prototype.isInputFocused = function () {
-        return this.inputForm && this.inputForm.isInputFocused() ? true : false;
+        return this.inputForm && this.inputForm.isInputFocused();
     };
@@ -201,0 +202,0 @@ TagInputComponent.prototype.hasCustomTemplate = function () {

dist/modules/components/tag-input.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"TagInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./helpers/accessor","name":"TagInputAccessor"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"TagInputComponent"},"multi":true}],"styleUrls":["./tag-input.style.scss"],"templateUrl":"./tag-input.template.html","animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"trigger"},"arguments":["flyInOut",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"transform":"translateX(0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[250,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"offset":0,"transform":"translate(0px, 20px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.3,"offset":0.3,"transform":"translate(0px, -10px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.5,"offset":0.5,"transform":"translate(0px, 0px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.75,"offset":0.75,"transform":"translate(0px, 5px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"offset":1,"transform":"translate(0px, 0px)"}]}]]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[150,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(-15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"transform":"translateX(100%)","offset":1}]}]]}]}]]}]]}]}]}],"members":{"separatorKeys":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"secondaryPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"maxItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"transform":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onlyFromAutocomplete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"errorMessages":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onTextChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"clearOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"hideForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pasteSplitPattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"blinkIfDupe":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"removable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"allowDupes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onAdd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onRemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTextChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onValidationError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTagEdited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","module":"./dropdown/tag-input-dropdown.component","name":"TagInputDropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"},{"descendants":false}]}]}],"inputForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"./tag-input-form/tag-input-form.component","name":"TagInputForm"}]}]}],"tags":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChildren"},"arguments":[{"__symbolic":"reference","module":"./tag/tag.component","name":"TagComponent"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"removeItem":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"isTagValid":[{"__symbolic":"method"}],"appendNewTag":[{"__symbolic":"method"}],"createTag":[{"__symbolic":"method"}],"selectItem":[{"__symbolic":"method"}],"fireEvents":[{"__symbolic":"method"}],"handleKeydown":[{"__symbolic":"method"}],"setInputValue":[{"__symbolic":"method"}],"getControl":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"blur":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"hasCustomTemplate":[{"__symbolic":"method"}],"switchNext":[{"__symbolic":"method"}],"switchPrev":[{"__symbolic":"method"}],"trackBy":[{"__symbolic":"method"}],"onPasteCallback":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TagInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./helpers/accessor","name":"TagInputAccessor"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"TagInputComponent"},"multi":true}],"styleUrls":["./tag-input.style.scss"],"templateUrl":"./tag-input.template.html","animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"trigger"},"arguments":["flyInOut",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"transform":"translateX(0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[250,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"offset":0,"transform":"translate(0px, 20px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.3,"offset":0.3,"transform":"translate(0px, -10px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.5,"offset":0.5,"transform":"translate(0px, 0px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.75,"offset":0.75,"transform":"translate(0px, 5px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"offset":1,"transform":"translate(0px, 0px)"}]}]]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[150,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(-15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"transform":"translateX(100%)","offset":1}]}]]}]}]]}]]}]}]}],"members":{"separatorKeys":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"secondaryPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"maxItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"transform":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onlyFromAutocomplete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"errorMessages":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onTextChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"clearOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"hideForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pasteSplitPattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"blinkIfDupe":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"removable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"allowDupes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onAdd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onRemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTextChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onValidationError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTagEdited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","module":"./dropdown/tag-input-dropdown.component","name":"TagInputDropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"},{"descendants":false}]}]}],"inputForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"./tag-input-form/tag-input-form.component","name":"TagInputForm"}]}]}],"tags":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChildren"},"arguments":[{"__symbolic":"reference","module":"./tag/tag.component","name":"TagComponent"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"removeItem":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"isTagValid":[{"__symbolic":"method"}],"appendNewTag":[{"__symbolic":"method"}],"createTag":[{"__symbolic":"method"}],"selectItem":[{"__symbolic":"method"}],"fireEvents":[{"__symbolic":"method"}],"handleKeydown":[{"__symbolic":"method"}],"setInputValue":[{"__symbolic":"method"}],"getControl":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"blur":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"hasCustomTemplate":[{"__symbolic":"method"}],"switchNext":[{"__symbolic":"method"}],"switchPrev":[{"__symbolic":"method"}],"trackBy":[{"__symbolic":"method"}],"onPasteCallback":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"TagInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./helpers/accessor","name":"TagInputAccessor"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"TagInputComponent"},"multi":true}],"styleUrls":["./tag-input.style.scss"],"templateUrl":"./tag-input.template.html","animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"trigger"},"arguments":["flyInOut",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"transform":"translateX(0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[250,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"offset":0,"transform":"translate(0px, 20px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.3,"offset":0.3,"transform":"translate(0px, -10px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.5,"offset":0.5,"transform":"translate(0px, 0px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.75,"offset":0.75,"transform":"translate(0px, 5px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"offset":1,"transform":"translate(0px, 0px)"}]}]]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[150,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(-15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"transform":"translateX(100%)","offset":1}]}]]}]}]]}]]}]}]}],"members":{"separatorKeys":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"secondaryPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"maxItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"transform":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onlyFromAutocomplete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"errorMessages":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onTextChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"clearOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"hideForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pasteSplitPattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"blinkIfDupe":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"removable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"allowDupes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"modelAsStrings":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onAdd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onRemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTextChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onValidationError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTagEdited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","module":"./dropdown/tag-input-dropdown.component","name":"TagInputDropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"},{"descendants":false}]}]}],"inputForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"./tag-input-form/tag-input-form.component","name":"TagInputForm"}]}]}],"tags":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChildren"},"arguments":[{"__symbolic":"reference","module":"./tag/tag.component","name":"TagComponent"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"removeItem":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"isTagValid":[{"__symbolic":"method"}],"appendNewTag":[{"__symbolic":"method"}],"createTag":[{"__symbolic":"method"}],"selectItem":[{"__symbolic":"method"}],"fireEvents":[{"__symbolic":"method"}],"handleKeydown":[{"__symbolic":"method"}],"setInputValue":[{"__symbolic":"method"}],"getControl":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"blur":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"hasCustomTemplate":[{"__symbolic":"method"}],"switchNext":[{"__symbolic":"method"}],"switchPrev":[{"__symbolic":"method"}],"trackBy":[{"__symbolic":"method"}],"onPasteCallback":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"TagInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./helpers/accessor","name":"TagInputAccessor"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"tag-input","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"TagInputComponent"},"multi":true}],"styleUrls":["./tag-input.style.scss"],"templateUrl":"./tag-input.template.html","animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"trigger"},"arguments":["flyInOut",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"state"},"arguments":["in",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"transform":"translateX(0)"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[250,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"offset":0,"transform":"translate(0px, 20px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.3,"offset":0.3,"transform":"translate(0px, -10px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.5,"offset":0.5,"transform":"translate(0px, 0px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0.75,"offset":0.75,"transform":"translate(0px, 5px)"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"offset":1,"transform":"translate(0px, 0px)"}]}]]}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"transition"},"arguments":[":leave",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"animate"},"arguments":[150,{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"keyframes"},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":1,"transform":"translateX(-15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"style"},"arguments":[{"opacity":0,"transform":"translateX(100%)","offset":1}]}]]}]}]]}]]}]}]}],"members":{"separatorKeys":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"secondaryPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"maxItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"transform":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validators":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onlyFromAutocomplete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"errorMessages":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onTextChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"clearOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"hideForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"addOnPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pasteSplitPattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"blinkIfDupe":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"removable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"allowDupes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"modelAsStrings":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onAdd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onRemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTextChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onPaste":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onValidationError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onTagEdited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"dropdown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","module":"./dropdown/tag-input-dropdown.component","name":"TagInputDropdown"}]}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef"},{"descendants":false}]}]}],"inputForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"./tag-input-form/tag-input-form.component","name":"TagInputForm"}]}]}],"tags":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChildren"},"arguments":[{"__symbolic":"reference","module":"./tag/tag.component","name":"TagComponent"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"removeItem":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"isTagValid":[{"__symbolic":"method"}],"appendNewTag":[{"__symbolic":"method"}],"createTag":[{"__symbolic":"method"}],"selectItem":[{"__symbolic":"method"}],"fireEvents":[{"__symbolic":"method"}],"handleKeydown":[{"__symbolic":"method"}],"setInputValue":[{"__symbolic":"method"}],"getControl":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"blur":[{"__symbolic":"method"}],"hasErrors":[{"__symbolic":"method"}],"isInputFocused":[{"__symbolic":"method"}],"hasCustomTemplate":[{"__symbolic":"method"}],"switchNext":[{"__symbolic":"method"}],"switchPrev":[{"__symbolic":"method"}],"trackBy":[{"__symbolic":"method"}],"onPasteCallback":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}}}]

dist/modules/components/tests/testing-helpers.d.ts

@@ -6,4 +6,4 @@ export declare class BasicTagInputComponent {
     items: string[];
-    onAdd(item: any): void;
-    onRemove(item: any): void;
+    onAdd(): void;
+    onRemove(): void;
     validators: any;
@@ -26,4 +26,4 @@ }
     validators: any;
-    onAdd(item: any): void;
-    onRemove(item: any): void;
+    onAdd(): void;
+    onRemove(): void;
 }
@@ -30,0 +30,0 @@ export declare class TagInputComponentWithTransformer {

dist/modules/components/tests/testing-helpers.js

@@ -43,4 +43,4 @@ "use strict";
     }
-    TagInputComponentWithOutputs.prototype.onAdd = function (item) { };
-    TagInputComponentWithOutputs.prototype.onRemove = function (item) { };
+    TagInputComponentWithOutputs.prototype.onAdd = function () { };
+    TagInputComponentWithOutputs.prototype.onRemove = function () { };
     return TagInputComponentWithOutputs;
@@ -86,4 +86,4 @@ }());
     }
-    TagInputComponentWithValidation.prototype.onAdd = function (item) { };
-    TagInputComponentWithValidation.prototype.onRemove = function (item) { };
+    TagInputComponentWithValidation.prototype.onAdd = function () { };
+    TagInputComponentWithValidation.prototype.onRemove = function () { };
     return TagInputComponentWithValidation;
@@ -90,0 +90,0 @@ }());

dist/vendor.bundle.js

@@ -78,3 +78,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 /******/ 	var hotApplyOnUpdate = true;
-/******/ 	var hotCurrentHash = "770a335a794203a583f7"; // eslint-disable-line no-unused-vars
+/******/ 	var hotCurrentHash = "de519670ca2c8bace1ad"; // eslint-disable-line no-unused-vars
 /******/ 	var hotCurrentModuleData = {};
@@ -81,0 +81,0 @@ /******/ 	var hotCurrentParents = []; // eslint-disable-line no-unused-vars

modules/components/tests/tag-input.spec.ts

@@ -12,4 +12,5 @@ import {
 import { BrowserModule } from '@angular/platform-browser';
-
 import { TagModel } from '../helpers/accessor';
+import { TagInputComponent } from '../tag-input';
+const match = jasmine.objectContaining;
 
@@ -30,6 +31,2 @@ import {
 
-import { TagInputComponent } from '../tag-input';
-
-const match = jasmine.objectContaining;
-
 describe('TagInputComponent', () => {
@@ -50,2 +47,3 @@ beforeEach(() => {
         tick();
+
         fixture.detectChanges();
@@ -52,0 +50,0 @@ tick();

package.json

 {
   "name": "ng2-tag-input",
-  "version": "0.8.1",
+  "version": "0.8.3",
   "description": "Tag Input component for Angular 2",
@@ -34,3 +34,3 @@ "scripts": {
     "@types/node": "^7.0.3",
-    "angular2-template-loader": "^0.6.0",
+    "angular2-template-loader": "0.6.0",
     "autoprefixer": "^6.7.0",
@@ -72,3 +72,3 @@ "awesome-typescript-loader": "3.0.0-beta.18",
   "dependencies": {
-    "ng2-material-dropdown": "0.6.4"
+    "ng2-material-dropdown": "0.7.2"
   },
@@ -75,0 +75,0 @@ "peerDependencies": {

README.md

@@ -301,2 +301,7 @@ # Tag Input Component for Angular [![Build Status](https://travis-ci.org/Gbuomprisco/ng2-tag-input.svg?branch=develop)](https://travis-ci.org/Gbuomprisco/ng2-tag-input)
 
+**`appendToBody`** - [**`?boolean`**]
+
+If set to `false`, the dropdown will not be appended to the body, but will remain in its parent element. Useful when using the components inside popups or dropdowns. Defaults to `false`.
+
+
 ---
@@ -510,11 +515,11 @@
 ```html
-<tag-input [ngModel]="['@item']" #input>
-    <template let-item="item"> <!-- DEFINE HERE YOUR TEMPLATE -->
+<tag-input [ngModel]="['@item']" [modelAsStrings]="true" #input>
+    <template let-item="item" let-index="index"> <!-- DEFINE HERE YOUR TEMPLATE -->
         <span>
             <!-- YOU MAY ACTUALLY DISPLAY WHATEVER YOU WANT IF YOU PASS AN OBJECT AS ITEM -->
-            item: {{ item.display }}
+            <!-- ex. item.myDisplayValue -->
+
+            item: {{ item }}
         </span>
-        <span (click)="input.removeItem(item)" class="ng2-tag__remove-button">
-            x
-        </span>
+        <delete-icon (click)="input.removeItem(item, index)"></delete-icon>
     </template>
@@ -521,0 +526,0 @@ </tag-input>

tsconfig.json

@@ -19,9 +19,12 @@ {
         "moduleResolution": "node",
+        "baseUrl": "",
         "rootDir": ".",
-        "baseUrl": "",
         "types": [
             "node",
-            "jasmine",
-            "es6-shim"
+            "jasmine"
         ],
+        "lib": [
+            "dom",
+            "es2015"
+        ],
         "suppressImplicitAnyIndexErrors": true
@@ -28,0 +31,0 @@ },

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

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

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

722249

increased by29.12%

Number of package files

136

increased by49.45%

Lines of code

7235

increased by33.54%

Number of lines in readme file

649

increased by0.78%

Number of low supply chain risk alerts

4

decreased by-20%

Dependency changes

• + Addedng2-material-dropdown@0.7.2(transitive)

• - Removedng2-material-dropdown@0.6.4(transitive)

• Updatedng2-material-dropdown@0.7.2