UNPKG

primeng

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primeng.svg)](https://badge.fury.io/js/primeng) [![Discord](https://img.shields.io/discord/557940238991753

16 lines (14 loc) 31.6 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/cdk/scrolling"),require("@angular/core"),require("@angular/animations"),require("@angular/common"),require("primeng/api"),require("primeng/dom"),require("primeng/utils"),require("@angular/forms"),require("primeng/tooltip"),require("primeng/ripple")):"function"==typeof define&&define.amd?define("primeng/dropdown",["exports","@angular/cdk/scrolling","@angular/core","@angular/animations","@angular/common","primeng/api","primeng/dom","primeng/utils","@angular/forms","primeng/tooltip","primeng/ripple"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).primeng=t.primeng||{},t.primeng.dropdown={}),t.ng.cdk.scrolling,t.ng.core,t.ng.animations,t.ng.common,t.primeng.api,t.primeng.dom,t.primeng.utils,t.ng.forms,t.primeng.tooltip,t.primeng.ripple)}(this,(function(t,e,i,n,o,l,s,r,p,a,d){"use strict"; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */Object.create;function h(t){var e="function"==typeof Symbol&&Symbol.iterator,i=e&&t[e],n=0;if(i)return i.call(t);if(t&&"number"==typeof t.length)return{next:function(){return t&&n>=t.length&&(t=void 0),{value:t&&t[n++],done:!t}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}Object.create;var u={provide:p.NG_VALUE_ACCESSOR,useExisting:i.forwardRef((function(){return y})),multi:!0},c=function(){function t(){this.onClick=new i.EventEmitter}return t.prototype.onOptionClick=function(t){this.onClick.emit({originalEvent:t,option:this.option})},t}();c.decorators=[{type:i.Component,args:[{selector:"p-dropdownItem",template:'\n <li (click)="onOptionClick($event)" role="option" pRipple\n [attr.aria-label]="label" [attr.aria-selected]="selected"\n [ngStyle]="{\'height\': itemSize + \'px\'}"\n [ngClass]="{\'p-dropdown-item\':true, \'p-highlight\': selected, \'p-disabled\': disabled}">\n <span *ngIf="!template">{{label||\'empty\'}}</span>\n <ng-container *ngTemplateOutlet="template; context: {$implicit: option}"></ng-container>\n </li>\n '}]}],c.propDecorators={option:[{type:i.Input}],selected:[{type:i.Input}],label:[{type:i.Input}],disabled:[{type:i.Input}],visible:[{type:i.Input}],itemSize:[{type:i.Input}],template:[{type:i.Input}],onClick:[{type:i.Output}]};var y=function(){function t(t,e,n,o,l){this.el=t,this.renderer=e,this.cd=n,this.zone=o,this.filterService=l,this.scrollHeight="200px",this.resetFilterOnHide=!1,this.dropdownIcon="pi pi-chevron-down",this.autoDisplayFirst=!0,this.emptyFilterMessage="No results found",this.autoZIndex=!0,this.baseZIndex=0,this.showTransitionOptions=".12s cubic-bezier(0, 0, 0.2, 1)",this.hideTransitionOptions=".1s linear",this.filterMatchMode="contains",this.tooltip="",this.tooltipPosition="right",this.tooltipPositionStyle="absolute",this.autofocusFilter=!0,this.onChange=new i.EventEmitter,this.onFocus=new i.EventEmitter,this.onBlur=new i.EventEmitter,this.onClick=new i.EventEmitter,this.onShow=new i.EventEmitter,this.onHide=new i.EventEmitter,this.onModelChange=function(){},this.onModelTouched=function(){},this.viewPortOffsetTop=0}return Object.defineProperty(t.prototype,"disabled",{get:function(){return this._disabled},set:function(t){t&&(this.focused=!1),this._disabled=t,this.cd.destroyed||this.cd.detectChanges()},enumerable:!1,configurable:!0}),t.prototype.ngAfterContentInit=function(){var t=this;this.templates.forEach((function(e){switch(e.getType()){case"item":t.itemTemplate=e.template;break;case"selectedItem":t.selectedItemTemplate=e.template;break;case"group":t.groupTemplate=e.template;break;default:t.itemTemplate=e.template}}))},t.prototype.ngOnInit=function(){this.optionsToDisplay=this.options,this.updateSelectedOption(null)},Object.defineProperty(t.prototype,"options",{get:function(){return this._options},set:function(t){this._options=t,this.optionsToDisplay=this._options,this.updateSelectedOption(this.value),this.optionsChanged=!0,this.updateFilledState(),this._filterValue&&this._filterValue.length&&this.activateFilter()},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"filterValue",{get:function(){return this._filterValue},set:function(t){this._filterValue=t,this.activateFilter()},enumerable:!1,configurable:!0}),t.prototype.ngAfterViewInit=function(){this.editable&&this.updateEditableLabel()},Object.defineProperty(t.prototype,"label",{get:function(){return this.selectedOption?this.getOptionLabel(this.selectedOption):null},enumerable:!1,configurable:!0}),t.prototype.updateEditableLabel=function(){this.editableInputViewChild&&this.editableInputViewChild.nativeElement&&(this.editableInputViewChild.nativeElement.value=this.selectedOption?this.getOptionLabel(this.selectedOption):this.value||"")},t.prototype.getOptionLabel=function(t){return this.optionLabel?r.ObjectUtils.resolveFieldData(t,this.optionLabel):null!=t.label?t.label:t},t.prototype.getOptionValue=function(t){return this.optionValue?r.ObjectUtils.resolveFieldData(t,this.optionValue):this.optionLabel?t:t.value},t.prototype.isOptionDisabled=function(t){return this.optionDisabled?r.ObjectUtils.resolveFieldData(t,this.optionDisabled):void 0!==t.disabled&&t.disabled},t.prototype.getOptionGroupLabel=function(t){return this.optionGroupLabel?r.ObjectUtils.resolveFieldData(t,this.optionGroupLabel):null!=t.label?t.label:t},t.prototype.getOptionGroupChildren=function(t){return this.optionGroupChildren?r.ObjectUtils.resolveFieldData(t,this.optionGroupChildren):t.items},t.prototype.onItemClick=function(t){var e=this,i=t.option;this.isOptionDisabled(i)||(this.selectItem(t,i),this.accessibleViewChild.nativeElement.focus()),setTimeout((function(){e.hide(t)}),150)},t.prototype.selectItem=function(t,e){var i=this;this.selectedOption!=e&&(this.selectedOption=e,this.value=this.getOptionValue(e),this.filled=!0,this.onModelChange(this.value),this.updateEditableLabel(),this.onChange.emit({originalEvent:t.originalEvent,value:this.value}),this.virtualScroll&&setTimeout((function(){i.viewPortOffsetTop=i.viewPort?i.viewPort.measureScrollOffset():0}),1))},t.prototype.ngAfterViewChecked=function(){var t=this;if(this.optionsChanged&&this.overlayVisible&&(this.optionsChanged=!1,this.virtualScroll&&this.updateVirtualScrollSelectedIndex(!0),this.zone.runOutsideAngular((function(){setTimeout((function(){t.alignOverlay()}),1)}))),this.selectedOptionUpdated&&this.itemsWrapper){if(this.virtualScroll&&this.viewPort){var e=this.viewPort.getRenderedRange();this.updateVirtualScrollSelectedIndex(!1),(e.start>this.virtualScrollSelectedIndex||e.end<this.virtualScrollSelectedIndex)&&this.viewPort.scrollToIndex(this.virtualScrollSelectedIndex)}s.DomHandler.findSingle(this.overlay,"li.p-highlight")&&s.DomHandler.scrollInView(this.itemsWrapper,s.DomHandler.findSingle(this.overlay,"li.p-highlight")),this.selectedOptionUpdated=!1}},t.prototype.writeValue=function(t){this.filter&&this.resetFilter(),this.value=t,this.updateSelectedOption(t),this.updateEditableLabel(),this.updateFilledState(),this.cd.markForCheck()},t.prototype.resetFilter=function(){this._filterValue=null,this.filterViewChild&&this.filterViewChild.nativeElement&&(this.filterViewChild.nativeElement.value=""),this.optionsToDisplay=this.options},t.prototype.updateSelectedOption=function(t){this.selectedOption=this.findOption(t,this.optionsToDisplay),this.autoDisplayFirst&&!this.placeholder&&!this.selectedOption&&this.optionsToDisplay&&this.optionsToDisplay.length&&!this.editable&&(this.selectedOption=this.optionsToDisplay[0]),this.selectedOptionUpdated=!0},t.prototype.registerOnChange=function(t){this.onModelChange=t},t.prototype.registerOnTouched=function(t){this.onModelTouched=t},t.prototype.setDisabledState=function(t){this.disabled=t,this.cd.markForCheck()},t.prototype.onMouseclick=function(t){this.disabled||this.readonly||this.isInputClick(t)||(this.onClick.emit(t),this.accessibleViewChild.nativeElement.focus(),this.overlayVisible?this.hide(t):this.show(),this.cd.detectChanges())},t.prototype.isInputClick=function(t){return s.DomHandler.hasClass(t.target,"p-dropdown-clear-icon")||t.target.isSameNode(this.accessibleViewChild.nativeElement)||this.editableInputViewChild&&t.target.isSameNode(this.editableInputViewChild.nativeElement)},t.prototype.isOutsideClicked=function(t){return!(this.el.nativeElement.isSameNode(t.target)||this.el.nativeElement.contains(t.target)||this.overlay&&this.overlay.contains(t.target))},t.prototype.onEditableInputClick=function(){this.bindDocumentClickListener()},t.prototype.onEditableInputFocus=function(t){this.focused=!0,this.hide(t),this.onFocus.emit(t)},t.prototype.onEditableInputChange=function(t){this.value=t.target.value,this.updateSelectedOption(this.value),this.onModelChange(this.value),this.onChange.emit({originalEvent:t,value:this.value})},t.prototype.show=function(){this.overlayVisible=!0},t.prototype.onOverlayAnimationStart=function(t){switch(t.toState){case"visible":this.overlay=t.element;var e=this.virtualScroll?".cdk-virtual-scroll-viewport":".p-dropdown-items-wrapper";if(this.itemsWrapper=s.DomHandler.findSingle(this.overlay,e),this.appendOverlay(),this.autoZIndex&&(this.overlay.style.zIndex=String(this.baseZIndex+ ++s.DomHandler.zindex)),this.alignOverlay(),this.bindDocumentClickListener(),this.bindDocumentResizeListener(),this.bindScrollListener(),this.options&&this.options.length&&!this.virtualScroll){var i=s.DomHandler.findSingle(this.itemsWrapper,".p-dropdown-item.p-highlight");i&&s.DomHandler.scrollInView(this.itemsWrapper,i)}this.filterViewChild&&this.filterViewChild.nativeElement&&(this.preventModelTouched=!0,this.autofocusFilter&&this.filterViewChild.nativeElement.focus()),this.onShow.emit(t);break;case"void":this.onOverlayHide()}},t.prototype.scrollToSelectedVirtualScrollElement=function(){this.virtualAutoScrolled||(this.viewPortOffsetTop?this.viewPort.scrollToOffset(this.viewPortOffsetTop):this.virtualScrollSelectedIndex>-1&&this.viewPort.scrollToIndex(this.virtualScrollSelectedIndex)),this.virtualAutoScrolled=!0},t.prototype.updateVirtualScrollSelectedIndex=function(t){this.selectedOption&&this.optionsToDisplay&&this.optionsToDisplay.length&&(t&&(this.viewPortOffsetTop=0),this.virtualScrollSelectedIndex=this.findOptionIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay))},t.prototype.appendOverlay=function(){this.appendTo&&("body"===this.appendTo?document.body.appendChild(this.overlay):s.DomHandler.appendChild(this.overlay,this.appendTo),this.overlay.style.minWidth||(this.overlay.style.minWidth=s.DomHandler.getWidth(this.containerViewChild.nativeElement)+"px"))},t.prototype.restoreOverlayAppend=function(){this.overlay&&this.appendTo&&this.el.nativeElement.appendChild(this.overlay)},t.prototype.hide=function(t){this.overlayVisible=!1,this.filter&&this.resetFilterOnHide&&this.resetFilter(),this.virtualScroll&&(this.virtualAutoScrolled=!1),this.cd.markForCheck(),this.onHide.emit(t)},t.prototype.alignOverlay=function(){this.overlay&&(this.appendTo?s.DomHandler.absolutePosition(this.overlay,this.containerViewChild.nativeElement):s.DomHandler.relativePosition(this.overlay,this.containerViewChild.nativeElement))},t.prototype.onInputFocus=function(t){this.focused=!0,this.onFocus.emit(t)},t.prototype.onInputBlur=function(t){this.focused=!1,this.onBlur.emit(t),this.preventModelTouched||this.onModelTouched(),this.preventModelTouched=!1},t.prototype.findPrevEnabledOption=function(t){var e;if(this.optionsToDisplay&&this.optionsToDisplay.length){for(var i=t-1;0<=i;i--){if(!(n=this.optionsToDisplay[i]).disabled){e=n;break}}if(!e)for(i=this.optionsToDisplay.length-1;i>=t;i--){var n=this.optionsToDisplay[i];if(!this.isOptionDisabled(n)){e=n;break}}}return e},t.prototype.findNextEnabledOption=function(t){var e;if(this.optionsToDisplay&&this.optionsToDisplay.length){for(var i=t+1;t<this.optionsToDisplay.length-1;i++){var n=this.optionsToDisplay[i];if(!this.isOptionDisabled(n)){e=n;break}}if(!e)for(i=0;i<t;i++){n=this.optionsToDisplay[i];if(!this.isOptionDisabled(n)){e=n;break}}}return e},t.prototype.onKeydown=function(t,e){if(!this.readonly&&this.optionsToDisplay&&null!==this.optionsToDisplay.length)switch(t.which){case 40:if(!this.overlayVisible&&t.altKey)this.show();else if(this.group){if(-1!==(n=this.selectedOption?this.findOptionGroupIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay):-1)){var i=n.itemIndex+1;i<this.getOptionGroupChildren(this.optionsToDisplay[n.groupIndex]).length?(this.selectItem(t,this.getOptionGroupChildren(this.optionsToDisplay[n.groupIndex])[i]),this.selectedOptionUpdated=!0):this.optionsToDisplay[n.groupIndex+1]&&(this.selectItem(t,this.getOptionGroupChildren(this.optionsToDisplay[n.groupIndex+1])[0]),this.selectedOptionUpdated=!0)}else this.selectItem(t,this.getOptionGroupChildren(this.optionsToDisplay[0])[0])}else{var n=this.selectedOption?this.findOptionIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay):-1,o=this.findNextEnabledOption(n);o&&(this.selectItem(t,o),this.selectedOptionUpdated=!0)}t.preventDefault();break;case 38:if(this.group){if(-1!==(n=this.selectedOption?this.findOptionGroupIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay):-1)){var l=n.itemIndex-1;if(l>=0)this.selectItem(t,this.getOptionGroupChildren(this.optionsToDisplay[n.groupIndex])[l]),this.selectedOptionUpdated=!0;else if(l<0){var s=this.optionsToDisplay[n.groupIndex-1];s&&(this.selectItem(t,this.getOptionGroupChildren(s)[this.getOptionGroupChildren(s).length-1]),this.selectedOptionUpdated=!0)}}}else{n=this.selectedOption?this.findOptionIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay):-1;var r=this.findPrevEnabledOption(n);r&&(this.selectItem(t,r),this.selectedOptionUpdated=!0)}t.preventDefault();break;case 32:case 32:this.overlayVisible||(this.show(),t.preventDefault());break;case 13:(!this.filter||this.optionsToDisplay&&this.optionsToDisplay.length>0)&&this.hide(t),t.preventDefault();break;case 27:case 9:this.hide(t);break;default:e&&this.search(t)}},t.prototype.search=function(t){var e=this;this.searchTimeout&&clearTimeout(this.searchTimeout);var i,n=t.key;if(this.previousSearchChar=this.currentSearchChar,this.currentSearchChar=n,this.previousSearchChar===this.currentSearchChar?this.searchValue=this.currentSearchChar:this.searchValue=this.searchValue?this.searchValue+n:n,this.group){var o=this.selectedOption?this.findOptionGroupIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay):{groupIndex:0,itemIndex:0};i=this.searchOptionWithinGroup(o)}else{o=this.selectedOption?this.findOptionIndex(this.getOptionValue(this.selectedOption),this.optionsToDisplay):-1;i=this.searchOption(++o)}i&&!this.isOptionDisabled(i)&&(this.selectItem(t,i),this.selectedOptionUpdated=!0),this.searchTimeout=setTimeout((function(){e.searchValue=null}),250)},t.prototype.searchOption=function(t){var e;return this.searchValue&&((e=this.searchOptionInRange(t,this.optionsToDisplay.length))||(e=this.searchOptionInRange(0,t))),e},t.prototype.searchOptionInRange=function(t,e){for(var i=t;i<e;i++){var n=this.optionsToDisplay[i];if(this.getOptionLabel(n).toLocaleLowerCase(this.filterLocale).startsWith(this.searchValue.toLocaleLowerCase(this.filterLocale))&&!this.isOptionDisabled(n))return n}return null},t.prototype.searchOptionWithinGroup=function(t){if(this.searchValue){for(var e=t.groupIndex;e<this.optionsToDisplay.length;e++)for(var i=t.groupIndex===e?t.itemIndex+1:0;i<this.getOptionGroupChildren(this.optionsToDisplay[e]).length;i++){var n=this.getOptionGroupChildren(this.optionsToDisplay[e])[i];if(this.getOptionLabel(n).toLocaleLowerCase(this.filterLocale).startsWith(this.searchValue.toLocaleLowerCase(this.filterLocale))&&!this.isOptionDisabled(n))return n}for(e=0;e<=t.groupIndex;e++)for(i=0;i<(t.groupIndex===e?t.itemIndex:this.getOptionGroupChildren(this.optionsToDisplay[e]).length);i++){n=this.getOptionGroupChildren(this.optionsToDisplay[e])[i];if(this.getOptionLabel(n).toLocaleLowerCase(this.filterLocale).startsWith(this.searchValue.toLocaleLowerCase(this.filterLocale))&&!this.isOptionDisabled(n))return n}}return null},t.prototype.findOptionIndex=function(t,e){var i=-1;if(e)for(var n=0;n<e.length;n++)if(null==t&&null==this.getOptionValue(e[n])||r.ObjectUtils.equals(t,this.getOptionValue(e[n]),this.dataKey)){i=n;break}return i},t.prototype.findOptionGroupIndex=function(t,e){var i,n;if(e)for(var o=0;o<e.length&&(i=o,-1===(n=this.findOptionIndex(t,this.getOptionGroupChildren(e[o]))));o++);return-1!==n?{groupIndex:i,itemIndex:n}:-1},t.prototype.findOption=function(t,e,i){var n,o;if(this.group&&!i){var l=void 0;if(e&&e.length)try{for(var s=h(e),r=s.next();!r.done;r=s.next()){var p=r.value;if(l=this.findOption(t,this.getOptionGroupChildren(p),!0))break}}catch(t){n={error:t}}finally{try{r&&!r.done&&(o=s.return)&&o.call(s)}finally{if(n)throw n.error}}return l}var a=this.findOptionIndex(t,e);return-1!=a?e[a]:null},t.prototype.onFilter=function(t){var e=t.target.value;e&&e.length?(this._filterValue=e,this.activateFilter()):(this._filterValue=null,this.optionsToDisplay=this.options),this.optionsChanged=!0},t.prototype.activateFilter=function(){var t,e,i=(this.filterBy||this.optionLabel||"label").split(",");if(this.options&&this.options.length){if(this.group){var n=[];try{for(var o=h(this.options),l=o.next();!l.done;l=o.next()){var s=l.value,r=this.filterService.filter(this.getOptionGroupChildren(s),i,this.filterValue,this.filterMatchMode,this.filterLocale);r&&r.length&&n.push({label:s.label,value:s.value,items:r})}}catch(e){t={error:e}}finally{try{l&&!l.done&&(e=o.return)&&e.call(o)}finally{if(t)throw t.error}}this.optionsToDisplay=n}else this.optionsToDisplay=this.filterService.filter(this.options,i,this.filterValue,this.filterMatchMode,this.filterLocale);this.optionsChanged=!0}},t.prototype.applyFocus=function(){this.editable?s.DomHandler.findSingle(this.el.nativeElement,".p-dropdown-label.p-inputtext").focus():s.DomHandler.findSingle(this.el.nativeElement,"input[readonly]").focus()},t.prototype.focus=function(){this.applyFocus()},t.prototype.bindDocumentClickListener=function(){var t=this;if(!this.documentClickListener){var e=this.el?this.el.nativeElement.ownerDocument:"document";this.documentClickListener=this.renderer.listen(e,"click",(function(e){t.isOutsideClicked(e)&&(t.hide(e),t.unbindDocumentClickListener()),t.cd.markForCheck()}))}},t.prototype.unbindDocumentClickListener=function(){this.documentClickListener&&(this.documentClickListener(),this.documentClickListener=null)},t.prototype.bindDocumentResizeListener=function(){this.documentResizeListener=this.onWindowResize.bind(this),window.addEventListener("resize",this.documentResizeListener)},t.prototype.unbindDocumentResizeListener=function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)},t.prototype.onWindowResize=function(){s.DomHandler.isAndroid()||this.hide(event)},t.prototype.bindScrollListener=function(){var t=this;this.scrollHandler||(this.scrollHandler=new s.ConnectedOverlayScrollHandler(this.containerViewChild.nativeElement,(function(e){t.overlayVisible&&t.hide(e)}))),this.scrollHandler.bindScrollListener()},t.prototype.unbindScrollListener=function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},t.prototype.updateFilledState=function(){this.filled=null!=this.selectedOption},t.prototype.clear=function(t){this.value=null,this.onModelChange(this.value),this.onChange.emit({originalEvent:t,value:this.value}),this.updateSelectedOption(this.value),this.updateEditableLabel(),this.updateFilledState()},t.prototype.onOverlayHide=function(){this.unbindDocumentClickListener(),this.unbindDocumentResizeListener(),this.unbindScrollListener(),this.overlay=null,this.itemsWrapper=null,this.onModelTouched()},t.prototype.ngOnDestroy=function(){this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.restoreOverlayAppend(),this.onOverlayHide()},t}();y.decorators=[{type:i.Component,args:[{selector:"p-dropdown",template:'\n <div #container [ngClass]="{\'p-dropdown p-component\':true,\n \'p-disabled\':disabled, \'p-dropdown-open\':overlayVisible, \'p-focus\':focused, \'p-dropdown-clearable\': showClear && !disabled}"\n (click)="onMouseclick($event)" [ngStyle]="style" [class]="styleClass">\n <div class="p-hidden-accessible">\n <input #in [attr.id]="inputId" type="text" [attr.aria-label]="label" readonly (focus)="onInputFocus($event)" aria-haspopup="listbox"\n aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible" [attr.aria-labelledby]="ariaLabelledBy" (blur)="onInputBlur($event)" (keydown)="onKeydown($event, true)"\n [disabled]="disabled" [attr.tabindex]="tabindex" [attr.autofocus]="autofocus" role="listbox">\n </div>\n <span [ngClass]="{\'p-dropdown-label p-inputtext\':true,\'p-dropdown-label-empty\':(label == null || label.length === 0)}" *ngIf="!editable && (label != null)" [pTooltip]="tooltip" [tooltipPosition]="tooltipPosition" [positionStyle]="tooltipPositionStyle" [tooltipStyleClass]="tooltipStyleClass">\n <ng-container *ngIf="!selectedItemTemplate">{{label||\'empty\'}}</ng-container>\n <ng-container *ngTemplateOutlet="selectedItemTemplate; context: {$implicit: selectedOption}"></ng-container>\n </span>\n <span [ngClass]="{\'p-dropdown-label p-inputtext p-placeholder\':true,\'p-dropdown-label-empty\': (placeholder == null || placeholder.length === 0)}" *ngIf="!editable && (label == null)">{{placeholder||\'empty\'}}</span>\n <input #editableInput type="text" [attr.maxlength]="maxlength" [attr.aria-label]="label" class="p-dropdown-label p-inputtext" *ngIf="editable" [disabled]="disabled" [attr.placeholder]="placeholder"\n aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible" (click)="onEditableInputClick()" (input)="onEditableInputChange($event)" (focus)="onEditableInputFocus($event)" (blur)="onInputBlur($event)">\n <i class="p-dropdown-clear-icon pi pi-times" (click)="clear($event)" *ngIf="value != null && showClear && !disabled"></i>\n <div class="p-dropdown-trigger" role="button" aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible">\n <span class="p-dropdown-trigger-icon" [ngClass]="dropdownIcon"></span>\n </div>\n <div *ngIf="overlayVisible" [ngClass]="\'p-dropdown-panel p-component\'" [@overlayAnimation]="{value: \'visible\', params: {showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions}}" (@overlayAnimation.start)="onOverlayAnimationStart($event)" [ngStyle]="panelStyle" [class]="panelStyleClass">\n <div class="p-dropdown-header" *ngIf="filter" >\n <div class="p-dropdown-filter-container" (click)="$event.stopPropagation()">\n <input #filter type="text" autocomplete="off" [value]="filterValue||\'\'" class="p-dropdown-filter p-inputtext p-component" [attr.placeholder]="filterPlaceholder"\n (keydown.enter)="$event.preventDefault()" (keydown)="onKeydown($event, false)" (input)="onFilter($event)" [attr.aria-label]="ariaFilterLabel">\n <span class="p-dropdown-filter-icon pi pi-search"></span>\n </div>\n </div>\n <div class="p-dropdown-items-wrapper" [style.max-height]="virtualScroll ? \'auto\' : (scrollHeight||\'auto\')">\n <ul class="p-dropdown-items" role="listbox">\n <ng-container *ngIf="group">\n <ng-template ngFor let-optgroup [ngForOf]="optionsToDisplay">\n <li class="p-dropdown-item-group">\n <span *ngIf="!groupTemplate">{{getOptionGroupLabel(optgroup)||\'empty\'}}</span>\n <ng-container *ngTemplateOutlet="groupTemplate; context: {$implicit: optgroup}"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet="itemslist; context: {$implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption}"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf="!group">\n <ng-container *ngTemplateOutlet="itemslist; context: {$implicit: optionsToDisplay, selectedOption: selectedOption}"></ng-container>\n </ng-container>\n <ng-template #itemslist let-options let-selectedOption="selectedOption">\n <ng-container *ngIf="!virtualScroll; else virtualScrollList">\n <ng-template ngFor let-option let-i="index" [ngForOf]="options">\n <p-dropdownItem [option]="option" [selected]="selectedOption == option" [label]="getOptionLabel(option)" [disabled]="isOptionDisabled(option)"\n (onClick)="onItemClick($event)"\n [template]="itemTemplate"></p-dropdownItem>\n </ng-template>\n </ng-container>\n <ng-template #virtualScrollList>\n <cdk-virtual-scroll-viewport (scrolledIndexChange)="scrollToSelectedVirtualScrollElement()" #viewport [ngStyle]="{\'height\': scrollHeight}" [itemSize]="itemSize" *ngIf="virtualScroll && optionsToDisplay && optionsToDisplay.length">\n <ng-container *cdkVirtualFor="let option of options; let i = index; let c = count; let f = first; let l = last; let e = even; let o = odd">\n <p-dropdownItem [option]="option" [selected]="selectedOption == option" [label]="getOptionLabel(option)" [disabled]="isOptionDisabled(option)"\n (onClick)="onItemClick($event)"\n [template]="itemTemplate"></p-dropdownItem>\n </ng-container>\n </cdk-virtual-scroll-viewport>\n </ng-template>\n </ng-template>\n <li *ngIf="filter && (!optionsToDisplay || (optionsToDisplay && optionsToDisplay.length === 0))" class="p-dropdown-empty-message">{{emptyFilterMessage}}</li>\n </ul>\n </div>\n </div>\n </div>\n ',animations:[n.trigger("overlayAnimation",[n.transition(":enter",[n.style({opacity:0,transform:"scaleY(0.8)"}),n.animate("{{showTransitionParams}}")]),n.transition(":leave",[n.animate("{{hideTransitionParams}}",n.style({opacity:0}))])])],host:{"[class.p-inputwrapper-filled]":"filled","[class.p-inputwrapper-focus]":"focused || overlayVisible"},providers:[u],changeDetection:i.ChangeDetectionStrategy.OnPush,encapsulation:i.ViewEncapsulation.None,styles:[".p-dropdown{-ms-user-select:none;-webkit-user-select:none;cursor:pointer;display:inline-flex;position:relative;user-select:none}.p-dropdown-clear-icon{margin-top:-.5rem;position:absolute;top:50%}.p-dropdown-trigger{align-items:center;display:flex;flex-shrink:0;justify-content:center}.p-dropdown-label{cursor:pointer;display:block;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:1%}.p-dropdown-label-empty{overflow:hidden;visibility:hidden}input.p-dropdown-label{cursor:default}.p-dropdown .p-dropdown-panel{min-width:100%}.p-dropdown-panel{position:absolute}.p-dropdown-items-wrapper{overflow:auto}.p-dropdown-item{cursor:pointer;font-weight:400;overflow:hidden;position:relative;white-space:nowrap}.p-dropdown-items{list-style-type:none;margin:0;padding:0}.p-dropdown-filter{width:100%}.p-dropdown-filter-container{position:relative}.p-dropdown-filter-icon{margin-top:-.5rem;position:absolute;top:50%}.p-fluid .p-dropdown{display:flex}.p-fluid .p-dropdown .p-dropdown-label{width:1%}"]}]}],y.ctorParameters=function(){return[{type:i.ElementRef},{type:i.Renderer2},{type:i.ChangeDetectorRef},{type:i.NgZone},{type:l.FilterService}]},y.propDecorators={scrollHeight:[{type:i.Input}],filter:[{type:i.Input}],name:[{type:i.Input}],style:[{type:i.Input}],panelStyle:[{type:i.Input}],styleClass:[{type:i.Input}],panelStyleClass:[{type:i.Input}],readonly:[{type:i.Input}],required:[{type:i.Input}],editable:[{type:i.Input}],appendTo:[{type:i.Input}],tabindex:[{type:i.Input}],placeholder:[{type:i.Input}],filterPlaceholder:[{type:i.Input}],filterLocale:[{type:i.Input}],inputId:[{type:i.Input}],selectId:[{type:i.Input}],dataKey:[{type:i.Input}],filterBy:[{type:i.Input}],autofocus:[{type:i.Input}],resetFilterOnHide:[{type:i.Input}],dropdownIcon:[{type:i.Input}],optionLabel:[{type:i.Input}],optionValue:[{type:i.Input}],optionDisabled:[{type:i.Input}],optionGroupLabel:[{type:i.Input}],optionGroupChildren:[{type:i.Input}],autoDisplayFirst:[{type:i.Input}],group:[{type:i.Input}],showClear:[{type:i.Input}],emptyFilterMessage:[{type:i.Input}],virtualScroll:[{type:i.Input}],itemSize:[{type:i.Input}],autoZIndex:[{type:i.Input}],baseZIndex:[{type:i.Input}],showTransitionOptions:[{type:i.Input}],hideTransitionOptions:[{type:i.Input}],ariaFilterLabel:[{type:i.Input}],ariaLabelledBy:[{type:i.Input}],filterMatchMode:[{type:i.Input}],maxlength:[{type:i.Input}],tooltip:[{type:i.Input}],tooltipPosition:[{type:i.Input}],tooltipPositionStyle:[{type:i.Input}],tooltipStyleClass:[{type:i.Input}],autofocusFilter:[{type:i.Input}],onChange:[{type:i.Output}],onFocus:[{type:i.Output}],onBlur:[{type:i.Output}],onClick:[{type:i.Output}],onShow:[{type:i.Output}],onHide:[{type:i.Output}],containerViewChild:[{type:i.ViewChild,args:["container"]}],filterViewChild:[{type:i.ViewChild,args:["filter"]}],accessibleViewChild:[{type:i.ViewChild,args:["in"]}],viewPort:[{type:i.ViewChild,args:[e.CdkVirtualScrollViewport]}],editableInputViewChild:[{type:i.ViewChild,args:["editableInput"]}],templates:[{type:i.ContentChildren,args:[l.PrimeTemplate]}],disabled:[{type:i.Input}],options:[{type:i.Input}],filterValue:[{type:i.Input}]};var f=function(){};f.decorators=[{type:i.NgModule,args:[{imports:[o.CommonModule,l.SharedModule,e.ScrollingModule,a.TooltipModule,d.RippleModule],exports:[y,l.SharedModule,e.ScrollingModule],declarations:[y,c]}]}],t.DROPDOWN_VALUE_ACCESSOR=u,t.Dropdown=y,t.DropdownItem=c,t.DropdownModule=f,Object.defineProperty(t,"__esModule",{value:!0})})); //# sourceMappingURL=primeng-dropdown.umd.min.js.map