primevue 3.12.4 → 3.13.0

package/organizationchart/organizationchart.cjs.js

@@ -84,80 +84,85 @@ var script$1 = {
 
 const _hoisted_1$1 = { class: "p-organizationchart-table" };
 const _hoisted_2 = { key: 0 };
-const _hoisted_3 = /*#__PURE__*/vue.createVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
-const _hoisted_4 = /*#__PURE__*/vue.createVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+const _hoisted_3 = ["colspan"];
+const _hoisted_4 = ["colspan"];
+const _hoisted_5 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+const _hoisted_6 = [
+  _hoisted_5
+];
+const _hoisted_7 = ["colspan"];
+const _hoisted_8 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+const _hoisted_9 = [
+  _hoisted_8
+];
 
 function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrganizationChartNode = vue.resolveComponent("OrganizationChartNode", true);
 
-  return (vue.openBlock(), vue.createBlock("table", _hoisted_1$1, [
-    vue.createVNode("tbody", null, [
+  return (vue.openBlock(), vue.createElementBlock("table", _hoisted_1$1, [
+    vue.createElementVNode("tbody", null, [
       ($props.node)
-        ? (vue.openBlock(), vue.createBlock("tr", _hoisted_2, [
-            vue.createVNode("td", { colspan: $options.colspan }, [
-              vue.createVNode("div", {
-                class: $options.nodeContentClass,
-                onClick: _cache[3] || (_cache[3] = (...args) => ($options.onNodeClick && $options.onNodeClick(...args)))
+        ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_2, [
+            vue.createElementVNode("td", { colspan: $options.colspan }, [
+              vue.createElementVNode("div", {
+                class: vue.normalizeClass($options.nodeContentClass),
+                onClick: _cache[2] || (_cache[2] = (...args) => ($options.onNodeClick && $options.onNodeClick(...args)))
               }, [
                 (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates[$props.node.type]||$props.templates['default']), { node: $props.node }, null, 8, ["node"])),
                 ($options.toggleable)
-                  ? (vue.openBlock(), vue.createBlock("a", {
+                  ? (vue.openBlock(), vue.createElementBlock("a", {
                       key: 0,
                       tabindex: "0",
                       class: "p-node-toggler",
-                      onClick: _cache[1] || (_cache[1] = (...args) => ($options.toggleNode && $options.toggleNode(...args))),
-                      onKeydown: _cache[2] || (_cache[2] = vue.withKeys((...args) => ($options.toggleNode && $options.toggleNode(...args)), ["enter"]))
+                      onClick: _cache[0] || (_cache[0] = (...args) => ($options.toggleNode && $options.toggleNode(...args))),
+                      onKeydown: _cache[1] || (_cache[1] = vue.withKeys((...args) => ($options.toggleNode && $options.toggleNode(...args)), ["enter"]))
                     }, [
-                      vue.createVNode("i", {
-                        class: ["p-node-toggler-icon pi", {'pi-chevron-down': $options.expanded, 'pi-chevron-up': !$options.expanded}]
+                      vue.createElementVNode("i", {
+                        class: vue.normalizeClass(["p-node-toggler-icon pi", {'pi-chevron-down': $options.expanded, 'pi-chevron-up': !$options.expanded}])
                       }, null, 2)
                     ], 32))
                   : vue.createCommentVNode("", true)
               ], 2)
-            ], 8, ["colspan"])
+            ], 8, _hoisted_3)
           ]))
         : vue.createCommentVNode("", true),
-      vue.createVNode("tr", {
-        style: $options.childStyle,
+      vue.createElementVNode("tr", {
+        style: vue.normalizeStyle($options.childStyle),
         class: "p-organizationchart-lines"
       }, [
-        vue.createVNode("td", { colspan: $options.colspan }, [
-          _hoisted_3
-        ], 8, ["colspan"])
+        vue.createElementVNode("td", { colspan: $options.colspan }, _hoisted_6, 8, _hoisted_4)
       ], 4),
-      vue.createVNode("tr", {
-        style: $options.childStyle,
+      vue.createElementVNode("tr", {
+        style: vue.normalizeStyle($options.childStyle),
         class: "p-organizationchart-lines"
       }, [
         ($props.node.children && $props.node.children.length === 1)
-          ? (vue.openBlock(), vue.createBlock("td", {
+          ? (vue.openBlock(), vue.createElementBlock("td", {
               key: 0,
               colspan: $options.colspan
-            }, [
-              _hoisted_4
-            ], 8, ["colspan"]))
+            }, _hoisted_9, 8, _hoisted_7))
           : vue.createCommentVNode("", true),
         ($props.node.children && $props.node.children.length > 1)
-          ? (vue.openBlock(true), vue.createBlock(vue.Fragment, { key: 1 }, vue.renderList($props.node.children, (child, i) => {
-              return (vue.openBlock(), vue.createBlock(vue.Fragment, {
+          ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList($props.node.children, (child, i) => {
+              return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
                 key: child.key
               }, [
-                vue.createVNode("td", {
-                  class: ["p-organizationchart-line-left", {'p-organizationchart-line-top': !(i === 0)}]
+                vue.createElementVNode("td", {
+                  class: vue.normalizeClass(["p-organizationchart-line-left", {'p-organizationchart-line-top': !(i === 0)}])
                 }, " ", 2),
-                vue.createVNode("td", {
-                  class: ["p-organizationchart-line-right", {'p-organizationchart-line-top': !(i === ($props.node.children.length - 1))}]
+                vue.createElementVNode("td", {
+                  class: vue.normalizeClass(["p-organizationchart-line-right", {'p-organizationchart-line-top': !(i === ($props.node.children.length - 1))}])
                 }, " ", 2)
               ], 64))
             }), 128))
           : vue.createCommentVNode("", true)
       ], 4),
-      vue.createVNode("tr", {
-        style: $options.childStyle,
+      vue.createElementVNode("tr", {
+        style: vue.normalizeStyle($options.childStyle),
         class: "p-organizationchart-nodes"
       }, [
-        (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.node.children, (child) => {
-          return (vue.openBlock(), vue.createBlock("td", {
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.node.children, (child) => {
+          return (vue.openBlock(), vue.createElementBlock("td", {
             key: child.key,
             colspan: "2"
           }, [
@@ -264,7 +269,7 @@ const _hoisted_1 = { class: "p-organizationchart p-component" };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrganizationChartNode = vue.resolveComponent("OrganizationChartNode");
 
-  return (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
     vue.createVNode(_component_OrganizationChartNode, {
       node: $props.value,
       templates: _ctx.$slots,

package/organizationchart/organizationchart.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),o=require("vue"),n={name:"OrganizationChartNode",emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{onNodeClick(o){e.DomHandler.hasClass(o.target,"p-node-toggler")||e.DomHandler.hasClass(o.target,"p-node-toggler-icon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick(e){this.$emit("node-click",e)},toggleNode(){this.$emit("node-toggle",this.node)},onChildNodeToggle(e){this.$emit("node-toggle",e)}},computed:{nodeContentClass(){return["p-organizationchart-node-content",this.node.styleClass,{"p-organizationchart-selectable-node":this.selectable,"p-highlight":this.selected}]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded(){return void 0===this.collapsedKeys[this.node.key]},selectable(){return this.selectionMode&&!1!==this.node.selectable},selected(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}}};const t={class:"p-organizationchart-table"},l={key:0},i=o.createVNode("div",{class:"p-organizationchart-line-down"},null,-1),s=o.createVNode("div",{class:"p-organizationchart-line-down"},null,-1);n.render=function(e,n,a,d,c,r){const p=o.resolveComponent("OrganizationChartNode",!0);return o.openBlock(),o.createBlock("table",t,[o.createVNode("tbody",null,[a.node?(o.openBlock(),o.createBlock("tr",l,[o.createVNode("td",{colspan:r.colspan},[o.createVNode("div",{class:r.nodeContentClass,onClick:n[3]||(n[3]=(...e)=>r.onNodeClick&&r.onNodeClick(...e))},[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(a.templates[a.node.type]||a.templates.default),{node:a.node},null,8,["node"])),r.toggleable?(o.openBlock(),o.createBlock("a",{key:0,tabindex:"0",class:"p-node-toggler",onClick:n[1]||(n[1]=(...e)=>r.toggleNode&&r.toggleNode(...e)),onKeydown:n[2]||(n[2]=o.withKeys(((...e)=>r.toggleNode&&r.toggleNode(...e)),["enter"]))},[o.createVNode("i",{class:["p-node-toggler-icon pi",{"pi-chevron-down":r.expanded,"pi-chevron-up":!r.expanded}]},null,2)],32)):o.createCommentVNode("",!0)],2)],8,["colspan"])])):o.createCommentVNode("",!0),o.createVNode("tr",{style:r.childStyle,class:"p-organizationchart-lines"},[o.createVNode("td",{colspan:r.colspan},[i],8,["colspan"])],4),o.createVNode("tr",{style:r.childStyle,class:"p-organizationchart-lines"},[a.node.children&&1===a.node.children.length?(o.openBlock(),o.createBlock("td",{key:0,colspan:r.colspan},[s],8,["colspan"])):o.createCommentVNode("",!0),a.node.children&&a.node.children.length>1?(o.openBlock(!0),o.createBlock(o.Fragment,{key:1},o.renderList(a.node.children,((e,n)=>(o.openBlock(),o.createBlock(o.Fragment,{key:e.key},[o.createVNode("td",{class:["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===n)}]}," ",2),o.createVNode("td",{class:["p-organizationchart-line-right",{"p-organizationchart-line-top":!(n===a.node.children.length-1)}]}," ",2)],64)))),128)):o.createCommentVNode("",!0)],4),o.createVNode("tr",{style:r.childStyle,class:"p-organizationchart-nodes"},[(o.openBlock(!0),o.createBlock(o.Fragment,null,o.renderList(a.node.children,(e=>(o.openBlock(),o.createBlock("td",{key:e.key,colspan:"2"},[o.createVNode(p,{node:e,templates:a.templates,collapsedKeys:a.collapsedKeys,onNodeToggle:r.onChildNodeToggle,collapsible:a.collapsible,selectionMode:a.selectionMode,selectionKeys:a.selectionKeys,onNodeClick:r.onChildNodeClick},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick"])])))),128))],4)])])};var a={name:"OrganizationChart",emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},data(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys(e){this.d_collapsedKeys=e}},methods:{onNodeClick(e){const o=e.key;if(this.selectionMode){let n=this.selectionKeys?{...this.selectionKeys}:{};n[o]?(delete n[o],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(n={}),n[o]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",n)}},onNodeToggle(e){const o=e.key;this.d_collapsedKeys[o]?(delete this.d_collapsedKeys[o],this.$emit("node-expand",e)):(this.d_collapsedKeys[o]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys={...this.d_collapsedKeys},this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:n}};const d={class:"p-organizationchart p-component"};!function(e,o){void 0===o&&(o={});var n=o.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===n&&t.firstChild?t.insertBefore(l,t.firstChild):t.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-organizationchart-table {\n    border-spacing: 0;\n    border-collapse: separate;\n    margin: 0 auto;\n}\n.p-organizationchart-table > tbody > tr > td {\n    text-align: center;\n    vertical-align: top;\n    padding: 0 .75rem;\n}\n.p-organizationchart-node-content {\n    display: inline-block;\n    position: relative;\n}\n.p-organizationchart-node-content .p-node-toggler {\n    position: absolute;\n    bottom: -.75rem;\n    margin-left: -.75rem;\n    z-index: 2;\n    left: 50%;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    cursor: pointer;\n    width: 1.5rem;\n    height: 1.5rem;\n    text-decoration: none;\n}\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n    position: relative;\n    top: .25rem;\n}\n.p-organizationchart-line-down {\n    margin: 0 auto;\n    height: 20px;\n    width: 1px;\n}\n.p-organizationchart-line-right {\n    border-radius: 0px;\n}\n.p-organizationchart-line-left {\n    border-radius: 0;\n}\n.p-organizationchart-selectable-node {\n    cursor: pointer;\n}\n"),a.render=function(e,n,t,l,i,s){const a=o.resolveComponent("OrganizationChartNode");return o.openBlock(),o.createBlock("div",d,[o.createVNode(a,{node:t.value,templates:e.$slots,onNodeToggle:s.onNodeToggle,collapsedKeys:i.d_collapsedKeys,collapsible:t.collapsible,onNodeClick:s.onNodeClick,selectionMode:t.selectionMode,selectionKeys:t.selectionKeys},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys"])])},module.exports=a;
+"use strict";var e=require("primevue/utils"),n=require("vue"),t={name:"OrganizationChartNode",emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{onNodeClick(n){e.DomHandler.hasClass(n.target,"p-node-toggler")||e.DomHandler.hasClass(n.target,"p-node-toggler-icon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick(e){this.$emit("node-click",e)},toggleNode(){this.$emit("node-toggle",this.node)},onChildNodeToggle(e){this.$emit("node-toggle",e)}},computed:{nodeContentClass(){return["p-organizationchart-node-content",this.node.styleClass,{"p-organizationchart-selectable-node":this.selectable,"p-highlight":this.selected}]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded(){return void 0===this.collapsedKeys[this.node.key]},selectable(){return this.selectionMode&&!1!==this.node.selectable},selected(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}}};const o={class:"p-organizationchart-table"},l={key:0},i=["colspan"],s=["colspan"],a=[n.createElementVNode("div",{class:"p-organizationchart-line-down"},null,-1)],d=["colspan"],c=[n.createElementVNode("div",{class:"p-organizationchart-line-down"},null,-1)];t.render=function(e,t,r,p,h,g){const m=n.resolveComponent("OrganizationChartNode",!0);return n.openBlock(),n.createElementBlock("table",o,[n.createElementVNode("tbody",null,[r.node?(n.openBlock(),n.createElementBlock("tr",l,[n.createElementVNode("td",{colspan:g.colspan},[n.createElementVNode("div",{class:n.normalizeClass(g.nodeContentClass),onClick:t[2]||(t[2]=(...e)=>g.onNodeClick&&g.onNodeClick(...e))},[(n.openBlock(),n.createBlock(n.resolveDynamicComponent(r.templates[r.node.type]||r.templates.default),{node:r.node},null,8,["node"])),g.toggleable?(n.openBlock(),n.createElementBlock("a",{key:0,tabindex:"0",class:"p-node-toggler",onClick:t[0]||(t[0]=(...e)=>g.toggleNode&&g.toggleNode(...e)),onKeydown:t[1]||(t[1]=n.withKeys(((...e)=>g.toggleNode&&g.toggleNode(...e)),["enter"]))},[n.createElementVNode("i",{class:n.normalizeClass(["p-node-toggler-icon pi",{"pi-chevron-down":g.expanded,"pi-chevron-up":!g.expanded}])},null,2)],32)):n.createCommentVNode("",!0)],2)],8,i)])):n.createCommentVNode("",!0),n.createElementVNode("tr",{style:n.normalizeStyle(g.childStyle),class:"p-organizationchart-lines"},[n.createElementVNode("td",{colspan:g.colspan},a,8,s)],4),n.createElementVNode("tr",{style:n.normalizeStyle(g.childStyle),class:"p-organizationchart-lines"},[r.node.children&&1===r.node.children.length?(n.openBlock(),n.createElementBlock("td",{key:0,colspan:g.colspan},c,8,d)):n.createCommentVNode("",!0),r.node.children&&r.node.children.length>1?(n.openBlock(!0),n.createElementBlock(n.Fragment,{key:1},n.renderList(r.node.children,((e,t)=>(n.openBlock(),n.createElementBlock(n.Fragment,{key:e.key},[n.createElementVNode("td",{class:n.normalizeClass(["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===t)}])}," ",2),n.createElementVNode("td",{class:n.normalizeClass(["p-organizationchart-line-right",{"p-organizationchart-line-top":!(t===r.node.children.length-1)}])}," ",2)],64)))),128)):n.createCommentVNode("",!0)],4),n.createElementVNode("tr",{style:n.normalizeStyle(g.childStyle),class:"p-organizationchart-nodes"},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(r.node.children,(e=>(n.openBlock(),n.createElementBlock("td",{key:e.key,colspan:"2"},[n.createVNode(m,{node:e,templates:r.templates,collapsedKeys:r.collapsedKeys,onNodeToggle:g.onChildNodeToggle,collapsible:r.collapsible,selectionMode:r.selectionMode,selectionKeys:r.selectionKeys,onNodeClick:g.onChildNodeClick},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick"])])))),128))],4)])])};var r={name:"OrganizationChart",emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},data(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys(e){this.d_collapsedKeys=e}},methods:{onNodeClick(e){const n=e.key;if(this.selectionMode){let t=this.selectionKeys?{...this.selectionKeys}:{};t[n]?(delete t[n],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(t={}),t[n]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",t)}},onNodeToggle(e){const n=e.key;this.d_collapsedKeys[n]?(delete this.d_collapsedKeys[n],this.$emit("node-expand",e)):(this.d_collapsedKeys[n]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys={...this.d_collapsedKeys},this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:t}};const p={class:"p-organizationchart p-component"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-organizationchart-table {\n    border-spacing: 0;\n    border-collapse: separate;\n    margin: 0 auto;\n}\n.p-organizationchart-table > tbody > tr > td {\n    text-align: center;\n    vertical-align: top;\n    padding: 0 .75rem;\n}\n.p-organizationchart-node-content {\n    display: inline-block;\n    position: relative;\n}\n.p-organizationchart-node-content .p-node-toggler {\n    position: absolute;\n    bottom: -.75rem;\n    margin-left: -.75rem;\n    z-index: 2;\n    left: 50%;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    cursor: pointer;\n    width: 1.5rem;\n    height: 1.5rem;\n    text-decoration: none;\n}\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n    position: relative;\n    top: .25rem;\n}\n.p-organizationchart-line-down {\n    margin: 0 auto;\n    height: 20px;\n    width: 1px;\n}\n.p-organizationchart-line-right {\n    border-radius: 0px;\n}\n.p-organizationchart-line-left {\n    border-radius: 0;\n}\n.p-organizationchart-selectable-node {\n    cursor: pointer;\n}\n"),r.render=function(e,t,o,l,i,s){const a=n.resolveComponent("OrganizationChartNode");return n.openBlock(),n.createElementBlock("div",p,[n.createVNode(a,{node:o.value,templates:e.$slots,onNodeToggle:s.onNodeToggle,collapsedKeys:i.d_collapsedKeys,collapsible:o.collapsible,onNodeClick:s.onNodeClick,selectionMode:o.selectionMode,selectionKeys:o.selectionKeys},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys"])])},module.exports=r;

package/organizationchart/organizationchart.esm.js

@@ -1,5 +1,5 @@
 import { DomHandler } from 'primevue/utils';
-import { resolveComponent, openBlock, createBlock, createVNode, resolveDynamicComponent, withKeys, createCommentVNode, Fragment, renderList } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, createBlock, resolveDynamicComponent, withKeys, createCommentVNode, normalizeStyle, Fragment, renderList, createVNode } from 'vue';
 
 var script$1 = {
     name: 'OrganizationChartNode',
@@ -82,80 +82,85 @@ var script$1 = {
 
 const _hoisted_1$1 = { class: "p-organizationchart-table" };
 const _hoisted_2 = { key: 0 };
-const _hoisted_3 = /*#__PURE__*/createVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
-const _hoisted_4 = /*#__PURE__*/createVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+const _hoisted_3 = ["colspan"];
+const _hoisted_4 = ["colspan"];
+const _hoisted_5 = /*#__PURE__*/createElementVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+const _hoisted_6 = [
+  _hoisted_5
+];
+const _hoisted_7 = ["colspan"];
+const _hoisted_8 = /*#__PURE__*/createElementVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+const _hoisted_9 = [
+  _hoisted_8
+];
 
 function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrganizationChartNode = resolveComponent("OrganizationChartNode", true);
 
-  return (openBlock(), createBlock("table", _hoisted_1$1, [
-    createVNode("tbody", null, [
+  return (openBlock(), createElementBlock("table", _hoisted_1$1, [
+    createElementVNode("tbody", null, [
       ($props.node)
-        ? (openBlock(), createBlock("tr", _hoisted_2, [
-            createVNode("td", { colspan: $options.colspan }, [
-              createVNode("div", {
-                class: $options.nodeContentClass,
-                onClick: _cache[3] || (_cache[3] = (...args) => ($options.onNodeClick && $options.onNodeClick(...args)))
+        ? (openBlock(), createElementBlock("tr", _hoisted_2, [
+            createElementVNode("td", { colspan: $options.colspan }, [
+              createElementVNode("div", {
+                class: normalizeClass($options.nodeContentClass),
+                onClick: _cache[2] || (_cache[2] = (...args) => ($options.onNodeClick && $options.onNodeClick(...args)))
               }, [
                 (openBlock(), createBlock(resolveDynamicComponent($props.templates[$props.node.type]||$props.templates['default']), { node: $props.node }, null, 8, ["node"])),
                 ($options.toggleable)
-                  ? (openBlock(), createBlock("a", {
+                  ? (openBlock(), createElementBlock("a", {
                       key: 0,
                       tabindex: "0",
                       class: "p-node-toggler",
-                      onClick: _cache[1] || (_cache[1] = (...args) => ($options.toggleNode && $options.toggleNode(...args))),
-                      onKeydown: _cache[2] || (_cache[2] = withKeys((...args) => ($options.toggleNode && $options.toggleNode(...args)), ["enter"]))
+                      onClick: _cache[0] || (_cache[0] = (...args) => ($options.toggleNode && $options.toggleNode(...args))),
+                      onKeydown: _cache[1] || (_cache[1] = withKeys((...args) => ($options.toggleNode && $options.toggleNode(...args)), ["enter"]))
                     }, [
-                      createVNode("i", {
-                        class: ["p-node-toggler-icon pi", {'pi-chevron-down': $options.expanded, 'pi-chevron-up': !$options.expanded}]
+                      createElementVNode("i", {
+                        class: normalizeClass(["p-node-toggler-icon pi", {'pi-chevron-down': $options.expanded, 'pi-chevron-up': !$options.expanded}])
                       }, null, 2)
                     ], 32))
                   : createCommentVNode("", true)
               ], 2)
-            ], 8, ["colspan"])
+            ], 8, _hoisted_3)
           ]))
         : createCommentVNode("", true),
-      createVNode("tr", {
-        style: $options.childStyle,
+      createElementVNode("tr", {
+        style: normalizeStyle($options.childStyle),
         class: "p-organizationchart-lines"
       }, [
-        createVNode("td", { colspan: $options.colspan }, [
-          _hoisted_3
-        ], 8, ["colspan"])
+        createElementVNode("td", { colspan: $options.colspan }, _hoisted_6, 8, _hoisted_4)
       ], 4),
-      createVNode("tr", {
-        style: $options.childStyle,
+      createElementVNode("tr", {
+        style: normalizeStyle($options.childStyle),
         class: "p-organizationchart-lines"
       }, [
         ($props.node.children && $props.node.children.length === 1)
-          ? (openBlock(), createBlock("td", {
+          ? (openBlock(), createElementBlock("td", {
               key: 0,
               colspan: $options.colspan
-            }, [
-              _hoisted_4
-            ], 8, ["colspan"]))
+            }, _hoisted_9, 8, _hoisted_7))
           : createCommentVNode("", true),
         ($props.node.children && $props.node.children.length > 1)
-          ? (openBlock(true), createBlock(Fragment, { key: 1 }, renderList($props.node.children, (child, i) => {
-              return (openBlock(), createBlock(Fragment, {
+          ? (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList($props.node.children, (child, i) => {
+              return (openBlock(), createElementBlock(Fragment, {
                 key: child.key
               }, [
-                createVNode("td", {
-                  class: ["p-organizationchart-line-left", {'p-organizationchart-line-top': !(i === 0)}]
+                createElementVNode("td", {
+                  class: normalizeClass(["p-organizationchart-line-left", {'p-organizationchart-line-top': !(i === 0)}])
                 }, " ", 2),
-                createVNode("td", {
-                  class: ["p-organizationchart-line-right", {'p-organizationchart-line-top': !(i === ($props.node.children.length - 1))}]
+                createElementVNode("td", {
+                  class: normalizeClass(["p-organizationchart-line-right", {'p-organizationchart-line-top': !(i === ($props.node.children.length - 1))}])
                 }, " ", 2)
               ], 64))
             }), 128))
           : createCommentVNode("", true)
       ], 4),
-      createVNode("tr", {
-        style: $options.childStyle,
+      createElementVNode("tr", {
+        style: normalizeStyle($options.childStyle),
         class: "p-organizationchart-nodes"
       }, [
-        (openBlock(true), createBlock(Fragment, null, renderList($props.node.children, (child) => {
-          return (openBlock(), createBlock("td", {
+        (openBlock(true), createElementBlock(Fragment, null, renderList($props.node.children, (child) => {
+          return (openBlock(), createElementBlock("td", {
             key: child.key,
             colspan: "2"
           }, [
@@ -262,7 +267,7 @@ const _hoisted_1 = { class: "p-organizationchart p-component" };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrganizationChartNode = resolveComponent("OrganizationChartNode");
 
-  return (openBlock(), createBlock("div", _hoisted_1, [
+  return (openBlock(), createElementBlock("div", _hoisted_1, [
     createVNode(_component_OrganizationChartNode, {
       node: $props.value,
       templates: _ctx.$slots,
@@ -308,4 +313,4 @@ styleInject(css_248z);
 
 script.render = render;
 
-export default script;
+export { script as default };

package/organizationchart/organizationchart.esm.min.js

@@ -1 +1 @@
-import{DomHandler as e}from"primevue/utils";import{resolveComponent as n,openBlock as t,createBlock as o,createVNode as l,resolveDynamicComponent as i,withKeys as s,createCommentVNode as d,Fragment as a,renderList as c}from"vue";var r={name:"OrganizationChartNode",emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{onNodeClick(n){e.hasClass(n.target,"p-node-toggler")||e.hasClass(n.target,"p-node-toggler-icon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick(e){this.$emit("node-click",e)},toggleNode(){this.$emit("node-toggle",this.node)},onChildNodeToggle(e){this.$emit("node-toggle",e)}},computed:{nodeContentClass(){return["p-organizationchart-node-content",this.node.styleClass,{"p-organizationchart-selectable-node":this.selectable,"p-highlight":this.selected}]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded(){return void 0===this.collapsedKeys[this.node.key]},selectable(){return this.selectionMode&&!1!==this.node.selectable},selected(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}}};const p={class:"p-organizationchart-table"},h={key:0},g=l("div",{class:"p-organizationchart-line-down"},null,-1),u=l("div",{class:"p-organizationchart-line-down"},null,-1);r.render=function(e,r,y,m,K,b){const f=n("OrganizationChartNode",!0);return t(),o("table",p,[l("tbody",null,[y.node?(t(),o("tr",h,[l("td",{colspan:b.colspan},[l("div",{class:b.nodeContentClass,onClick:r[3]||(r[3]=(...e)=>b.onNodeClick&&b.onNodeClick(...e))},[(t(),o(i(y.templates[y.node.type]||y.templates.default),{node:y.node},null,8,["node"])),b.toggleable?(t(),o("a",{key:0,tabindex:"0",class:"p-node-toggler",onClick:r[1]||(r[1]=(...e)=>b.toggleNode&&b.toggleNode(...e)),onKeydown:r[2]||(r[2]=s(((...e)=>b.toggleNode&&b.toggleNode(...e)),["enter"]))},[l("i",{class:["p-node-toggler-icon pi",{"pi-chevron-down":b.expanded,"pi-chevron-up":!b.expanded}]},null,2)],32)):d("",!0)],2)],8,["colspan"])])):d("",!0),l("tr",{style:b.childStyle,class:"p-organizationchart-lines"},[l("td",{colspan:b.colspan},[g],8,["colspan"])],4),l("tr",{style:b.childStyle,class:"p-organizationchart-lines"},[y.node.children&&1===y.node.children.length?(t(),o("td",{key:0,colspan:b.colspan},[u],8,["colspan"])):d("",!0),y.node.children&&y.node.children.length>1?(t(!0),o(a,{key:1},c(y.node.children,((e,n)=>(t(),o(a,{key:e.key},[l("td",{class:["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===n)}]}," ",2),l("td",{class:["p-organizationchart-line-right",{"p-organizationchart-line-top":!(n===y.node.children.length-1)}]}," ",2)],64)))),128)):d("",!0)],4),l("tr",{style:b.childStyle,class:"p-organizationchart-nodes"},[(t(!0),o(a,null,c(y.node.children,(e=>(t(),o("td",{key:e.key,colspan:"2"},[l(f,{node:e,templates:y.templates,collapsedKeys:y.collapsedKeys,onNodeToggle:b.onChildNodeToggle,collapsible:y.collapsible,selectionMode:y.selectionMode,selectionKeys:y.selectionKeys,onNodeClick:b.onChildNodeClick},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick"])])))),128))],4)])])};var y={name:"OrganizationChart",emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},data(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys(e){this.d_collapsedKeys=e}},methods:{onNodeClick(e){const n=e.key;if(this.selectionMode){let t=this.selectionKeys?{...this.selectionKeys}:{};t[n]?(delete t[n],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(t={}),t[n]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",t)}},onNodeToggle(e){const n=e.key;this.d_collapsedKeys[n]?(delete this.d_collapsedKeys[n],this.$emit("node-expand",e)):(this.d_collapsedKeys[n]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys={...this.d_collapsedKeys},this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:r}};const m={class:"p-organizationchart p-component"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-organizationchart-table {\n    border-spacing: 0;\n    border-collapse: separate;\n    margin: 0 auto;\n}\n.p-organizationchart-table > tbody > tr > td {\n    text-align: center;\n    vertical-align: top;\n    padding: 0 .75rem;\n}\n.p-organizationchart-node-content {\n    display: inline-block;\n    position: relative;\n}\n.p-organizationchart-node-content .p-node-toggler {\n    position: absolute;\n    bottom: -.75rem;\n    margin-left: -.75rem;\n    z-index: 2;\n    left: 50%;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    cursor: pointer;\n    width: 1.5rem;\n    height: 1.5rem;\n    text-decoration: none;\n}\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n    position: relative;\n    top: .25rem;\n}\n.p-organizationchart-line-down {\n    margin: 0 auto;\n    height: 20px;\n    width: 1px;\n}\n.p-organizationchart-line-right {\n    border-radius: 0px;\n}\n.p-organizationchart-line-left {\n    border-radius: 0;\n}\n.p-organizationchart-selectable-node {\n    cursor: pointer;\n}\n"),y.render=function(e,i,s,d,a,c){const r=n("OrganizationChartNode");return t(),o("div",m,[l(r,{node:s.value,templates:e.$slots,onNodeToggle:c.onNodeToggle,collapsedKeys:a.d_collapsedKeys,collapsible:s.collapsible,onNodeClick:c.onNodeClick,selectionMode:s.selectionMode,selectionKeys:s.selectionKeys},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys"])])};export default y;
+import{DomHandler as e}from"primevue/utils";import{resolveComponent as n,openBlock as t,createElementBlock as o,createElementVNode as l,normalizeClass as i,createBlock as s,resolveDynamicComponent as d,withKeys as a,createCommentVNode as c,normalizeStyle as r,Fragment as p,renderList as h,createVNode as g}from"vue";var u={name:"OrganizationChartNode",emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{onNodeClick(n){e.hasClass(n.target,"p-node-toggler")||e.hasClass(n.target,"p-node-toggler-icon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick(e){this.$emit("node-click",e)},toggleNode(){this.$emit("node-toggle",this.node)},onChildNodeToggle(e){this.$emit("node-toggle",e)}},computed:{nodeContentClass(){return["p-organizationchart-node-content",this.node.styleClass,{"p-organizationchart-selectable-node":this.selectable,"p-highlight":this.selected}]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded(){return void 0===this.collapsedKeys[this.node.key]},selectable(){return this.selectionMode&&!1!==this.node.selectable},selected(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}}};const y={class:"p-organizationchart-table"},m={key:0},K=["colspan"],b=["colspan"],f=[l("div",{class:"p-organizationchart-line-down"},null,-1)],C=["colspan"],k=[l("div",{class:"p-organizationchart-line-down"},null,-1)];u.render=function(e,u,N,z,v,x){const M=n("OrganizationChartNode",!0);return t(),o("table",y,[l("tbody",null,[N.node?(t(),o("tr",m,[l("td",{colspan:x.colspan},[l("div",{class:i(x.nodeContentClass),onClick:u[2]||(u[2]=(...e)=>x.onNodeClick&&x.onNodeClick(...e))},[(t(),s(d(N.templates[N.node.type]||N.templates.default),{node:N.node},null,8,["node"])),x.toggleable?(t(),o("a",{key:0,tabindex:"0",class:"p-node-toggler",onClick:u[0]||(u[0]=(...e)=>x.toggleNode&&x.toggleNode(...e)),onKeydown:u[1]||(u[1]=a(((...e)=>x.toggleNode&&x.toggleNode(...e)),["enter"]))},[l("i",{class:i(["p-node-toggler-icon pi",{"pi-chevron-down":x.expanded,"pi-chevron-up":!x.expanded}])},null,2)],32)):c("",!0)],2)],8,K)])):c("",!0),l("tr",{style:r(x.childStyle),class:"p-organizationchart-lines"},[l("td",{colspan:x.colspan},f,8,b)],4),l("tr",{style:r(x.childStyle),class:"p-organizationchart-lines"},[N.node.children&&1===N.node.children.length?(t(),o("td",{key:0,colspan:x.colspan},k,8,C)):c("",!0),N.node.children&&N.node.children.length>1?(t(!0),o(p,{key:1},h(N.node.children,((e,n)=>(t(),o(p,{key:e.key},[l("td",{class:i(["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===n)}])}," ",2),l("td",{class:i(["p-organizationchart-line-right",{"p-organizationchart-line-top":!(n===N.node.children.length-1)}])}," ",2)],64)))),128)):c("",!0)],4),l("tr",{style:r(x.childStyle),class:"p-organizationchart-nodes"},[(t(!0),o(p,null,h(N.node.children,(e=>(t(),o("td",{key:e.key,colspan:"2"},[g(M,{node:e,templates:N.templates,collapsedKeys:N.collapsedKeys,onNodeToggle:x.onChildNodeToggle,collapsible:N.collapsible,selectionMode:N.selectionMode,selectionKeys:N.selectionKeys,onNodeClick:x.onChildNodeClick},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick"])])))),128))],4)])])};var N={name:"OrganizationChart",emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},data(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys(e){this.d_collapsedKeys=e}},methods:{onNodeClick(e){const n=e.key;if(this.selectionMode){let t=this.selectionKeys?{...this.selectionKeys}:{};t[n]?(delete t[n],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(t={}),t[n]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",t)}},onNodeToggle(e){const n=e.key;this.d_collapsedKeys[n]?(delete this.d_collapsedKeys[n],this.$emit("node-expand",e)):(this.d_collapsedKeys[n]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys={...this.d_collapsedKeys},this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:u}};const z={class:"p-organizationchart p-component"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-organizationchart-table {\n    border-spacing: 0;\n    border-collapse: separate;\n    margin: 0 auto;\n}\n.p-organizationchart-table > tbody > tr > td {\n    text-align: center;\n    vertical-align: top;\n    padding: 0 .75rem;\n}\n.p-organizationchart-node-content {\n    display: inline-block;\n    position: relative;\n}\n.p-organizationchart-node-content .p-node-toggler {\n    position: absolute;\n    bottom: -.75rem;\n    margin-left: -.75rem;\n    z-index: 2;\n    left: 50%;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    cursor: pointer;\n    width: 1.5rem;\n    height: 1.5rem;\n    text-decoration: none;\n}\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n    position: relative;\n    top: .25rem;\n}\n.p-organizationchart-line-down {\n    margin: 0 auto;\n    height: 20px;\n    width: 1px;\n}\n.p-organizationchart-line-right {\n    border-radius: 0px;\n}\n.p-organizationchart-line-left {\n    border-radius: 0;\n}\n.p-organizationchart-selectable-node {\n    cursor: pointer;\n}\n"),N.render=function(e,l,i,s,d,a){const c=n("OrganizationChartNode");return t(),o("div",z,[g(c,{node:i.value,templates:e.$slots,onNodeToggle:a.onNodeToggle,collapsedKeys:d.d_collapsedKeys,collapsible:i.collapsible,onNodeClick:a.onNodeClick,selectionMode:i.selectionMode,selectionKeys:i.selectionKeys},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys"])])};export{N as default};

package/organizationchart/organizationchart.js

@@ -83,80 +83,85 @@ this.primevue.organizationchart = (function (utils, vue) {
 
     const _hoisted_1$1 = { class: "p-organizationchart-table" };
     const _hoisted_2 = { key: 0 };
-    const _hoisted_3 = /*#__PURE__*/vue.createVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
-    const _hoisted_4 = /*#__PURE__*/vue.createVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+    const _hoisted_3 = ["colspan"];
+    const _hoisted_4 = ["colspan"];
+    const _hoisted_5 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+    const _hoisted_6 = [
+      _hoisted_5
+    ];
+    const _hoisted_7 = ["colspan"];
+    const _hoisted_8 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-organizationchart-line-down" }, null, -1);
+    const _hoisted_9 = [
+      _hoisted_8
+    ];
 
     function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       const _component_OrganizationChartNode = vue.resolveComponent("OrganizationChartNode", true);
 
-      return (vue.openBlock(), vue.createBlock("table", _hoisted_1$1, [
-        vue.createVNode("tbody", null, [
+      return (vue.openBlock(), vue.createElementBlock("table", _hoisted_1$1, [
+        vue.createElementVNode("tbody", null, [
           ($props.node)
-            ? (vue.openBlock(), vue.createBlock("tr", _hoisted_2, [
-                vue.createVNode("td", { colspan: $options.colspan }, [
-                  vue.createVNode("div", {
-                    class: $options.nodeContentClass,
-                    onClick: _cache[3] || (_cache[3] = (...args) => ($options.onNodeClick && $options.onNodeClick(...args)))
+            ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_2, [
+                vue.createElementVNode("td", { colspan: $options.colspan }, [
+                  vue.createElementVNode("div", {
+                    class: vue.normalizeClass($options.nodeContentClass),
+                    onClick: _cache[2] || (_cache[2] = (...args) => ($options.onNodeClick && $options.onNodeClick(...args)))
                   }, [
                     (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates[$props.node.type]||$props.templates['default']), { node: $props.node }, null, 8, ["node"])),
                     ($options.toggleable)
-                      ? (vue.openBlock(), vue.createBlock("a", {
+                      ? (vue.openBlock(), vue.createElementBlock("a", {
                           key: 0,
                           tabindex: "0",
                           class: "p-node-toggler",
-                          onClick: _cache[1] || (_cache[1] = (...args) => ($options.toggleNode && $options.toggleNode(...args))),
-                          onKeydown: _cache[2] || (_cache[2] = vue.withKeys((...args) => ($options.toggleNode && $options.toggleNode(...args)), ["enter"]))
+                          onClick: _cache[0] || (_cache[0] = (...args) => ($options.toggleNode && $options.toggleNode(...args))),
+                          onKeydown: _cache[1] || (_cache[1] = vue.withKeys((...args) => ($options.toggleNode && $options.toggleNode(...args)), ["enter"]))
                         }, [
-                          vue.createVNode("i", {
-                            class: ["p-node-toggler-icon pi", {'pi-chevron-down': $options.expanded, 'pi-chevron-up': !$options.expanded}]
+                          vue.createElementVNode("i", {
+                            class: vue.normalizeClass(["p-node-toggler-icon pi", {'pi-chevron-down': $options.expanded, 'pi-chevron-up': !$options.expanded}])
                           }, null, 2)
                         ], 32))
                       : vue.createCommentVNode("", true)
                   ], 2)
-                ], 8, ["colspan"])
+                ], 8, _hoisted_3)
               ]))
             : vue.createCommentVNode("", true),
-          vue.createVNode("tr", {
-            style: $options.childStyle,
+          vue.createElementVNode("tr", {
+            style: vue.normalizeStyle($options.childStyle),
             class: "p-organizationchart-lines"
           }, [
-            vue.createVNode("td", { colspan: $options.colspan }, [
-              _hoisted_3
-            ], 8, ["colspan"])
+            vue.createElementVNode("td", { colspan: $options.colspan }, _hoisted_6, 8, _hoisted_4)
           ], 4),
-          vue.createVNode("tr", {
-            style: $options.childStyle,
+          vue.createElementVNode("tr", {
+            style: vue.normalizeStyle($options.childStyle),
             class: "p-organizationchart-lines"
           }, [
             ($props.node.children && $props.node.children.length === 1)
-              ? (vue.openBlock(), vue.createBlock("td", {
+              ? (vue.openBlock(), vue.createElementBlock("td", {
                   key: 0,
                   colspan: $options.colspan
-                }, [
-                  _hoisted_4
-                ], 8, ["colspan"]))
+                }, _hoisted_9, 8, _hoisted_7))
               : vue.createCommentVNode("", true),
             ($props.node.children && $props.node.children.length > 1)
-              ? (vue.openBlock(true), vue.createBlock(vue.Fragment, { key: 1 }, vue.renderList($props.node.children, (child, i) => {
-                  return (vue.openBlock(), vue.createBlock(vue.Fragment, {
+              ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList($props.node.children, (child, i) => {
+                  return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
                     key: child.key
                   }, [
-                    vue.createVNode("td", {
-                      class: ["p-organizationchart-line-left", {'p-organizationchart-line-top': !(i === 0)}]
+                    vue.createElementVNode("td", {
+                      class: vue.normalizeClass(["p-organizationchart-line-left", {'p-organizationchart-line-top': !(i === 0)}])
                     }, " ", 2),
-                    vue.createVNode("td", {
-                      class: ["p-organizationchart-line-right", {'p-organizationchart-line-top': !(i === ($props.node.children.length - 1))}]
+                    vue.createElementVNode("td", {
+                      class: vue.normalizeClass(["p-organizationchart-line-right", {'p-organizationchart-line-top': !(i === ($props.node.children.length - 1))}])
                     }, " ", 2)
                   ], 64))
                 }), 128))
               : vue.createCommentVNode("", true)
           ], 4),
-          vue.createVNode("tr", {
-            style: $options.childStyle,
+          vue.createElementVNode("tr", {
+            style: vue.normalizeStyle($options.childStyle),
             class: "p-organizationchart-nodes"
           }, [
-            (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.node.children, (child) => {
-              return (vue.openBlock(), vue.createBlock("td", {
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.node.children, (child) => {
+              return (vue.openBlock(), vue.createElementBlock("td", {
                 key: child.key,
                 colspan: "2"
               }, [
@@ -263,7 +268,7 @@ this.primevue.organizationchart = (function (utils, vue) {
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       const _component_OrganizationChartNode = vue.resolveComponent("OrganizationChartNode");
 
-      return (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
+      return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         vue.createVNode(_component_OrganizationChartNode, {
           node: $props.value,
           templates: _ctx.$slots,
@@ -311,4 +316,4 @@ this.primevue.organizationchart = (function (utils, vue) {
 
     return script;
 
-}(primevue.utils, Vue));
+})(primevue.utils, Vue);

package/organizationchart/organizationchart.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.organizationchart=function(e,n){"use strict";var o={name:"OrganizationChartNode",emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{onNodeClick(n){e.DomHandler.hasClass(n.target,"p-node-toggler")||e.DomHandler.hasClass(n.target,"p-node-toggler-icon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick(e){this.$emit("node-click",e)},toggleNode(){this.$emit("node-toggle",this.node)},onChildNodeToggle(e){this.$emit("node-toggle",e)}},computed:{nodeContentClass(){return["p-organizationchart-node-content",this.node.styleClass,{"p-organizationchart-selectable-node":this.selectable,"p-highlight":this.selected}]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded(){return void 0===this.collapsedKeys[this.node.key]},selectable(){return this.selectionMode&&!1!==this.node.selectable},selected(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}}};const t={class:"p-organizationchart-table"},l={key:0},i=n.createVNode("div",{class:"p-organizationchart-line-down"},null,-1),s=n.createVNode("div",{class:"p-organizationchart-line-down"},null,-1);o.render=function(e,o,a,d,c,r){const p=n.resolveComponent("OrganizationChartNode",!0);return n.openBlock(),n.createBlock("table",t,[n.createVNode("tbody",null,[a.node?(n.openBlock(),n.createBlock("tr",l,[n.createVNode("td",{colspan:r.colspan},[n.createVNode("div",{class:r.nodeContentClass,onClick:o[3]||(o[3]=(...e)=>r.onNodeClick&&r.onNodeClick(...e))},[(n.openBlock(),n.createBlock(n.resolveDynamicComponent(a.templates[a.node.type]||a.templates.default),{node:a.node},null,8,["node"])),r.toggleable?(n.openBlock(),n.createBlock("a",{key:0,tabindex:"0",class:"p-node-toggler",onClick:o[1]||(o[1]=(...e)=>r.toggleNode&&r.toggleNode(...e)),onKeydown:o[2]||(o[2]=n.withKeys(((...e)=>r.toggleNode&&r.toggleNode(...e)),["enter"]))},[n.createVNode("i",{class:["p-node-toggler-icon pi",{"pi-chevron-down":r.expanded,"pi-chevron-up":!r.expanded}]},null,2)],32)):n.createCommentVNode("",!0)],2)],8,["colspan"])])):n.createCommentVNode("",!0),n.createVNode("tr",{style:r.childStyle,class:"p-organizationchart-lines"},[n.createVNode("td",{colspan:r.colspan},[i],8,["colspan"])],4),n.createVNode("tr",{style:r.childStyle,class:"p-organizationchart-lines"},[a.node.children&&1===a.node.children.length?(n.openBlock(),n.createBlock("td",{key:0,colspan:r.colspan},[s],8,["colspan"])):n.createCommentVNode("",!0),a.node.children&&a.node.children.length>1?(n.openBlock(!0),n.createBlock(n.Fragment,{key:1},n.renderList(a.node.children,((e,o)=>(n.openBlock(),n.createBlock(n.Fragment,{key:e.key},[n.createVNode("td",{class:["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===o)}]}," ",2),n.createVNode("td",{class:["p-organizationchart-line-right",{"p-organizationchart-line-top":!(o===a.node.children.length-1)}]}," ",2)],64)))),128)):n.createCommentVNode("",!0)],4),n.createVNode("tr",{style:r.childStyle,class:"p-organizationchart-nodes"},[(n.openBlock(!0),n.createBlock(n.Fragment,null,n.renderList(a.node.children,(e=>(n.openBlock(),n.createBlock("td",{key:e.key,colspan:"2"},[n.createVNode(p,{node:e,templates:a.templates,collapsedKeys:a.collapsedKeys,onNodeToggle:r.onChildNodeToggle,collapsible:a.collapsible,selectionMode:a.selectionMode,selectionKeys:a.selectionKeys,onNodeClick:r.onChildNodeClick},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick"])])))),128))],4)])])};var a={name:"OrganizationChart",emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},data(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys(e){this.d_collapsedKeys=e}},methods:{onNodeClick(e){const n=e.key;if(this.selectionMode){let o=this.selectionKeys?{...this.selectionKeys}:{};o[n]?(delete o[n],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(o={}),o[n]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",o)}},onNodeToggle(e){const n=e.key;this.d_collapsedKeys[n]?(delete this.d_collapsedKeys[n],this.$emit("node-expand",e)):(this.d_collapsedKeys[n]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys={...this.d_collapsedKeys},this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:o}};const d={class:"p-organizationchart p-component"};return function(e,n){void 0===n&&(n={});var o=n.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===o&&t.firstChild?t.insertBefore(l,t.firstChild):t.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-organizationchart-table {\n    border-spacing: 0;\n    border-collapse: separate;\n    margin: 0 auto;\n}\n.p-organizationchart-table > tbody > tr > td {\n    text-align: center;\n    vertical-align: top;\n    padding: 0 .75rem;\n}\n.p-organizationchart-node-content {\n    display: inline-block;\n    position: relative;\n}\n.p-organizationchart-node-content .p-node-toggler {\n    position: absolute;\n    bottom: -.75rem;\n    margin-left: -.75rem;\n    z-index: 2;\n    left: 50%;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    cursor: pointer;\n    width: 1.5rem;\n    height: 1.5rem;\n    text-decoration: none;\n}\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n    position: relative;\n    top: .25rem;\n}\n.p-organizationchart-line-down {\n    margin: 0 auto;\n    height: 20px;\n    width: 1px;\n}\n.p-organizationchart-line-right {\n    border-radius: 0px;\n}\n.p-organizationchart-line-left {\n    border-radius: 0;\n}\n.p-organizationchart-selectable-node {\n    cursor: pointer;\n}\n"),a.render=function(e,o,t,l,i,s){const a=n.resolveComponent("OrganizationChartNode");return n.openBlock(),n.createBlock("div",d,[n.createVNode(a,{node:t.value,templates:e.$slots,onNodeToggle:s.onNodeToggle,collapsedKeys:i.d_collapsedKeys,collapsible:t.collapsible,onNodeClick:s.onNodeClick,selectionMode:t.selectionMode,selectionKeys:t.selectionKeys},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys"])])},a}(primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.organizationchart=function(e,n){"use strict";var t={name:"OrganizationChartNode",emits:["node-click","node-toggle"],props:{node:{type:null,default:null},templates:{type:null,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null}},methods:{onNodeClick(n){e.DomHandler.hasClass(n.target,"p-node-toggler")||e.DomHandler.hasClass(n.target,"p-node-toggler-icon")||this.selectionMode&&this.$emit("node-click",this.node)},onChildNodeClick(e){this.$emit("node-click",e)},toggleNode(){this.$emit("node-toggle",this.node)},onChildNodeToggle(e){this.$emit("node-toggle",e)}},computed:{nodeContentClass(){return["p-organizationchart-node-content",this.node.styleClass,{"p-organizationchart-selectable-node":this.selectable,"p-highlight":this.selected}]},leaf(){return!1!==this.node.leaf&&!(this.node.children&&this.node.children.length)},colspan(){return this.node.children&&this.node.children.length?2*this.node.children.length:null},childStyle(){return{visibility:!this.leaf&&this.expanded?"inherit":"hidden"}},expanded(){return void 0===this.collapsedKeys[this.node.key]},selectable(){return this.selectionMode&&!1!==this.node.selectable},selected(){return this.selectable&&this.selectionKeys&&!0===this.selectionKeys[this.node.key]},toggleable(){return this.collapsible&&!1!==this.node.collapsible&&!this.leaf}}};const o={class:"p-organizationchart-table"},l={key:0},i=["colspan"],s=["colspan"],a=[n.createElementVNode("div",{class:"p-organizationchart-line-down"},null,-1)],d=["colspan"],c=[n.createElementVNode("div",{class:"p-organizationchart-line-down"},null,-1)];t.render=function(e,t,r,p,h,g){const m=n.resolveComponent("OrganizationChartNode",!0);return n.openBlock(),n.createElementBlock("table",o,[n.createElementVNode("tbody",null,[r.node?(n.openBlock(),n.createElementBlock("tr",l,[n.createElementVNode("td",{colspan:g.colspan},[n.createElementVNode("div",{class:n.normalizeClass(g.nodeContentClass),onClick:t[2]||(t[2]=(...e)=>g.onNodeClick&&g.onNodeClick(...e))},[(n.openBlock(),n.createBlock(n.resolveDynamicComponent(r.templates[r.node.type]||r.templates.default),{node:r.node},null,8,["node"])),g.toggleable?(n.openBlock(),n.createElementBlock("a",{key:0,tabindex:"0",class:"p-node-toggler",onClick:t[0]||(t[0]=(...e)=>g.toggleNode&&g.toggleNode(...e)),onKeydown:t[1]||(t[1]=n.withKeys(((...e)=>g.toggleNode&&g.toggleNode(...e)),["enter"]))},[n.createElementVNode("i",{class:n.normalizeClass(["p-node-toggler-icon pi",{"pi-chevron-down":g.expanded,"pi-chevron-up":!g.expanded}])},null,2)],32)):n.createCommentVNode("",!0)],2)],8,i)])):n.createCommentVNode("",!0),n.createElementVNode("tr",{style:n.normalizeStyle(g.childStyle),class:"p-organizationchart-lines"},[n.createElementVNode("td",{colspan:g.colspan},a,8,s)],4),n.createElementVNode("tr",{style:n.normalizeStyle(g.childStyle),class:"p-organizationchart-lines"},[r.node.children&&1===r.node.children.length?(n.openBlock(),n.createElementBlock("td",{key:0,colspan:g.colspan},c,8,d)):n.createCommentVNode("",!0),r.node.children&&r.node.children.length>1?(n.openBlock(!0),n.createElementBlock(n.Fragment,{key:1},n.renderList(r.node.children,((e,t)=>(n.openBlock(),n.createElementBlock(n.Fragment,{key:e.key},[n.createElementVNode("td",{class:n.normalizeClass(["p-organizationchart-line-left",{"p-organizationchart-line-top":!(0===t)}])}," ",2),n.createElementVNode("td",{class:n.normalizeClass(["p-organizationchart-line-right",{"p-organizationchart-line-top":!(t===r.node.children.length-1)}])}," ",2)],64)))),128)):n.createCommentVNode("",!0)],4),n.createElementVNode("tr",{style:n.normalizeStyle(g.childStyle),class:"p-organizationchart-nodes"},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(r.node.children,(e=>(n.openBlock(),n.createElementBlock("td",{key:e.key,colspan:"2"},[n.createVNode(m,{node:e,templates:r.templates,collapsedKeys:r.collapsedKeys,onNodeToggle:g.onChildNodeToggle,collapsible:r.collapsible,selectionMode:r.selectionMode,selectionKeys:r.selectionKeys,onNodeClick:g.onChildNodeClick},null,8,["node","templates","collapsedKeys","onNodeToggle","collapsible","selectionMode","selectionKeys","onNodeClick"])])))),128))],4)])])};var r={name:"OrganizationChart",emits:["node-unselect","node-select","update:selectionKeys","node-expand","node-collapse","update:collapsedKeys"],props:{value:{type:null,default:null},selectionKeys:{type:null,default:null},selectionMode:{type:String,default:null},collapsible:{type:Boolean,default:!1},collapsedKeys:{type:null,default:null}},data(){return{d_collapsedKeys:this.collapsedKeys||{}}},watch:{collapsedKeys(e){this.d_collapsedKeys=e}},methods:{onNodeClick(e){const n=e.key;if(this.selectionMode){let t=this.selectionKeys?{...this.selectionKeys}:{};t[n]?(delete t[n],this.$emit("node-unselect",e)):("single"===this.selectionMode&&(t={}),t[n]=!0,this.$emit("node-select",e)),this.$emit("update:selectionKeys",t)}},onNodeToggle(e){const n=e.key;this.d_collapsedKeys[n]?(delete this.d_collapsedKeys[n],this.$emit("node-expand",e)):(this.d_collapsedKeys[n]=!0,this.$emit("node-collapse",e)),this.d_collapsedKeys={...this.d_collapsedKeys},this.$emit("update:collapsedKeys",this.d_collapsedKeys)}},components:{OrganizationChartNode:t}};const p={class:"p-organizationchart p-component"};return function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-organizationchart-table {\n    border-spacing: 0;\n    border-collapse: separate;\n    margin: 0 auto;\n}\n.p-organizationchart-table > tbody > tr > td {\n    text-align: center;\n    vertical-align: top;\n    padding: 0 .75rem;\n}\n.p-organizationchart-node-content {\n    display: inline-block;\n    position: relative;\n}\n.p-organizationchart-node-content .p-node-toggler {\n    position: absolute;\n    bottom: -.75rem;\n    margin-left: -.75rem;\n    z-index: 2;\n    left: 50%;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    cursor: pointer;\n    width: 1.5rem;\n    height: 1.5rem;\n    text-decoration: none;\n}\n.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n    position: relative;\n    top: .25rem;\n}\n.p-organizationchart-line-down {\n    margin: 0 auto;\n    height: 20px;\n    width: 1px;\n}\n.p-organizationchart-line-right {\n    border-radius: 0px;\n}\n.p-organizationchart-line-left {\n    border-radius: 0;\n}\n.p-organizationchart-selectable-node {\n    cursor: pointer;\n}\n"),r.render=function(e,t,o,l,i,s){const a=n.resolveComponent("OrganizationChartNode");return n.openBlock(),n.createElementBlock("div",p,[n.createVNode(a,{node:o.value,templates:e.$slots,onNodeToggle:s.onNodeToggle,collapsedKeys:i.d_collapsedKeys,collapsible:o.collapsible,onNodeClick:s.onNodeClick,selectionMode:o.selectionMode,selectionKeys:o.selectionKeys},null,8,["node","templates","onNodeToggle","collapsedKeys","collapsible","onNodeClick","selectionMode","selectionKeys"])])},r}(primevue.utils,Vue);

package/overlayeventbus/overlayeventbus.esm.js

@@ -2,4 +2,4 @@ import { EventBus } from 'primevue/utils';
 
 var OverlayEventBus = EventBus();
 
-export default OverlayEventBus;
+export { OverlayEventBus as default };

package/overlayeventbus/overlayeventbus.esm.min.js

@@ -1 +1 @@
-import{EventBus as r}from"primevue/utils";var e=r();export default e;
+import{EventBus as r}from"primevue/utils";var e=r();export{e as default};

package/overlayeventbus/overlayeventbus.js

@@ -6,4 +6,4 @@ this.primevue.overlayeventbus = (function (utils) {
 
 	return OverlayEventBus;
 
-}(primevue.utils));
+})(primevue.utils);

package/overlaypanel/OverlayPanel.vue

@@ -1,5 +1,5 @@
 <template>
-    <Teleport :to="appendTo">
+    <Portal :appendTo="appendTo">
         <transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave" @after-leave="onAfterLeave">
             <div :class="containerClass" v-if="visible" :ref="containerRef" v-bind="$attrs" @click="onOverlayClick">
                 <div class="p-overlaypanel-content" @click="onContentClick" @mousedown="onContentClick">
@@ -10,13 +10,14 @@
                 </button>
             </div>
         </transition>
-    </Teleport>
+    </Portal>
 </template>
 
 <script>
 import {UniqueComponentId,DomHandler,ConnectedOverlayScrollHandler,ZIndexUtils} from 'primevue/utils';
 import OverlayEventBus from 'primevue/overlayeventbus';
 import Ripple from 'primevue/ripple';
+import Portal from 'primevue/portal';
 
 export default {
     name: 'OverlayPanel',
@@ -202,7 +203,7 @@ export default {
         bindResizeListener() {
             if (!this.resizeListener) {
                 this.resizeListener = () => {
-                    if (this.visible && !DomHandler.isAndroid()) {
+                    if (this.visible && !DomHandler.isTouchDevice()) {
                         this.visible = false;
                     }
                 };
@@ -267,6 +268,9 @@ export default {
     },
     directives: {
         'ripple': Ripple
+    },
+    components: {
+        'Portal': Portal
     }
 }
 </script>