UNPKG

ng-zorro-antd

Version:

An enterprise-class UI components based on Ant Design and Angular

16 lines (14 loc) 20.2 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/cdk/overlay"),require("@angular/common"),require("@angular/core"),require("@angular/forms"),require("ng-zorro-antd/core/no-animation"),require("ng-zorro-antd/core/outlet"),require("ng-zorro-antd/input"),require("ng-zorro-antd/core/util"),require("@angular/cdk/keycodes"),require("@angular/cdk/portal"),require("rxjs"),require("rxjs/operators"),require("ng-zorro-antd/core/animation")):"function"==typeof define&&define.amd?define("ng-zorro-antd/auto-complete",["exports","@angular/cdk/overlay","@angular/common","@angular/core","@angular/forms","ng-zorro-antd/core/no-animation","ng-zorro-antd/core/outlet","ng-zorro-antd/input","ng-zorro-antd/core/util","@angular/cdk/keycodes","@angular/cdk/portal","rxjs","rxjs/operators","ng-zorro-antd/core/animation"],e):e(((t=t||self)["ng-zorro-antd"]=t["ng-zorro-antd"]||{},t["ng-zorro-antd"]["auto-complete"]={}),t.ng.cdk.overlay,t.ng.common,t.ng.core,t.ng.forms,t["ng-zorro-antd"].core["no-animation"],t["ng-zorro-antd"].core.outlet,t["ng-zorro-antd"].input,t["ng-zorro-antd"].core.util,t.ng.cdk.keycodes,t.ng.cdk.portal,t.rxjs,t.rxjs.operators,t["ng-zorro-antd"].core.animation)}(this,(function(t,e,n,o,i,r,s,a,c,p,l,u,h,m){"use strict"; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */function f(t,e,n,o){var i,r=arguments.length,s=r<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,n,o);else for(var a=t.length-1;a>=0;a--)(i=t[a])&&(s=(r<3?i(s):r>3?i(e,n,s):i(e,n))||s);return r>3&&s&&Object.defineProperty(e,n,s),s}function d(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}function g(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var o,i,r=n.call(t),s=[];try{for(;(void 0===e||e-- >0)&&!(o=r.next()).done;)s.push(o.value)}catch(t){i={error:t}}finally{try{o&&!o.done&&(n=r.return)&&n.call(r)}finally{if(i)throw i.error}}return s}function v(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(g(arguments[e]));return t}var y=function(){function t(){}return t.decorators=[{type:o.Component,args:[{selector:"nz-auto-optgroup",exportAs:"nzAutoOptgroup",preserveWhitespaces:!1,changeDetection:o.ChangeDetectionStrategy.OnPush,encapsulation:o.ViewEncapsulation.None,template:'\n <div class="ant-select-item ant-select-item-group">\n <ng-container *nzStringTemplateOutlet="nzLabel">{{ nzLabel }}</ng-container>\n </div>\n <ng-content select="nz-auto-option"></ng-content>\n '}]}],t.ctorParameters=function(){return[]},t.propDecorators={nzLabel:[{type:o.Input}]},t}();var b=function(t,e){void 0===e&&(e=!1),this.source=t,this.isUserInput=e};var z=function(){function t(t,e,n){this.changeDetectorRef=t,this.element=e,this.nzAutocompleteOptgroupComponent=n,this.nzDisabled=!1,this.selectionChange=new o.EventEmitter,this.mouseEntered=new o.EventEmitter,this.active=!1,this.selected=!1}return t.prototype.select=function(t){void 0===t&&(t=!0),this.selected=!0,this.changeDetectorRef.markForCheck(),t&&this.emitSelectionChangeEvent()},t.prototype.onMouseEnter=function(){this.mouseEntered.emit(this)},t.prototype.deselect=function(){this.selected=!1,this.changeDetectorRef.markForCheck(),this.emitSelectionChangeEvent()},t.prototype.getLabel=function(){return this.nzLabel||this.nzValue.toString()},t.prototype.setActiveStyles=function(){this.active||(this.active=!0,this.changeDetectorRef.markForCheck())},t.prototype.setInactiveStyles=function(){this.active&&(this.active=!1,this.changeDetectorRef.markForCheck())},t.prototype.scrollIntoViewIfNeeded=function(){c.scrollIntoView(this.element.nativeElement)},t.prototype.selectViaInteraction=function(){this.nzDisabled||(this.selected=!this.selected,this.selected?this.setActiveStyles():this.setInactiveStyles(),this.emitSelectionChangeEvent(!0),this.changeDetectorRef.markForCheck())},t.prototype.emitSelectionChangeEvent=function(t){void 0===t&&(t=!1),this.selectionChange.emit(new b(this,t))},t.decorators=[{type:o.Component,args:[{selector:"nz-auto-option",exportAs:"nzAutoOption",preserveWhitespaces:!1,changeDetection:o.ChangeDetectionStrategy.OnPush,encapsulation:o.ViewEncapsulation.None,template:'\n <div class="ant-select-item-option-content">\n <ng-content></ng-content>\n </div>\n ',host:{role:"menuitem",class:"ant-select-item ant-select-item-option","[class.ant-select-item-option-grouped]":"nzAutocompleteOptgroupComponent","[class.ant-select-item-option-selected]":"selected","[class.ant-select-item-option-active]":"active","[class.ant-select-item-option-disabled]":"nzDisabled","[attr.aria-selected]":"selected.toString()","[attr.aria-disabled]":"nzDisabled.toString()","(click)":"selectViaInteraction()","(mouseenter)":"onMouseEnter()","(mousedown)":"$event.preventDefault()"}}]}],t.ctorParameters=function(){return[{type:o.ChangeDetectorRef},{type:o.ElementRef},{type:y,decorators:[{type:o.Optional}]}]},t.propDecorators={nzValue:[{type:o.Input}],nzLabel:[{type:o.Input}],nzDisabled:[{type:o.Input}],selectionChange:[{type:o.Output}],mouseEntered:[{type:o.Output}]},f([c.InputBoolean(),d("design:type",Object)],t.prototype,"nzDisabled",void 0),t}();var O=function(){function t(t,e,n){var i=this;this.changeDetectorRef=t,this.ngZone=e,this.noAnimation=n,this.nzOverlayClassName="",this.nzOverlayStyle={},this.nzDefaultActiveFirstOption=!0,this.nzBackfill=!1,this.compareWith=function(t,e){return t===e},this.selectionChange=new o.EventEmitter,this.showPanel=!0,this.isOpen=!1,this.dropDownPosition="bottom",this.activeItemIndex=-1,this.selectionChangeSubscription=u.Subscription.EMPTY,this.optionMouseEnterSubscription=u.Subscription.EMPTY,this.dataSourceChangeSubscription=u.Subscription.EMPTY,this.optionSelectionChanges=u.defer((function(){return i.options?u.merge.apply(void 0,v(i.options.map((function(t){return t.selectionChange})))):i.ngZone.onStable.asObservable().pipe(h.take(1),h.switchMap((function(){return i.optionSelectionChanges})))})),this.optionMouseEnter=u.defer((function(){return i.options?u.merge.apply(void 0,v(i.options.map((function(t){return t.mouseEntered})))):i.ngZone.onStable.asObservable().pipe(h.take(1),h.switchMap((function(){return i.optionMouseEnter})))}))}return Object.defineProperty(t.prototype,"options",{get:function(){return this.nzDataSource?this.fromDataSourceOptions:this.fromContentOptions},enumerable:!0,configurable:!0}),t.prototype.ngAfterContentInit=function(){this.nzDataSource||this.optionsInit()},t.prototype.ngAfterViewInit=function(){this.nzDataSource&&this.optionsInit()},t.prototype.ngOnDestroy=function(){this.dataSourceChangeSubscription.unsubscribe(),this.selectionChangeSubscription.unsubscribe(),this.optionMouseEnterSubscription.unsubscribe()},t.prototype.setVisibility=function(){this.showPanel=!!this.options.length,this.changeDetectorRef.markForCheck()},t.prototype.setActiveItem=function(t){var e=this.options.toArray()[t];e&&!e.active&&(this.activeItem=e,this.activeItemIndex=t,this.clearSelectedOptions(this.activeItem),this.activeItem.setActiveStyles(),this.changeDetectorRef.markForCheck())},t.prototype.setNextItemActive=function(){var t=this.activeItemIndex+1<=this.options.length-1?this.activeItemIndex+1:0;this.setActiveItem(t)},t.prototype.setPreviousItemActive=function(){var t=this.activeItemIndex-1<0?this.options.length-1:this.activeItemIndex-1;this.setActiveItem(t)},t.prototype.getOptionIndex=function(t){var e=this;return this.options.reduce((function(n,o,i){return-1===n?e.compareWith(t,o.nzValue)?i:-1:n}),-1)},t.prototype.getOption=function(t){var e=this;return this.options.find((function(n){return e.compareWith(t,n.nzValue)}))||null},t.prototype.updatePosition=function(t){this.dropDownPosition=t,this.changeDetectorRef.markForCheck()},t.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()}))},t.prototype.clearSelectedOptions=function(t,e){void 0===e&&(e=!1),this.options.forEach((function(n){n!==t&&(e&&n.deselect(),n.setInactiveStyles())}))},t.prototype.subscribeOptionChanges=function(){var t=this;this.selectionChangeSubscription.unsubscribe(),this.selectionChangeSubscription=this.optionSelectionChanges.pipe(h.filter((function(t){return t.isUserInput}))).subscribe((function(e){e.source.select(),e.source.setActiveStyles(),t.activeItem=e.source,t.activeItemIndex=t.getOptionIndex(t.activeItem.nzValue),t.clearSelectedOptions(e.source,!0),t.selectionChange.emit(e.source)})),this.optionMouseEnterSubscription.unsubscribe(),this.optionMouseEnterSubscription=this.optionMouseEnter.subscribe((function(e){e.setActiveStyles(),t.activeItem=e,t.activeItemIndex=t.getOptionIndex(t.activeItem.nzValue),t.clearSelectedOptions(e)}))},t.decorators=[{type:o.Component,args:[{selector:"nz-autocomplete",exportAs:"nzAutocomplete",preserveWhitespaces:!1,changeDetection:o.ChangeDetectionStrategy.OnPush,encapsulation:o.ViewEncapsulation.None,template:'\n <ng-template>\n <div\n #panel\n class="ant-select-dropdown ant-select-dropdown-placement-bottomLeft"\n [class.ant-select-dropdown-hidden]="!showPanel"\n [ngClass]="nzOverlayClassName"\n [ngStyle]="nzOverlayStyle"\n [nzNoAnimation]="noAnimation?.nzNoAnimation"\n [@slideMotion]="dropDownPosition"\n [@.disabled]="noAnimation?.nzNoAnimation"\n >\n <div style="max-height: 256px; overflow-y: auto; overflow-anchor: none;">\n <div style="display: flex; flex-direction: column;">\n <ng-template *ngTemplateOutlet="nzDataSource ? optionsTemplate : contentTemplate"></ng-template>\n </div>\n </div>\n </div>\n <ng-template #contentTemplate>\n <ng-content></ng-content>\n </ng-template>\n <ng-template #optionsTemplate>\n <nz-auto-option\n *ngFor="let option of nzDataSource"\n [nzValue]="option"\n [nzLabel]="option && option.label ? option.label : $any(option)"\n >\n {{ option && option.label ? option.label : option }}\n </nz-auto-option>\n </ng-template>\n </ng-template>\n ',animations:[m.slideMotion]}]}],t.ctorParameters=function(){return[{type:o.ChangeDetectorRef},{type:o.NgZone},{type:r.NzNoAnimationDirective,decorators:[{type:o.Host},{type:o.Optional}]}]},t.propDecorators={nzWidth:[{type:o.Input}],nzOverlayClassName:[{type:o.Input}],nzOverlayStyle:[{type:o.Input}],nzDefaultActiveFirstOption:[{type:o.Input}],nzBackfill:[{type:o.Input}],compareWith:[{type:o.Input}],nzDataSource:[{type:o.Input}],selectionChange:[{type:o.Output}],fromContentOptions:[{type:o.ContentChildren,args:[z,{descendants:!0}]}],fromDataSourceOptions:[{type:o.ViewChildren,args:[z]}],template:[{type:o.ViewChild,args:[o.TemplateRef,{static:!1}]}],panel:[{type:o.ViewChild,args:["panel",{static:!1}]}],content:[{type:o.ViewChild,args:["content",{static:!1}]}]},f([c.InputBoolean(),d("design:type",Object)],t.prototype,"nzDefaultActiveFirstOption",void 0),f([c.InputBoolean(),d("design:type",Object)],t.prototype,"nzBackfill",void 0),t}();var C={provide:i.NG_VALUE_ACCESSOR,useExisting:o.forwardRef((function(){return S})),multi:!0};function A(){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 S=function(){function t(t,e,n,o,i,r){this.elementRef=t,this.overlay=e,this.viewContainerRef=n,this.ngZone=o,this.nzInputGroupWhitSuffixOrPrefixDirective=i,this.document=r,this.onChange=function(){},this.onTouched=function(){},this.panelOpen=!1}return Object.defineProperty(t.prototype,"activeOption",{get:function(){if(this.nzAutocomplete&&this.nzAutocomplete.options.length)return this.nzAutocomplete.activeItem},enumerable:!0,configurable:!0}),t.prototype.ngOnDestroy=function(){this.destroyPanel()},t.prototype.writeValue=function(t){var e=this;Promise.resolve(null).then((function(){return e.setTriggerValue(t)}))},t.prototype.registerOnChange=function(t){this.onChange=t},t.prototype.registerOnTouched=function(t){this.onTouched=t},t.prototype.setDisabledState=function(t){this.elementRef.nativeElement.disabled=t,this.closePanel()},t.prototype.openPanel=function(){this.previousValue=this.elementRef.nativeElement.value,this.attachOverlay(),this.updateStatus()},t.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))},t.prototype.handleKeydown=function(t){var e=t.keyCode,n=e===p.UP_ARROW||e===p.DOWN_ARROW;e===p.ESCAPE&&t.preventDefault(),!this.panelOpen||e!==p.ESCAPE&&e!==p.TAB?this.panelOpen&&e===p.ENTER?this.nzAutocomplete.showPanel&&this.activeOption&&(t.preventDefault(),this.activeOption.selectViaInteraction()):this.panelOpen&&n&&this.nzAutocomplete.showPanel&&(t.stopPropagation(),t.preventDefault(),e===p.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())},t.prototype.handleInput=function(t){var e=t.target,n=this.document,o=e.value;"number"===e.type&&(o=""===o?null:parseFloat(o)),this.previousValue!==o&&(this.previousValue=o,this.onChange(o),this.canOpen()&&n.activeElement===t.target&&this.openPanel())},t.prototype.handleFocus=function(){this.canOpen()&&this.openPanel()},t.prototype.handleBlur=function(){this.onTouched()},t.prototype.subscribeOptionsChange=function(){var t=this,e=this.ngZone.onStable.asObservable().pipe(h.take(1)),n=this.nzAutocomplete.options.changes.pipe(h.tap((function(){return t.positionStrategy.reapplyLastPosition()})),h.delay(0));return u.merge(e,n).subscribe((function(){t.resetActiveItem(),t.panelOpen&&t.overlayRef.updatePosition()}))},t.prototype.subscribeSelectionChange=function(){var t=this;return this.nzAutocomplete.selectionChange.subscribe((function(e){t.setValueAndClose(e)}))},t.prototype.subscribeOverlayBackdropClick=function(){var t=this;return u.merge(u.fromEvent(this.document,"click"),u.fromEvent(this.document,"touchend")).subscribe((function(e){var n=e.target;n!==t.elementRef.nativeElement&&!t.overlayRef.overlayElement.contains(n)&&t.panelOpen&&t.closePanel()}))},t.prototype.subscribeOverlayPositionChange=function(){var t=this;return this.positionStrategy.positionChanges.pipe(h.map((function(t){return t.connectionPair.originY})),h.distinct(),h.delay(0)).subscribe((function(e){t.nzAutocomplete.updatePosition(e)}))},t.prototype.attachOverlay=function(){if(!this.nzAutocomplete)throw A();this.portal||(this.portal=new l.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},t.prototype.updateStatus=function(){this.overlayRef&&this.overlayRef.updateSize({width:this.nzAutocomplete.nzWidth||this.getHostWidth()}),this.nzAutocomplete.setVisibility(),this.resetActiveItem(),this.activeOption&&this.activeOption.scrollIntoViewIfNeeded()},t.prototype.destroyPanel=function(){this.overlayRef&&this.closePanel()},t.prototype.getOverlayConfig=function(){return new e.OverlayConfig({positionStrategy:this.getOverlayPosition(),disposeOnNavigation:!0,scrollStrategy:this.overlay.scrollStrategies.reposition(),width:this.nzAutocomplete.nzWidth||this.getHostWidth()})},t.prototype.getConnectedElement=function(){return this.nzInputGroupWhitSuffixOrPrefixDirective?this.nzInputGroupWhitSuffixOrPrefixDirective.elementRef:this.elementRef},t.prototype.getHostWidth=function(){return this.getConnectedElement().nativeElement.getBoundingClientRect().width},t.prototype.getOverlayPosition=function(){var t=[new e.ConnectionPositionPair({originX:"start",originY:"bottom"},{overlayX:"start",overlayY:"top"}),new e.ConnectionPositionPair({originX:"start",originY:"top"},{overlayX:"start",overlayY:"bottom"})];return this.positionStrategy=this.overlay.position().flexibleConnectedTo(this.getConnectedElement()).withFlexibleDimensions(!1).withPush(!1).withPositions(t),this.positionStrategy},t.prototype.resetActiveItem=function(){var t=this.nzAutocomplete.getOptionIndex(this.previousValue);this.nzAutocomplete.clearSelectedOptions(null,!0),-1!==t?(this.nzAutocomplete.setActiveItem(t),this.nzAutocomplete.activeItem.select(!1)):this.nzAutocomplete.setActiveItem(this.nzAutocomplete.nzDefaultActiveFirstOption?0:-1)},t.prototype.setValueAndClose=function(t){var e=t.nzValue;this.setTriggerValue(t.getLabel()),this.onChange(e),this.elementRef.nativeElement.focus(),this.closePanel()},t.prototype.setTriggerValue=function(t){var e=this.nzAutocomplete.getOption(t),n=e?e.getLabel():t;this.elementRef.nativeElement.value=null!=n?n:"",this.nzAutocomplete.nzBackfill||(this.previousValue=n)},t.prototype.doBackfill=function(){this.nzAutocomplete.nzBackfill&&this.nzAutocomplete.activeItem&&this.setTriggerValue(this.nzAutocomplete.activeItem.getLabel())},t.prototype.canOpen=function(){var t=this.elementRef.nativeElement;return!t.readOnly&&!t.disabled},t.decorators=[{type:o.Directive,args:[{selector:"input[nzAutocomplete], textarea[nzAutocomplete]",exportAs:"nzAutocompleteTrigger",providers:[C],host:{autocomplete:"off","aria-autocomplete":"list","(focusin)":"handleFocus()","(blur)":"handleBlur()","(input)":"handleInput($event)","(keydown)":"handleKeydown($event)"}}]}],t.ctorParameters=function(){return[{type:o.ElementRef},{type:e.Overlay},{type:o.ViewContainerRef},{type:o.NgZone},{type:a.NzInputGroupWhitSuffixOrPrefixDirective,decorators:[{type:o.Optional}]},{type:void 0,decorators:[{type:o.Optional},{type:o.Inject,args:[n.DOCUMENT]}]}]},t.propDecorators={nzAutocomplete:[{type:o.Input}]},t}();var I=function(){function t(){}return t.decorators=[{type:o.NgModule,args:[{declarations:[O,z,S,y],exports:[O,z,S,y],imports:[n.CommonModule,e.OverlayModule,i.FormsModule,s.NzOutletModule,r.NzNoAnimationModule,a.NzInputModule]}]}],t}();t.NZ_AUTOCOMPLETE_VALUE_ACCESSOR=C,t.NzAutocompleteComponent=O,t.NzAutocompleteModule=I,t.NzAutocompleteOptgroupComponent=y,t.NzAutocompleteOptionComponent=z,t.NzAutocompleteTriggerDirective=S,t.NzOptionSelectionChange=b,t.getNzAutocompleteMissingPanelError=A,Object.defineProperty(t,"__esModule",{value:!0})})); //# sourceMappingURL=ng-zorro-antd-auto-complete.umd.min.js.map