primevue 3.20.0 → 3.22.0

package/tree/tree.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("primevue/ripple"),n=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i={name:"TreeNode",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,methods:{toggle(){this.$emit("node-toggle",this.node)},label:e=>"function"==typeof e.label?e.label():e.label,onChildNodeToggle(e){this.$emit("node-toggle",e)},onClick(t){e.DomHandler.hasClass(t.target,"p-tree-toggler")||e.DomHandler.hasClass(t.target.parentElement,"p-tree-toggler")||(this.isCheckboxSelectionMode()?this.toggleCheckbox():this.$emit("node-click",{originalEvent:t,nodeTouched:this.nodeTouched,node:this.node}),this.nodeTouched=!1)},onChildNodeClick(e){this.$emit("node-click",e)},onTouchEnd(){this.nodeTouched=!0},onKeyDown(e){const t=e.target.parentElement;switch(e.code){case"ArrowDown":var n=t.children[1];if(n)this.focusNode(n.children[0]);else{const e=t.nextElementSibling;if(e)this.focusNode(e);else{let e=this.findNextSiblingOfAncestor(t);e&&this.focusNode(e)}}break;case"ArrowUp":if(t.previousElementSibling)this.focusNode(this.findLastVisibleDescendant(t.previousElementSibling));else{let e=this.getParentNodeElement(t);e&&this.focusNode(e)}break;case"ArrowRight":case"ArrowLeft":this.$emit("node-toggle",this.node);break;case"Enter":case"Space":this.onClick(e)}e.preventDefault()},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 l of e.children)this.propagateDown(l,t,n)},propagateUp(e){let t=e.check,n={...e.selectionKeys},l=0,i=!1;for(let e of this.node.children)n[e.key]&&n[e.key].checked?l++:n[e.key]&&n[e.key].partialChecked&&(i=!0);t&&l===this.node.children.length?n[this.node.key]={checked:!0,partialChecked:!1}:(t||delete n[this.node.key],i||l>0&&l!==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(t){const n=t.parentElement.parentElement;return e.DomHandler.hasClass(n,"p-treenode")?n:null},focusNode(e){e.children[0].focus()},isCheckboxSelectionMode(){return"checkbox"===this.selectionMode}},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]},toggleIcon(){return["p-tree-toggler-icon pi pi-fw",this.expanded?this.node.expandedIcon||"pi-chevron-down":this.node.collapsedIcon||"pi-chevron-right"]},checkboxClass(){return["p-checkbox-box",{"p-highlight":this.checked,"p-indeterminate":this.partialChecked}]},checkboxIcon(){return["p-checkbox-icon",{"pi pi-check":this.checked,"pi pi-minus":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)}},directives:{ripple:l(t).default}};const o=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level"],s=["aria-expanded"],d={key:0,class:"p-checkbox p-component"},c=["aria-checked"],r={class:"p-treenode-label"},a={key:0,class:"p-treenode-children",role:"group"};i.render=function(e,t,l,i,h,p){const u=n.resolveComponent("TreeNode",!0),y=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("li",{class:n.normalizeClass(p.containerClass),role:"treeitem","aria-label":p.label(l.node),"aria-selected":p.selected,"aria-expanded":p.expanded,"aria-setsize":l.node.children?l.node.children.length:0,"aria-posinset":l.index+1,"aria-level":l.level},[n.createElementVNode("div",{class:n.normalizeClass(p.contentClass),tabindex:"0",role:"treeitem","aria-expanded":p.expanded,onClick:t[1]||(t[1]=(...e)=>p.onClick&&p.onClick(...e)),onKeydown:t[2]||(t[2]=(...e)=>p.onKeyDown&&p.onKeyDown(...e)),onTouchend:t[3]||(t[3]=(...e)=>p.onTouchEnd&&p.onTouchEnd(...e)),style:n.normalizeStyle(l.node.style)},[n.withDirectives((n.openBlock(),n.createElementBlock("button",{type:"button",class:"p-tree-toggler p-link",onClick:t[0]||(t[0]=(...e)=>p.toggle&&p.toggle(...e)),tabindex:"-1"},[n.createElementVNode("span",{class:n.normalizeClass(p.toggleIcon)},null,2)])),[[y]]),p.checkboxMode?(n.openBlock(),n.createElementBlock("div",d,[n.createElementVNode("div",{class:n.normalizeClass(p.checkboxClass),role:"checkbox","aria-checked":p.checked},[n.createElementVNode("span",{class:n.normalizeClass(p.checkboxIcon)},null,2)],10,c)])):n.createCommentVNode("",!0),n.createElementVNode("span",{class:n.normalizeClass(p.icon)},null,2),n.createElementVNode("span",r,[l.templates[l.node.type]||l.templates.default?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(l.templates[l.node.type]||l.templates.default),{key:0,node:l.node},null,8,["node"])):(n.openBlock(),n.createElementBlock(n.Fragment,{key:1},[n.createTextVNode(n.toDisplayString(p.label(l.node)),1)],64))])],46,s),p.hasChildren&&p.expanded?(n.openBlock(),n.createElementBlock("ul",a,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(l.node.children,(e=>(n.openBlock(),n.createBlock(u,{key:e.key,node:e,templates:l.templates,level:l.level+1,expandedKeys:l.expandedKeys,onNodeToggle:p.onChildNodeToggle,onNodeClick:p.onChildNodeClick,selectionMode:l.selectionMode,selectionKeys:l.selectionKeys,onCheckboxChange:p.propagateUp},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])):n.createCommentVNode("",!0)],10,o)};var h={name:"Tree",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:"pi pi-spinner"},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}},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,l=t.metaKey||t.ctrlKey;let i;return this.isNodeSelected(n)&&l?(this.isSingleSelectionMode()?i={}:(i={...this.selectionKeys},delete i[n.key]),this.$emit("node-unselect",n)):(this.isSingleSelectionMode()?i={}:this.isMultipleSelectionMode()&&(i=l&&this.selectionKeys?{...this.selectionKeys}:{}),i[n.key]=!0,this.$emit("node-select",n)),i},handleSelectionWithoutMetaKey(e){const t=e.node,n=this.isNodeSelected(t);let l;return this.isSingleSelectionMode()?n?(l={},this.$emit("node-unselect",t)):(l={},l[t.key]=!0,this.$emit("node-select",t)):n?(l={...this.selectionKeys},delete l[t.key],this.$emit("node-unselect",t)):(l=this.selectionKeys?{...this.selectionKeys}:{},l[t.key]=!0,this.$emit("node-select",t)),l},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 l=[...e.children];e.children=[];for(let i of l){let l={...i};this.isFilterMatched(l,t)&&(n=!0,e.children.push(l))}}if(n)return!0}},isFilterMatched(t,{searchFields:n,filterText:l,strict:i}){let o=!1;for(let i of n){String(e.ObjectUtils.resolveFieldData(t,i)).toLocaleLowerCase(this.filterLocale).indexOf(l)>-1&&(o=!0)}return(!o||i&&!this.isNodeLeaf(t))&&(o=this.findFilteredNodes(t,{searchFields:n,filterText:l,strict:i})||o),o}},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}]},loadingIconClass(){return["p-tree-loading-icon pi-spin",this.loadingIcon]},filteredValue(){let e=[];const t=this.filterBy.split(","),n=this.filterValue.trim().toLocaleLowerCase(this.filterLocale),l="strict"===this.filterMode;for(let i of this.value){let o={...i},s={searchFields:t,filterText:n,strict:l};(l&&(this.findFilteredNodes(o,s)||this.isFilterMatched(o,s))||!l&&(this.isFilterMatched(o,s)||this.findFilteredNodes(o,s)))&&e.push(o)}return e},valueToRender(){return this.filterValue&&this.filterValue.trim().length>0?this.filteredValue:this.value}},components:{TreeNode:i}};const p={key:0,class:"p-tree-loading-overlay p-component-overlay"},u={key:1,class:"p-tree-filter-container"},y=["placeholder"],m=n.createElementVNode("span",{class:"p-tree-filter-icon pi pi-search"},null,-1),k={class:"p-tree-container",role:"tree"};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var l=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&l.firstChild?l.insertBefore(i,l.firstChild):l.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.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    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-tree-toggler {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n    -ms-flex-negative: 0;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tree-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-tree-flex-scrollable .p-tree-wrapper {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n"),h.render=function(e,t,l,i,o,s){const d=n.resolveComponent("TreeNode");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(s.containerClass)},[l.loading?(n.openBlock(),n.createElementBlock("div",p,[n.createElementVNode("i",{class:n.normalizeClass(s.loadingIconClass)},null,2)])):n.createCommentVNode("",!0),l.filter?(n.openBlock(),n.createElementBlock("div",u,[n.withDirectives(n.createElementVNode("input",{"onUpdate:modelValue":t[0]||(t[0]=e=>o.filterValue=e),type:"text",autocomplete:"off",class:"p-tree-filter p-inputtext p-component",placeholder:l.filterPlaceholder,onKeydown:t[1]||(t[1]=(...e)=>s.onFilterKeydown&&s.onFilterKeydown(...e))},null,40,y),[[n.vModelText,o.filterValue]]),m])):n.createCommentVNode("",!0),n.createElementVNode("div",{class:"p-tree-wrapper",style:n.normalizeStyle({maxHeight:l.scrollHeight})},[n.createElementVNode("ul",k,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(s.valueToRender,((t,i)=>(n.openBlock(),n.createBlock(d,{key:t.key,node:t,templates:e.$slots,level:l.level+1,index:i,expandedKeys:o.d_expandedKeys,onNodeToggle:s.onNodeToggle,onNodeClick:s.onNodeClick,selectionMode:l.selectionMode,selectionKeys:l.selectionKeys,onCheckboxChange:s.onCheckboxChange},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])],4)],2)},module.exports=h;
+"use strict";var e=require("primevue/utils"),t=require("primevue/ripple"),n=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i={name:"TreeNode",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,mounted(){this.$refs.currentNode.closest(".p-treeselect-items-wrapper")&&this.setAllNodesTabIndexes()},methods:{toggle(){this.$emit("node-toggle",this.node)},label:e=>"function"==typeof e.label?e.label():e.label,onChildNodeToggle(e){this.$emit("node-toggle",e)},onClick(t){e.DomHandler.hasClass(t.target,"p-tree-toggler")||e.DomHandler.hasClass(t.target.parentElement,"p-tree-toggler")||(this.isCheckboxSelectionMode()?this.toggleCheckbox():this.$emit("node-click",{originalEvent:t,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(t){const n=e.DomHandler.findSingle(t.currentTarget,".p-tree-toggler");if(0===this.level&&!this.expanded)return!1;if(this.expanded&&!this.leaf)return n.click(),!1;const l=this.findBeforeClickableNode(t.currentTarget);l&&this.focusRowChange(t.currentTarget,l)},onEnterKey(e){this.setTabIndexForSelectionMode(e,this.nodeTouched),this.onClick(e),e.preventDefault()},onTabKey(){this.setAllNodesTabIndexes()},setAllNodesTabIndexes(){const t=e.DomHandler.find(this.$refs.currentNode.closest(".p-tree-container"),".p-treenode"),n=[...t].some((e=>"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")));if([...t].forEach((e=>{e.tabIndex=-1})),n){[...t].filter((e=>"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")))[0].tabIndex=0}else[...t][0].tabIndex=0},setTabIndexForSelectionMode(t,n){if(null!==this.selectionMode){const l=[...e.DomHandler.find(this.$refs.currentNode.parentElement,".p-treenode")];t.currentTarget.tabIndex=!1===n?-1:0,l.every((e=>-1===e.tabIndex))&&(l[0].tabIndex=0)}},focusRowChange(e,t,n){e.tabIndex="-1",t.tabIndex="0",this.focusNode(n||t)},findBeforeClickableNode(t){const n=t.closest("ul").closest("li");if(n){const l=e.DomHandler.findSingle(n,"button");return l&&"hidden"!==l.style.visibility?n:this.findBeforeClickableNode(t.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 l of e.children)this.propagateDown(l,t,n)},propagateUp(e){let t=e.check,n={...e.selectionKeys},l=0,i=!1;for(let e of this.node.children)n[e.key]&&n[e.key].checked?l++:n[e.key]&&n[e.key].partialChecked&&(i=!0);t&&l===this.node.children.length?n[this.node.key]={checked:!0,partialChecked:!1}:(t||delete n[this.node.key],i||l>0&&l!==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(t){const n=t.parentElement.parentElement;return e.DomHandler.hasClass(n,"p-treenode")?n: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]},toggleIcon(){return["p-tree-toggler-icon pi pi-fw",this.expanded?this.node.expandedIcon||"pi-chevron-down":this.node.collapsedIcon||"pi-chevron-right"]},checkboxClass(){return["p-checkbox-box",{"p-highlight":this.checked,"p-indeterminate":this.partialChecked}]},checkboxIcon(){return["p-checkbox-icon",{"pi pi-check":this.checked,"pi pi-minus":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}},directives:{ripple:l(t).default}};const o=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level","aria-checked","tabindex"],s={key:0,class:"p-checkbox p-component","aria-hidden":"true"},r={class:"p-treenode-label"},d={key:0,class:"p-treenode-children",role:"group"};i.render=function(e,t,l,i,c,a){const h=n.resolveComponent("TreeNode",!0),p=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("li",{ref:"currentNode",class:n.normalizeClass(a.containerClass),role:"treeitem","aria-label":a.label(l.node),"aria-selected":a.ariaSelected,"aria-expanded":a.expanded,"aria-setsize":l.node.children?l.node.children.length:0,"aria-posinset":l.index+1,"aria-level":l.level,"aria-checked":a.ariaChecked,tabindex:0===l.index?0:-1,onKeydown:t[3]||(t[3]=(...e)=>a.onKeyDown&&a.onKeyDown(...e))},[n.createElementVNode("div",{class:n.normalizeClass(a.contentClass),onClick:t[1]||(t[1]=(...e)=>a.onClick&&a.onClick(...e)),onTouchend:t[2]||(t[2]=(...e)=>a.onTouchEnd&&a.onTouchEnd(...e)),style:n.normalizeStyle(l.node.style)},[n.withDirectives((n.openBlock(),n.createElementBlock("button",{type:"button",class:"p-tree-toggler p-link",onClick:t[0]||(t[0]=(...e)=>a.toggle&&a.toggle(...e)),tabindex:"-1","aria-hidden":"true"},[n.createElementVNode("span",{class:n.normalizeClass(a.toggleIcon)},null,2)])),[[p]]),a.checkboxMode?(n.openBlock(),n.createElementBlock("div",s,[n.createElementVNode("div",{class:n.normalizeClass(a.checkboxClass),role:"checkbox"},[n.createElementVNode("span",{class:n.normalizeClass(a.checkboxIcon)},null,2)],2)])):n.createCommentVNode("",!0),n.createElementVNode("span",{class:n.normalizeClass(a.icon)},null,2),n.createElementVNode("span",r,[l.templates[l.node.type]||l.templates.default?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(l.templates[l.node.type]||l.templates.default),{key:0,node:l.node},null,8,["node"])):(n.openBlock(),n.createElementBlock(n.Fragment,{key:1},[n.createTextVNode(n.toDisplayString(a.label(l.node)),1)],64))])],38),a.hasChildren&&a.expanded?(n.openBlock(),n.createElementBlock("ul",d,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(l.node.children,(e=>(n.openBlock(),n.createBlock(h,{key:e.key,node:e,templates:l.templates,level:l.level+1,expandedKeys:l.expandedKeys,onNodeToggle:a.onChildNodeToggle,onNodeClick:a.onChildNodeClick,selectionMode:l.selectionMode,selectionKeys:l.selectionKeys,onCheckboxChange:a.propagateUp},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])):n.createCommentVNode("",!0)],42,o)};var c={name:"Tree",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:"pi pi-spinner"},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,l=t.metaKey||t.ctrlKey;let i;return this.isNodeSelected(n)&&l?(this.isSingleSelectionMode()?i={}:(i={...this.selectionKeys},delete i[n.key]),this.$emit("node-unselect",n)):(this.isSingleSelectionMode()?i={}:this.isMultipleSelectionMode()&&(i=l&&this.selectionKeys?{...this.selectionKeys}:{}),i[n.key]=!0,this.$emit("node-select",n)),i},handleSelectionWithoutMetaKey(e){const t=e.node,n=this.isNodeSelected(t);let l;return this.isSingleSelectionMode()?n?(l={},this.$emit("node-unselect",t)):(l={},l[t.key]=!0,this.$emit("node-select",t)):n?(l={...this.selectionKeys},delete l[t.key],this.$emit("node-unselect",t)):(l=this.selectionKeys?{...this.selectionKeys}:{},l[t.key]=!0,this.$emit("node-select",t)),l},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 l=[...e.children];e.children=[];for(let i of l){let l={...i};this.isFilterMatched(l,t)&&(n=!0,e.children.push(l))}}if(n)return!0}},isFilterMatched(t,{searchFields:n,filterText:l,strict:i}){let o=!1;for(let i of n){String(e.ObjectUtils.resolveFieldData(t,i)).toLocaleLowerCase(this.filterLocale).indexOf(l)>-1&&(o=!0)}return(!o||i&&!this.isNodeLeaf(t))&&(o=this.findFilteredNodes(t,{searchFields:n,filterText:l,strict:i})||o),o}},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}]},loadingIconClass(){return["p-tree-loading-icon pi-spin",this.loadingIcon]},filteredValue(){let e=[];const t=this.filterBy.split(","),n=this.filterValue.trim().toLocaleLowerCase(this.filterLocale),l="strict"===this.filterMode;for(let i of this.value){let o={...i},s={searchFields:t,filterText:n,strict:l};(l&&(this.findFilteredNodes(o,s)||this.isFilterMatched(o,s))||!l&&(this.isFilterMatched(o,s)||this.findFilteredNodes(o,s)))&&e.push(o)}return e},valueToRender(){return this.filterValue&&this.filterValue.trim().length>0?this.filteredValue:this.value}},components:{TreeNode:i}};const a={key:0,class:"p-tree-loading-overlay p-component-overlay"},h={key:1,class:"p-tree-filter-container"},p=["placeholder"],u=n.createElementVNode("span",{class:"p-tree-filter-icon pi pi-search"},null,-1),y=["aria-labelledby","aria-label"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var l=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&l.firstChild?l.insertBefore(i,l.firstChild):l.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.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,l,i,o,s){const r=n.resolveComponent("TreeNode");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(s.containerClass)},[l.loading?(n.openBlock(),n.createElementBlock("div",a,[n.createElementVNode("i",{class:n.normalizeClass(s.loadingIconClass)},null,2)])):n.createCommentVNode("",!0),l.filter?(n.openBlock(),n.createElementBlock("div",h,[n.withDirectives(n.createElementVNode("input",{"onUpdate:modelValue":t[0]||(t[0]=e=>o.filterValue=e),type:"text",autocomplete:"off",class:"p-tree-filter p-inputtext p-component",placeholder:l.filterPlaceholder,onKeydown:t[1]||(t[1]=(...e)=>s.onFilterKeydown&&s.onFilterKeydown(...e))},null,40,p),[[n.vModelText,o.filterValue]]),u])):n.createCommentVNode("",!0),n.createElementVNode("div",{class:"p-tree-wrapper",style:n.normalizeStyle({maxHeight:l.scrollHeight})},[n.createElementVNode("ul",{class:"p-tree-container",role:"tree","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(s.valueToRender,((t,i)=>(n.openBlock(),n.createBlock(r,{key:t.key,node:t,templates:e.$slots,level:l.level+1,index:i,expandedKeys:o.d_expandedKeys,onNodeToggle:s.onNodeToggle,onNodeClick:s.onNodeClick,selectionMode:l.selectionMode,selectionKeys:l.selectionKeys,onCheckboxChange:s.onCheckboxChange},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))],8,y)],4)],2)},module.exports=c;

package/tree/tree.esm.js

@@ -36,6 +36,13 @@ var script$1 = {
         }
     },
     nodeTouched: false,
+    mounted() {
+        const hasTreeSelectParent = this.$refs.currentNode.closest('.p-treeselect-items-wrapper');
+
+        if (hasTreeSelectParent) {
+            this.setAllNodesTabIndexes();
+        }
+    },
     methods: {
         toggle() {
             this.$emit('node-toggle', this.node);
@@ -70,56 +77,165 @@ var script$1 = {
             this.nodeTouched = true;
         },
         onKeyDown(event) {
-            const nodeElement = event.target.parentElement;
+            if (!this.isSameNode(event)) return;
 
             switch (event.code) {
-                case 'ArrowDown':
-                    var listElement = nodeElement.children[1];
-
-                    if (listElement) {
-                        this.focusNode(listElement.children[0]);
-                    } else {
-                        const nextNodeElement = nodeElement.nextElementSibling;
+                case 'Tab':
+                    this.onTabKey(event);
 
-                        if (nextNodeElement) {
-                            this.focusNode(nextNodeElement);
-                        } else {
-                            let nextSiblingAncestor = this.findNextSiblingOfAncestor(nodeElement);
+                    break;
 
-                            if (nextSiblingAncestor) {
-                                this.focusNode(nextSiblingAncestor);
-                            }
-                        }
-                    }
+                case 'ArrowDown':
+                    this.onArrowDown(event);
 
                     break;
 
                 case 'ArrowUp':
-                    if (nodeElement.previousElementSibling) {
-                        this.focusNode(this.findLastVisibleDescendant(nodeElement.previousElementSibling));
-                    } else {
-                        let parentNodeElement = this.getParentNodeElement(nodeElement);
-
-                        if (parentNodeElement) {
-                            this.focusNode(parentNodeElement);
-                        }
-                    }
+                    this.onArrowUp(event);
 
                     break;
 
                 case 'ArrowRight':
+                    this.onArrowRight(event);
+
+                    break;
+
                 case 'ArrowLeft':
-                    this.$emit('node-toggle', this.node);
+                    this.onArrowLeft(event);
+
                     break;
 
                 case 'Enter':
                 case 'Space':
-                    this.onClick(event);
+                    this.onEnterKey(event);
+
                     break;
             }
+        },
+        onArrowDown(event) {
+            const nodeElement = event.target;
+            const listElement = nodeElement.children[1];
+
+            if (listElement) {
+                this.focusRowChange(nodeElement, listElement.children[0]);
+            } else {
+                if (nodeElement.nextElementSibling) {
+                    this.focusRowChange(nodeElement, nodeElement.nextElementSibling);
+                } else {
+                    let nextSiblingAncestor = this.findNextSiblingOfAncestor(nodeElement);
+
+                    if (nextSiblingAncestor) {
+                        this.focusRowChange(nodeElement, nextSiblingAncestor);
+                    }
+                }
+            }
+
+            event.preventDefault();
+        },
+        onArrowUp(event) {
+            const nodeElement = event.target;
+
+            if (nodeElement.previousElementSibling) {
+                this.focusRowChange(nodeElement, nodeElement.previousElementSibling, this.findLastVisibleDescendant(nodeElement.previousElementSibling));
+            } else {
+                let parentNodeElement = this.getParentNodeElement(nodeElement);
+
+                if (parentNodeElement) {
+                    this.focusRowChange(nodeElement, parentNodeElement);
+                }
+            }
 
             event.preventDefault();
         },
+        onArrowRight(event) {
+            if (this.leaf || this.expanded) return;
+
+            event.currentTarget.tabIndex = -1;
+
+            this.$emit('node-toggle', this.node);
+            this.$nextTick(() => {
+                this.onArrowDown(event);
+            });
+        },
+        onArrowLeft(event) {
+            const togglerElement = DomHandler.findSingle(event.currentTarget, '.p-tree-toggler');
+
+            if (this.level === 0 && !this.expanded) {
+                return false;
+            }
+
+            if (this.expanded && !this.leaf) {
+                togglerElement.click();
+
+                return false;
+            }
+
+            const target = this.findBeforeClickableNode(event.currentTarget);
+
+            if (target) {
+                this.focusRowChange(event.currentTarget, target);
+            }
+        },
+        onEnterKey(event) {
+            this.setTabIndexForSelectionMode(event, this.nodeTouched);
+            this.onClick(event);
+
+            event.preventDefault();
+        },
+        onTabKey() {
+            this.setAllNodesTabIndexes();
+        },
+        setAllNodesTabIndexes() {
+            const nodes = DomHandler.find(this.$refs.currentNode.closest('.p-tree-container'), '.p-treenode');
+
+            const hasSelectedNode = [...nodes].some((node) => node.getAttribute('aria-selected') === 'true' || node.getAttribute('aria-checked') === 'true');
+
+            [...nodes].forEach((node) => {
+                node.tabIndex = -1;
+            });
+
+            if (hasSelectedNode) {
+                const selectedNodes = [...nodes].filter((node) => node.getAttribute('aria-selected') === 'true' || node.getAttribute('aria-checked') === 'true');
+
+                selectedNodes[0].tabIndex = 0;
+
+                return;
+            }
+
+            [...nodes][0].tabIndex = 0;
+        },
+        setTabIndexForSelectionMode(event, nodeTouched) {
+            if (this.selectionMode !== null) {
+                const elements = [...DomHandler.find(this.$refs.currentNode.parentElement, '.p-treenode')];
+
+                event.currentTarget.tabIndex = nodeTouched === false ? -1 : 0;
+
+                if (elements.every((element) => element.tabIndex === -1)) {
+                    elements[0].tabIndex = 0;
+                }
+            }
+        },
+        focusRowChange(firstFocusableRow, currentFocusedRow, lastVisibleDescendant) {
+            firstFocusableRow.tabIndex = '-1';
+            currentFocusedRow.tabIndex = '0';
+
+            this.focusNode(lastVisibleDescendant || currentFocusedRow);
+        },
+        findBeforeClickableNode(node) {
+            const parentListElement = node.closest('ul').closest('li');
+
+            if (parentListElement) {
+                const prevNodeButton = DomHandler.findSingle(parentListElement, 'button');
+
+                if (prevNodeButton && prevNodeButton.style.visibility !== 'hidden') {
+                    return parentListElement;
+                }
+
+                return this.findBeforeClickableNode(node.previousElementSibling);
+            }
+
+            return null;
+        },
         toggleCheckbox() {
             let _selectionKeys = this.selectionKeys ? { ...this.selectionKeys } : {};
             const _check = !this.checked;
@@ -200,10 +316,13 @@ var script$1 = {
             return DomHandler.hasClass(parentNodeElement, 'p-treenode') ? parentNodeElement : null;
         },
         focusNode(element) {
-            element.children[0].focus();
+            element.focus();
         },
         isCheckboxSelectionMode() {
             return this.selectionMode === 'checkbox';
+        },
+        isSameNode(event) {
+            return event.currentTarget && (event.currentTarget.isSameNode(event.target) || event.currentTarget.isSameNode(event.target.closest('.p-treenode')));
         }
     },
     computed: {
@@ -255,6 +374,12 @@ var script$1 = {
         },
         partialChecked() {
             return this.selectionKeys ? this.selectionKeys[this.node.key] && this.selectionKeys[this.node.key].partialChecked : false;
+        },
+        ariaChecked() {
+            return this.selectionMode === 'single' || this.selectionMode === 'multiple' ? this.selected : undefined;
+        },
+        ariaSelected() {
+            return this.checkboxMode ? this.checked : undefined;
         }
     },
     directives: {
@@ -262,15 +387,14 @@ var script$1 = {
     }
 };
 
-const _hoisted_1$1 = ["aria-label", "aria-selected", "aria-expanded", "aria-setsize", "aria-posinset", "aria-level"];
-const _hoisted_2$1 = ["aria-expanded"];
-const _hoisted_3$1 = {
+const _hoisted_1$1 = ["aria-label", "aria-selected", "aria-expanded", "aria-setsize", "aria-posinset", "aria-level", "aria-checked", "tabindex"];
+const _hoisted_2$1 = {
   key: 0,
-  class: "p-checkbox p-component"
+  class: "p-checkbox p-component",
+  "aria-hidden": "true"
 };
-const _hoisted_4$1 = ["aria-checked"];
-const _hoisted_5$1 = { class: "p-treenode-label" };
-const _hoisted_6 = {
+const _hoisted_3$1 = { class: "p-treenode-label" };
+const _hoisted_4$1 = {
   key: 0,
   class: "p-treenode-children",
   role: "group"
@@ -281,30 +405,31 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   const _directive_ripple = resolveDirective("ripple");
 
   return (openBlock(), createElementBlock("li", {
+    ref: "currentNode",
     class: normalizeClass($options.containerClass),
     role: "treeitem",
     "aria-label": $options.label($props.node),
-    "aria-selected": $options.selected,
+    "aria-selected": $options.ariaSelected,
     "aria-expanded": $options.expanded,
     "aria-setsize": $props.node.children ? $props.node.children.length : 0,
     "aria-posinset": $props.index + 1,
-    "aria-level": $props.level
+    "aria-level": $props.level,
+    "aria-checked": $options.ariaChecked,
+    tabindex: $props.index === 0 ? 0 : -1,
+    onKeydown: _cache[3] || (_cache[3] = (...args) => ($options.onKeyDown && $options.onKeyDown(...args)))
   }, [
     createElementVNode("div", {
       class: normalizeClass($options.contentClass),
-      tabindex: "0",
-      role: "treeitem",
-      "aria-expanded": $options.expanded,
       onClick: _cache[1] || (_cache[1] = (...args) => ($options.onClick && $options.onClick(...args))),
-      onKeydown: _cache[2] || (_cache[2] = (...args) => ($options.onKeyDown && $options.onKeyDown(...args))),
-      onTouchend: _cache[3] || (_cache[3] = (...args) => ($options.onTouchEnd && $options.onTouchEnd(...args))),
+      onTouchend: _cache[2] || (_cache[2] = (...args) => ($options.onTouchEnd && $options.onTouchEnd(...args))),
       style: normalizeStyle($props.node.style)
     }, [
       withDirectives((openBlock(), createElementBlock("button", {
         type: "button",
         class: "p-tree-toggler p-link",
         onClick: _cache[0] || (_cache[0] = (...args) => ($options.toggle && $options.toggle(...args))),
-        tabindex: "-1"
+        tabindex: "-1",
+        "aria-hidden": "true"
       }, [
         createElementVNode("span", {
           class: normalizeClass($options.toggleIcon)
@@ -313,22 +438,21 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
         [_directive_ripple]
       ]),
       ($options.checkboxMode)
-        ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
+        ? (openBlock(), createElementBlock("div", _hoisted_2$1, [
             createElementVNode("div", {
               class: normalizeClass($options.checkboxClass),
-              role: "checkbox",
-              "aria-checked": $options.checked
+              role: "checkbox"
             }, [
               createElementVNode("span", {
                 class: normalizeClass($options.checkboxIcon)
               }, null, 2)
-            ], 10, _hoisted_4$1)
+            ], 2)
           ]))
         : createCommentVNode("", true),
       createElementVNode("span", {
         class: normalizeClass($options.icon)
       }, null, 2),
-      createElementVNode("span", _hoisted_5$1, [
+      createElementVNode("span", _hoisted_3$1, [
         ($props.templates[$props.node.type] || $props.templates['default'])
           ? (openBlock(), createBlock(resolveDynamicComponent($props.templates[$props.node.type] || $props.templates['default']), {
               key: 0,
@@ -338,9 +462,9 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
               createTextVNode(toDisplayString($options.label($props.node)), 1)
             ], 64))
       ])
-    ], 46, _hoisted_2$1),
+    ], 38),
     ($options.hasChildren && $options.expanded)
-      ? (openBlock(), createElementBlock("ul", _hoisted_6, [
+      ? (openBlock(), createElementBlock("ul", _hoisted_4$1, [
           (openBlock(true), createElementBlock(Fragment, null, renderList($props.node.children, (childNode) => {
             return (openBlock(), createBlock(_component_TreeNode, {
               key: childNode.key,
@@ -357,7 +481,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
           }), 128))
         ]))
       : createCommentVNode("", true)
-  ], 10, _hoisted_1$1))
+  ], 42, _hoisted_1$1))
 }
 
 script$1.render = render$1;
@@ -421,6 +545,14 @@ var script = {
         level: {
             type: Number,
             default: 0
+        },
+        'aria-labelledby': {
+            type: String,
+            default: null
+        },
+        'aria-label': {
+            type: String,
+            default: null
         }
     },
     data() {
@@ -638,10 +770,7 @@ const _hoisted_2 = {
 };
 const _hoisted_3 = ["placeholder"];
 const _hoisted_4 = /*#__PURE__*/createElementVNode("span", { class: "p-tree-filter-icon pi pi-search" }, null, -1);
-const _hoisted_5 = {
-  class: "p-tree-container",
-  role: "tree"
-};
+const _hoisted_5 = ["aria-labelledby", "aria-label"];
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_TreeNode = resolveComponent("TreeNode");
@@ -675,7 +804,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       class: "p-tree-wrapper",
       style: normalizeStyle({ maxHeight: $props.scrollHeight })
     }, [
-      createElementVNode("ul", _hoisted_5, [
+      createElementVNode("ul", {
+        class: "p-tree-container",
+        role: "tree",
+        "aria-labelledby": _ctx.ariaLabelledby,
+        "aria-label": _ctx.ariaLabel
+      }, [
         (openBlock(true), createElementBlock(Fragment, null, renderList($options.valueToRender, (node, index) => {
           return (openBlock(), createBlock(_component_TreeNode, {
             key: node.key,
@@ -691,7 +825,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             onCheckboxChange: $options.onCheckboxChange
           }, null, 8, ["node", "templates", "level", "index", "expandedKeys", "onNodeToggle", "onNodeClick", "selectionMode", "selectionKeys", "onCheckboxChange"]))
         }), 128))
-      ])
+      ], 8, _hoisted_5)
     ], 4)
   ], 2))
 }
@@ -723,7 +857,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "\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    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-tree-toggler {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n    -ms-flex-negative: 0;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tree-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-tree-flex-scrollable .p-tree-wrapper {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n";
+var css_248z = "\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";
 styleInject(css_248z);
 
 script.render = render;

package/tree/tree.esm.min.js

@@ -1 +1 @@
-import{DomHandler as e,ObjectUtils as t}from"primevue/utils";import n from"primevue/ripple";import{resolveComponent as l,resolveDirective as i,openBlock as o,createElementBlock as s,normalizeClass as d,createElementVNode as c,normalizeStyle as r,withDirectives as a,createCommentVNode as h,createBlock as p,resolveDynamicComponent as u,Fragment as y,createTextVNode as f,toDisplayString as g,renderList as k,vModelText as x}from"vue";var m={name:"TreeNode",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,methods:{toggle(){this.$emit("node-toggle",this.node)},label:e=>"function"==typeof e.label?e.label():e.label,onChildNodeToggle(e){this.$emit("node-toggle",e)},onClick(t){e.hasClass(t.target,"p-tree-toggler")||e.hasClass(t.target.parentElement,"p-tree-toggler")||(this.isCheckboxSelectionMode()?this.toggleCheckbox():this.$emit("node-click",{originalEvent:t,nodeTouched:this.nodeTouched,node:this.node}),this.nodeTouched=!1)},onChildNodeClick(e){this.$emit("node-click",e)},onTouchEnd(){this.nodeTouched=!0},onKeyDown(e){const t=e.target.parentElement;switch(e.code){case"ArrowDown":var n=t.children[1];if(n)this.focusNode(n.children[0]);else{const e=t.nextElementSibling;if(e)this.focusNode(e);else{let e=this.findNextSiblingOfAncestor(t);e&&this.focusNode(e)}}break;case"ArrowUp":if(t.previousElementSibling)this.focusNode(this.findLastVisibleDescendant(t.previousElementSibling));else{let e=this.getParentNodeElement(t);e&&this.focusNode(e)}break;case"ArrowRight":case"ArrowLeft":this.$emit("node-toggle",this.node);break;case"Enter":case"Space":this.onClick(e)}e.preventDefault()},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 l of e.children)this.propagateDown(l,t,n)},propagateUp(e){let t=e.check,n={...e.selectionKeys},l=0,i=!1;for(let e of this.node.children)n[e.key]&&n[e.key].checked?l++:n[e.key]&&n[e.key].partialChecked&&(i=!0);t&&l===this.node.children.length?n[this.node.key]={checked:!0,partialChecked:!1}:(t||delete n[this.node.key],i||l>0&&l!==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(t){const n=t.parentElement.parentElement;return e.hasClass(n,"p-treenode")?n:null},focusNode(e){e.children[0].focus()},isCheckboxSelectionMode(){return"checkbox"===this.selectionMode}},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]},toggleIcon(){return["p-tree-toggler-icon pi pi-fw",this.expanded?this.node.expandedIcon||"pi-chevron-down":this.node.collapsedIcon||"pi-chevron-right"]},checkboxClass(){return["p-checkbox-box",{"p-highlight":this.checked,"p-indeterminate":this.partialChecked}]},checkboxIcon(){return["p-checkbox-icon",{"pi pi-check":this.checked,"pi pi-minus":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)}},directives:{ripple:n}};const b=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level"],K=["aria-expanded"],C={key:0,class:"p-checkbox p-component"},v=["aria-checked"],w={class:"p-treenode-label"},N={key:0,class:"p-treenode-children",role:"group"};m.render=function(e,t,n,x,m,S){const M=l("TreeNode",!0),T=i("ripple");return o(),s("li",{class:d(S.containerClass),role:"treeitem","aria-label":S.label(n.node),"aria-selected":S.selected,"aria-expanded":S.expanded,"aria-setsize":n.node.children?n.node.children.length:0,"aria-posinset":n.index+1,"aria-level":n.level},[c("div",{class:d(S.contentClass),tabindex:"0",role:"treeitem","aria-expanded":S.expanded,onClick:t[1]||(t[1]=(...e)=>S.onClick&&S.onClick(...e)),onKeydown:t[2]||(t[2]=(...e)=>S.onKeyDown&&S.onKeyDown(...e)),onTouchend:t[3]||(t[3]=(...e)=>S.onTouchEnd&&S.onTouchEnd(...e)),style:r(n.node.style)},[a((o(),s("button",{type:"button",class:"p-tree-toggler p-link",onClick:t[0]||(t[0]=(...e)=>S.toggle&&S.toggle(...e)),tabindex:"-1"},[c("span",{class:d(S.toggleIcon)},null,2)])),[[T]]),S.checkboxMode?(o(),s("div",C,[c("div",{class:d(S.checkboxClass),role:"checkbox","aria-checked":S.checked},[c("span",{class:d(S.checkboxIcon)},null,2)],10,v)])):h("",!0),c("span",{class:d(S.icon)},null,2),c("span",w,[n.templates[n.node.type]||n.templates.default?(o(),p(u(n.templates[n.node.type]||n.templates.default),{key:0,node:n.node},null,8,["node"])):(o(),s(y,{key:1},[f(g(S.label(n.node)),1)],64))])],46,K),S.hasChildren&&S.expanded?(o(),s("ul",N,[(o(!0),s(y,null,k(n.node.children,(e=>(o(),p(M,{key:e.key,node:e,templates:n.templates,level:n.level+1,expandedKeys:n.expandedKeys,onNodeToggle:S.onChildNodeToggle,onNodeClick:S.onChildNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:S.propagateUp},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])):h("",!0)],10,b)};var S={name:"Tree",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:"pi pi-spinner"},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}},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,l=t.metaKey||t.ctrlKey;let i;return this.isNodeSelected(n)&&l?(this.isSingleSelectionMode()?i={}:(i={...this.selectionKeys},delete i[n.key]),this.$emit("node-unselect",n)):(this.isSingleSelectionMode()?i={}:this.isMultipleSelectionMode()&&(i=l&&this.selectionKeys?{...this.selectionKeys}:{}),i[n.key]=!0,this.$emit("node-select",n)),i},handleSelectionWithoutMetaKey(e){const t=e.node,n=this.isNodeSelected(t);let l;return this.isSingleSelectionMode()?n?(l={},this.$emit("node-unselect",t)):(l={},l[t.key]=!0,this.$emit("node-select",t)):n?(l={...this.selectionKeys},delete l[t.key],this.$emit("node-unselect",t)):(l=this.selectionKeys?{...this.selectionKeys}:{},l[t.key]=!0,this.$emit("node-select",t)),l},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 l=[...e.children];e.children=[];for(let i of l){let l={...i};this.isFilterMatched(l,t)&&(n=!0,e.children.push(l))}}if(n)return!0}},isFilterMatched(e,{searchFields:n,filterText:l,strict:i}){let o=!1;for(let i of n){String(t.resolveFieldData(e,i)).toLocaleLowerCase(this.filterLocale).indexOf(l)>-1&&(o=!0)}return(!o||i&&!this.isNodeLeaf(e))&&(o=this.findFilteredNodes(e,{searchFields:n,filterText:l,strict:i})||o),o}},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}]},loadingIconClass(){return["p-tree-loading-icon pi-spin",this.loadingIcon]},filteredValue(){let e=[];const t=this.filterBy.split(","),n=this.filterValue.trim().toLocaleLowerCase(this.filterLocale),l="strict"===this.filterMode;for(let i of this.value){let o={...i},s={searchFields:t,filterText:n,strict:l};(l&&(this.findFilteredNodes(o,s)||this.isFilterMatched(o,s))||!l&&(this.isFilterMatched(o,s)||this.findFilteredNodes(o,s)))&&e.push(o)}return e},valueToRender(){return this.filterValue&&this.filterValue.trim().length>0?this.filteredValue:this.value}},components:{TreeNode:m}};const M={key:0,class:"p-tree-loading-overlay p-component-overlay"},T={key:1,class:"p-tree-filter-container"},$=["placeholder"],E=c("span",{class:"p-tree-filter-icon pi pi-search"},null,-1),F={class:"p-tree-container",role:"tree"};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var l=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&l.firstChild?l.insertBefore(i,l.firstChild):l.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.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    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-tree-toggler {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    overflow: hidden;\n    position: relative;\n    -ms-flex-negative: 0;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\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: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tree-flex-scrollable {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    height: 100%;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-tree-flex-scrollable .p-tree-wrapper {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n"),S.render=function(e,t,n,i,u,f){const g=l("TreeNode");return o(),s("div",{class:d(f.containerClass)},[n.loading?(o(),s("div",M,[c("i",{class:d(f.loadingIconClass)},null,2)])):h("",!0),n.filter?(o(),s("div",T,[a(c("input",{"onUpdate:modelValue":t[0]||(t[0]=e=>u.filterValue=e),type:"text",autocomplete:"off",class:"p-tree-filter p-inputtext p-component",placeholder:n.filterPlaceholder,onKeydown:t[1]||(t[1]=(...e)=>f.onFilterKeydown&&f.onFilterKeydown(...e))},null,40,$),[[x,u.filterValue]]),E])):h("",!0),c("div",{class:"p-tree-wrapper",style:r({maxHeight:n.scrollHeight})},[c("ul",F,[(o(!0),s(y,null,k(f.valueToRender,((t,l)=>(o(),p(g,{key:t.key,node:t,templates:e.$slots,level:n.level+1,index:l,expandedKeys:u.d_expandedKeys,onNodeToggle:f.onNodeToggle,onNodeClick:f.onNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:f.onCheckboxChange},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])],4)],2)};export{S as default};
+import{DomHandler as e,ObjectUtils as t}from"primevue/utils";import n from"primevue/ripple";import{resolveComponent as i,resolveDirective as l,openBlock as o,createElementBlock as s,normalizeClass as d,createElementVNode as r,normalizeStyle as a,withDirectives as c,createCommentVNode as h,createBlock as p,resolveDynamicComponent as u,Fragment as y,createTextVNode as g,toDisplayString as f,renderList as k,vModelText as b}from"vue";var x={name:"TreeNode",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,mounted(){this.$refs.currentNode.closest(".p-treeselect-items-wrapper")&&this.setAllNodesTabIndexes()},methods:{toggle(){this.$emit("node-toggle",this.node)},label:e=>"function"==typeof e.label?e.label():e.label,onChildNodeToggle(e){this.$emit("node-toggle",e)},onClick(t){e.hasClass(t.target,"p-tree-toggler")||e.hasClass(t.target.parentElement,"p-tree-toggler")||(this.isCheckboxSelectionMode()?this.toggleCheckbox():this.$emit("node-click",{originalEvent:t,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(t){const n=e.findSingle(t.currentTarget,".p-tree-toggler");if(0===this.level&&!this.expanded)return!1;if(this.expanded&&!this.leaf)return n.click(),!1;const i=this.findBeforeClickableNode(t.currentTarget);i&&this.focusRowChange(t.currentTarget,i)},onEnterKey(e){this.setTabIndexForSelectionMode(e,this.nodeTouched),this.onClick(e),e.preventDefault()},onTabKey(){this.setAllNodesTabIndexes()},setAllNodesTabIndexes(){const t=e.find(this.$refs.currentNode.closest(".p-tree-container"),".p-treenode"),n=[...t].some((e=>"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")));if([...t].forEach((e=>{e.tabIndex=-1})),n){[...t].filter((e=>"true"===e.getAttribute("aria-selected")||"true"===e.getAttribute("aria-checked")))[0].tabIndex=0}else[...t][0].tabIndex=0},setTabIndexForSelectionMode(t,n){if(null!==this.selectionMode){const i=[...e.find(this.$refs.currentNode.parentElement,".p-treenode")];t.currentTarget.tabIndex=!1===n?-1:0,i.every((e=>-1===e.tabIndex))&&(i[0].tabIndex=0)}},focusRowChange(e,t,n){e.tabIndex="-1",t.tabIndex="0",this.focusNode(n||t)},findBeforeClickableNode(t){const n=t.closest("ul").closest("li");if(n){const i=e.findSingle(n,"button");return i&&"hidden"!==i.style.visibility?n:this.findBeforeClickableNode(t.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 i of e.children)this.propagateDown(i,t,n)},propagateUp(e){let t=e.check,n={...e.selectionKeys},i=0,l=!1;for(let e of this.node.children)n[e.key]&&n[e.key].checked?i++:n[e.key]&&n[e.key].partialChecked&&(l=!0);t&&i===this.node.children.length?n[this.node.key]={checked:!0,partialChecked:!1}:(t||delete n[this.node.key],l||i>0&&i!==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(t){const n=t.parentElement.parentElement;return e.hasClass(n,"p-treenode")?n: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]},toggleIcon(){return["p-tree-toggler-icon pi pi-fw",this.expanded?this.node.expandedIcon||"pi-chevron-down":this.node.collapsedIcon||"pi-chevron-right"]},checkboxClass(){return["p-checkbox-box",{"p-highlight":this.checked,"p-indeterminate":this.partialChecked}]},checkboxIcon(){return["p-checkbox-icon",{"pi pi-check":this.checked,"pi pi-minus":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}},directives:{ripple:n}};const m=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level","aria-checked","tabindex"],C={key:0,class:"p-checkbox p-component","aria-hidden":"true"},K={class:"p-treenode-label"},v={key:0,class:"p-treenode-children",role:"group"};x.render=function(e,t,n,b,x,N){const S=i("TreeNode",!0),w=l("ripple");return o(),s("li",{ref:"currentNode",class:d(N.containerClass),role:"treeitem","aria-label":N.label(n.node),"aria-selected":N.ariaSelected,"aria-expanded":N.expanded,"aria-setsize":n.node.children?n.node.children.length:0,"aria-posinset":n.index+1,"aria-level":n.level,"aria-checked":N.ariaChecked,tabindex:0===n.index?0:-1,onKeydown:t[3]||(t[3]=(...e)=>N.onKeyDown&&N.onKeyDown(...e))},[r("div",{class:d(N.contentClass),onClick:t[1]||(t[1]=(...e)=>N.onClick&&N.onClick(...e)),onTouchend:t[2]||(t[2]=(...e)=>N.onTouchEnd&&N.onTouchEnd(...e)),style:a(n.node.style)},[c((o(),s("button",{type:"button",class:"p-tree-toggler p-link",onClick:t[0]||(t[0]=(...e)=>N.toggle&&N.toggle(...e)),tabindex:"-1","aria-hidden":"true"},[r("span",{class:d(N.toggleIcon)},null,2)])),[[w]]),N.checkboxMode?(o(),s("div",C,[r("div",{class:d(N.checkboxClass),role:"checkbox"},[r("span",{class:d(N.checkboxIcon)},null,2)],2)])):h("",!0),r("span",{class:d(N.icon)},null,2),r("span",K,[n.templates[n.node.type]||n.templates.default?(o(),p(u(n.templates[n.node.type]||n.templates.default),{key:0,node:n.node},null,8,["node"])):(o(),s(y,{key:1},[g(f(N.label(n.node)),1)],64))])],38),N.hasChildren&&N.expanded?(o(),s("ul",v,[(o(!0),s(y,null,k(n.node.children,(e=>(o(),p(S,{key:e.key,node:e,templates:n.templates,level:n.level+1,expandedKeys:n.expandedKeys,onNodeToggle:N.onChildNodeToggle,onNodeClick:N.onChildNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:N.propagateUp},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])):h("",!0)],42,m)};var N={name:"Tree",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:"pi pi-spinner"},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,i=t.metaKey||t.ctrlKey;let l;return this.isNodeSelected(n)&&i?(this.isSingleSelectionMode()?l={}:(l={...this.selectionKeys},delete l[n.key]),this.$emit("node-unselect",n)):(this.isSingleSelectionMode()?l={}:this.isMultipleSelectionMode()&&(l=i&&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 i;return this.isSingleSelectionMode()?n?(i={},this.$emit("node-unselect",t)):(i={},i[t.key]=!0,this.$emit("node-select",t)):n?(i={...this.selectionKeys},delete i[t.key],this.$emit("node-unselect",t)):(i=this.selectionKeys?{...this.selectionKeys}:{},i[t.key]=!0,this.$emit("node-select",t)),i},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 i=[...e.children];e.children=[];for(let l of i){let i={...l};this.isFilterMatched(i,t)&&(n=!0,e.children.push(i))}}if(n)return!0}},isFilterMatched(e,{searchFields:n,filterText:i,strict:l}){let o=!1;for(let l of n){String(t.resolveFieldData(e,l)).toLocaleLowerCase(this.filterLocale).indexOf(i)>-1&&(o=!0)}return(!o||l&&!this.isNodeLeaf(e))&&(o=this.findFilteredNodes(e,{searchFields:n,filterText:i,strict:l})||o),o}},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}]},loadingIconClass(){return["p-tree-loading-icon pi-spin",this.loadingIcon]},filteredValue(){let e=[];const t=this.filterBy.split(","),n=this.filterValue.trim().toLocaleLowerCase(this.filterLocale),i="strict"===this.filterMode;for(let l of this.value){let o={...l},s={searchFields:t,filterText:n,strict:i};(i&&(this.findFilteredNodes(o,s)||this.isFilterMatched(o,s))||!i&&(this.isFilterMatched(o,s)||this.findFilteredNodes(o,s)))&&e.push(o)}return e},valueToRender(){return this.filterValue&&this.filterValue.trim().length>0?this.filteredValue:this.value}},components:{TreeNode:x}};const S={key:0,class:"p-tree-loading-overlay p-component-overlay"},w={key:1,class:"p-tree-filter-container"},T=["placeholder"],M=r("span",{class:"p-tree-filter-icon pi pi-search"},null,-1),E=["aria-labelledby","aria-label"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===n&&i.firstChild?i.insertBefore(l,i.firstChild):i.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"),N.render=function(e,t,n,l,u,g){const f=i("TreeNode");return o(),s("div",{class:d(g.containerClass)},[n.loading?(o(),s("div",S,[r("i",{class:d(g.loadingIconClass)},null,2)])):h("",!0),n.filter?(o(),s("div",w,[c(r("input",{"onUpdate:modelValue":t[0]||(t[0]=e=>u.filterValue=e),type:"text",autocomplete:"off",class:"p-tree-filter p-inputtext p-component",placeholder:n.filterPlaceholder,onKeydown:t[1]||(t[1]=(...e)=>g.onFilterKeydown&&g.onFilterKeydown(...e))},null,40,T),[[b,u.filterValue]]),M])):h("",!0),r("div",{class:"p-tree-wrapper",style:a({maxHeight:n.scrollHeight})},[r("ul",{class:"p-tree-container",role:"tree","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},[(o(!0),s(y,null,k(g.valueToRender,((t,i)=>(o(),p(f,{key:t.key,node:t,templates:e.$slots,level:n.level+1,index:i,expandedKeys:u.d_expandedKeys,onNodeToggle:g.onNodeToggle,onNodeClick:g.onNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:g.onCheckboxChange},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))],8,E)],4)],2)};export{N as default};