primevue/treeselect/treeselect.min.js

[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [![Discord Chat](https://img.shields.io/discord/55794023

this.primevue=this.primevue||{},this.primevue.treeselect=function(e,t,l,i,n,s,o,r){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=a(e),c=a(t),p=a(l),h=a(i),u=a(n),m=a(s),y={name:"TreeSelect",extends:d.default,emits:["update:modelValue","before-show","before-hide","change","show","hide","node-select","node-unselect","node-expand","node-collapse","focus","blur"],props:{modelValue:null,options:Array,scrollHeight:{type:String,default:"400px"},placeholder:{type:String,default:null},disabled:{type:Boolean,default:!1},tabindex:{type:Number,default:null},selectionMode:{type:String,default:"single"},appendTo:{type:String,default:"body"},emptyMessage:{type:String,default:null},display:{type:String,default:"comma"},metaKeySelection:{type:Boolean,default:!0},inputId:{type:String,default:null},inputClass:{type:[String,Object],default:null},inputStyle:{type:Object,default:null},inputProps:{type:null,default:null},panelClass:{type:[String,Object],default:null},panelProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},data:()=>({focused:!1,overlayVisible:!1,expandedKeys:{}}),watch:{modelValue:{handler:function(){this.selfChange||this.updateTreeState(),this.selfChange=!1},immediate:!0},options(){this.updateTreeState()}},outsideClickListener:null,resizeListener:null,scrollHandler:null,overlay:null,selfChange:!1,selfClick:!1,beforeUnmount(){this.unbindOutsideClickListener(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.overlay&&(o.ZIndexUtils.clear(this.overlay),this.overlay=null)},mounted(){this.updateTreeState()},methods:{show(){this.$emit("before-show"),this.overlayVisible=!0},hide(){this.$emit("before-hide"),this.overlayVisible=!1,this.$refs.focusInput.focus()},onFocus(e){this.focused=!0,this.$emit("focus",e)},onBlur(e){this.focused=!1,this.$emit("blur",e)},onClick(e){this.disabled||this.overlay&&this.overlay.contains(e.target)||o.DomHandler.hasClass(e.target,"p-treeselect-close")||(this.overlayVisible?this.hide():this.show(),this.$refs.focusInput.focus())},onSelectionChange(e){this.selfChange=!0,this.$emit("update:modelValue",e),this.$emit("change",e)},onNodeSelect(e){this.$emit("node-select",e),"single"===this.selectionMode&&this.hide()},onNodeUnselect(e){this.$emit("node-unselect",e)},onNodeToggle(e){this.expandedKeys=e},onKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"Space":case"Enter":this.onEnterKey(e);break;case"Escape":this.onEscapeKey(e)}},onArrowDownKey(e){this.overlayVisible||(this.show(),this.$nextTick((()=>{const e=[...o.DomHandler.find(this.$refs.tree.$el,".p-treenode")].find((e=>"0"===e.getAttribute("tabindex")));o.DomHandler.focus(e)})),e.preventDefault())},onEnterKey(e){this.overlayVisible?this.hide():this.onArrowDownKey(e),e.preventDefault()},onEscapeKey(e){this.overlayVisible&&(this.hide(),e.preventDefault())},onOverlayEnter(e){o.ZIndexUtils.set("overlay",e,this.$primevue.config.zIndex.overlay),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.scrollValueInView(),this.$emit("show")},onOverlayLeave(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.$emit("hide"),this.overlay=null},onOverlayAfterLeave(e){o.ZIndexUtils.clear(e)},alignOverlay(){"self"===this.appendTo?o.DomHandler.relativePosition(this.overlay,this.$el):(this.overlay.style.minWidth=o.DomHandler.getOuterWidth(this.$el)+"px",o.DomHandler.absolutePosition(this.overlay,this.$el))},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.overlayVisible&&!this.selfClick&&this.isOutsideClicked(e)&&this.hide(),this.selfClick=!1},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener(){this.scrollHandler||(this.scrollHandler=new o.ConnectedOverlayScrollHandler(this.$refs.container,(()=>{this.overlayVisible&&this.hide()}))),this.scrollHandler.bindScrollListener()},unbindScrollListener(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener(){this.resizeListener||(this.resizeListener=()=>{this.overlayVisible&&!o.DomHandler.isTouchDevice()&&this.hide()},window.addEventListener("resize",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},isOutsideClicked(e){return!(this.$el.isSameNode(e.target)||this.$el.contains(e.target)||this.overlay&&this.overlay.contains(e.target))},overlayRef(e){this.overlay=e},onOverlayClick(e){p.default.emit("overlay-click",{originalEvent:e,target:this.$el}),this.selfClick=!0},onOverlayKeydown(e){"Escape"===e.code&&this.hide()},findSelectedNodes(e,t,l){if(e){if(this.isSelected(e,t)&&(l.push(e),delete t[e.key]),Object.keys(t).length&&e.children)for(let i of e.children)this.findSelectedNodes(i,t,l)}else for(let e of this.options)this.findSelectedNodes(e,t,l)},isSelected(e,t){return"checkbox"===this.selectionMode?t[e.key]&&t[e.key].checked:t[e.key]},updateTreeState(){let e={...this.modelValue};this.expandedKeys={},e&&this.options&&this.updateTreeBranchState(null,null,e)},updateTreeBranchState(e,t,l){if(e){if(this.isSelected(e,l)&&(this.expandPath(t),delete l[e.key]),Object.keys(l).length&&e.children)for(let i of e.children)t.push(e.key),this.updateTreeBranchState(i,t,l)}else for(let e of this.options)this.updateTreeBranchState(e,[],l)},expandPath(e){if(e.length>0)for(let t of e)this.expandedKeys[t]=!0},scrollValueInView(){if(this.overlay){let e=o.DomHandler.findSingle(this.overlay,"li.p-highlight");e&&e.scrollIntoView({block:"nearest",inline:"start"})}}},computed:{containerClass(){return["p-treeselect p-component p-inputwrapper",{"p-treeselect-chip":"chip"===this.display,"p-disabled":this.disabled,"p-focus":this.focused,"p-inputwrapper-filled":!this.emptyValue,"p-inputwrapper-focus":this.focused||this.overlayVisible}]},labelClass(){return["p-treeselect-label",{"p-placeholder":this.label===this.placeholder,"p-treeselect-label-empty":!this.placeholder&&this.emptyValue}]},panelStyleClass(){return["p-treeselect-panel p-component",this.panelClass,{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]},selectedNodes(){let e=[];if(this.modelValue&&this.options){let t={...this.modelValue};this.findSelectedNodes(null,t,e)}return e},label(){let e=this.selectedNodes;return e.length?e.map((e=>e.label)).join(", "):this.placeholder},emptyMessageText(){return this.emptyMessage||this.$primevue.config.locale.emptyMessage},emptyValue(){return!this.modelValue||0===Object.keys(this.modelValue).length},emptyOptions(){return!this.options||0===this.options.length},listId:()=>o.UniqueComponentId()+"_list"},components:{TSTree:m.default,Portal:h.default,ChevronDownIcon:c.default},directives:{ripple:u.default}};const f=["id","disabled","tabindex","aria-labelledby","aria-label","aria-expanded","aria-controls"],v=["aria-expanded"];return function(e,t){void 0===t&&(t={});var l=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===l&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-treeselect {\n    display: inline-flex;\n    cursor: pointer;\n    position: relative;\n    user-select: none;\n}\n.p-treeselect-trigger {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n}\n.p-treeselect-label-container {\n    overflow: hidden;\n    flex: 1 1 auto;\n    cursor: pointer;\n}\n.p-treeselect-label {\n    display: block;\n    white-space: nowrap;\n    cursor: pointer;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.p-treeselect-label-empty {\n    overflow: hidden;\n    visibility: hidden;\n}\n.p-treeselect-token {\n    cursor: default;\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n}\n.p-treeselect .p-treeselect-panel {\n    min-width: 100%;\n}\n.p-treeselect-panel {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-treeselect-items-wrapper {\n    overflow: auto;\n}\n.p-fluid .p-treeselect {\n    display: flex;\n}\n"),y.render=function(e,t,l,i,n,s){const o=r.resolveComponent("TSTree"),a=r.resolveComponent("Portal");return r.openBlock(),r.createElementBlock("div",r.mergeProps({ref:"container",class:s.containerClass,onClick:t[7]||(t[7]=(...e)=>s.onClick&&s.onClick(...e))},e.ptm("root")),[r.createElementVNode("div",r.mergeProps({class:"p-hidden-accessible"},e.ptm("hiddenInputWrapper")),[r.createElementVNode("input",r.mergeProps({ref:"focusInput",id:l.inputId,type:"text",role:"combobox",class:l.inputClass,style:l.inputStyle,readonly:"",disabled:l.disabled,tabindex:l.disabled?-1:l.tabindex,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-haspopup":"tree","aria-expanded":n.overlayVisible,"aria-controls":s.listId,onFocus:t[0]||(t[0]=e=>s.onFocus(e)),onBlur:t[1]||(t[1]=e=>s.onBlur(e)),onKeydown:t[2]||(t[2]=e=>s.onKeyDown(e))},{...l.inputProps,...e.ptm("hiddenInput")}),null,16,f)],16),r.createElementVNode("div",r.mergeProps({class:"p-treeselect-label-container"},e.ptm("labelContainer")),[r.createElementVNode("div",r.mergeProps({class:s.labelClass},e.ptm("label")),[r.renderSlot(e.$slots,"value",{value:s.selectedNodes,placeholder:l.placeholder},(()=>["comma"===l.display?(r.openBlock(),r.createElementBlock(r.Fragment,{key:0},[r.createTextVNode(r.toDisplayString(s.label||"empty"),1)],64)):"chip"===l.display?(r.openBlock(),r.createElementBlock(r.Fragment,{key:1},[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(s.selectedNodes,(t=>(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:t.key,class:"p-treeselect-token"},e.ptm("token")),[r.createElementVNode("span",r.mergeProps({class:"p-treeselect-token-label"},e.ptm("tokenLabel")),r.toDisplayString(t.label),17)],16)))),128)),s.emptyValue?(r.openBlock(),r.createElementBlock(r.Fragment,{key:0},[r.createTextVNode(r.toDisplayString(l.placeholder||"empty"),1)],64)):r.createCommentVNode("",!0)],64)):r.createCommentVNode("",!0)]))],16)],16),r.createElementVNode("div",r.mergeProps({class:"p-treeselect-trigger",role:"button","aria-haspopup":"tree","aria-expanded":n.overlayVisible},e.ptm("trigger")),[r.renderSlot(e.$slots,"triggericon",{},(()=>[(r.openBlock(),r.createBlock(r.resolveDynamicComponent("ChevronDownIcon"),r.mergeProps({class:"p-treeselect-trigger-icon"},e.ptm("triggerIcon")),null,16))]))],16,v),r.createVNode(a,{appendTo:l.appendTo},{default:r.withCtx((()=>[r.createVNode(r.Transition,{name:"p-connected-overlay",onEnter:s.onOverlayEnter,onLeave:s.onOverlayLeave,onAfterLeave:s.onOverlayAfterLeave},{default:r.withCtx((()=>[n.overlayVisible?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:s.overlayRef,onClick:t[5]||(t[5]=(...e)=>s.onOverlayClick&&s.onOverlayClick(...e)),class:s.panelStyleClass,onKeydown:t[6]||(t[6]=(...e)=>s.onOverlayKeydown&&s.onOverlayKeydown(...e))},{...l.panelProps,...e.ptm("panel")}),[r.renderSlot(e.$slots,"header",{value:l.modelValue,options:l.options}),r.createElementVNode("div",r.mergeProps({class:"p-treeselect-items-wrapper",style:{"max-height":l.scrollHeight}},e.ptm("wrapper")),[r.createVNode(o,{ref:"tree",id:s.listId,value:l.options,selectionMode:l.selectionMode,"onUpdate:selectionKeys":s.onSelectionChange,selectionKeys:l.modelValue,expandedKeys:n.expandedKeys,"onUpdate:expandedKeys":s.onNodeToggle,metaKeySelection:l.metaKeySelection,onNodeExpand:t[3]||(t[3]=t=>e.$emit("node-expand",t)),onNodeCollapse:t[4]||(t[4]=t=>e.$emit("node-collapse",t)),onNodeSelect:s.onNodeSelect,onNodeUnselect:s.onNodeUnselect,level:0,pt:e.ptm("tree")},r.createSlots({_:2},[e.$slots.itemtogglericon?{name:"togglericon",fn:r.withCtx((t=>[r.renderSlot(e.$slots,"itemtogglericon",{node:t.node,expanded:t.expanded,class:r.normalizeClass(t.class)})])),key:"0"}:void 0,e.$slots.itemcheckboxicon?{name:"checkboxicon",fn:r.withCtx((t=>[r.renderSlot(e.$slots,"itemcheckboxicon",{checked:t.checked,partialChecked:t.partialChecked,class:r.normalizeClass(t.class)})])),key:"1"}:void 0]),1032,["id","value","selectionMode","onUpdate:selectionKeys","selectionKeys","expandedKeys","onUpdate:expandedKeys","metaKeySelection","onNodeSelect","onNodeUnselect","pt"]),s.emptyOptions?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,class:"p-treeselect-empty-message"},e.ptm("emptyMessage")),[r.renderSlot(e.$slots,"empty",{},(()=>[r.createTextVNode(r.toDisplayString(s.emptyMessageText),1)]))],16)):r.createCommentVNode("",!0)],16),r.renderSlot(e.$slots,"footer",{value:l.modelValue,options:l.options})],16)):r.createCommentVNode("",!0)])),_:3},8,["onEnter","onLeave","onAfterLeave"])])),_:3},8,["appendTo"])],16)},y}(primevue.basecomponent,primevue.icons.chevrondown,primevue.overlayeventbus,primevue.portal,primevue.ripple,primevue.tree,primevue.utils,Vue);