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) 19.7 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("primeng/api"),require("primeng/utils"),require("primeng/dom"),require("@angular/animations"),require("@angular/forms"),require("primeng/ripple")):"function"==typeof define&&define.amd?define("primeng/cascadeselect",["exports","@angular/core","@angular/common","primeng/api","primeng/utils","primeng/dom","@angular/animations","@angular/forms","primeng/ripple"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).primeng=e.primeng||{},e.primeng.cascadeselect={}),e.ng.core,e.ng.common,e.primeng.api,e.primeng.utils,e.primeng.dom,e.ng.animations,e.ng.forms,e.primeng.ripple)}(this,(function(e,t,n,i,o,l,a,r,s){"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 p(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],i=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&i>=e.length&&(e=void 0),{value:e&&e[i++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}Object.create;var c={provide:r.NG_VALUE_ACCESSOR,useExisting:t.forwardRef((function(){return d})),multi:!0},u=function(){function e(e){this.el=e,this.level=0,this.onSelect=new t.EventEmitter,this.onGroupSelect=new t.EventEmitter,this.activeOption=null}return Object.defineProperty(e.prototype,"parentActive",{get:function(){return this._parentActive},set:function(e){e||(this.activeOption=null),this._parentActive=e},enumerable:!1,configurable:!0}),e.prototype.ngOnInit=function(){var e,t;if(this.selectionPath&&this.options&&!this.dirty)try{for(var n=p(this.options),i=n.next();!i.done;i=n.next()){var o=i.value;if(this.selectionPath.includes(o)){this.activeOption=o;break}}}catch(t){e={error:t}}finally{try{i&&!i.done&&(t=n.return)&&t.call(n)}finally{if(e)throw e.error}}this.root||this.position()},e.prototype.onOptionClick=function(e,t){this.isOptionGroup(t)?(this.activeOption=this.activeOption===t?null:t,this.onGroupSelect.emit({originalEvent:e,value:t})):this.onSelect.emit({originalEvent:e,value:this.getOptionValue(t)})},e.prototype.onOptionSelect=function(e){this.onSelect.emit(e)},e.prototype.onOptionGroupSelect=function(e){this.onGroupSelect.emit(e)},e.prototype.getOptionLabel=function(e){return this.optionLabel?o.ObjectUtils.resolveFieldData(e,this.optionLabel):e},e.prototype.getOptionValue=function(e){return this.optionValue?o.ObjectUtils.resolveFieldData(e,this.optionValue):e},e.prototype.getOptionGroupLabel=function(e){return this.optionGroupLabel?o.ObjectUtils.resolveFieldData(e,this.optionGroupLabel):null},e.prototype.getOptionGroupChildren=function(e){return o.ObjectUtils.resolveFieldData(e,this.optionGroupChildren[this.level])},e.prototype.isOptionGroup=function(e){return Object.prototype.hasOwnProperty.call(e,this.optionGroupChildren[this.level])},e.prototype.getOptionLabelToRender=function(e){return this.isOptionGroup(e)?this.getOptionGroupLabel(e):this.getOptionLabel(e)},e.prototype.getItemClass=function(e){return{"p-cascadeselect-item":!0,"p-cascadeselect-item-group":this.isOptionGroup(e),"p-cascadeselect-item-active p-highlight":this.isOptionActive(e)}},e.prototype.isOptionActive=function(e){return this.activeOption===e},e.prototype.onKeyDown=function(e,t,n){var i=e.currentTarget.parentElement;switch(e.key){case"Down":case"ArrowDown":var o=this.el.nativeElement.children[0].children[n+1];o&&o.children[0].focus();break;case"Up":case"ArrowUp":var l=this.el.nativeElement.children[0].children[n-1];l&&l.children[0].focus();break;case"Right":case"ArrowRight":this.isOptionGroup(t)&&(this.isOptionActive(t)?i.children[1].children[0].children[0].children[0].focus():this.activeOption=t);break;case"Left":case"ArrowLeft":this.activeOption=null;var a=i.parentElement.parentElement.parentElement;a&&a.children[0].focus();break;case"Enter":this.onOptionClick(e,t)}e.preventDefault()},e.prototype.position=function(){var e=this.el.nativeElement.parentElement,t=l.DomHandler.getOffset(e),n=l.DomHandler.getViewport(),i=this.el.nativeElement.children[0].offsetParent?this.el.nativeElement.children[0].offsetWidth:l.DomHandler.getHiddenElementOuterWidth(this.el.nativeElement.children[0]),o=l.DomHandler.getOuterWidth(e.children[0]);parseInt(t.left,10)+o+i>n.width-l.DomHandler.calculateScrollbarWidth()&&(this.el.nativeElement.children[0].style.left="-200%")},e}();u.decorators=[{type:t.Component,args:[{selector:"p-cascadeSelectSub",template:'\n <ul class="p-cascadeselect-panel p-cascadeselect-items" [ngClass]="{\'p-cascadeselect-panel-root\': root}" role="listbox" aria-orientation="horizontal">\n <ng-template ngFor let-option [ngForOf]="options" let-i="index">\n <li [ngClass]="getItemClass(option)" role="none">\n <div class="p-cascadeselect-item-content" (click)="onOptionClick($event, option)" tabindex="0" (keydown)="onKeyDown($event, option, i)" pRipple>\n <ng-container *ngIf="optionTemplate;else defaultOptionTemplate">\n <ng-container *ngTemplateOutlet="optionTemplate; context: {$implicit: option}"></ng-container>\n </ng-container>\n <ng-template #defaultOptionTemplate>\n <span class="p-cascadeselect-item-text">{{getOptionLabelToRender(option)}}</span>\n </ng-template>\n <span class="p-cascadeselect-group-icon pi pi-angle-right" *ngIf="isOptionGroup(option)"></span>\n </div>\n <p-cascadeSelectSub *ngIf="isOptionGroup(option) && isOptionActive(option)" class="p-cascadeselect-sublist" [selectionPath]="selectionPath" [options]="getOptionGroupChildren(option)"\n [optionLabel]="optionLabel" [optionValue]="optionValue" [level]="level + 1" (onSelect)="onOptionSelect($event)" (onOptionGroupSelect)="onOptionGroupSelect()"\n [optionGroupLabel]="optionGroupLabel" [optionGroupChildren]="optionGroupChildren" [parentActive]="isOptionActive(option)" [dirty]="dirty" [optionTemplate]="optionTemplate">\n </p-cascadeSelectSub>\n </li>\n </ng-template>\n </ul>\n ',encapsulation:t.ViewEncapsulation.None,changeDetection:t.ChangeDetectionStrategy.OnPush}]}],u.ctorParameters=function(){return[{type:t.ElementRef}]},u.propDecorators={selectionPath:[{type:t.Input}],options:[{type:t.Input}],optionGroupChildren:[{type:t.Input}],optionTemplate:[{type:t.Input}],level:[{type:t.Input}],optionLabel:[{type:t.Input}],optionValue:[{type:t.Input}],optionGroupLabel:[{type:t.Input}],dirty:[{type:t.Input}],root:[{type:t.Input}],onSelect:[{type:t.Output}],onGroupSelect:[{type:t.Output}],parentActive:[{type:t.Input}]};var d=function(){function e(e,n){this.el=e,this.cd=n,this.showTransitionOptions=".12s cubic-bezier(0, 0, 0.2, 1)",this.hideTransitionOptions=".1s linear",this.onChange=new t.EventEmitter,this.onGroupChange=new t.EventEmitter,this.onShow=new t.EventEmitter,this.onHide=new t.EventEmitter,this.onBeforeShow=new t.EventEmitter,this.onBeforeHide=new t.EventEmitter,this.selectionPath=null,this.focused=!1,this.filled=!1,this.overlayVisible=!1,this.dirty=!1,this.onModelChange=function(){},this.onModelTouched=function(){}}return e.prototype.ngOnInit=function(){this.updateSelectionPath()},e.prototype.ngAfterContentInit=function(){var e=this;this.templates.forEach((function(t){switch(t.getType()){case"value":e.valueTemplate=t.template;break;case"option":e.optionTemplate=t.template}}))},e.prototype.onOptionSelect=function(e){this.value=e.value,this.updateSelectionPath(),this.onModelChange(this.value),this.onChange.emit(e),this.hide(),this.focusInputEl.nativeElement.focus()},e.prototype.onOptionGroupSelect=function(e){this.dirty=!0,this.onGroupChange.emit(e)},e.prototype.getOptionLabel=function(e){return this.optionLabel?o.ObjectUtils.resolveFieldData(e,this.optionLabel):e},e.prototype.getOptionValue=function(e){return this.optionValue?o.ObjectUtils.resolveFieldData(e,this.optionValue):e},e.prototype.getOptionGroupChildren=function(e,t){return o.ObjectUtils.resolveFieldData(e,this.optionGroupChildren[t])},e.prototype.isOptionGroup=function(e,t){return Object.prototype.hasOwnProperty.call(e,this.optionGroupChildren[t])},e.prototype.updateSelectionPath=function(){var e,t,n;if(null!=this.value&&this.options)try{for(var i=p(this.options),o=i.next();!o.done;o=i.next()){var l=o.value;if(n=this.findModelOptionInGroup(l,0))break}}catch(t){e={error:t}}finally{try{o&&!o.done&&(t=i.return)&&t.call(i)}finally{if(e)throw e.error}}this.selectionPath=n,this.updateFilledState()},e.prototype.updateFilledState=function(){this.filled=!(null==this.selectionPath||0==this.selectionPath.length)},e.prototype.findModelOptionInGroup=function(e,t){var n,i;if(this.isOptionGroup(e,t)){var l=void 0;try{for(var a=p(this.getOptionGroupChildren(e,t)),r=a.next();!r.done;r=a.next()){var s=r.value;if(l=this.findModelOptionInGroup(s,t+1))return l.unshift(e),l}}catch(e){n={error:e}}finally{try{r&&!r.done&&(i=a.return)&&i.call(a)}finally{if(n)throw n.error}}}else if(o.ObjectUtils.equals(this.value,this.getOptionValue(e),this.dataKey))return[e];return null},e.prototype.show=function(){this.onBeforeShow.emit(),this.overlayVisible=!0},e.prototype.hide=function(){this.onBeforeHide.emit(),this.overlayVisible=!1,this.cd.markForCheck()},e.prototype.onClick=function(e){this.disabled||this.overlayEl&&this.overlayEl&&this.overlayEl.contains(e.target)||(this.overlayVisible?this.hide():this.show(),this.focusInputEl.nativeElement.focus())},e.prototype.onFocus=function(){this.focused=!0},e.prototype.onBlur=function(){this.focused=!1},e.prototype.onOverlayAnimationStart=function(e){switch(e.toState){case"visible":this.overlayEl=e.element,this.onOverlayEnter()}},e.prototype.onOverlayAnimationDone=function(e){switch(e.toState){case"void":this.onOverlayLeave()}},e.prototype.onOverlayEnter=function(){this.overlayEl.style.zIndex=String(l.DomHandler.generateZIndex()),this.appendContainer(),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.onShow.emit()},e.prototype.onOverlayLeave=function(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.onHide.emit(),this.overlayEl=null,this.dirty=!1},e.prototype.writeValue=function(e){this.value=e,this.updateSelectionPath(),this.cd.markForCheck()},e.prototype.registerOnChange=function(e){this.onModelChange=e},e.prototype.registerOnTouched=function(e){this.onModelTouched=e},e.prototype.setDisabledState=function(e){this.disabled=e,this.cd.markForCheck()},e.prototype.alignOverlay=function(){this.appendTo?(l.DomHandler.absolutePosition(this.overlayEl,this.containerEl.nativeElement),this.overlayEl.style.minWidth=l.DomHandler.getOuterWidth(this.containerEl.nativeElement)+"px"):l.DomHandler.relativePosition(this.overlayEl,this.containerEl.nativeElement)},e.prototype.bindOutsideClickListener=function(){var e=this;this.outsideClickListener||(this.outsideClickListener=function(t){e.overlayVisible&&e.overlayEl&&!e.containerEl.nativeElement.contains(t.target)&&!e.overlayEl.contains(t.target)&&e.hide()},document.addEventListener("click",this.outsideClickListener))},e.prototype.unbindOutsideClickListener=function(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},e.prototype.bindScrollListener=function(){var e=this;this.scrollHandler||(this.scrollHandler=new l.ConnectedOverlayScrollHandler(this.containerEl.nativeElement,(function(){e.overlayVisible&&e.hide()}))),this.scrollHandler.bindScrollListener()},e.prototype.unbindScrollListener=function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},e.prototype.bindResizeListener=function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.overlayVisible&&e.hide()},window.addEventListener("resize",this.resizeListener))},e.prototype.unbindResizeListener=function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},e.prototype.appendContainer=function(){this.appendTo&&("body"===this.appendTo?document.body.appendChild(this.overlayEl):document.getElementById(this.appendTo).appendChild(this.overlayEl))},e.prototype.restoreAppend=function(){this.overlayEl&&this.appendTo&&("body"===this.appendTo?document.body.removeChild(this.overlayEl):document.getElementById(this.appendTo).removeChild(this.overlayEl))},e.prototype.label=function(){return this.selectionPath?this.getOptionLabel(this.selectionPath[this.selectionPath.length-1]):this.placeholder||"p-emptylabel"},e.prototype.onKeyDown=function(e){switch(e.key){case"Down":case"ArrowDown":this.overlayVisible?l.DomHandler.findSingle(this.overlayEl,".p-cascadeselect-item").children[0].focus():e.altKey&&this.options&&this.options.length&&this.show(),e.preventDefault();break;case"Escape":this.overlayVisible&&(this.hide(),e.preventDefault());break;case"Tab":this.hide()}},e.prototype.containerClass=function(){return{"p-cascadeselect p-component p-inputwrapper":!0,"p-disabled":this.disabled,"p-focus":this.focused}},e.prototype.labelClass=function(){return{"p-cascadeselect-label":!0,"p-placeholder":this.label()===this.placeholder,"p-cascadeselect-label-empty":!this.value&&("p-emptylabel"===this.label()||0===this.label().length)}},e.prototype.ngOnDestroy=function(){this.restoreAppend(),this.unbindOutsideClickListener(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.overlayEl=null},e}();d.decorators=[{type:t.Component,args:[{selector:"p-cascadeSelect",template:'\n <div #container [ngClass]="containerClass()" [class]="styleClass" [ngStyle]="style" (click)="onClick($event)">\n <div class="p-hidden-accessible">\n <input #focusInput type="text" [attr.id]="inputId" readonly [disabled]="disabled" (focus)="onFocus()" (blur)="onBlur()" (keydown)="onKeyDown($event)" [attr.tabindex]="tabindex"\n aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible" [attr.aria-labelledby]="ariaLabelledBy">\n </div>\n <span [ngClass]="labelClass()">\n <ng-container *ngIf="valueTemplate;else defaultValueTemplate">\n <ng-container *ngTemplateOutlet="valueTemplate; context: {$implicit: value, placeholder: placeholder}"></ng-container>\n </ng-container>\n <ng-template #defaultValueTemplate>\n {{label()}}\n </ng-template>\n </span>\n <div class="p-cascadeselect-trigger" role="button" aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible">\n <span class="p-cascadeselect-trigger-icon pi pi-chevron-down"></span>\n </div>\n <div class="p-cascadeselect-panel p-component" *ngIf="overlayVisible" \n [@overlayAnimation]="{value: \'visible\', params: {showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions}}" (@overlayAnimation.start)="onOverlayAnimationStart($event)" (@overlayAnimation.done)="onOverlayAnimationDone($event)">\n <div class="p-cascadeselect-items-wrapper">\n <p-cascadeSelectSub [options]="options" [selectionPath]="selectionPath" class="p-cascadeselect-items" \n [optionLabel]="optionLabel" [optionValue]="optionValue" [level]="0" [optionTemplate]="optionTemplate"\n [optionGroupLabel]="optionGroupLabel" [optionGroupChildren]="optionGroupChildren" \n (onSelect)="onOptionSelect($event)" (onGroupSelect)="onOptionGroupSelect()" [dirty]="dirty" [root]="true">\n </p-cascadeSelectSub>\n </div>\n </div>\n </div>\n ',animations:[a.trigger("overlayAnimation",[a.transition(":enter",[a.style({opacity:0,transform:"scaleY(0.8)"}),a.animate("{{showTransitionParams}}")]),a.transition(":leave",[a.animate("{{hideTransitionParams}}",a.style({opacity:0}))])])],host:{"[class.p-inputwrapper-filled]":"filled","[class.p-inputwrapper-focus]":"focused || overlayVisible"},providers:[c],changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None,styles:[".p-cascadeselect{-ms-user-select:none;-webkit-user-select:none;cursor:pointer;display:inline-flex;position:relative;user-select:none}.p-cascadeselect-trigger{align-items:center;display:flex;flex-shrink:0;justify-content:center}.p-cascadeselect-label{cursor:pointer;display:block;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:1%}.p-cascadeselect-label-empty{overflow:hidden;visibility:hidden}.p-cascadeselect .p-cascadeselect-panel{min-width:100%}.p-cascadeselect-panel{position:absolute}.p-cascadeselect-item{cursor:pointer;font-weight:400;white-space:nowrap}.p-cascadeselect-item-content{align-items:center;display:flex;overflow:hidden;position:relative}.p-cascadeselect-group-icon{margin-left:auto}.p-cascadeselect-items{list-style-type:none;margin:0;padding:0}.p-fluid .p-cascadeselect{display:flex}.p-fluid .p-cascadeselect .p-cascadeselect-label{width:1%}.p-cascadeselect-sublist{display:none;min-width:100%;position:absolute;z-index:1}.p-cascadeselect-item-active{overflow:visible!important}.p-cascadeselect-item-active>.p-cascadeselect-sublist{display:block;left:100%;top:0}"]}]}],d.ctorParameters=function(){return[{type:t.ElementRef},{type:t.ChangeDetectorRef}]},d.propDecorators={styleClass:[{type:t.Input}],style:[{type:t.Input}],options:[{type:t.Input}],optionLabel:[{type:t.Input}],optionValue:[{type:t.Input}],optionGroupLabel:[{type:t.Input}],optionGroupChildren:[{type:t.Input}],placeholder:[{type:t.Input}],value:[{type:t.Input}],dataKey:[{type:t.Input}],inputId:[{type:t.Input}],tabindex:[{type:t.Input}],ariaLabelledBy:[{type:t.Input}],appendTo:[{type:t.Input}],disabled:[{type:t.Input}],rounded:[{type:t.Input}],showTransitionOptions:[{type:t.Input}],hideTransitionOptions:[{type:t.Input}],focusInputEl:[{type:t.ViewChild,args:["focusInput"]}],containerEl:[{type:t.ViewChild,args:["container"]}],onChange:[{type:t.Output}],onGroupChange:[{type:t.Output}],onShow:[{type:t.Output}],onHide:[{type:t.Output}],onBeforeShow:[{type:t.Output}],onBeforeHide:[{type:t.Output}],templates:[{type:t.ContentChildren,args:[i.PrimeTemplate]}]};var h=function(){};h.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule,i.SharedModule,s.RippleModule],exports:[d,u,i.SharedModule],declarations:[d,u]}]}],e.CASCADESELECT_VALUE_ACCESSOR=c,e.CascadeSelect=d,e.CascadeSelectModule=h,e.CascadeSelectSub=u,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=primeng-cascadeselect.umd.min.js.map