{"__symbolic":"module","version":4,"metadata":{"AutocompleteLibComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"ng-autocomplete-lib","template":"\n    <p>\n      autocomplete-lib works!\n    </p>\n  ","styles":[]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"AutocompleteLibModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":10,"character":4}],"declarations":[{"__symbolic":"reference","name":"AutocompleteLibComponent"},{"__symbolic":"reference","name":"AutocompleteComponent"},{"__symbolic":"reference","name":"HighlightPipe"}],"exports":[{"__symbolic":"reference","name":"AutocompleteLibComponent"},{"__symbolic":"reference","name":"AutocompleteComponent"},{"__symbolic":"reference","name":"HighlightPipe"}]}]}],"members":{}},"AutocompleteComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":30,"character":1},"arguments":[{"selector":"ng-autocomplete","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":36,"character":15},"useExisting":{"__symbolic":"reference","name":"AutocompleteComponent"},"multi":true}],"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":41,"character":17},"member":"None"},"host":{"(document:click)":"handleClick($event)","class":"ng-autocomplete","$quoted$":["(document:click)","class"]},"template":"<div class=\"autocomplete-container\"\r\n     [ngClass]=\"{ 'active': isOpen}\">\r\n  <div class=\"input-container\">\r\n    <input #searchInput type=\"text\" placeholder={{placeHolder}}\r\n           [(ngModel)]=query\r\n           (input)=\"onChange($event)\"\r\n           (focus)=handleFocus($event)\r\n           (blur)=handleBlur($event)\r\n           [disabled]=\"disabled\">\r\n    <div class=\"x\" *ngIf=\"query && !isLoading && !disabled\" (click)=\"remove($event)\">\r\n      <i class=\"material-icons\">close</i>\r\n    </div>\r\n    <!--Loading mask-->\r\n    <div class=\"sk-fading-circle\" *ngIf=\"isLoading\">\r\n      <div class=\"sk-circle1 sk-circle\"></div>\r\n      <div class=\"sk-circle2 sk-circle\"></div>\r\n      <div class=\"sk-circle3 sk-circle\"></div>\r\n      <div class=\"sk-circle4 sk-circle\"></div>\r\n      <div class=\"sk-circle5 sk-circle\"></div>\r\n      <div class=\"sk-circle6 sk-circle\"></div>\r\n      <div class=\"sk-circle7 sk-circle\"></div>\r\n      <div class=\"sk-circle8 sk-circle\"></div>\r\n      <div class=\"sk-circle9 sk-circle\"></div>\r\n      <div class=\"sk-circle10 sk-circle\"></div>\r\n      <div class=\"sk-circle11 sk-circle\"></div>\r\n      <div class=\"sk-circle12 sk-circle\"></div>\r\n    </div>\r\n  </div>\r\n\r\n  <!--FilteredList items-->\r\n  <div class=\"suggestions-container\"\r\n       [ngClass]=\"{ 'is-hidden': isHistoryListVisible, 'is-visible': !isHistoryListVisible}\">\r\n    <!--FilteredList heading-->\r\n    <div class=\"heading\" *ngIf=\"filteredList.length > 0 && heading\">\r\n      <div class=\"text\">{{heading}}</div>\r\n    </div>\r\n\r\n    <ul #filteredListElement>\r\n      <li *ngFor=\"let item of filteredList; let idx = index\" class=\"item\">\r\n        <!--string logic-->\r\n        <div [class.complete-selected]=\"idx === selectedIdx\" *ngIf='isType(item)'\r\n             (click)=\"select(item)\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"itemTemplate;  context: { $implicit: item | highlight: toHighlight }\">\r\n          </ng-container>\r\n        </div>\r\n        <!--object logic-->\r\n        <div [class.complete-selected]=\"idx === selectedIdx\" *ngIf='!isType(item)'\r\n             (click)=\"select(item)\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item | highlight: toHighlight : searchKeyword }\">\r\n          </ng-container>\r\n        </div>\r\n      </li>\r\n      <li class=\"manual-search\"><div>\r\n        <a #manualSearch (click)=\"manualsearch()\">{{manualSearchText}}</a>\r\n      </div></li>\r\n    </ul>\r\n  </div>\r\n\r\n  <!--HistoryList items-->\r\n  <div class=\"suggestions-container\"\r\n       [ngClass]=\"{ 'is-hidden': !isHistoryListVisible, 'is-visible': isHistoryListVisible}\">\r\n    <!--HistoryList heading-->\r\n    <div class=\"heading\" *ngIf=\"historyList.length > 0 && historyHeading\">\r\n      <div class=\"text\">{{historyHeading}}</div>\r\n      <div class=\"x\" (click)=\"resetHistoryList($event)\">\r\n        <i class=\"material-icons\">delete</i>\r\n      </div>\r\n    </div>\r\n\r\n    <ul #historyListElement>\r\n      <li *ngFor=\"let item of historyList; let idx = index\" class=\"item\">\r\n        <!--string logic-->\r\n        <div [class.complete-selected]=\"idx === selectedIdx\" *ngIf='isType(item)' (click)=\"select(item)\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"itemTemplate;  context: { $implicit: item }\">\r\n          </ng-container>\r\n        </div>\r\n        <!--object logic-->\r\n        <div [class.complete-selected]=\"idx === selectedIdx\" *ngIf='!isType(item)' (click)=\"select(item)\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\">\r\n          </ng-container>\r\n        </div>\r\n        <div class=\"x\" (click)=\"removeHistoryItem(idx, $event)\">\r\n          <i class=\"material-icons\">close</i>\r\n        </div>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n\r\n  <!--Not found-->\r\n  <div class=\"not-found\" *ngIf=\"isLoading ? !isLoading && notFound : notFound\">\r\n    <ng-container\r\n      *ngTemplateOutlet=\"notFoundTemplate;  context: { $implicit: notFoundText  }\">\r\n    </ng-container>\r\n  </div>\r\n</div>\r\n<div class=\"overlay\" *ngIf=\"overlay\" (click)=\"handleOverlay()\"></div>\r\n","styles":["@import url(https://fonts.googleapis.com/icon?family=Material+Icons);.ng-autocomplete{width:600px}.autocomplete-container{box-shadow:0 1px 3px 0 rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 2px 1px -1px rgba(0,0,0,.12);position:relative;overflow:visible;height:40px}.autocomplete-container .input-container input{font-size:14px;box-sizing:border-box;border:none;box-shadow:none;outline:0;background-color:#fff;color:rgba(0,0,0,.87);width:100%;padding:0 15px;line-height:40px;height:40px}.autocomplete-container .input-container input:disabled{background-color:#eee;color:#666}.autocomplete-container .input-container .x{position:absolute;right:10px;margin:auto;cursor:pointer;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.autocomplete-container .input-container .x i{color:rgba(0,0,0,.54);font-size:22px;vertical-align:middle}.autocomplete-container .suggestions-container{position:absolute;width:100%;background:#fff;height:auto;box-shadow:0 2px 5px rgba(0,0,0,.25);box-sizing:border-box}.autocomplete-container .suggestions-container ul{padding:0;margin:0;max-height:240px;overflow-y:auto}.autocomplete-container .suggestions-container ul li{position:relative;list-style:none;padding:0;margin:0;cursor:pointer}.autocomplete-container .suggestions-container ul li a{padding:14px 15px;display:block;text-decoration:none;cursor:pointer;color:rgba(0,0,0,.87);font-size:15px}.autocomplete-container .suggestions-container .complete-selected,.autocomplete-container .suggestions-container ul li:hover{background-color:rgba(158,158,158,.18)}.autocomplete-container .suggestions-container .heading{position:relative;padding:10px 15px;border:1px solid #f1f1f1}.autocomplete-container .suggestions-container .heading .text{font-size:.85em}.autocomplete-container .suggestions-container .x{position:absolute;right:10px;margin:auto;cursor:pointer;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.autocomplete-container .suggestions-container .x i{color:rgba(0,0,0,.54);font-size:18px;vertical-align:middle}.autocomplete-container .suggestions-container.is-hidden{visibility:hidden}.autocomplete-container .suggestions-container.is-visible{visibility:visible}.autocomplete-container .not-found{padding:0 .75em;border:1px solid #f1f1f1;background:#fff}.autocomplete-container .not-found div{padding:.4em 0;font-size:.95em;line-height:1.4;border-bottom:1px solid rgba(230,230,230,.7)}.autocomplete-container.active{z-index:999}.highlight{font-weight:700}.overlay{position:absolute;background-color:transparent;width:100%;height:100%;top:0;right:0;bottom:0;left:0;z-index:50}input[type=text]::-ms-clear{display:none}.sk-fading-circle{width:20px;height:20px;position:absolute;right:10px;top:0;bottom:0;margin:auto}.sk-fading-circle .sk-circle{width:100%;height:100%;position:absolute;left:0;top:0}.sk-fading-circle .sk-circle:before{content:\"\";display:block;margin:0 auto;width:15%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:1.2s ease-in-out infinite both sk-circleFadeDelay;animation:1.2s ease-in-out infinite both sk-circleFadeDelay}.sk-fading-circle .sk-circle2{-webkit-transform:rotate(30deg);transform:rotate(30deg)}.sk-fading-circle .sk-circle3{-webkit-transform:rotate(60deg);transform:rotate(60deg)}.sk-fading-circle .sk-circle4{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.sk-fading-circle .sk-circle5{-webkit-transform:rotate(120deg);transform:rotate(120deg)}.sk-fading-circle .sk-circle6{-webkit-transform:rotate(150deg);transform:rotate(150deg)}.sk-fading-circle .sk-circle7{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.sk-fading-circle .sk-circle8{-webkit-transform:rotate(210deg);transform:rotate(210deg)}.sk-fading-circle .sk-circle9{-webkit-transform:rotate(240deg);transform:rotate(240deg)}.sk-fading-circle .sk-circle10{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.sk-fading-circle .sk-circle11{-webkit-transform:rotate(300deg);transform:rotate(300deg)}.sk-fading-circle .sk-circle12{-webkit-transform:rotate(330deg);transform:rotate(330deg)}.sk-fading-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-fading-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-fading-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-fading-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-fading-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-fading-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-fading-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-fading-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-fading-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-fading-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-fading-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleFadeDelay{0%,100%,39%{opacity:0}40%{opacity:1}}@keyframes sk-circleFadeDelay{0%,100%,39%{opacity:0}40%{opacity:1}}"]}]}],"members":{"searchInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":49,"character":3},"arguments":["searchInput"]}]}],"manualSearchElem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":50,"character":3},"arguments":["manualSearch"]}]}],"filteredListElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":51,"character":3},"arguments":["filteredListElement"]}]}],"historyListElement":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":52,"character":3},"arguments":["historyListElement"]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":78,"character":3}}]}],"searchKeyword":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":79,"character":3}}]}],"placeHolder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":3}}]}],"manualSearchText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":81,"character":3}}]}],"heading":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":3}}]}],"initialValue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":83,"character":3}}]}],"historyIdentifier":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":90,"character":3}}]}],"historyHeading":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":95,"character":3}}]}],"historyListMaxNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":96,"character":3}}]}],"notFoundText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":97,"character":3}}]}],"isLoading":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":98,"character":3}}]}],"debounceTime":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":99,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":100,"character":3}}]}],"minQueryLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":3}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":109,"character":3}}]}],"manualsearchselected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":111,"character":3}}]}],"inputChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3}}]}],"inputFocused":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3}}]}],"inputBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":119,"character":3}}]}],"inputCleared":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":122,"character":3}}]}],"opened":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":125,"character":3}}]}],"closed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3}}]}],"scrolledToEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":131,"character":3}}]}],"itemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":135,"character":3}}]}],"notFoundTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":136,"character":3}}]}],"customTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":137,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":137,"character":16}]}]}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":174,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":174,"character":56}]}],"setDisabledState":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"setInitialValue":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"handleItemsChange":[{"__symbolic":"method"}],"filterList":[{"__symbolic":"method"}],"isType":[{"__symbolic":"method"}],"manualsearch":[{"__symbolic":"method"}],"select":[{"__symbolic":"method"}],"handleClick":[{"__symbolic":"method"}],"handleOverlay":[{"__symbolic":"method"}],"handleScroll":[{"__symbolic":"method"}],"setPanelState":[{"__symbolic":"method"}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"clear":[{"__symbolic":"method"}],"remove":[{"__symbolic":"method"}],"initSearchHistory":[{"__symbolic":"method"}],"handleOpen":[{"__symbolic":"method"}],"handleClose":[{"__symbolic":"method"}],"handleFocus":[{"__symbolic":"method"}],"handleBlur":[{"__symbolic":"method"}],"scrollToEnd":[{"__symbolic":"method"}],"initEventStream":[{"__symbolic":"method"}],"listenEventStream":[{"__symbolic":"method"}],"onKeyUp":[{"__symbolic":"method"}],"onFocusItem":[{"__symbolic":"method"}],"scrollToFocusedItem":[{"__symbolic":"method"}],"onHandleEnter":[{"__symbolic":"method"}],"onEsc":[{"__symbolic":"method"}],"onTab":[{"__symbolic":"method"}],"onDelete":[{"__symbolic":"method"}],"saveHistory":[{"__symbolic":"method"}],"saveHistoryToLocalStorage":[{"__symbolic":"method"}],"removeHistoryItem":[{"__symbolic":"method"}],"resetHistoryList":[{"__symbolic":"method"}]}},"HighlightPipe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":2,"character":1},"arguments":[{"name":"highlight"}]}],"members":{"transform":[{"__symbolic":"method"}]}}},"origins":{"AutocompleteLibComponent":"./lib/autocomplete-lib.component","AutocompleteLibModule":"./lib/autocomplete-lib.module","AutocompleteComponent":"./lib/autocomplete/autocomplete.component","HighlightPipe":"./lib/autocomplete/highlight.pipe"},"importAs":"angular-ng-autocomplete"}