mdc-autocomplete
Version:
MdcAutocomplete in conjunction with MdcAutocompleteList and MdcAutocompleteListItem are a pack of angular components to provide an autocomplete functionality to Angular MDC web.
2 lines • 3.46 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("mdc-autocomplete-list"),require("mdc-autocomplete-list-item"),require("@angular-mdc/web"),require("@angular/forms")):"function"==typeof define&&define.amd?define("mdc-autocomplete",["exports","@angular/core","mdc-autocomplete-list","mdc-autocomplete-list-item","@angular-mdc/web","@angular/forms"],t):t(e["mdc-autocomplete"]={},e.ng.core,null,null,null,e.ng.forms)}(this,function(e,t,o,n,c,i){"use strict";var r=function(){function e(){}return e.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}],e.ctorParameters=function(){return[]},e.ngInjectableDef=t.defineInjectable({factory:function(){return new e},token:e,providedIn:"root"}),e}(),u=function(){function e(){}return e.prototype.ngOnInit=function(){},e.decorators=[{type:t.Component,args:[{selector:"mdc-mdc-autocomplete",template:"\n <p>\n mdc-autocomplete works!\n </p>\n ",styles:[]}]}],e.ctorParameters=function(){return[]},e}(),l=function(){function e(){this.itemSelected=new t.EventEmitter,this.label=""}return Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){this._value=e,this.autocompleteList.filter=e},enumerable:!0,configurable:!0}),e.prototype.ngOnInit=function(){},e.prototype.ngAfterContentInit=function(){var t=this;this.setNativeInputAtrributes(),this.autocompleteList.itemSelected.subscribe(function(e){t.selectedItemValue=e,t.value=e.toString(),t.itemSelected.emit(e),t.autocompleteList.visible=!1})},e.prototype.onKeyDown=function(e){"ArrowDown"===e.key?this.autocompleteList.focusNextItem():"ArrowUp"===e.key?this.autocompleteList.focusPreviousItem():"Enter"===e.key&&this.autocompleteList.selectFocusedItem()},e.prototype.onKeyUp=function(e){"ArrowDown"!==e.key&&"ArrowUp"!==e.key&&"Enter"!==e.key&&this.onTextFieldChange()},e.prototype.onTextFieldChange=function(){this.autocompleteList.visible=!0,this.autocompleteList.filter=this.textField.value},e.prototype.onFocus=function(e){var t=this;setTimeout(function(){t.autocompleteList.visible=e},100)},e.prototype.setNativeInputAtrributes=function(){var e=this.textField.elementRef.nativeElement.querySelector("input");e.autocomplete="off",e.autocorrect="off",e.autocapitalize="off"},e.decorators=[{type:t.Component,args:[{selector:"mdc-autocomplete",template:'<div class="autocomplete">\n <mdc-text-field #textField [(ngModel)]="value" [label]="label" (keydown)="onKeyDown($event)" (keyup)="onKeyUp($event)"\n (click)="onFocus(true)" (focus)="onFocus(true)" (focusout)="onFocus(false)" (blur)="onFocus(false)"\n autocomplete="off" autocorrect="off" autocapitalize="off">\n </mdc-text-field>\n <ng-content select="mdc-autocomplete-list"></ng-content>\n</div>\n',styles:[".autocomplete{display:inline-block}"]}]}],e.ctorParameters=function(){return[]},e.propDecorators={label:[{type:t.Input}],itemSelected:[{type:t.Output}],textField:[{type:t.ViewChild,args:["textField"]}],autocompleteList:[{type:t.ContentChild,args:[o.MdcAutocompleteList]}]},e}(),s=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{imports:[o.MdcAutocompleteListModule,n.MdcAutocompleteListItemModule,c.MdcTextFieldModule,i.FormsModule],declarations:[u,l],exports:[l]}]}],e}();e.MdcAutocompleteService=r,e.MdcAutocompleteModule=s,e.MdcAutocomplete=l,e.ɵa=u,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=mdc-autocomplete.umd.min.js.map