primevue 3.29.2 → 3.30.0

package/tree/tree.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.tree=function(e,t,n,o,l,i,s,r,c,d){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=a(e),p=a(t),u=a(n),g=a(l),m=a(i),k=a(s),y=a(r),f=a(c),x={name:"TreeNode",extends:h.default,emits:["node-toggle","node-click","checkbox-change"],props:{node:{type:null,default:null},expandedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},templates:{type:null,default:null},level:{type:Number,default:null},index:{type:Number,default:null}},nodeTouched:!1,toggleClicked:!1,mounted(){this.$refs.currentNode.closest(".p-treeselect-items-wrapper")&&this.setAllNodesTabIndexes()},methods:{toggle(){this.$emit("node-toggle",this.node),this.toggleClicked=!0},label:e=>"function"==typeof e.label?e.label():e.label,onChildNodeToggle(e){this.$emit("node-toggle",e)},getPTOptions(e){return this.ptm(e,{context:{expanded:this.expanded,selected:this.selected,checked:this.checked}})},onClick(e){this.toggleClicked||o.DomHandler.hasClass(e.target,"p-tree-toggler")||o.DomHandler.hasClass(e.target.parentElement,"p-tree-toggler")?this.toggleClicked=!1:(this.isCheckboxSelectionMode()?this.toggleCheckbox():this.$emit("node-click",{originalEvent:e,nodeTouched:this.nodeTouched,node:this.node}),this.nodeTouched=!1)},onChildNodeClick(e){this.$emit("node-click",e)},onTouchEnd(){this.nodeTouched=!0},onKeyDown(e){if(this.isSameNode(e))switch(e.code){case"Tab":this.onTabKey(e);break;case"ArrowDown":this.onArrowDown(e);break;case"ArrowUp":this.onArrowUp(e);break;case"ArrowRight":this.onArrowRight(e);break;case"ArrowLeft":this.onArrowLeft(e);break;case"Enter":case"Space":this.onEnterKey(e)}},onArrowDown(e){const t=e.target,n=t.children[1];if(n)this.focusRowChange(t,n.children[0]);else if(t.nextElementSibling)this.focusRowChange(t,t.nextElementSibling);else{let e=this.findNextSiblingOfAncestor(t);e&&this.focusRowChange(t,e)}e.preventDefault()},onArrowUp(e){const t=e.target;if(t.previousElementSibling)this.focusRowChange(t,t.previousElementSibling,this.findLastVisibleDescendant(t.previousElementSibling));else{let e=this.getParentNodeElement(t);e&&this.focusRowChange(t,e)}e.preventDefault()},onArrowRight(e){this.leaf||this.expanded||(e.currentTarget.tabIndex=-1,this.$emit("node-toggle",this.node),this.$nextTick((()=>{this.onArrowDown(e)})))},onArrowLeft(e){const t=o.DomHandler.findSingle(e.currentTarget,".p-tree-toggler");if(0===this.level&&!this.expanded)return!1;if(this.expanded&&!this.leaf)return t.click(),!1;const n=this.findBeforeClickableNode(e.currentTarget);n&&this.focusRowChange(e.currentTarget,n)},onEnterKey(e){this.setTabIndexForSelectionMode(e,this.nodeTouched),this.onClick(e),e.preventDefault()},onTabKey(){this.setAllNodesTabIndexes()},setAllNodesTabIndexes(){const e=o.DomHandler.find(this.$refs.currentNode.closest(".p-tree-container"),".p-treenode"),t=[...e].some((e=>"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")));if([...e].forEach((e=>{e.tabIndex=-1})),t){[...e].filter((e=>"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")))[0].tabIndex=0}else[...e][0].tabIndex=0},setTabIndexForSelectionMode(e,t){if(null!==this.selectionMode){const n=[...o.DomHandler.find(this.$refs.currentNode.parentElement,".p-treenode")];e.currentTarget.tabIndex=!1===t?-1:0,n.every((e=>-1===e.tabIndex))&&(n[0].tabIndex=0)}},focusRowChange(e,t,n){e.tabIndex="-1",t.tabIndex="0",this.focusNode(n||t)},findBeforeClickableNode(e){const t=e.closest("ul").closest("li");if(t){const n=o.DomHandler.findSingle(t,"button");return n&&"hidden"!==n.style.visibility?t:this.findBeforeClickableNode(e.previousElementSibling)}return null},toggleCheckbox(){let e=this.selectionKeys?{...this.selectionKeys}:{};const t=!this.checked;this.propagateDown(this.node,t,e),this.$emit("checkbox-change",{node:this.node,check:t,selectionKeys:e})},propagateDown(e,t,n){if(t?n[e.key]={checked:!0,partialChecked:!1}:delete n[e.key],e.children&&e.children.length)for(let o of e.children)this.propagateDown(o,t,n)},propagateUp(e){let t=e.check,n={...e.selectionKeys},o=0,l=!1;for(let e of this.node.children)n[e.key]&&n[e.key].checked?o++:n[e.key]&&n[e.key].partialChecked&&(l=!0);t&&o===this.node.children.length?n[this.node.key]={checked:!0,partialChecked:!1}:(t||delete n[this.node.key],l||o>0&&o!==this.node.children.length?n[this.node.key]={checked:!1,partialChecked:!0}:delete n[this.node.key]),this.$emit("checkbox-change",{node:e.node,check:e.check,selectionKeys:n})},onChildCheckboxChange(e){this.$emit("checkbox-change",e)},findNextSiblingOfAncestor(e){let t=this.getParentNodeElement(e);return t?t.nextElementSibling?t.nextElementSibling:this.findNextSiblingOfAncestor(t):null},findLastVisibleDescendant(e){const t=e.children[1];if(t){const e=t.children[t.children.length-1];return this.findLastVisibleDescendant(e)}return e},getParentNodeElement(e){const t=e.parentElement.parentElement;return o.DomHandler.hasClass(t,"p-treenode")?t:null},focusNode(e){e.focus()},isCheckboxSelectionMode(){return"checkbox"===this.selectionMode},isSameNode:e=>e.currentTarget&&(e.currentTarget.isSameNode(e.target)||e.currentTarget.isSameNode(e.target.closest(".p-treenode")))},computed:{hasChildren(){return this.node.children&&this.node.children.length>0},expanded(){return this.expandedKeys&&!0===this.expandedKeys[this.node.key]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},selectable(){return!1!==this.node.selectable&&null!=this.selectionMode},selected(){return!(!this.selectionMode||!this.selectionKeys)&&!0===this.selectionKeys[this.node.key]},containerClass(){return["p-treenode",{"p-treenode-leaf":this.leaf}]},contentClass(){return["p-treenode-content",this.node.styleClass,{"p-treenode-selectable":this.selectable,"p-highlight":this.checkboxMode?this.checked:this.selected}]},icon(){return["p-treenode-icon",this.node.icon]},checkboxClass(){return["p-checkbox-box",{"p-highlight":this.checked,"p-indeterminate":this.partialChecked}]},checkboxMode(){return"checkbox"===this.selectionMode&&!1!==this.node.selectable},checked(){return!!this.selectionKeys&&(this.selectionKeys[this.node.key]&&this.selectionKeys[this.node.key].checked)},partialChecked(){return!!this.selectionKeys&&(this.selectionKeys[this.node.key]&&this.selectionKeys[this.node.key].partialChecked)},ariaChecked(){return"single"===this.selectionMode||"multiple"===this.selectionMode?this.selected:void 0},ariaSelected(){return this.checkboxMode?this.checked:void 0}},components:{ChevronDownIcon:m.default,ChevronRightIcon:k.default,CheckIcon:g.default,MinusIcon:y.default},directives:{ripple:f.default}};const b=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level","aria-checked","tabindex"];x.render=function(e,t,n,o,l,i){const s=d.resolveComponent("TreeNode",!0),r=d.resolveDirective("ripple");return d.openBlock(),d.createElementBlock("li",d.mergeProps({ref:"currentNode",class:i.containerClass,role:"treeitem","aria-label":i.label(n.node),"aria-selected":i.ariaSelected,"aria-expanded":i.expanded,"aria-setsize":n.node.children?n.node.children.length:0,"aria-posinset":n.index+1,"aria-level":n.level,"aria-checked":i.ariaChecked,tabindex:0===n.index?0:-1,onKeydown:t[3]||(t[3]=(...e)=>i.onKeyDown&&i.onKeyDown(...e))},i.getPTOptions("node")),[d.createElementVNode("div",d.mergeProps({class:i.contentClass,onClick:t[1]||(t[1]=(...e)=>i.onClick&&i.onClick(...e)),onTouchend:t[2]||(t[2]=(...e)=>i.onTouchEnd&&i.onTouchEnd(...e)),style:n.node.style},i.getPTOptions("content")),[d.withDirectives((d.openBlock(),d.createElementBlock("button",d.mergeProps({type:"button",class:"p-tree-toggler p-link",onClick:t[0]||(t[0]=(...e)=>i.toggle&&i.toggle(...e)),tabindex:"-1","aria-hidden":"true"},i.getPTOptions("toggler")),[n.templates.togglericon?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.templates.togglericon),{key:0,node:n.node,expanded:i.expanded,class:"p-tree-toggler-icon"},null,8,["node","expanded"])):i.expanded?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.node.expandedIcon?"span":"ChevronDownIcon"),d.mergeProps({key:1,class:"p-tree-toggler-icon"},i.getPTOptions("togglerIcon")),null,16)):(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.node.collapsedIcon?"span":"ChevronRightIcon"),d.mergeProps({key:2,class:"p-tree-toggler-icon"},i.getPTOptions("togglerIcon")),null,16))],16)),[[r]]),i.checkboxMode?(d.openBlock(),d.createElementBlock("div",d.mergeProps({key:0,class:"p-checkbox p-component","aria-hidden":"true"},i.getPTOptions("checkboxContainer")),[d.createElementVNode("div",d.mergeProps({class:i.checkboxClass,role:"checkbox"},i.getPTOptions("checkbox")),[n.templates.checkboxicon?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.templates.checkboxicon),{key:0,checked:i.checked,partialChecked:i.partialChecked,class:"p-checkbox-icon"},null,8,["checked","partialChecked"])):(d.openBlock(),d.createBlock(d.resolveDynamicComponent(i.checked?"CheckIcon":i.partialChecked?"MinusIcon":null),d.mergeProps({key:1,class:"p-checkbox-icon"},i.getPTOptions("checkboxIcon")),null,16))],16)],16)):d.createCommentVNode("",!0),d.createElementVNode("span",d.mergeProps({class:i.icon},i.getPTOptions("nodeIcon")),null,16),d.createElementVNode("span",d.mergeProps({class:"p-treenode-label"},i.getPTOptions("label")),[n.templates[n.node.type]||n.templates.default?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.templates[n.node.type]||n.templates.default),{key:0,node:n.node},null,8,["node"])):(d.openBlock(),d.createElementBlock(d.Fragment,{key:1},[d.createTextVNode(d.toDisplayString(i.label(n.node)),1)],64))],16)],16),i.hasChildren&&i.expanded?(d.openBlock(),d.createElementBlock("ul",d.mergeProps({key:0,class:"p-treenode-children",role:"group"},e.ptm("subgroup")),[(d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(n.node.children,(t=>(d.openBlock(),d.createBlock(s,{key:t.key,node:t,templates:n.templates,level:n.level+1,expandedKeys:n.expandedKeys,onNodeToggle:i.onChildNodeToggle,onNodeClick:i.onChildNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:i.propagateUp,pt:e.pt},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange","pt"])))),128))],16)):d.createCommentVNode("",!0)],16,b)};var C={name:"Tree",extends:h.default,emits:["node-expand","node-collapse","update:expandedKeys","update:selectionKeys","node-select","node-unselect"],props:{value:{type:null,default:null},expandedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},metaKeySelection:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},loadingIcon:{type:String,default:void 0},filter:{type:Boolean,default:!1},filterBy:{type:String,default:"label"},filterMode:{type:String,default:"lenient"},filterPlaceholder:{type:String,default:null},filterLocale:{type:String,default:void 0},scrollHeight:{type:String,default:null},level:{type:Number,default:0},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},data(){return{d_expandedKeys:this.expandedKeys||{},filterValue:null}},watch:{expandedKeys(e){this.d_expandedKeys=e}},methods:{onNodeToggle(e){const t=e.key;this.d_expandedKeys[t]?(delete this.d_expandedKeys[t],this.$emit("node-collapse",e)):(this.d_expandedKeys[t]=!0,this.$emit("node-expand",e)),this.d_expandedKeys={...this.d_expandedKeys},this.$emit("update:expandedKeys",this.d_expandedKeys)},onNodeClick(e){if(null!=this.selectionMode&&!1!==e.node.selectable){const t=!e.nodeTouched&&this.metaKeySelection?this.handleSelectionWithMetaKey(e):this.handleSelectionWithoutMetaKey(e);this.$emit("update:selectionKeys",t)}},onCheckboxChange(e){this.$emit("update:selectionKeys",e.selectionKeys),e.check?this.$emit("node-select",e.node):this.$emit("node-unselect",e.node)},handleSelectionWithMetaKey(e){const t=e.originalEvent,n=e.node,o=t.metaKey||t.ctrlKey;let l;return this.isNodeSelected(n)&&o?(this.isSingleSelectionMode()?l={}:(l={...this.selectionKeys},delete l[n.key]),this.$emit("node-unselect",n)):(this.isSingleSelectionMode()?l={}:this.isMultipleSelectionMode()&&(l=o&&this.selectionKeys?{...this.selectionKeys}:{}),l[n.key]=!0,this.$emit("node-select",n)),l},handleSelectionWithoutMetaKey(e){const t=e.node,n=this.isNodeSelected(t);let o;return this.isSingleSelectionMode()?n?(o={},this.$emit("node-unselect",t)):(o={},o[t.key]=!0,this.$emit("node-select",t)):n?(o={...this.selectionKeys},delete o[t.key],this.$emit("node-unselect",t)):(o=this.selectionKeys?{...this.selectionKeys}:{},o[t.key]=!0,this.$emit("node-select",t)),o},isSingleSelectionMode(){return"single"===this.selectionMode},isMultipleSelectionMode(){return"multiple"===this.selectionMode},isNodeSelected(e){return!(!this.selectionMode||!this.selectionKeys)&&!0===this.selectionKeys[e.key]},isChecked(e){return!!this.selectionKeys&&(this.selectionKeys[e.key]&&this.selectionKeys[e.key].checked)},isNodeLeaf:e=>!1!==e.leaf&&!(e.children&&e.children.length),onFilterKeydown(e){13===e.which&&e.preventDefault()},findFilteredNodes(e,t){if(e){let n=!1;if(e.children){let o=[...e.children];e.children=[];for(let l of o){let o={...l};this.isFilterMatched(o,t)&&(n=!0,e.children.push(o))}}if(n)return!0}},isFilterMatched(e,{searchFields:t,filterText:n,strict:l}){let i=!1;for(let l of t){String(o.ObjectUtils.resolveFieldData(e,l)).toLocaleLowerCase(this.filterLocale).indexOf(n)>-1&&(i=!0)}return(!i||l&&!this.isNodeLeaf(e))&&(i=this.findFilteredNodes(e,{searchFields:t,filterText:n,strict:l})||i),i}},computed:{containerClass(){return["p-tree p-component",{"p-tree-selectable":null!=this.selectionMode,"p-tree-loading":this.loading,"p-tree-flex-scrollable":"flex"===this.scrollHeight}]},filteredValue(){let e=[];const t=this.filterBy.split(","),n=this.filterValue.trim().toLocaleLowerCase(this.filterLocale),o="strict"===this.filterMode;for(let l of this.value){let i={...l},s={searchFields:t,filterText:n,strict:o};(o&&(this.findFilteredNodes(i,s)||this.isFilterMatched(i,s))||!o&&(this.isFilterMatched(i,s)||this.findFilteredNodes(i,s)))&&e.push(i)}return e},valueToRender(){return this.filterValue&&this.filterValue.trim().length>0?this.filteredValue:this.value}},components:{TreeNode:x,SearchIcon:p.default,SpinnerIcon:u.default}};const v=["placeholder"],K=["aria-labelledby","aria-label"];return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===n&&o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-tree-container {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    overflow: auto;\n}\n.p-treenode-children {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n}\n.p-tree-wrapper {\n    overflow: auto;\n}\n.p-treenode-selectable {\n    cursor: pointer;\n    user-select: none;\n}\n.p-tree-toggler {\n    cursor: pointer;\n    user-select: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n    flex-shrink: 0;\n}\n.p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n    visibility: hidden;\n}\n.p-treenode-content {\n    display: flex;\n    align-items: center;\n}\n.p-tree-filter {\n    width: 100%;\n}\n.p-tree-filter-container {\n    position: relative;\n    display: block;\n    width: 100%;\n}\n.p-tree-filter-icon {\n    position: absolute;\n    top: 50%;\n    margin-top: -0.5rem;\n}\n.p-tree-loading {\n    position: relative;\n    min-height: 4rem;\n}\n.p-tree .p-tree-loading-overlay {\n    position: absolute;\n    z-index: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-tree-flex-scrollable {\n    display: flex;\n    flex: 1;\n    height: 100%;\n    flex-direction: column;\n}\n.p-tree-flex-scrollable .p-tree-wrapper {\n    flex: 1;\n}\n"),C.render=function(e,t,n,o,l,i){const s=d.resolveComponent("SpinnerIcon"),r=d.resolveComponent("SearchIcon"),c=d.resolveComponent("TreeNode");return d.openBlock(),d.createElementBlock("div",d.mergeProps({class:i.containerClass},e.ptm("root")),[n.loading?(d.openBlock(),d.createElementBlock("div",d.mergeProps({key:0,class:"p-tree-loading-overlay p-component-overlay"},e.ptm("loadingOverlay")),[d.renderSlot(e.$slots,"loadingicon",{},(()=>[n.loadingIcon?(d.openBlock(),d.createElementBlock("i",d.mergeProps({key:0,class:["p-tree-loading-icon pi-spin",n.loadingIcon]},e.ptm("loadingIcon")),null,16)):(d.openBlock(),d.createBlock(s,d.mergeProps({key:1,spin:"",class:"p-tree-loading-icon"},e.ptm("loadingIcon")),null,16))]))],16)):d.createCommentVNode("",!0),n.filter?(d.openBlock(),d.createElementBlock("div",d.mergeProps({key:1,class:"p-tree-filter-container"},e.ptm("filterContainer")),[d.withDirectives(d.createElementVNode("input",d.mergeProps({"onUpdate:modelValue":t[0]||(t[0]=e=>l.filterValue=e),type:"text",autocomplete:"off",class:"p-tree-filter p-inputtext p-component",placeholder:n.filterPlaceholder,onKeydown:t[1]||(t[1]=(...e)=>i.onFilterKeydown&&i.onFilterKeydown(...e))},e.ptm("input")),null,16,v),[[d.vModelText,l.filterValue]]),d.renderSlot(e.$slots,"searchicon",{},(()=>[d.createVNode(r,d.mergeProps({class:"p-tree-filter-icon"},e.ptm("searchIcon")),null,16)]))],16)):d.createCommentVNode("",!0),d.createElementVNode("div",d.mergeProps({class:"p-tree-wrapper",style:{maxHeight:n.scrollHeight}},e.ptm("wrapper")),[d.createElementVNode("ul",d.mergeProps({class:"p-tree-container",role:"tree","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},e.ptm("container")),[(d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(i.valueToRender,((t,o)=>(d.openBlock(),d.createBlock(c,{key:t.key,node:t,templates:e.$slots,level:n.level+1,index:o,expandedKeys:l.d_expandedKeys,onNodeToggle:i.onNodeToggle,onNodeClick:i.onNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:i.onCheckboxChange,pt:e.pt},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange","pt"])))),128))],16,K)],16)],16)},C}(primevue.basecomponent,primevue.icons.search,primevue.icons.spinner,primevue.utils,primevue.icons.check,primevue.icons.chevrondown,primevue.icons.chevronright,primevue.icons.minus,primevue.ripple,Vue);
+this.primevue=this.primevue||{},this.primevue.tree=function(e,t,n,o,r,i,l,c,a,s,d){"use strict";function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=u(e),h=u(t),f=u(o),y=u(i),g=u(l),m=u(c),b=u(a),k=u(s),v=r.useStyle("\n.p-tree-container {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    overflow: auto;\n}\n\n.p-treenode-children {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n}\n\n.p-tree-wrapper {\n    overflow: auto;\n}\n\n.p-treenode-selectable {\n    cursor: pointer;\n    user-select: none;\n}\n\n.p-tree-toggler {\n    cursor: pointer;\n    user-select: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n    flex-shrink: 0;\n}\n\n.p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n    visibility: hidden;\n}\n\n.p-treenode-content {\n    display: flex;\n    align-items: center;\n}\n\n.p-tree-filter {\n    width: 100%;\n}\n\n.p-tree-filter-container {\n    position: relative;\n    display: block;\n    width: 100%;\n}\n\n.p-tree-filter-icon {\n    position: absolute;\n    top: 50%;\n    margin-top: -0.5rem;\n}\n\n.p-tree-loading {\n    position: relative;\n    min-height: 4rem;\n}\n\n.p-tree .p-tree-loading-overlay {\n    position: absolute;\n    z-index: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-tree-flex-scrollable {\n    display: flex;\n    flex: 1;\n    height: 100%;\n    flex-direction: column;\n}\n\n.p-tree-flex-scrollable .p-tree-wrapper {\n    flex: 1;\n}\n",{name:"tree",manual:!0}),x={name:"BaseTree",extends:f.default,props:{value:{type:null,default:null},expandedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},metaKeySelection:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},loadingIcon:{type:String,default:void 0},filter:{type:Boolean,default:!1},filterBy:{type:String,default:"label"},filterMode:{type:String,default:"lenient"},filterPlaceholder:{type:String,default:null},filterLocale:{type:String,default:void 0},scrollHeight:{type:String,default:null},level:{type:Number,default:0},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},css:{classes:{root:function(e){var t=e.props;return["p-tree p-component",{"p-tree-selectable":null!=t.selectionMode,"p-tree-loading":t.loading,"p-tree-flex-scrollable":"flex"===t.scrollHeight}]},loadingOverlay:"p-tree-loading-overlay p-component-overlay",loadingIcon:"p-tree-loading-icon",filterContainer:"p-tree-filter-container",input:"p-tree-filter p-inputtext p-component",searchIcon:"p-tree-filter-icon",wrapper:"p-tree-wrapper",container:"p-tree-container",node:function(e){return["p-treenode",{"p-treenode-leaf":e.instance.leaf}]},content:function(e){var t=e.instance;return["p-treenode-content",t.node.styleClass,{"p-treenode-selectable":t.selectable,"p-highlight":t.checkboxMode?t.checked:t.selected}]},toggler:"p-tree-toggler p-link",togglerIcon:"p-tree-toggler-icon",checkboxContainer:"p-checkbox p-component",checkbox:function(e){var t=e.instance;return["p-checkbox-box",{"p-highlight":t.checked,"p-indeterminate":t.partialChecked}]},checkboxIcon:"p-checkbox-icon",nodeIcon:function(e){return["p-treenode-icon",e.instance.node.icon]},label:"p-treenode-label",subgroup:"p-treenode-children"},loadStyle:v.load},provide:function(){return{$parentInstance:this}}};function C(e){return C="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},C(e)}function S(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=E(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var o=0,r=function(){};return{s:r,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:r}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,l=!0,c=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return l=e.done,e},e:function(e){c=!0,i=e},f:function(){try{l||null==n.return||n.return()}finally{if(c)throw i}}}}function w(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function K(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?w(Object(n),!0).forEach((function(t){N(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):w(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function N(e,t,n){return(t=T(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function T(e){var t=I(e,"string");return"symbol"===C(t)?t:String(t)}function I(e,t){if("object"!==C(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==C(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function O(e){return B(e)||M(e)||E(e)||P()}function P(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function E(e,t){if(e){if("string"==typeof e)return A(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?A(e,t):void 0}}function M(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function B(e){if(Array.isArray(e))return A(e)}function A(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var D={name:"TreeNode",hostName:"Tree",extends:f.default,emits:["node-toggle","node-click","checkbox-change"],props:{node:{type:null,default:null},expandedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},templates:{type:null,default:null},level:{type:Number,default:null},index:{type:Number,default:null}},nodeTouched:!1,toggleClicked:!1,mounted:function(){this.setAllNodesTabIndexes()},methods:{toggle:function(){this.$emit("node-toggle",this.node),this.toggleClicked=!0},label:function(e){return"function"==typeof e.label?e.label():e.label},onChildNodeToggle:function(e){this.$emit("node-toggle",e)},getPTOptions:function(e){return this.ptm(e,{context:{expanded:this.expanded,selected:this.selected,checked:this.checked}})},onClick:function(e){this.toggleClicked||n.DomHandler.getAttribute(e.target,'[data-pc-section="toggler"]')||n.DomHandler.getAttribute(e.target.parentElement,'[data-pc-section="toggler"]')?this.toggleClicked=!1:(this.isCheckboxSelectionMode()?this.toggleCheckbox():this.$emit("node-click",{originalEvent:e,nodeTouched:this.nodeTouched,node:this.node}),this.nodeTouched=!1)},onChildNodeClick:function(e){this.$emit("node-click",e)},onTouchEnd:function(){this.nodeTouched=!0},onKeyDown:function(e){if(this.isSameNode(e))switch(e.code){case"Tab":this.onTabKey(e);break;case"ArrowDown":this.onArrowDown(e);break;case"ArrowUp":this.onArrowUp(e);break;case"ArrowRight":this.onArrowRight(e);break;case"ArrowLeft":this.onArrowLeft(e);break;case"Enter":case"Space":this.onEnterKey(e)}},onArrowDown:function(e){var t="toggler"===e.target.getAttribute("data-pc-section")?e.target.closest('[role="treeitem"]'):e.target,n=t.children[1];if(n)this.focusRowChange(t,n.children[0]);else if(t.nextElementSibling)this.focusRowChange(t,t.nextElementSibling);else{var o=this.findNextSiblingOfAncestor(t);o&&this.focusRowChange(t,o)}e.preventDefault()},onArrowUp:function(e){var t=e.target;if(t.previousElementSibling)this.focusRowChange(t,t.previousElementSibling,this.findLastVisibleDescendant(t.previousElementSibling));else{var n=this.getParentNodeElement(t);n&&this.focusRowChange(t,n)}e.preventDefault()},onArrowRight:function(e){var t=this;this.leaf||this.expanded||(e.currentTarget.tabIndex=-1,this.$emit("node-toggle",this.node),this.$nextTick((function(){t.onArrowDown(e)})))},onArrowLeft:function(e){var t=n.DomHandler.findSingle(e.currentTarget,'[data-pc-section="toggler"]');if(0===this.level&&!this.expanded)return!1;if(this.expanded&&!this.leaf)return t.click(),!1;var o=this.findBeforeClickableNode(e.currentTarget);o&&this.focusRowChange(e.currentTarget,o)},onEnterKey:function(e){this.setTabIndexForSelectionMode(e,this.nodeTouched),this.onClick(e),e.preventDefault()},onTabKey:function(){this.setAllNodesTabIndexes()},setAllNodesTabIndexes:function(){var e=n.DomHandler.find(this.$refs.currentNode.closest('[data-pc-section="container"]'),'[role="treeitem"]'),t=O(e).some((function(e){return"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")}));(O(e).forEach((function(e){e.tabIndex=-1})),t)?O(e).filter((function(e){return"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")}))[0].tabIndex=0:O(e)[0].tabIndex=0},setTabIndexForSelectionMode:function(e,t){if(null!==this.selectionMode){var o=O(n.DomHandler.find(this.$refs.currentNode.parentElement,'[role="treeitem"]'));e.currentTarget.tabIndex=!1===t?-1:0,o.every((function(e){return-1===e.tabIndex}))&&(o[0].tabIndex=0)}},focusRowChange:function(e,t,n){e.tabIndex="-1",t.tabIndex="0",this.focusNode(n||t)},findBeforeClickableNode:function(e){var t=e.closest("ul").closest("li");if(t){var o=n.DomHandler.findSingle(t,"button");return o&&"hidden"!==o.style.visibility?t:this.findBeforeClickableNode(e.previousElementSibling)}return null},toggleCheckbox:function(){var e=this.selectionKeys?K({},this.selectionKeys):{},t=!this.checked;this.propagateDown(this.node,t,e),this.$emit("checkbox-change",{node:this.node,check:t,selectionKeys:e})},propagateDown:function(e,t,n){if(t?n[e.key]={checked:!0,partialChecked:!1}:delete n[e.key],e.children&&e.children.length){var o,r=S(e.children);try{for(r.s();!(o=r.n()).done;){this.propagateDown(o.value,t,n)}}catch(e){r.e(e)}finally{r.f()}}},propagateUp:function(e){var t,n=e.check,o=K({},e.selectionKeys),r=0,i=!1,l=S(this.node.children);try{for(l.s();!(t=l.n()).done;){var c=t.value;o[c.key]&&o[c.key].checked?r++:o[c.key]&&o[c.key].partialChecked&&(i=!0)}}catch(e){l.e(e)}finally{l.f()}n&&r===this.node.children.length?o[this.node.key]={checked:!0,partialChecked:!1}:(n||delete o[this.node.key],i||r>0&&r!==this.node.children.length?o[this.node.key]={checked:!1,partialChecked:!0}:delete o[this.node.key]),this.$emit("checkbox-change",{node:e.node,check:e.check,selectionKeys:o})},onChildCheckboxChange:function(e){this.$emit("checkbox-change",e)},findNextSiblingOfAncestor:function(e){var t=this.getParentNodeElement(e);return t?t.nextElementSibling?t.nextElementSibling:this.findNextSiblingOfAncestor(t):null},findLastVisibleDescendant:function(e){var t=e.children[1];return t?this.findLastVisibleDescendant(t.children[t.children.length-1]):e},getParentNodeElement:function(e){var t=e.parentElement.parentElement;return"treeitem"===n.DomHandler.getAttribute(t,"role")?t:null},focusNode:function(e){e.focus()},isCheckboxSelectionMode:function(){return"checkbox"===this.selectionMode},isSameNode:function(e){return e.currentTarget&&(e.currentTarget.isSameNode(e.target)||e.currentTarget.isSameNode(e.target.closest('[role="treeitem"]')))}},computed:{hasChildren:function(){return this.node.children&&this.node.children.length>0},expanded:function(){return this.expandedKeys&&!0===this.expandedKeys[this.node.key]},leaf:function(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},selectable:function(){return!1!==this.node.selectable&&null!=this.selectionMode},selected:function(){return!(!this.selectionMode||!this.selectionKeys)&&!0===this.selectionKeys[this.node.key]},checkboxMode:function(){return"checkbox"===this.selectionMode&&!1!==this.node.selectable},checked:function(){return!!this.selectionKeys&&(this.selectionKeys[this.node.key]&&this.selectionKeys[this.node.key].checked)},partialChecked:function(){return!!this.selectionKeys&&(this.selectionKeys[this.node.key]&&this.selectionKeys[this.node.key].partialChecked)},ariaChecked:function(){return"single"===this.selectionMode||"multiple"===this.selectionMode?this.selected:void 0},ariaSelected:function(){return this.checkboxMode?this.checked:void 0}},components:{ChevronDownIcon:g.default,ChevronRightIcon:m.default,CheckIcon:y.default,MinusIcon:b.default},directives:{ripple:k.default}},j=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level","aria-checked","tabindex"],$=["data-p-highlight","data-p-selectable"],V=["data-p-checked","data-p-partialchecked"];function F(e){return F="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},F(e)}function L(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=H(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var o=0,r=function(){};return{s:r,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:r}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,l=!0,c=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return l=e.done,e},e:function(e){c=!0,i=e},f:function(){try{l||null==n.return||n.return()}finally{if(c)throw i}}}}function R(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function H(e,t){if(e){if("string"==typeof e)return z(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?z(e,t):void 0}}function U(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function _(e){if(Array.isArray(e))return z(e)}function z(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function W(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function q(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?W(Object(n),!0).forEach((function(t){G(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):W(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function G(e,t,n){return(t=J(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function J(e){var t=Q(e,"string");return"symbol"===F(t)?t:String(t)}function Q(e,t){if("object"!==F(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==F(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}D.render=function(e,t,n,o,r,i){var l=d.resolveComponent("TreeNode",!0),c=d.resolveDirective("ripple");return d.openBlock(),d.createElementBlock("li",d.mergeProps({ref:"currentNode",class:e.cx("node"),role:"treeitem","aria-label":i.label(n.node),"aria-selected":i.ariaSelected,"aria-expanded":i.expanded,"aria-setsize":n.node.children?n.node.children.length:0,"aria-posinset":n.index+1,"aria-level":n.level,"aria-checked":i.ariaChecked,tabindex:0===n.index?0:-1,onKeydown:t[3]||(t[3]=function(){return i.onKeyDown&&i.onKeyDown.apply(i,arguments)})},1===n.level?i.getPTOptions("node"):e.ptm("subgroup")),[d.createElementVNode("div",d.mergeProps({class:e.cx("content"),onClick:t[1]||(t[1]=function(){return i.onClick&&i.onClick.apply(i,arguments)}),onTouchend:t[2]||(t[2]=function(){return i.onTouchEnd&&i.onTouchEnd.apply(i,arguments)}),style:n.node.style},i.getPTOptions("content"),{"data-p-highlight":i.checkboxMode?i.checked:i.selected,"data-p-selectable":i.selectable}),[d.withDirectives((d.openBlock(),d.createElementBlock("button",d.mergeProps({type:"button",class:e.cx("toggler"),onClick:t[0]||(t[0]=function(){return i.toggle&&i.toggle.apply(i,arguments)}),tabindex:"-1","aria-hidden":"true"},i.getPTOptions("toggler")),[n.templates.togglericon?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.templates.togglericon),{key:0,node:n.node,expanded:i.expanded,class:d.normalizeClass(e.cx("togglerIcon"))},null,8,["node","expanded","class"])):i.expanded?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.node.expandedIcon?"span":"ChevronDownIcon"),d.mergeProps({key:1,class:e.cx("togglerIcon")},i.getPTOptions("togglerIcon")),null,16,["class"])):(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.node.collapsedIcon?"span":"ChevronRightIcon"),d.mergeProps({key:2,class:e.cx("togglerIcon")},i.getPTOptions("togglerIcon")),null,16,["class"]))],16)),[[c]]),i.checkboxMode?(d.openBlock(),d.createElementBlock("div",d.mergeProps({key:0,class:e.cx("checkboxContainer"),"aria-hidden":"true"},i.getPTOptions("checkboxContainer")),[d.createElementVNode("div",d.mergeProps({class:e.cx("checkbox"),role:"checkbox"},i.getPTOptions("checkbox"),{"data-p-checked":i.checked,"data-p-partialchecked":i.partialChecked}),[n.templates.checkboxicon?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.templates.checkboxicon),{key:0,checked:i.checked,partialChecked:i.partialChecked,class:d.normalizeClass(e.cx("checkboxIcon"))},null,8,["checked","partialChecked","class"])):(d.openBlock(),d.createBlock(d.resolveDynamicComponent(i.checked?"CheckIcon":i.partialChecked?"MinusIcon":null),d.mergeProps({key:1,class:e.cx("checkboxIcon")},i.getPTOptions("checkboxIcon")),null,16,["class"]))],16,V)],16)):d.createCommentVNode("",!0),d.createElementVNode("span",d.mergeProps({class:e.cx("nodeIcon")},i.getPTOptions("nodeIcon")),null,16),d.createElementVNode("span",d.mergeProps({class:e.cx("label")},i.getPTOptions("label")),[n.templates[n.node.type]||n.templates.default?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(n.templates[n.node.type]||n.templates.default),{key:0,node:n.node},null,8,["node"])):(d.openBlock(),d.createElementBlock(d.Fragment,{key:1},[d.createTextVNode(d.toDisplayString(i.label(n.node)),1)],64))],16)],16,$),i.hasChildren&&i.expanded?(d.openBlock(),d.createElementBlock("ul",d.mergeProps({key:0,class:e.cx("subgroup"),role:"group"},e.ptm("subgroup")),[(d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(n.node.children,(function(t){return d.openBlock(),d.createBlock(l,{key:t.key,node:t,templates:n.templates,level:n.level+1,expandedKeys:n.expandedKeys,onNodeToggle:i.onChildNodeToggle,onNodeClick:i.onChildNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:i.propagateUp,pt:e.pt},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange","pt"])})),128))],16)):d.createCommentVNode("",!0)],16,j)};var X={name:"Tree",extends:x,emits:["node-expand","node-collapse","update:expandedKeys","update:selectionKeys","node-select","node-unselect"],data:function(){return{d_expandedKeys:this.expandedKeys||{},filterValue:null}},watch:{expandedKeys:function(e){this.d_expandedKeys=e}},methods:{onNodeToggle:function(e){var t=e.key;this.d_expandedKeys[t]?(delete this.d_expandedKeys[t],this.$emit("node-collapse",e)):(this.d_expandedKeys[t]=!0,this.$emit("node-expand",e)),this.d_expandedKeys=q({},this.d_expandedKeys),this.$emit("update:expandedKeys",this.d_expandedKeys)},onNodeClick:function(e){if(null!=this.selectionMode&&!1!==e.node.selectable){var t=!e.nodeTouched&&this.metaKeySelection?this.handleSelectionWithMetaKey(e):this.handleSelectionWithoutMetaKey(e);this.$emit("update:selectionKeys",t)}},onCheckboxChange:function(e){this.$emit("update:selectionKeys",e.selectionKeys),this.$emit(e.check?"node-select":"node-unselect",e.node)},handleSelectionWithMetaKey:function(e){var t,n=e.originalEvent,o=e.node,r=n.metaKey||n.ctrlKey;return this.isNodeSelected(o)&&r?(this.isSingleSelectionMode()?t={}:delete(t=q({},this.selectionKeys))[o.key],this.$emit("node-unselect",o)):(this.isSingleSelectionMode()?t={}:this.isMultipleSelectionMode()&&(t=r&&this.selectionKeys?q({},this.selectionKeys):{}),t[o.key]=!0,this.$emit("node-select",o)),t},handleSelectionWithoutMetaKey:function(e){var t,n=e.node,o=this.isNodeSelected(n);return this.isSingleSelectionMode()?o?(t={},this.$emit("node-unselect",n)):((t={})[n.key]=!0,this.$emit("node-select",n)):o?(delete(t=q({},this.selectionKeys))[n.key],this.$emit("node-unselect",n)):((t=this.selectionKeys?q({},this.selectionKeys):{})[n.key]=!0,this.$emit("node-select",n)),t},isSingleSelectionMode:function(){return"single"===this.selectionMode},isMultipleSelectionMode:function(){return"multiple"===this.selectionMode},isNodeSelected:function(e){return!(!this.selectionMode||!this.selectionKeys)&&!0===this.selectionKeys[e.key]},isChecked:function(e){return!!this.selectionKeys&&(this.selectionKeys[e.key]&&this.selectionKeys[e.key].checked)},isNodeLeaf:function(e){return!1!==e.leaf&&!(e.children&&e.children.length)},onFilterKeydown:function(e){13===e.which&&e.preventDefault()},findFilteredNodes:function(e,t){if(e){var n=!1;if(e.children){var o=_(c=e.children)||U(c)||H(c)||R();e.children=[];var r,i=L(o);try{for(i.s();!(r=i.n()).done;){var l=q({},r.value);this.isFilterMatched(l,t)&&(n=!0,e.children.push(l))}}catch(e){i.e(e)}finally{i.f()}}if(n)return!0}var c},isFilterMatched:function(e,t){var o,r=t.searchFields,i=t.filterText,l=t.strict,c=!1,a=L(r);try{for(a.s();!(o=a.n()).done;){String(n.ObjectUtils.resolveFieldData(e,o.value)).toLocaleLowerCase(this.filterLocale).indexOf(i)>-1&&(c=!0)}}catch(e){a.e(e)}finally{a.f()}return(!c||l&&!this.isNodeLeaf(e))&&(c=this.findFilteredNodes(e,{searchFields:r,filterText:i,strict:l})||c),c}},computed:{filteredValue:function(){var e,t=[],n=this.filterBy.split(","),o=this.filterValue.trim().toLocaleLowerCase(this.filterLocale),r="strict"===this.filterMode,i=L(this.value);try{for(i.s();!(e=i.n()).done;){var l=q({},e.value),c={searchFields:n,filterText:o,strict:r};(r&&(this.findFilteredNodes(l,c)||this.isFilterMatched(l,c))||!r&&(this.isFilterMatched(l,c)||this.findFilteredNodes(l,c)))&&t.push(l)}}catch(e){i.e(e)}finally{i.f()}return t},valueToRender:function(){return this.filterValue&&this.filterValue.trim().length>0?this.filteredValue:this.value}},components:{TreeNode:D,SearchIcon:p.default,SpinnerIcon:h.default}},Y=["placeholder"],Z=["aria-labelledby","aria-label"];return X.render=function(e,t,n,o,r,i){var l=d.resolveComponent("SpinnerIcon"),c=d.resolveComponent("SearchIcon"),a=d.resolveComponent("TreeNode");return d.openBlock(),d.createElementBlock("div",d.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"tree"}),[e.loading?(d.openBlock(),d.createElementBlock("div",d.mergeProps({key:0,class:e.cx("loadingOverlay")},e.ptm("loadingOverlay")),[d.renderSlot(e.$slots,"loadingicon",{class:d.normalizeClass(e.cx("loadingIcon"))},(function(){return[e.loadingIcon?(d.openBlock(),d.createElementBlock("i",d.mergeProps({key:0,class:[e.cx("loadingIcon"),"pi-spin",e.loadingIcon]},e.ptm("loadingIcon")),null,16)):(d.openBlock(),d.createBlock(l,d.mergeProps({key:1,spin:"",class:e.cx("loadingIcon")},e.ptm("loadingIcon")),null,16,["class"]))]}))],16)):d.createCommentVNode("",!0),e.filter?(d.openBlock(),d.createElementBlock("div",d.mergeProps({key:1,class:e.cx("filterContainer")},e.ptm("filterContainer")),[d.withDirectives(d.createElementVNode("input",d.mergeProps({"onUpdate:modelValue":t[0]||(t[0]=function(e){return r.filterValue=e}),type:"text",autocomplete:"off",class:e.cx("input"),placeholder:e.filterPlaceholder,onKeydown:t[1]||(t[1]=function(){return i.onFilterKeydown&&i.onFilterKeydown.apply(i,arguments)})},e.ptm("input")),null,16,Y),[[d.vModelText,r.filterValue]]),d.renderSlot(e.$slots,"searchicon",{class:d.normalizeClass(e.cx("searchIcon"))},(function(){return[d.createVNode(c,d.mergeProps({class:e.cx("searchIcon")},e.ptm("searchIcon")),null,16,["class"])]}))],16)):d.createCommentVNode("",!0),d.createElementVNode("div",d.mergeProps({class:e.cx("wrapper"),style:{maxHeight:e.scrollHeight}},e.ptm("wrapper")),[d.createElementVNode("ul",d.mergeProps({class:e.cx("container"),role:"tree","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},e.ptm("container")),[(d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(i.valueToRender,(function(t,n){return d.openBlock(),d.createBlock(a,{key:t.key,node:t,templates:e.$slots,level:e.level+1,index:n,expandedKeys:r.d_expandedKeys,onNodeToggle:i.onNodeToggle,onNodeClick:i.onNodeClick,selectionMode:e.selectionMode,selectionKeys:e.selectionKeys,onCheckboxChange:i.onCheckboxChange,pt:e.pt},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange","pt"])})),128))],16,Z)],16)],16)},X}(primevue.icons.search,primevue.icons.spinner,primevue.utils,primevue.basecomponent,primevue.usestyle,primevue.icons.check,primevue.icons.chevrondown,primevue.icons.chevronright,primevue.icons.minus,primevue.ripple,Vue);

package/treeselect/BaseTreeSelect.vue

@@ -0,0 +1,184 @@
+<script>
+import BaseComponent from 'primevue/basecomponent';
+import { useStyle } from 'primevue/usestyle';
+
+const styles = `
+.p-treeselect {
+    display: inline-flex;
+    cursor: pointer;
+    user-select: none;
+}
+
+.p-treeselect-trigger {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+}
+
+.p-treeselect-label-container {
+    overflow: hidden;
+    flex: 1 1 auto;
+    cursor: pointer;
+}
+
+.p-treeselect-label {
+    display: block;
+    white-space: nowrap;
+    cursor: pointer;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.p-treeselect-label-empty {
+    overflow: hidden;
+    visibility: hidden;
+}
+
+.p-treeselect-token {
+    cursor: default;
+    display: inline-flex;
+    align-items: center;
+    flex: 0 0 auto;
+}
+
+.p-treeselect .p-treeselect-panel {
+    min-width: 100%;
+}
+
+.p-treeselect-items-wrapper {
+    overflow: auto;
+}
+
+.p-fluid .p-treeselect {
+    display: flex;
+}
+`;
+
+const inlineStyles = {
+    root: ({ props }) => ({ position: props.appendTo === 'self' ? 'relative' : undefined })
+};
+
+const classes = {
+    root: ({ instance, props }) => [
+        'p-treeselect p-component p-inputwrapper',
+        {
+            'p-treeselect-chip': props.display === 'chip',
+            'p-disabled': props.disabled,
+            'p-focus': instance.focused,
+            'p-inputwrapper-filled': !instance.emptyValue,
+            'p-inputwrapper-focus': instance.focused || instance.overlayVisible
+        }
+    ],
+    labelContainer: 'p-treeselect-label-container',
+    label: ({ instance, props }) => [
+        'p-treeselect-label',
+        {
+            'p-placeholder': instance.label === props.placeholder,
+            'p-treeselect-label-empty': !props.placeholder && instance.emptyValue
+        }
+    ],
+    token: 'p-treeselect-token',
+    tokenLabel: 'p-treeselect-token-label',
+    trigger: 'p-treeselect-trigger',
+    triggerIcon: 'p-treeselect-trigger-icon',
+    panel: ({ instance }) => [
+        'p-treeselect-panel p-component',
+        {
+            'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
+            'p-ripple-disabled': instance.$primevue.config.ripple === false
+        }
+    ],
+    wrapper: 'p-treeselect-items-wrapper',
+    emptyMessage: 'p-treeselect-empty-message'
+};
+
+const { load: loadStyle } = useStyle(styles, { name: 'treeselect', manual: true });
+
+export default {
+    name: 'BaseTreeSelect',
+    extends: BaseComponent,
+    props: {
+        modelValue: null,
+        options: Array,
+        scrollHeight: {
+            type: String,
+            default: '400px'
+        },
+        placeholder: {
+            type: String,
+            default: null
+        },
+        disabled: {
+            type: Boolean,
+            default: false
+        },
+        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: true
+        },
+        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
+        }
+    },
+    css: {
+        classes,
+        inlineStyles,
+        loadStyle
+    },
+    provide() {
+        return {
+            $parentInstance: this
+        };
+    }
+};
+</script>

package/treeselect/TreeSelect.d.ts

@@ -8,6 +8,7 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent';
 import { TreeExpandedKeys, TreeNode, TreePassThroughOptionType } from '../tree';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
@@ -17,6 +18,7 @@ export declare type TreeSelectPassThroughOptionType = TreeSelectPassThroughAttri
  * Custom passthrough(pt) option method.
  */
 export interface TreeSelectPassThroughMethodOptions {
+    instance: any;
     props: TreeSelectProps;
     state: TreeSelectState;
 }
@@ -63,7 +65,7 @@ export interface TreeSelectPassThroughOptions {
      */
     wrapper?: TreeSelectPassThroughOptionType;
     /**
-     * Uses to pass attributes to the trigger's DOM element.
+     * Uses to pass attributes to Tree component.
      * @see {@link TreePassThroughOptionType}
      */
     tree?: TreePassThroughOptionType;
@@ -79,6 +81,11 @@ export interface TreeSelectPassThroughOptions {
      * Uses to pass attributes to the hidden input's DOM element.
      */
     hiddenInput?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
@@ -196,6 +203,11 @@ export interface TreeSelectProps {
      * @type {TreeSelectPassThroughOptions}
      */
     pt?: TreeSelectPassThroughOptions;
+    /**
+     * When enabled, it removes component related styles in the core.
+     * @defaultValue false
+     */
+    unstyled?: boolean;
 }
 
 /**
@@ -256,7 +268,12 @@ export interface TreeSelectSlots {
     /**
      * Custom indicator template.
      */
-    triggericon(): VNode[];
+    triggericon(scope: {
+        /**
+         * Style class of the icon.
+         */
+        class: string;
+    }): VNode[];
     /**
      * Custom item toggler icon template.
      * @param {Object} scope - item toggler icon slot's params.

package/treeselect/TreeSelect.vue

@@ -1,6 +1,6 @@
 <template>
-    <div ref="container" :class="containerClass" @click="onClick" v-bind="ptm('root')">
-        <div class="p-hidden-accessible" v-bind="ptm('hiddenInputWrapper')">
+    <div ref="container" :class="cx('root')" :style="sx('root')" @click="onClick" v-bind="ptm('root')" data-pc-name="treeselect">
+        <div class="p-hidden-accessible" v-bind="ptm('hiddenInputWrapper')" :data-p-hidden-accessible="true">
             <input
                 ref="focusInput"
                 :id="inputId"
@@ -22,31 +22,31 @@
                 v-bind="{ ...inputProps, ...ptm('hiddenInput') }"
             />
         </div>
-        <div class="p-treeselect-label-container" v-bind="ptm('labelContainer')">
-            <div :class="labelClass" v-bind="ptm('label')">
+        <div :class="cx('labelContainer')" v-bind="ptm('labelContainer')">
+            <div :class="cx('label')" v-bind="ptm('label')">
                 <slot name="value" :value="selectedNodes" :placeholder="placeholder">
                     <template v-if="display === 'comma'">
                         {{ label || 'empty' }}
                     </template>
                     <template v-else-if="display === 'chip'">
-                        <div v-for="node of selectedNodes" :key="node.key" class="p-treeselect-token" v-bind="ptm('token')">
-                            <span class="p-treeselect-token-label" v-bind="ptm('tokenLabel')">{{ node.label }}</span>
+                        <div v-for="node of selectedNodes" :key="node.key" :class="cx('token')" v-bind="ptm('token')">
+                            <span :class="cx('tokenLabel')" v-bind="ptm('tokenLabel')">{{ node.label }}</span>
                         </div>
                         <template v-if="emptyValue">{{ placeholder || 'empty' }}</template>
                     </template>
                 </slot>
             </div>
         </div>
-        <div class="p-treeselect-trigger" role="button" aria-haspopup="tree" :aria-expanded="overlayVisible" v-bind="ptm('trigger')">
-            <slot name="triggericon">
-                <component :is="'ChevronDownIcon'" class="p-treeselect-trigger-icon" v-bind="ptm('triggerIcon')" />
+        <div :class="cx('trigger')" role="button" aria-haspopup="tree" :aria-expanded="overlayVisible" v-bind="ptm('trigger')">
+            <slot name="triggericon" :class="cx('triggerIcon')">
+                <component :is="'ChevronDownIcon'" :class="cx('triggerIcon')" v-bind="ptm('triggerIcon')" />
             </slot>
         </div>
         <Portal :appendTo="appendTo">
             <transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
-                <div v-if="overlayVisible" :ref="overlayRef" @click="onOverlayClick" :class="panelStyleClass" @keydown="onOverlayKeydown" v-bind="{ ...panelProps, ...ptm('panel') }">
+                <div v-if="overlayVisible" :ref="overlayRef" @click="onOverlayClick" :class="[cx('panel'), panelClass]" @keydown="onOverlayKeydown" v-bind="{ ...panelProps, ...ptm('panel') }">
                     <slot name="header" :value="modelValue" :options="options"></slot>
-                    <div class="p-treeselect-items-wrapper" :style="{ 'max-height': scrollHeight }" v-bind="ptm('wrapper')">
+                    <div :class="cx('panel')" :style="{ 'max-height': scrollHeight }" v-bind="ptm('wrapper')">
                         <TSTree
                             ref="tree"
                             :id="listId"
@@ -62,7 +62,9 @@
                             @node-select="onNodeSelect"
                             @node-unselect="onNodeUnselect"
                             :level="0"
+                            :unstyled="unstyled"
                             :pt="ptm('tree')"
+                            data-pc-section="tree"
                         >
                             <template v-if="$slots.itemtogglericon" #togglericon="iconProps">
                                 <slot name="itemtogglericon" :node="iconProps.node" :expanded="iconProps.expanded" :class="iconProps.class" />
@@ -71,7 +73,7 @@
                                 <slot name="itemcheckboxicon" :checked="iconProps.checked" :partialChecked="iconProps.partialChecked" :class="iconProps.class" />
                             </template>
                         </TSTree>
-                        <div v-if="emptyOptions" class="p-treeselect-empty-message" v-bind="ptm('emptyMessage')">
+                        <div v-if="emptyOptions" :class="cx('emptyMessage')" v-bind="ptm('emptyMessage')">
                             <slot name="empty">{{ emptyMessageText }}</slot>
                         </div>
                     </div>
@@ -83,90 +85,18 @@
 </template>
 
 <script>
-import BaseComponent from 'primevue/basecomponent';
 import ChevronDownIcon from 'primevue/icons/chevrondown';
 import OverlayEventBus from 'primevue/overlayeventbus';
 import Portal from 'primevue/portal';
 import Ripple from 'primevue/ripple';
 import Tree from 'primevue/tree';
 import { ConnectedOverlayScrollHandler, DomHandler, UniqueComponentId, ZIndexUtils } from 'primevue/utils';
+import BaseTreeSelect from './BaseTreeSelect.vue';
 
 export default {
     name: 'TreeSelect',
-    extends: BaseComponent,
+    extends: BaseTreeSelect,
     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: false
-        },
-        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: true
-        },
-        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() {
         return {
             focused: false,
@@ -231,7 +161,7 @@ export default {
             this.$emit('blur', event);
         },
         onClick(event) {
-            if (!this.disabled && (!this.overlay || !this.overlay.contains(event.target)) && !DomHandler.hasClass(event.target, 'p-treeselect-close')) {
+            if (!this.disabled && (!this.overlay || !this.overlay.contains(event.target))) {
                 if (this.overlayVisible) this.hide();
                 else this.show();
 
@@ -282,7 +212,7 @@ export default {
             this.show();
 
             this.$nextTick(() => {
-                const treeNodeEl = DomHandler.find(this.$refs.tree.$el, '.p-treenode');
+                const treeNodeEl = DomHandler.find(this.$refs.tree.$el, '[data-pc-section="treeitem"]');
                 const focusedElement = [...treeNodeEl].find((item) => item.getAttribute('tabindex') === '0');
 
                 DomHandler.focus(focusedElement);
@@ -307,6 +237,8 @@ export default {
         },
         onOverlayEnter(el) {
             ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
+
+            DomHandler.addStyles(el, { position: 'absolute', top: '0', left: '0' });
             this.alignOverlay();
             this.bindOutsideClickListener();
             this.bindScrollListener();
@@ -459,7 +391,7 @@ export default {
         },
         scrollValueInView() {
             if (this.overlay) {
-                let selectedItem = DomHandler.findSingle(this.overlay, 'li.p-highlight');
+                let selectedItem = DomHandler.findSingle(this.overlay, '[data-p-highlight="true"]');
 
                 if (selectedItem) {
                     selectedItem.scrollIntoView({ block: 'nearest', inline: 'start' });
@@ -468,37 +400,6 @@ export default {
         }
     },
     computed: {
-        containerClass() {
-            return [
-                'p-treeselect p-component p-inputwrapper',
-                {
-                    'p-treeselect-chip': this.display === 'chip',
-                    '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': this.$primevue.config.inputStyle === 'filled',
-                    'p-ripple-disabled': this.$primevue.config.ripple === false
-                }
-            ];
-        },
         selectedNodes() {
             let selectedNodes = [];
 
@@ -538,63 +439,3 @@ export default {
     }
 };
 </script>
-
-<style>
-.p-treeselect {
-    display: inline-flex;
-    cursor: pointer;
-    position: relative;
-    user-select: none;
-}
-
-.p-treeselect-trigger {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
-}
-
-.p-treeselect-label-container {
-    overflow: hidden;
-    flex: 1 1 auto;
-    cursor: pointer;
-}
-
-.p-treeselect-label {
-    display: block;
-    white-space: nowrap;
-    cursor: pointer;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-.p-treeselect-label-empty {
-    overflow: hidden;
-    visibility: hidden;
-}
-
-.p-treeselect-token {
-    cursor: default;
-    display: inline-flex;
-    align-items: center;
-    flex: 0 0 auto;
-}
-
-.p-treeselect .p-treeselect-panel {
-    min-width: 100%;
-}
-
-.p-treeselect-panel {
-    position: absolute;
-    top: 0;
-    left: 0;
-}
-
-.p-treeselect-items-wrapper {
-    overflow: auto;
-}
-
-.p-fluid .p-treeselect {
-    display: flex;
-}
-</style>