ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
2 lines • 16.6 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/cdk/keycodes"),require("@angular/cdk/overlay"),require("@angular/cdk/portal"),require("@angular/common"),require("@angular/forms"),require("@angular/core"),require("rxjs"),require("rxjs/operators"),require("ng-zorro-antd/core")):"function"==typeof define&&define.amd?define("ng-zorro-antd/auto-complete",["exports","@angular/cdk/keycodes","@angular/cdk/overlay","@angular/cdk/portal","@angular/common","@angular/forms","@angular/core","rxjs","rxjs/operators","ng-zorro-antd/core"],t):t((e["ng-zorro-antd"]=e["ng-zorro-antd"]||{},e["ng-zorro-antd"]["auto-complete"]={}),e.ng.cdk.keycodes,e.ng.cdk.overlay,e.ng.cdk.portal,e.ng.common,e.ng.forms,e.ng.core,e.rxjs,e.rxjs.operators,e["ng-zorro-antd"].core)}(this,function(e,o,t,n,i,s,r,a,c,l){"use strict";var p=(u.decorators=[{type:r.Component,args:[{selector:"nz-auto-optgroup",exportAs:"nzAutoOptgroup",preserveWhitespaces:!1,changeDetection:r.ChangeDetectionStrategy.OnPush,encapsulation:r.ViewEncapsulation.None,template:'<div class="ant-select-dropdown-menu-item-group-title">\n <ng-container *nzStringTemplateOutlet="nzLabel">{{nzLabel}}</ng-container>\n</div>\n<ul class="ant-select-dropdown-menu-item-group-list">\n <ng-content select="nz-auto-option"></ng-content>\n</ul>\n',host:{role:"group","class":"ant-select-dropdown-menu-item-group"}}]}],u.ctorParameters=function(){return[]},u.propDecorators={nzLabel:[{type:r.Input}]},u);function u(){}function h(e,t,n,o){var i,s=arguments.length,r=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,n,o);else for(var a=e.length-1;0<=a;a--)(i=e[a])&&(r=(s<3?i(r):3<s?i(t,n,r):i(t,n))||r);return 3<s&&r&&Object.defineProperty(t,n,r),r}function d(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function m(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var o,i,s=n.call(e),r=[];try{for(;(void 0===t||0<t--)&&!(o=s.next()).done;)r.push(o.value)}catch(a){i={error:a}}finally{try{o&&!o.done&&(n=s["return"])&&n.call(s)}finally{if(i)throw i.error}}return r}var g=function w(e,t){void 0===t&&(t=!1),this.source=e,this.isUserInput=t},f=(v.prototype.select=function(){this.selected=!0,this.changeDetectorRef.markForCheck(),this.emitSelectionChangeEvent()},v.prototype.deselect=function(){this.selected=!1,this.changeDetectorRef.markForCheck(),this.emitSelectionChangeEvent()},v.prototype.getLabel=function(){return this.nzLabel||this.nzValue.toString()},v.prototype.setActiveStyles=function(){this.active||(this.active=!0,this.changeDetectorRef.markForCheck())},v.prototype.setInactiveStyles=function(){this.active&&(this.active=!1,this.changeDetectorRef.markForCheck())},v.prototype.scrollIntoViewIfNeeded=function(){l.scrollIntoView(this.element.nativeElement)},v.prototype.selectViaInteraction=function(){this.nzDisabled||(this.selected=!this.selected,this.selected?this.setActiveStyles():this.setInactiveStyles(),this.emitSelectionChangeEvent(!0),this.changeDetectorRef.markForCheck())},v.prototype.emitSelectionChangeEvent=function(e){void 0===e&&(e=!1),this.selectionChange.emit(new g(this,e))},v.decorators=[{type:r.Component,args:[{selector:"nz-auto-option",exportAs:"nzAutoOption",preserveWhitespaces:!1,changeDetection:r.ChangeDetectionStrategy.OnPush,encapsulation:r.ViewEncapsulation.None,template:"<ng-content></ng-content>",host:{role:"menuitem","class":"ant-select-dropdown-menu-item","[class.ant-select-dropdown-menu-item-selected]":"selected","[class.ant-select-dropdown-menu-item-active]":"active","[class.ant-select-dropdown-menu-item-disabled]":"nzDisabled","[attr.aria-selected]":"selected.toString()","[attr.aria-disabled]":"nzDisabled.toString()","(click)":"selectViaInteraction()","(mousedown)":"$event.preventDefault()"}}]}],v.ctorParameters=function(){return[{type:r.ChangeDetectorRef},{type:r.ElementRef}]},v.propDecorators={nzValue:[{type:r.Input}],nzLabel:[{type:r.Input}],nzDisabled:[{type:r.Input}],selectionChange:[{type:r.Output}]},h([l.InputBoolean(),d("design:type",Object)],v.prototype,"nzDisabled",void 0),v);function v(e,t){this.changeDetectorRef=e,this.element=t,this.nzDisabled=!1,this.selectionChange=new r.EventEmitter,this.active=!1,this.selected=!1}var y={provide:s.NG_VALUE_ACCESSOR,useExisting:r.forwardRef(function(){return C}),multi:!0};function b(){return Error("Attempting to open an undefined instance of `nz-autocomplete`. Make sure that the id passed to the `nzAutocomplete` is correct and that you're attempting to open it after the ngAfterContentInit hook.")}var C=(Object.defineProperty(O.prototype,"activeOption",{get:function(){if(this.nzAutocomplete&&this.nzAutocomplete.options.length)return this.nzAutocomplete.activeItem},enumerable:!0,configurable:!0}),O.prototype.ngOnDestroy=function(){this.destroyPanel()},O.prototype.writeValue=function(e){this.setTriggerValue(e)},O.prototype.registerOnChange=function(e){this._onChange=e},O.prototype.registerOnTouched=function(e){this._onTouched=e},O.prototype.setDisabledState=function(e){this.elementRef.nativeElement.disabled=e,this.closePanel()},O.prototype.openPanel=function(){this.attachOverlay()},O.prototype.closePanel=function(){this.panelOpen&&(this.nzAutocomplete.isOpen=this.panelOpen=!1,this.overlayRef&&this.overlayRef.hasAttached()&&(this.selectionChangeSubscription.unsubscribe(),this.overlayBackdropClickSubscription.unsubscribe(),this.overlayPositionChangeSubscription.unsubscribe(),this.optionsChangeSubscription.unsubscribe(),this.overlayRef.detach(),this.overlayRef=null,this.portal=null))},O.prototype.handleKeydown=function(e){var t=e.keyCode,n=t===o.UP_ARROW||t===o.DOWN_ARROW;t===o.ESCAPE&&e.preventDefault(),!this.panelOpen||t!==o.ESCAPE&&t!==o.TAB?this.panelOpen&&t===o.ENTER?this.nzAutocomplete.showPanel&&this.activeOption&&(e.preventDefault(),this.activeOption.selectViaInteraction()):this.panelOpen&&n&&this.nzAutocomplete.showPanel&&(e.stopPropagation(),e.preventDefault(),t===o.UP_ARROW?this.nzAutocomplete.setPreviousItemActive():this.nzAutocomplete.setNextItemActive(),this.activeOption&&this.activeOption.scrollIntoViewIfNeeded(),this.doBackfill()):(this.activeOption&&this.activeOption.getLabel()!==this.previousValue&&this.setTriggerValue(this.previousValue),this.closePanel())},O.prototype.handleInput=function(e){var t=e.target,n=t.value;"number"===t.type&&(n=""===n?null:parseFloat(n)),this.canOpen()&&document.activeElement===e.target&&this.previousValue!==n&&(this.previousValue=n,this._onChange(n),this.openPanel())},O.prototype.handleFocus=function(){this.canOpen()&&(this.previousValue=this.elementRef.nativeElement.value,this.openPanel())},O.prototype.handleBlur=function(){this.closePanel(),this._onTouched()},O.prototype.subscribeOptionsChange=function(){var e=this;return this.nzAutocomplete.options.changes.pipe(c.delay(0)).subscribe(function(){e.resetActiveItem()})},O.prototype.subscribeSelectionChange=function(){var t=this;return this.nzAutocomplete.selectionChange.subscribe(function(e){t.setValueAndClose(e)})},O.prototype.subscribeOverlayBackdropClick=function(){var n=this;return a.merge(a.fromEvent(this.document,"click"),a.fromEvent(this.document,"touchend")).subscribe(function(e){var t=e.target;t!==n.elementRef.nativeElement&&!n.overlayRef.overlayElement.contains(t)&&n.panelOpen&&n.closePanel()})},O.prototype.subscribeOverlayPositionChange=function(){var t=this;return this.positionStrategy.positionChanges.pipe(c.map(function(e){return e.connectionPair.originY}),c.distinct()).subscribe(function(e){t.nzAutocomplete.dropDownPosition=e})},O.prototype.attachOverlay=function(){var e=this;if(!this.nzAutocomplete)throw b();this.portal||(this.portal=new n.TemplatePortal(this.nzAutocomplete.template,this.viewContainerRef)),this.overlayRef||(this.overlayRef=this._overlay.create(this.getOverlayConfig())),this.overlayRef&&!this.overlayRef.hasAttached()&&(this.overlayRef.attach(this.portal),this.overlayPositionChangeSubscription=this.subscribeOverlayPositionChange(),this.selectionChangeSubscription=this.subscribeSelectionChange(),this.overlayBackdropClickSubscription=this.subscribeOverlayBackdropClick(),this.optionsChangeSubscription=this.subscribeOptionsChange()),this.nzAutocomplete.isOpen=this.panelOpen=!0,this.nzAutocomplete.setVisibility(),this.overlayRef.updateSize({width:this.nzAutocomplete.nzWidth||this.getHostWidth()}),setTimeout(function(){e.overlayRef&&e.overlayRef.updatePosition()},150),this.resetActiveItem(),this.activeOption&&this.activeOption.scrollIntoViewIfNeeded()},O.prototype.destroyPanel=function(){this.overlayRef&&this.closePanel()},O.prototype.getOverlayConfig=function(){return new t.OverlayConfig({positionStrategy:this.getOverlayPosition(),scrollStrategy:this._overlay.scrollStrategies.reposition(),width:this.nzAutocomplete.nzWidth||this.getHostWidth()})},O.prototype.getConnectedElement=function(){return this.elementRef},O.prototype.getHostWidth=function(){return this.getConnectedElement().nativeElement.getBoundingClientRect().width},O.prototype.getOverlayPosition=function(){var e=[new t.ConnectionPositionPair({originX:"start",originY:"bottom"},{overlayX:"start",overlayY:"top"}),new t.ConnectionPositionPair({originX:"start",originY:"top"},{overlayX:"start",overlayY:"bottom"})];return this.positionStrategy=this._overlay.position().flexibleConnectedTo(this.getConnectedElement()).withPositions(e).withFlexibleDimensions(!1).withPush(!1),this.positionStrategy},O.prototype.resetActiveItem=function(){var e=this.nzAutocomplete.getOptionIndex(this.nzAutocomplete.activeItem);this.nzAutocomplete.activeItem&&-1!==e?this.nzAutocomplete.setActiveItem(e):this.nzAutocomplete.setActiveItem(this.nzAutocomplete.nzDefaultActiveFirstOption?0:-1)},O.prototype.setValueAndClose=function(e){var t=e.nzValue;this.setTriggerValue(e.getLabel()),this._onChange(t),this.elementRef.nativeElement.focus(),this.closePanel()},O.prototype.setTriggerValue=function(e){this.elementRef.nativeElement.value=e||""},O.prototype.doBackfill=function(){this.nzAutocomplete.nzBackfill&&this.nzAutocomplete.activeItem&&this.setTriggerValue(this.nzAutocomplete.activeItem.getLabel())},O.prototype.canOpen=function(){var e=this.elementRef.nativeElement;return!e.readOnly&&!e.disabled},O.decorators=[{type:r.Directive,args:[{selector:"input[nzAutocomplete], textarea[nzAutocomplete]",exportAs:"nzAutocompleteTrigger",providers:[y],host:{autocomplete:"off","aria-autocomplete":"list","(focusin)":"handleFocus()","(blur)":"handleBlur()","(input)":"handleInput($event)","(keydown)":"handleKeydown($event)"}}]}],O.ctorParameters=function(){return[{type:r.ElementRef},{type:t.Overlay},{type:r.ViewContainerRef},{type:undefined,decorators:[{type:r.Optional},{type:r.Inject,args:[i.DOCUMENT]}]}]},O.propDecorators={nzAutocomplete:[{type:r.Input}]},O);function O(e,t,n,o){this.elementRef=e,this._overlay=t,this.viewContainerRef=n,this.document=o,this._onChange=function(){},this._onTouched=function(){},this.panelOpen=!1}var z=(Object.defineProperty(A.prototype,"options",{get:function(){return this.nzDataSource?this.fromDataSourceOptions:this.fromContentOptions},enumerable:!0,configurable:!0}),A.prototype.ngAfterViewInit=function(){this.optionsInit()},A.prototype.ngOnDestroy=function(){this.dataSourceChangeSubscription.unsubscribe(),this.selectionChangeSubscription.unsubscribe()},A.prototype.setVisibility=function(){this.showPanel=!!this.options.length,this.changeDetectorRef.markForCheck()},A.prototype.setActiveItem=function(e){var t=this.options.toArray()[e];t&&!t.active&&(this.activeItem=t,this.activeItemIndex=e,this.clearSelectedOptions(this.activeItem),this.activeItem.setActiveStyles(),this.changeDetectorRef.markForCheck())},A.prototype.setNextItemActive=function(){var e=this.activeItemIndex+1<=this.options.length-1?this.activeItemIndex+1:0;this.setActiveItem(e)},A.prototype.setPreviousItemActive=function(){var e=this.activeItemIndex-1<0?this.options.length-1:this.activeItemIndex-1;this.setActiveItem(e)},A.prototype.getOptionIndex=function(o){return this.options.reduce(function(e,t,n){return-1===e?o===t?n:-1:e},-1)},A.prototype.optionsInit=function(){var t=this;this.setVisibility(),this.subscribeOptionChanges();var e=this.nzDataSource?this.fromDataSourceOptions.changes:this.fromContentOptions.changes;this.dataSourceChangeSubscription=e.subscribe(function(e){!e.dirty&&t.isOpen&&setTimeout(function(){return t.setVisibility()}),t.subscribeOptionChanges()})},A.prototype.clearSelectedOptions=function(t,n){void 0===n&&(n=!1),this.options.forEach(function(e){e!==t&&(n&&e.deselect(),e.setInactiveStyles())})},A.prototype.subscribeOptionChanges=function(){var t=this;this.selectionChangeSubscription.unsubscribe(),this.selectionChangeSubscription=this.optionSelectionChanges.pipe(c.filter(function(e){return e.isUserInput})).subscribe(function(e){e.source.select(),e.source.setActiveStyles(),t.activeItem=e.source,t.activeItemIndex=t.getOptionIndex(t.activeItem),t.clearSelectedOptions(e.source,!0),t.selectionChange.emit(e.source)})},A.decorators=[{type:r.Component,args:[{selector:"nz-autocomplete",exportAs:"nzAutocomplete",preserveWhitespaces:!1,changeDetection:r.ChangeDetectionStrategy.OnPush,encapsulation:r.ViewEncapsulation.None,template:'<ng-template>\n <div class="ant-select-dropdown ant-select-dropdown--single ant-select-dropdown-placement-bottomLeft"\n #panel\n [nzNoAnimation]="noAnimation?.nzNoAnimation"\n [@slideMotion]="dropDownPosition"\n [class.ant-select-dropdown-hidden]="!showPanel" [ngClass]="nzOverlayClassName" [ngStyle]="nzOverlayStyle">\n <div style="overflow: auto;">\n <ul class="ant-select-dropdown-menu ant-select-dropdown-menu-root ant-select-dropdown-menu-vertical"\n role="menu"\n aria-activedescendant>\n <ng-template *ngTemplateOutlet="nzDataSource ? optionsTemplate : contentTemplate"></ng-template>\n </ul>\n </div>\n </div>\n <ng-template #contentTemplate>\n <ng-content></ng-content>\n </ng-template>\n <ng-template #optionsTemplate>\n <nz-auto-option *ngFor="let option of nzDataSource" [nzValue]="option">{{option}}</nz-auto-option>\n </ng-template>\n</ng-template>',animations:[l.slideMotion],styles:["\n .ant-select-dropdown {\n top: 100%;\n left: 0;\n position: relative;\n width: 100%;\n margin-top: 4px;\n margin-bottom: 4px;\n }\n "]}]}],A.ctorParameters=function(){return[{type:r.ChangeDetectorRef},{type:r.NgZone},{type:l.NzNoAnimationDirective,decorators:[{type:r.Host},{type:r.Optional}]}]},A.propDecorators={nzWidth:[{type:r.Input}],nzOverlayClassName:[{type:r.Input}],nzOverlayStyle:[{type:r.Input}],nzDefaultActiveFirstOption:[{type:r.Input}],nzBackfill:[{type:r.Input}],nzDataSource:[{type:r.Input}],selectionChange:[{type:r.Output}],fromContentOptions:[{type:r.ContentChildren,args:[f,{descendants:!0}]}],fromDataSourceOptions:[{type:r.ViewChildren,args:[f]}],template:[{type:r.ViewChild,args:[r.TemplateRef]}],panel:[{type:r.ViewChild,args:["panel"]}],content:[{type:r.ViewChild,args:["content"]}]},h([l.InputBoolean(),d("design:type",Object)],A.prototype,"nzDefaultActiveFirstOption",void 0),h([l.InputBoolean(),d("design:type",Object)],A.prototype,"nzBackfill",void 0),A);function A(e,t,n){var o=this;this.changeDetectorRef=e,this.ngZone=t,this.noAnimation=n,this.nzOverlayClassName="",this.nzOverlayStyle={},this.nzDefaultActiveFirstOption=!0,this.nzBackfill=!1,this.selectionChange=new r.EventEmitter,this.showPanel=!1,this.isOpen=!1,this.dropDownPosition="bottom",this.activeItemIndex=-1,this.selectionChangeSubscription=a.Subscription.EMPTY,this.dataSourceChangeSubscription=a.Subscription.EMPTY,this.optionSelectionChanges=a.defer(function(){return o.options?a.merge.apply(void 0,function n(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(m(arguments[t]));return e}(o.options.map(function(e){return e.selectionChange}))):o.ngZone.onStable.asObservable().pipe(c.take(1),c.switchMap(function(){return o.optionSelectionChanges}))})}var S=(I.decorators=[{type:r.NgModule,args:[{declarations:[z,f,C,p],exports:[z,f,C,p],imports:[i.CommonModule,t.OverlayModule,s.FormsModule,l.NzAddOnModule,l.NzNoAnimationModule]}]}],I);function I(){}e.NzAutocompleteModule=S,e.NzAutocompleteComponent=z,e.getNzAutocompleteMissingPanelError=b,e.NZ_AUTOCOMPLETE_VALUE_ACCESSOR=y,e.NzAutocompleteTriggerDirective=C,e.NzOptionSelectionChange=g,e.NzAutocompleteOptionComponent=f,e.NzAutocompleteOptgroupComponent=p,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=ng-zorro-antd-auto-complete.umd.min.js.map