primevue 3.28.0 → 3.29.0

package/tree/tree.js

@@ -1,9 +1,10 @@
 this.primevue = this.primevue || {};
-this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, ChevronDownIcon, ChevronRightIcon, MinusIcon, Ripple, vue) {
+this.primevue.tree = (function (BaseComponent, SearchIcon, SpinnerIcon, utils, CheckIcon, ChevronDownIcon, ChevronRightIcon, MinusIcon, Ripple, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
     var SearchIcon__default = /*#__PURE__*/_interopDefaultLegacy(SearchIcon);
     var SpinnerIcon__default = /*#__PURE__*/_interopDefaultLegacy(SpinnerIcon);
     var CheckIcon__default = /*#__PURE__*/_interopDefaultLegacy(CheckIcon);
@@ -14,6 +15,7 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
 
     var script$1 = {
         name: 'TreeNode',
+        extends: BaseComponent__default["default"],
         emits: ['node-toggle', 'node-click', 'checkbox-change'],
         props: {
             node: {
@@ -65,6 +67,15 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
             onChildNodeToggle(node) {
                 this.$emit('node-toggle', node);
             },
+            getPTOptions(key) {
+                return this.ptm(key, {
+                    context: {
+                        expanded: this.expanded,
+                        selected: this.selected,
+                        checked: this.checked
+                    }
+                });
+            },
             onClick(event) {
                 if (this.toggleClicked || utils.DomHandler.hasClass(event.target, 'p-tree-toggler') || utils.DomHandler.hasClass(event.target.parentElement, 'p-tree-toggler')) {
                     this.toggleClicked = false;
@@ -402,25 +413,14 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
     };
 
     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",
-      "aria-hidden": "true"
-    };
-    const _hoisted_3$1 = { class: "p-treenode-label" };
-    const _hoisted_4$1 = {
-      key: 0,
-      class: "p-treenode-children",
-      role: "group"
-    };
 
     function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       const _component_TreeNode = vue.resolveComponent("TreeNode", true);
       const _directive_ripple = vue.resolveDirective("ripple");
 
-      return (vue.openBlock(), vue.createElementBlock("li", {
+      return (vue.openBlock(), vue.createElementBlock("li", vue.mergeProps({
         ref: "currentNode",
-        class: vue.normalizeClass($options.containerClass),
+        class: $options.containerClass,
         role: "treeitem",
         "aria-label": $options.label($props.node),
         "aria-selected": $options.ariaSelected,
@@ -431,20 +431,20 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
         "aria-checked": $options.ariaChecked,
         tabindex: $props.index === 0 ? 0 : -1,
         onKeydown: _cache[3] || (_cache[3] = (...args) => ($options.onKeyDown && $options.onKeyDown(...args)))
-      }, [
-        vue.createElementVNode("div", {
-          class: vue.normalizeClass($options.contentClass),
+      }, $options.getPTOptions('node')), [
+        vue.createElementVNode("div", vue.mergeProps({
+          class: $options.contentClass,
           onClick: _cache[1] || (_cache[1] = (...args) => ($options.onClick && $options.onClick(...args))),
           onTouchend: _cache[2] || (_cache[2] = (...args) => ($options.onTouchEnd && $options.onTouchEnd(...args))),
-          style: vue.normalizeStyle($props.node.style)
-        }, [
-          vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
+          style: $props.node.style
+        }, $options.getPTOptions('content')), [
+          vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
             type: "button",
             class: "p-tree-toggler p-link",
             onClick: _cache[0] || (_cache[0] = (...args) => ($options.toggle && $options.toggle(...args))),
             tabindex: "-1",
             "aria-hidden": "true"
-          }, [
+          }, $options.getPTOptions('toggler')), [
             ($props.templates['togglericon'])
               ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates['togglericon']), {
                   key: 0,
@@ -453,23 +453,27 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
                   class: "p-tree-toggler-icon"
                 }, null, 8, ["node", "expanded"]))
               : ($options.expanded)
-                ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.node.expandedIcon ? 'span' : 'ChevronDownIcon'), {
+                ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.node.expandedIcon ? 'span' : 'ChevronDownIcon'), vue.mergeProps({
                     key: 1,
                     class: "p-tree-toggler-icon"
-                  }))
-                : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.node.collapsedIcon ? 'span' : 'ChevronRightIcon'), {
+                  }, $options.getPTOptions('togglerIcon')), null, 16))
+                : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.node.collapsedIcon ? 'span' : 'ChevronRightIcon'), vue.mergeProps({
                     key: 2,
                     class: "p-tree-toggler-icon"
-                  }))
-          ])), [
+                  }, $options.getPTOptions('togglerIcon')), null, 16))
+          ], 16)), [
             [_directive_ripple]
           ]),
           ($options.checkboxMode)
-            ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
-                vue.createElementVNode("div", {
-                  class: vue.normalizeClass($options.checkboxClass),
+            ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+                key: 0,
+                class: "p-checkbox p-component",
+                "aria-hidden": "true"
+              }, $options.getPTOptions('checkboxContainer')), [
+                vue.createElementVNode("div", vue.mergeProps({
+                  class: $options.checkboxClass,
                   role: "checkbox"
-                }, [
+                }, $options.getPTOptions('checkbox')), [
                   ($props.templates['checkboxicon'])
                     ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates['checkboxicon']), {
                         key: 0,
@@ -477,17 +481,15 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
                         partialChecked: $options.partialChecked,
                         class: "p-checkbox-icon"
                       }, null, 8, ["checked", "partialChecked"]))
-                    : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($options.checked ? 'CheckIcon' : $options.partialChecked ? 'MinusIcon' : null), {
+                    : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($options.checked ? 'CheckIcon' : $options.partialChecked ? 'MinusIcon' : null), vue.mergeProps({
                         key: 1,
                         class: "p-checkbox-icon"
-                      }))
-                ], 2)
-              ]))
+                      }, $options.getPTOptions('checkboxIcon')), null, 16))
+                ], 16)
+              ], 16))
             : vue.createCommentVNode("", true),
-          vue.createElementVNode("span", {
-            class: vue.normalizeClass($options.icon)
-          }, null, 2),
-          vue.createElementVNode("span", _hoisted_3$1, [
+          vue.createElementVNode("span", vue.mergeProps({ class: $options.icon }, $options.getPTOptions('nodeIcon')), null, 16),
+          vue.createElementVNode("span", vue.mergeProps({ class: "p-treenode-label" }, $options.getPTOptions('label')), [
             ($props.templates[$props.node.type] || $props.templates['default'])
               ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates[$props.node.type] || $props.templates['default']), {
                   key: 0,
@@ -496,10 +498,14 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
               : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
                   vue.createTextVNode(vue.toDisplayString($options.label($props.node)), 1)
                 ], 64))
-          ])
-        ], 38),
+          ], 16)
+        ], 16),
         ($options.hasChildren && $options.expanded)
-          ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_4$1, [
+          ? (vue.openBlock(), vue.createElementBlock("ul", vue.mergeProps({
+              key: 0,
+              class: "p-treenode-children",
+              role: "group"
+            }, _ctx.ptm('subgroup')), [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.node.children, (childNode) => {
                 return (vue.openBlock(), vue.createBlock(_component_TreeNode, {
                   key: childNode.key,
@@ -511,18 +517,20 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
                   onNodeClick: $options.onChildNodeClick,
                   selectionMode: $props.selectionMode,
                   selectionKeys: $props.selectionKeys,
-                  onCheckboxChange: $options.propagateUp
-                }, null, 8, ["node", "templates", "level", "expandedKeys", "onNodeToggle", "onNodeClick", "selectionMode", "selectionKeys", "onCheckboxChange"]))
+                  onCheckboxChange: $options.propagateUp,
+                  pt: _ctx.pt
+                }, null, 8, ["node", "templates", "level", "expandedKeys", "onNodeToggle", "onNodeClick", "selectionMode", "selectionKeys", "onCheckboxChange", "pt"]))
               }), 128))
-            ]))
+            ], 16))
           : vue.createCommentVNode("", true)
-      ], 42, _hoisted_1$1))
+      ], 16, _hoisted_1$1))
     }
 
     script$1.render = render$1;
 
     var script = {
         name: 'Tree',
+        extends: BaseComponent__default["default"],
         emits: ['node-expand', 'node-collapse', 'update:expandedKeys', 'update:selectionKeys', 'node-select', 'node-unselect'],
         props: {
             value: {
@@ -794,68 +802,64 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
         }
     };
 
-    const _hoisted_1 = {
-      key: 0,
-      class: "p-tree-loading-overlay p-component-overlay"
-    };
-    const _hoisted_2 = {
-      key: 1,
-      class: "p-tree-filter-container"
-    };
-    const _hoisted_3 = ["placeholder"];
-    const _hoisted_4 = ["aria-labelledby", "aria-label"];
+    const _hoisted_1 = ["placeholder"];
+    const _hoisted_2 = ["aria-labelledby", "aria-label"];
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       const _component_SpinnerIcon = vue.resolveComponent("SpinnerIcon");
       const _component_SearchIcon = vue.resolveComponent("SearchIcon");
       const _component_TreeNode = vue.resolveComponent("TreeNode");
 
-      return (vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass($options.containerClass)
-      }, [
+      return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({ class: $options.containerClass }, _ctx.ptm('root')), [
         ($props.loading)
-          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+          ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              key: 0,
+              class: "p-tree-loading-overlay p-component-overlay"
+            }, _ctx.ptm('loadingOverlay')), [
               vue.renderSlot(_ctx.$slots, "loadingicon", {}, () => [
                 ($props.loadingIcon)
-                  ? (vue.openBlock(), vue.createElementBlock("i", {
+                  ? (vue.openBlock(), vue.createElementBlock("i", vue.mergeProps({
                       key: 0,
-                      class: vue.normalizeClass(['p-tree-loading-icon pi-spin', $props.loadingIcon])
-                    }, null, 2))
-                  : (vue.openBlock(), vue.createBlock(_component_SpinnerIcon, {
+                      class: ['p-tree-loading-icon pi-spin', $props.loadingIcon]
+                    }, _ctx.ptm('loadingIcon')), null, 16))
+                  : (vue.openBlock(), vue.createBlock(_component_SpinnerIcon, vue.mergeProps({
                       key: 1,
                       spin: "",
                       class: "p-tree-loading-icon"
-                    }))
+                    }, _ctx.ptm('loadingIcon')), null, 16))
               ])
-            ]))
+            ], 16))
           : vue.createCommentVNode("", true),
         ($props.filter)
-          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
-              vue.withDirectives(vue.createElementVNode("input", {
+          ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              key: 1,
+              class: "p-tree-filter-container"
+            }, _ctx.ptm('filterContainer')), [
+              vue.withDirectives(vue.createElementVNode("input", vue.mergeProps({
                 "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (($data.filterValue) = $event)),
                 type: "text",
                 autocomplete: "off",
                 class: "p-tree-filter p-inputtext p-component",
                 placeholder: $props.filterPlaceholder,
                 onKeydown: _cache[1] || (_cache[1] = (...args) => ($options.onFilterKeydown && $options.onFilterKeydown(...args)))
-              }, null, 40, _hoisted_3), [
+              }, _ctx.ptm('input')), null, 16, _hoisted_1), [
                 [vue.vModelText, $data.filterValue]
               ]),
               vue.renderSlot(_ctx.$slots, "searchicon", {}, () => [
-                vue.createVNode(_component_SearchIcon, { class: "p-tree-filter-icon" })
+                vue.createVNode(_component_SearchIcon, vue.mergeProps({ class: "p-tree-filter-icon" }, _ctx.ptm('searchIcon')), null, 16)
               ])
-            ]))
+            ], 16))
           : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", {
+        vue.createElementVNode("div", vue.mergeProps({
           class: "p-tree-wrapper",
-          style: vue.normalizeStyle({ maxHeight: $props.scrollHeight })
-        }, [
-          vue.createElementVNode("ul", {
+          style: { maxHeight: $props.scrollHeight }
+        }, _ctx.ptm('wrapper')), [
+          vue.createElementVNode("ul", vue.mergeProps({
             class: "p-tree-container",
             role: "tree",
             "aria-labelledby": _ctx.ariaLabelledby,
             "aria-label": _ctx.ariaLabel
-          }, [
+          }, _ctx.ptm('container')), [
             (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.valueToRender, (node, index) => {
               return (vue.openBlock(), vue.createBlock(_component_TreeNode, {
                 key: node.key,
@@ -868,12 +872,13 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
                 onNodeClick: $options.onNodeClick,
                 selectionMode: $props.selectionMode,
                 selectionKeys: $props.selectionKeys,
-                onCheckboxChange: $options.onCheckboxChange
-              }, null, 8, ["node", "templates", "level", "index", "expandedKeys", "onNodeToggle", "onNodeClick", "selectionMode", "selectionKeys", "onCheckboxChange"]))
+                onCheckboxChange: $options.onCheckboxChange,
+                pt: _ctx.pt
+              }, null, 8, ["node", "templates", "level", "index", "expandedKeys", "onNodeToggle", "onNodeClick", "selectionMode", "selectionKeys", "onCheckboxChange", "pt"]))
             }), 128))
-          ], 8, _hoisted_4)
-        ], 4)
-      ], 2))
+          ], 16, _hoisted_2)
+        ], 16)
+      ], 16))
     }
 
     function styleInject(css, ref) {
@@ -910,4 +915,4 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, CheckIcon, Chevr
 
     return script;
 
-})(primevue.icons.search, primevue.icons.spinner, primevue.utils, primevue.icons.check, primevue.icons.chevrondown, primevue.icons.chevronright, primevue.icons.minus, primevue.ripple, Vue);
+})(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);

package/tree/tree.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.tree=function(e,t,n,l,o,i,s,c,r){"use strict";function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=d(e),h=d(t),p=d(l),u=d(o),g=d(i),y=d(s),k=d(c),f={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,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)},onClick(e){this.toggleClicked||n.DomHandler.hasClass(e.target,"p-tree-toggler")||n.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=n.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 l=this.findBeforeClickableNode(e.currentTarget);l&&this.focusRowChange(e.currentTarget,l)},onEnterKey(e){this.setTabIndexForSelectionMode(e,this.nodeTouched),this.onClick(e),e.preventDefault()},onTabKey(){this.setAllNodesTabIndexes()},setAllNodesTabIndexes(){const e=n.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 l=[...n.DomHandler.find(this.$refs.currentNode.parentElement,".p-treenode")];e.currentTarget.tabIndex=!1===t?-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(e){const t=e.closest("ul").closest("li");if(t){const l=n.DomHandler.findSingle(t,"button");return l&&"hidden"!==l.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 l of e.children)this.propagateDown(l,t,n)},propagateUp(e){let t=e.check,n={...e.selectionKeys},l=0,o=!1;for(let e of this.node.children)n[e.key]&&n[e.key].checked?l++:n[e.key]&&n[e.key].partialChecked&&(o=!0);t&&l===this.node.children.length?n[this.node.key]={checked:!0,partialChecked:!1}:(t||delete n[this.node.key],o||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(e){const t=e.parentElement.parentElement;return n.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:u.default,ChevronRightIcon:g.default,CheckIcon:p.default,MinusIcon:y.default},directives:{ripple:k.default}};const m=["aria-label","aria-selected","aria-expanded","aria-setsize","aria-posinset","aria-level","aria-checked","tabindex"],b={key:0,class:"p-checkbox p-component","aria-hidden":"true"},x={class:"p-treenode-label"},C={key:0,class:"p-treenode-children",role:"group"};f.render=function(e,t,n,l,o,i){const s=r.resolveComponent("TreeNode",!0),c=r.resolveDirective("ripple");return r.openBlock(),r.createElementBlock("li",{ref:"currentNode",class:r.normalizeClass(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))},[r.createElementVNode("div",{class:r.normalizeClass(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:r.normalizeStyle(n.node.style)},[r.withDirectives((r.openBlock(),r.createElementBlock("button",{type:"button",class:"p-tree-toggler p-link",onClick:t[0]||(t[0]=(...e)=>i.toggle&&i.toggle(...e)),tabindex:"-1","aria-hidden":"true"},[n.templates.togglericon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.togglericon),{key:0,node:n.node,expanded:i.expanded,class:"p-tree-toggler-icon"},null,8,["node","expanded"])):i.expanded?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.node.expandedIcon?"span":"ChevronDownIcon"),{key:1,class:"p-tree-toggler-icon"})):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.node.collapsedIcon?"span":"ChevronRightIcon"),{key:2,class:"p-tree-toggler-icon"}))])),[[c]]),i.checkboxMode?(r.openBlock(),r.createElementBlock("div",b,[r.createElementVNode("div",{class:r.normalizeClass(i.checkboxClass),role:"checkbox"},[n.templates.checkboxicon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.checkboxicon),{key:0,checked:i.checked,partialChecked:i.partialChecked,class:"p-checkbox-icon"},null,8,["checked","partialChecked"])):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.checked?"CheckIcon":i.partialChecked?"MinusIcon":null),{key:1,class:"p-checkbox-icon"}))],2)])):r.createCommentVNode("",!0),r.createElementVNode("span",{class:r.normalizeClass(i.icon)},null,2),r.createElementVNode("span",x,[n.templates[n.node.type]||n.templates.default?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates[n.node.type]||n.templates.default),{key:0,node:n.node},null,8,["node"])):(r.openBlock(),r.createElementBlock(r.Fragment,{key:1},[r.createTextVNode(r.toDisplayString(i.label(n.node)),1)],64))])],38),i.hasChildren&&i.expanded?(r.openBlock(),r.createElementBlock("ul",C,[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(n.node.children,(e=>(r.openBlock(),r.createBlock(s,{key:e.key,node:e,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},null,8,["node","templates","level","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))])):r.createCommentVNode("",!0)],42,m)};var v={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: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,l=t.metaKey||t.ctrlKey;let o;return this.isNodeSelected(n)&&l?(this.isSingleSelectionMode()?o={}:(o={...this.selectionKeys},delete o[n.key]),this.$emit("node-unselect",n)):(this.isSingleSelectionMode()?o={}:this.isMultipleSelectionMode()&&(o=l&&this.selectionKeys?{...this.selectionKeys}:{}),o[n.key]=!0,this.$emit("node-select",n)),o},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 o of l){let l={...o};this.isFilterMatched(l,t)&&(n=!0,e.children.push(l))}}if(n)return!0}},isFilterMatched(e,{searchFields:t,filterText:l,strict:o}){let i=!1;for(let o of t){String(n.ObjectUtils.resolveFieldData(e,o)).toLocaleLowerCase(this.filterLocale).indexOf(l)>-1&&(i=!0)}return(!i||o&&!this.isNodeLeaf(e))&&(i=this.findFilteredNodes(e,{searchFields:t,filterText:l,strict:o})||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),l="strict"===this.filterMode;for(let o of this.value){let i={...o},s={searchFields:t,filterText:n,strict:l};(l&&(this.findFilteredNodes(i,s)||this.isFilterMatched(i,s))||!l&&(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:f,SearchIcon:a.default,SpinnerIcon:h.default}};const K={key:0,class:"p-tree-loading-overlay p-component-overlay"},N={key:1,class:"p-tree-filter-container"},S=["placeholder"],w=["aria-labelledby","aria-label"];return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var l=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&l.firstChild?l.insertBefore(o,l.firstChild):l.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.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"),v.render=function(e,t,n,l,o,i){const s=r.resolveComponent("SpinnerIcon"),c=r.resolveComponent("SearchIcon"),d=r.resolveComponent("TreeNode");return r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(i.containerClass)},[n.loading?(r.openBlock(),r.createElementBlock("div",K,[r.renderSlot(e.$slots,"loadingicon",{},(()=>[n.loadingIcon?(r.openBlock(),r.createElementBlock("i",{key:0,class:r.normalizeClass(["p-tree-loading-icon pi-spin",n.loadingIcon])},null,2)):(r.openBlock(),r.createBlock(s,{key:1,spin:"",class:"p-tree-loading-icon"}))]))])):r.createCommentVNode("",!0),n.filter?(r.openBlock(),r.createElementBlock("div",N,[r.withDirectives(r.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:n.filterPlaceholder,onKeydown:t[1]||(t[1]=(...e)=>i.onFilterKeydown&&i.onFilterKeydown(...e))},null,40,S),[[r.vModelText,o.filterValue]]),r.renderSlot(e.$slots,"searchicon",{},(()=>[r.createVNode(c,{class:"p-tree-filter-icon"})]))])):r.createCommentVNode("",!0),r.createElementVNode("div",{class:"p-tree-wrapper",style:r.normalizeStyle({maxHeight:n.scrollHeight})},[r.createElementVNode("ul",{class:"p-tree-container",role:"tree","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(i.valueToRender,((t,l)=>(r.openBlock(),r.createBlock(d,{key:t.key,node:t,templates:e.$slots,level:n.level+1,index:l,expandedKeys:o.d_expandedKeys,onNodeToggle:i.onNodeToggle,onNodeClick:i.onNodeClick,selectionMode:n.selectionMode,selectionKeys:n.selectionKeys,onCheckboxChange:i.onCheckboxChange},null,8,["node","templates","level","index","expandedKeys","onNodeToggle","onNodeClick","selectionMode","selectionKeys","onCheckboxChange"])))),128))],8,w)],4)],2)},v}(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,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);

package/treeselect/TreeSelect.d.ts

@@ -8,9 +8,106 @@
  *
  */
 import { InputHTMLAttributes, VNode } from 'vue';
-import { TreeNode } from '../tree';
+import { TreeExpandedKeys, TreeNode, TreePassThroughOptionType } from '../tree';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type TreeSelectPassThroughOptionType = TreeSelectPassThroughAttributes | ((options: TreeSelectPassThroughMethodOptions) => TreeSelectPassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface TreeSelectPassThroughMethodOptions {
+    props: TreeSelectProps;
+    state: TreeSelectState;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link TreeSelectProps.pt}
+ */
+export interface TreeSelectPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the label container's DOM element.
+     */
+    labelContainer?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the label's DOM element.
+     */
+    label?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the token's DOM element.
+     */
+    token?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the token label's DOM element.
+     */
+    tokenLabel?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the trigger's DOM element.
+     */
+    trigger?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the trigger icon's DOM element.
+     */
+    triggerIcon?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the panel's DOM element.
+     */
+    panel?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the wrapper's DOM element.
+     */
+    wrapper?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the trigger's DOM element.
+     * @see {@link TreePassThroughOptionType}
+     */
+    tree?: TreePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the empty message's DOM element.
+     */
+    emptyMessage?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the hidden input wrapper's DOM element.
+     */
+    hiddenInputWrapper?: TreeSelectPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the hidden input's DOM element.
+     */
+    hiddenInput?: TreeSelectPassThroughOptionType;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface TreeSelectPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines current inline state in TreeSelect component.
+ */
+export interface TreeSelectState {
+    /**
+     * Current focused state as a boolean.
+     * @defaultValue false
+     */
+    focused: boolean;
+    /**
+     * Current overlay visible state as a boolean.
+     * @defaultValue false
+     */
+    overlayVisible: boolean;
+    /**
+     * Current expanded keys state.
+     */
+    expandedKeys: TreeExpandedKeys;
+}
+
 /**
  * Defines valid properties in TreeSelect component.
  */
@@ -94,6 +191,11 @@ export interface TreeSelectProps {
      * Establishes a string value that labels the component.
      */
     'aria-label'?: string | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {TreeSelectPassThroughOptions}
+     */
+    pt?: TreeSelectPassThroughOptions;
 }
 
 /**

package/treeselect/TreeSelect.vue

@@ -1,6 +1,6 @@
 <template>
-    <div ref="container" :class="containerClass" @click="onClick">
-        <div class="p-hidden-accessible">
+    <div ref="container" :class="containerClass" @click="onClick" v-bind="ptm('root')">
+        <div class="p-hidden-accessible" v-bind="ptm('hiddenInputWrapper')">
             <input
                 ref="focusInput"
                 :id="inputId"
@@ -19,34 +19,34 @@
                 @focus="onFocus($event)"
                 @blur="onBlur($event)"
                 @keydown="onKeyDown($event)"
-                v-bind="inputProps"
+                v-bind="{ ...inputProps, ...ptm('hiddenInput') }"
             />
         </div>
-        <div class="p-treeselect-label-container">
-            <div :class="labelClass">
+        <div class="p-treeselect-label-container" v-bind="ptm('labelContainer')">
+            <div :class="labelClass" 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">
-                            <span class="p-treeselect-token-label">{{ node.label }}</span>
+                        <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>
                         <template v-if="emptyValue">{{ placeholder || 'empty' }}</template>
                     </template>
                 </slot>
             </div>
         </div>
-        <div class="p-treeselect-trigger" role="button" aria-haspopup="tree" :aria-expanded="overlayVisible">
+        <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" />
+                <component :is="'ChevronDownIcon'" class="p-treeselect-trigger-icon" 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">
+                <div v-if="overlayVisible" :ref="overlayRef" @click="onOverlayClick" :class="panelStyleClass" @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 }">
+                    <div class="p-treeselect-items-wrapper" :style="{ 'max-height': scrollHeight }" v-bind="ptm('wrapper')">
                         <TSTree
                             ref="tree"
                             :id="listId"
@@ -62,6 +62,7 @@
                             @node-select="onNodeSelect"
                             @node-unselect="onNodeUnselect"
                             :level="0"
+                            :pt="ptm('tree')"
                         >
                             <template v-if="$slots.itemtogglericon" #togglericon="iconProps">
                                 <slot name="itemtogglericon" :node="iconProps.node" :expanded="iconProps.expanded" :class="iconProps.class" />
@@ -70,7 +71,7 @@
                                 <slot name="itemcheckboxicon" :checked="iconProps.checked" :partialChecked="iconProps.partialChecked" :class="iconProps.class" />
                             </template>
                         </TSTree>
-                        <div v-if="emptyOptions" class="p-treeselect-empty-message">
+                        <div v-if="emptyOptions" class="p-treeselect-empty-message" v-bind="ptm('emptyMessage')">
                             <slot name="empty">{{ emptyMessageText }}</slot>
                         </div>
                     </div>
@@ -82,6 +83,7 @@
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
 import ChevronDownIcon from 'primevue/icons/chevrondown';
 import OverlayEventBus from 'primevue/overlayeventbus';
 import Portal from 'primevue/portal';
@@ -91,6 +93,7 @@ import { ConnectedOverlayScrollHandler, DomHandler, UniqueComponentId, ZIndexUti
 
 export default {
     name: 'TreeSelect',
+    extends: BaseComponent,
     emits: ['update:modelValue', 'before-show', 'before-hide', 'change', 'show', 'hide', 'node-select', 'node-unselect', 'node-expand', 'node-collapse', 'focus', 'blur'],
     props: {
         modelValue: null,