@muzykantov/ngx-dadata
Version:
Angular 6+ [DaData][dadata] suggestion (подсказки) implementation
2 lines • 6.49 kB
JavaScript
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common/http"),require("rxjs"),require("rxjs/operators"),require("@angular/forms"),require("@angular/common")):"function"==typeof define&&define.amd?define("@muzykantov/ngx-dadata",["exports","@angular/core","@angular/common/http","rxjs","rxjs/operators","@angular/forms","@angular/common"],e):e((t.muzykantov=t.muzykantov||{},t.muzykantov["ngx-dadata"]={}),t.ng.core,t.ng.common.http,t.rxjs,t.rxjs.operators,t.ng.forms,t.ng.common)}(this,function(t,o,a,n,i,e,r){"use strict";var s={fio:"fio",address:"address",party:"party",bank:"bank",email:"email"},u=function(){function t(t){this.http=t,this.apiKey=""}return t.prototype.setApiKey=function(t){this.apiKey=t},t.prototype.getData=function(t,e,o,n){void 0===e&&(e=s.address),void 0===o&&(o=10),void 0===n&&(n=null);var i={headers:new a.HttpHeaders({Accept:"application/json","Content-Type":"application/json",Authorization:"Token "+this.apiKey})},r=Object.assign({query:t,count:o},n);return this.http.post("https://suggestions.dadata.ru/suggestions/api/4_1/rs/suggest/"+e,r,i)},t.decorators=[{type:o.Injectable,args:[{providedIn:"root"}]}],t.ctorParameters=function(){return[{type:a.HttpClient}]},t.ngInjectableDef=o.defineInjectable({factory:function(){return new t(o.inject(a.HttpClient))},token:t,providedIn:"root"}),t}(),p={apiKey:"",type:s.address,delay:500,limit:10,width:"auto",minWidth:"0"},c={provide:e.NG_VALUE_ACCESSOR,useExisting:o.forwardRef(function(){return l}),multi:!0};var l=function(){function t(t,e){this.dataService=t,this._r=e,this._value="",this.currentFocus=-1,this.data=[],this.config=p,this.disabled=null,this.type=s.address,this.options=null,this.limit=p.limit,this.placeholder="",this.selected=new o.EventEmitter,this.input=new o.EventEmitter,this.inputString$=new n.Subject,this.onTouched=function(){},this.propagateChange=function(){},this.validateFn=function(){}}return Object.defineProperty(t.prototype,"value",{get:function(){return this._value},set:function(t){t!==this._value&&(this._value=t,this.propagateChange(t),this.input.emit(t))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var e=this;this.type=this.config.type,this.dataService.setApiKey(this.apiKey?this.apiKey:this.config.apiKey),this.inputString$.pipe(i.debounce(function(){return n.timer(e.config.delay?e.config.delay:500)})).subscribe(function(t){e.dataService.getData(t,e.type,e.limit,e.options).subscribe(function(t){e.data=t.suggestions})})},t.prototype.ngOnChanges=function(t){t.value},t.prototype.getData=function(t){this.inputString$.next(t),this.currentFocus=-1},t.prototype.onClick=function(t,e){this.inputValue.nativeElement.value=e.value,this.propagateChange(e.value),this.inputValue.nativeElement.focus(),this.selectedSuggestion=e,this.data=[],this.currentFocus=-1,this.selected.emit(e)},t.prototype.onOutsideClick=function(){this.data=[]},t.prototype.onArrowDown=function(){this.removeFocus(this.currentFocus),this.currentFocus>=this.data.length-1?this.currentFocus=0:this.currentFocus++,this.setFocus(this.currentFocus)},t.prototype.onArrowUp=function(){this.removeFocus(this.currentFocus),0===this.currentFocus?this.currentFocus=this.data.length-1:this.currentFocus--,this.setFocus(this.currentFocus)},t.prototype.onEnter=function(){this.selectedSuggestion=this.data[this.currentFocus],this.inputValue.nativeElement.value=this.selectedSuggestion.value,this.data=[],this.currentFocus=-1,this.propagateChange(this.selectedSuggestion.value),this.selected.emit(this.selectedSuggestion)},t.prototype.setFocus=function(t){var e=document.getElementById(t+"item");this._r.addClass(e,"active")},t.prototype.removeFocus=function(t){if(-1!==t){var e=document.getElementById(t+"item");this._r.removeClass(e,"active")}},t.prototype.writeValue=function(t){t!==undefined&&(this._value=t)},t.prototype.registerOnChange=function(t){this.propagateChange=t},t.prototype.registerOnTouched=function(t){this.onTouched=t},t.prototype.setDisabledState=function(t){alert("disabled!"),this.disabled=t},t.decorators=[{type:o.Component,args:[{selector:"ngx-da-data",template:'<div class="autocomplete">\r\n <label for="address_input"></label>\r\n <input [disabled]="disabled ? true : null" type="text" id="address_input" name="address" class="search" #inputValue (input)="getData(inputValue.value)"\r\n [placeholder]="placeholder" (keyup.ArrowDown)="onArrowDown()" (keyup.ArrowUp)="onArrowUp()"\r\n (keyup.Enter)="onEnter()" spellcheck="false" [(ngModel)]="value" autocomplete="new-password" />\r\n <div *ngIf="data.length">\r\n <div class="autocomplete-items">\r\n <div class="autocomplele-item" *ngFor="let item of data;let i = index" (click)="onClick($event, item)" [id]="i+\'item\'">\r\n {{item.value}}\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n',providers:[c],styles:[".autocomplete{position:relative}input{border:0 solid transparent;background-color:#f1f1f1;padding:5px}input[type=text]{background-color:#f1f1f1;width:100%}input[type=submit]{background-color:#1e90ff;color:#fff}.autocomplete-items{position:absolute;border:1px solid #d4d4d4;border-bottom:none;border-top:none;z-index:99;top:100%;left:0;right:0}.autocomplete-items .autocomplele-item{padding:5px 10px;cursor:pointer;background-color:#fff;border-bottom:1px solid #d4d4d4}.autocomplete-items .autocomplele-item:hover{background-color:#e9e9e9}.autocomplete-items .autocomplele-item.active{background-color:#1e90ff!important;color:#fff}"]}]}],t.ctorParameters=function(){return[{type:u},{type:o.Renderer2}]},t.propDecorators={config:[{type:o.Input}],apiKey:[{type:o.Input}],disabled:[{type:o.Input}],type:[{type:o.Input}],options:[{type:o.Input}],limit:[{type:o.Input}],placeholder:[{type:o.Input}],selectedSuggestion:[{type:o.Output}],selected:[{type:o.Output}],input:[{type:o.Output}],inputValue:[{type:o.ViewChild,args:["inputValue"]}],onOutsideClick:[{type:o.HostListener,args:["document:click"]}]},t}(),d=function(){function t(){}return t.decorators=[{type:o.NgModule,args:[{imports:[r.CommonModule,e.FormsModule],declarations:[l],exports:[l]}]}],t}();t.DaDataType=s,t.NgxDaDataService=u,t.createDaDataValidator=function h(o){return function(t){var e={rangeError:{given:t.value,expected:o}};return t.value!==o?e:null}},t.NgxDaDataComponent=l,t.NgxDaDataModule=d,t.DaDataConfigDefault=p,Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=muzykantov-ngx-dadata.umd.min.js.map