primevue 3.12.4 → 3.13.0

package/tieredmenu/tieredmenu.js

@@ -1,10 +1,11 @@
 this.primevue = this.primevue || {};
-this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
+this.primevue.tieredmenu = (function (utils, OverlayEventBus, Portal, Ripple, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
     var OverlayEventBus__default = /*#__PURE__*/_interopDefaultLegacy(OverlayEventBus);
+    var Portal__default = /*#__PURE__*/_interopDefaultLegacy(Portal);
     var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
 
     var script$1 = {
@@ -219,13 +220,16 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
             }
         },
         directives: {
-            'ripple': Ripple__default['default']
+            'ripple': Ripple__default["default"]
         }
     };
 
-    const _hoisted_1 = { class: "p-menuitem-text" };
-    const _hoisted_2 = { class: "p-menuitem-text" };
-    const _hoisted_3 = {
+    const _hoisted_1 = ["onMouseenter"];
+    const _hoisted_2 = ["href", "onClick", "onKeydown"];
+    const _hoisted_3 = { class: "p-menuitem-text" };
+    const _hoisted_4 = ["href", "target", "aria-haspopup", "aria-expanded", "onClick", "onKeydown", "tabindex"];
+    const _hoisted_5 = { class: "p-menuitem-text" };
+    const _hoisted_6 = {
       key: 0,
       class: "p-submenu-icon pi pi-angle-right"
     };
@@ -235,26 +239,26 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
       const _component_TieredMenuSub = vue.resolveComponent("TieredMenuSub", true);
       const _directive_ripple = vue.resolveDirective("ripple");
 
-      return (vue.openBlock(), vue.createBlock("ul", {
+      return (vue.openBlock(), vue.createElementBlock("ul", {
         ref: "element",
-        class: $options.containerClass,
+        class: vue.normalizeClass($options.containerClass),
         role: "'menubar' : 'menu'",
         "aria-orientation": "horizontal"
       }, [
-        (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.model, (item, i) => {
-          return (vue.openBlock(), vue.createBlock(vue.Fragment, {
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.model, (item, i) => {
+          return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
             key: $options.label(item) + i.toString()
           }, [
             ($options.visible(item) && !item.separator)
-              ? (vue.openBlock(), vue.createBlock("li", {
+              ? (vue.openBlock(), vue.createElementBlock("li", {
                   key: 0,
-                  class: $options.getItemClass(item),
-                  style: item.style,
+                  class: vue.normalizeClass($options.getItemClass(item)),
+                  style: vue.normalizeStyle(item.style),
                   onMouseenter: $event => ($options.onItemMouseEnter($event, item)),
                   role: "none"
                 }, [
                   (!$props.template)
-                    ? (vue.openBlock(), vue.createBlock(vue.Fragment, { key: 0 }, [
+                    ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
                         (item.to && !$options.disabled(item))
                           ? (vue.openBlock(), vue.createBlock(_component_router_link, {
                               key: 0,
@@ -262,27 +266,27 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                               custom: ""
                             }, {
                               default: vue.withCtx(({navigate, href, isActive, isExactActive}) => [
-                                vue.withDirectives(vue.createVNode("a", {
+                                vue.withDirectives((vue.openBlock(), vue.createElementBlock("a", {
                                   href: href,
                                   onClick: $event => ($options.onItemClick($event, item, navigate)),
-                                  class: $options.linkClass(item, {isActive, isExactActive}),
+                                  class: vue.normalizeClass($options.linkClass(item, {isActive, isExactActive})),
                                   onKeydown: $event => ($options.onItemKeyDown($event, item)),
                                   role: "menuitem"
                                 }, [
-                                  vue.createVNode("span", {
-                                    class: ['p-menuitem-icon', item.icon]
+                                  vue.createElementVNode("span", {
+                                    class: vue.normalizeClass(['p-menuitem-icon', item.icon])
                                   }, null, 2),
-                                  vue.createVNode("span", _hoisted_1, vue.toDisplayString($options.label(item)), 1)
-                                ], 42, ["href", "onClick", "onKeydown"]), [
+                                  vue.createElementVNode("span", _hoisted_3, vue.toDisplayString($options.label(item)), 1)
+                                ], 42, _hoisted_2)), [
                                   [_directive_ripple]
                                 ])
                               ]),
                               _: 2
                             }, 1032, ["to"]))
-                          : vue.withDirectives((vue.openBlock(), vue.createBlock("a", {
+                          : vue.withDirectives((vue.openBlock(), vue.createElementBlock("a", {
                               key: 1,
                               href: item.url,
-                              class: $options.linkClass(item),
+                              class: vue.normalizeClass($options.linkClass(item)),
                               target: item.target,
                               "aria-haspopup": item.items != null,
                               "aria-expanded": item === $data.activeItem,
@@ -291,14 +295,14 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                               role: "menuitem",
                               tabindex: $options.disabled(item) ? null : '0'
                             }, [
-                              vue.createVNode("span", {
-                                class: ['p-menuitem-icon', item.icon]
+                              vue.createElementVNode("span", {
+                                class: vue.normalizeClass(['p-menuitem-icon', item.icon])
                               }, null, 2),
-                              vue.createVNode("span", _hoisted_2, vue.toDisplayString($options.label(item)), 1),
+                              vue.createElementVNode("span", _hoisted_5, vue.toDisplayString($options.label(item)), 1),
                               (item.items)
-                                ? (vue.openBlock(), vue.createBlock("span", _hoisted_3))
+                                ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_6))
                                 : vue.createCommentVNode("", true)
-                            ], 42, ["href", "target", "aria-haspopup", "aria-expanded", "onClick", "onKeydown", "tabindex"])), [
+                            ], 42, _hoisted_4)), [
                               [_directive_ripple]
                             ])
                       ], 64))
@@ -317,12 +321,12 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                         exact: $props.exact
                       }, null, 8, ["model", "template", "onLeafClick", "onKeydownItem", "parentActive", "exact"]))
                     : vue.createCommentVNode("", true)
-                ], 46, ["onMouseenter"]))
+                ], 46, _hoisted_1))
               : vue.createCommentVNode("", true),
             ($options.visible(item) && item.separator)
-              ? (vue.openBlock(), vue.createBlock("li", {
-                  class: ['p-menu-separator', item.class],
-                  style: item.style,
+              ? (vue.openBlock(), vue.createElementBlock("li", {
+                  class: vue.normalizeClass(['p-menu-separator', item.class]),
+                  style: vue.normalizeStyle(item.style),
                   key: 'separator' + i.toString(),
                   role: "separator"
                 }, null, 6))
@@ -468,7 +472,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
             bindResizeListener() {
                 if (!this.resizeListener) {
                     this.resizeListener = () => {
-                        if (this.visible) {
+                        if (this.visible && !utils.DomHandler.isTouchDevice()) {
                             this.hide();
                         }
                     };
@@ -493,7 +497,7 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
                 this.container = el;
             },
             onOverlayClick(event) {
-                OverlayEventBus__default['default'].emit('overlay-click', {
+                OverlayEventBus__default["default"].emit('overlay-click', {
                     originalEvent: event,
                     target: this.target
                 });
@@ -509,46 +513,51 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
             }
         },
         components: {
-            'TieredMenuSub': script$1
+            'TieredMenuSub': script$1,
+            'Portal': Portal__default["default"]
         }
     };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       const _component_TieredMenuSub = vue.resolveComponent("TieredMenuSub");
+      const _component_Portal = vue.resolveComponent("Portal");
 
-      return (vue.openBlock(), vue.createBlock(vue.Teleport, {
-        to: $props.appendTo,
+      return (vue.openBlock(), vue.createBlock(_component_Portal, {
+        appendTo: $props.appendTo,
         disabled: !$props.popup
-      }, [
-        vue.createVNode(vue.Transition, {
-          name: "p-connected-overlay",
-          onEnter: $options.onEnter,
-          onLeave: $options.onLeave,
-          onAfterLeave: $options.onAfterLeave
-        }, {
-          default: vue.withCtx(() => [
-            ($props.popup ? $data.visible : true)
-              ? (vue.openBlock(), vue.createBlock("div", vue.mergeProps({
-                  key: 0,
-                  ref: $options.containerRef,
-                  class: $options.containerClass
-                }, _ctx.$attrs, {
-                  onClick: _cache[1] || (_cache[1] = (...args) => ($options.onOverlayClick && $options.onOverlayClick(...args)))
-                }), [
-                  vue.createVNode(_component_TieredMenuSub, {
-                    model: $props.model,
-                    root: true,
-                    popup: $props.popup,
-                    onLeafClick: $options.onLeafClick,
-                    template: _ctx.$slots.item,
-                    exact: $props.exact
-                  }, null, 8, ["model", "popup", "onLeafClick", "template", "exact"])
-                ], 16))
-              : vue.createCommentVNode("", true)
-          ]),
-          _: 1
-        }, 8, ["onEnter", "onLeave", "onAfterLeave"])
-      ], 8, ["to", "disabled"]))
+      }, {
+        default: vue.withCtx(() => [
+          vue.createVNode(vue.Transition, {
+            name: "p-connected-overlay",
+            onEnter: $options.onEnter,
+            onLeave: $options.onLeave,
+            onAfterLeave: $options.onAfterLeave
+          }, {
+            default: vue.withCtx(() => [
+              ($props.popup ? $data.visible : true)
+                ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+                    key: 0,
+                    ref: $options.containerRef,
+                    class: $options.containerClass
+                  }, _ctx.$attrs, {
+                    onClick: _cache[0] || (_cache[0] = (...args) => ($options.onOverlayClick && $options.onOverlayClick(...args)))
+                  }), [
+                    vue.createVNode(_component_TieredMenuSub, {
+                      model: $props.model,
+                      root: true,
+                      popup: $props.popup,
+                      onLeafClick: $options.onLeafClick,
+                      template: _ctx.$slots.item,
+                      exact: $props.exact
+                    }, null, 8, ["model", "popup", "onLeafClick", "template", "exact"])
+                  ], 16))
+                : vue.createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["onEnter", "onLeave", "onAfterLeave"])
+        ]),
+        _: 1
+      }, 8, ["appendTo", "disabled"]))
     }
 
     function styleInject(css, ref) {
@@ -585,4 +594,4 @@ this.primevue.tieredmenu = (function (utils, OverlayEventBus, Ripple, vue) {
 
     return script;
 
-}(primevue.utils, primevue.overlayeventbus, primevue.ripple, Vue));
+})(primevue.utils, primevue.overlayeventbus, primevue.portal, primevue.ripple, Vue);

package/tieredmenu/tieredmenu.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.tieredmenu=function(e,t,i,n){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=l(t),o={name:"TieredMenuSub",emits:["leaf-click","keydown-item"],props:{model:{type:Array,default:null},root:{type:Boolean,default:!1},popup:{type:Boolean,default:!1},parentActive:{type:Boolean,default:!1},template:{type:Function,default:null},exact:{type:Boolean,default:!0}},documentClickListener:null,watch:{parentActive(e){e||(this.activeItem=null)}},data:()=>({activeItem:null}),updated(){this.root&&this.activeItem&&this.bindDocumentClickListener()},beforeUnmount(){this.unbindDocumentClickListener()},methods:{onItemMouseEnter(e,t){this.disabled(t)?e.preventDefault():this.root?(this.activeItem||this.popup)&&(this.activeItem=t):this.activeItem=t},onItemClick(e,t,i){this.disabled(t)?e.preventDefault():(t.command&&t.command({originalEvent:e,item:t}),t.items&&(this.activeItem&&t===this.activeItem?this.activeItem=null:this.activeItem=t),t.items||this.onLeafClick(),t.to&&i&&i(e))},onLeafClick(){this.activeItem=null,this.$emit("leaf-click")},onItemKeyDown(e,t){let i=e.currentTarget.parentElement;switch(e.which){case 40:var n=this.findNextItem(i);n&&n.children[0].focus(),e.preventDefault();break;case 38:var l=this.findPrevItem(i);l&&l.children[0].focus(),e.preventDefault();break;case 39:t.items&&(this.activeItem=t,setTimeout((()=>{i.children[1].children[0].children[0].focus()}),50)),e.preventDefault()}this.$emit("keydown-item",{originalEvent:e,element:i})},onChildItemKeyDown(e){37===e.originalEvent.which&&(this.activeItem=null,e.element.parentElement.previousElementSibling.focus())},findNextItem(t){let i=t.nextElementSibling;return i?e.DomHandler.hasClass(i,"p-disabled")||!e.DomHandler.hasClass(i,"p-menuitem")?this.findNextItem(i):i:null},findPrevItem(t){let i=t.previousElementSibling;return i?e.DomHandler.hasClass(i,"p-disabled")||!e.DomHandler.hasClass(i,"p-menuitem")?this.findPrevItem(i):i:null},getItemClass(e){return["p-menuitem",e.class,{"p-menuitem-active":this.activeItem===e}]},linkClass(e,t){return["p-menuitem-link",{"p-disabled":this.disabled(e),"router-link-active":t&&t.isActive,"router-link-active-exact":this.exact&&t&&t.isExactActive}]},bindDocumentClickListener(){this.documentClickListener||(this.documentClickListener=e=>{this.$el&&!this.$el.contains(e.target)&&(this.activeItem=null,this.unbindDocumentClickListener())},document.addEventListener("click",this.documentClickListener))},unbindDocumentClickListener(){this.documentClickListener&&(document.removeEventListener("click",this.documentClickListener),this.documentClickListener=null)},visible:e=>"function"==typeof e.visible?e.visible():!1!==e.visible,disabled:e=>"function"==typeof e.disabled?e.disabled():e.disabled,label:e=>"function"==typeof e.label?e.label():e.label},computed:{containerClass(){return{"p-submenu-list":!this.root}}},directives:{ripple:l(i).default}};const r={class:"p-menuitem-text"},a={class:"p-menuitem-text"},c={key:0,class:"p-submenu-icon pi pi-angle-right"};o.render=function(e,t,i,l,s,o){const d=n.resolveComponent("router-link"),u=n.resolveComponent("TieredMenuSub",!0),m=n.resolveDirective("ripple");return n.openBlock(),n.createBlock("ul",{ref:"element",class:o.containerClass,role:"'menubar' : 'menu'","aria-orientation":"horizontal"},[(n.openBlock(!0),n.createBlock(n.Fragment,null,n.renderList(i.model,((e,t)=>(n.openBlock(),n.createBlock(n.Fragment,{key:o.label(e)+t.toString()},[o.visible(e)&&!e.separator?(n.openBlock(),n.createBlock("li",{key:0,class:o.getItemClass(e),style:e.style,onMouseenter:t=>o.onItemMouseEnter(t,e),role:"none"},[i.template?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(i.template),{key:1,item:e},null,8,["item"])):(n.openBlock(),n.createBlock(n.Fragment,{key:0},[e.to&&!o.disabled(e)?(n.openBlock(),n.createBlock(d,{key:0,to:e.to,custom:""},{default:n.withCtx((({navigate:t,href:i,isActive:l,isExactActive:s})=>[n.withDirectives(n.createVNode("a",{href:i,onClick:i=>o.onItemClick(i,e,t),class:o.linkClass(e,{isActive:l,isExactActive:s}),onKeydown:t=>o.onItemKeyDown(t,e),role:"menuitem"},[n.createVNode("span",{class:["p-menuitem-icon",e.icon]},null,2),n.createVNode("span",r,n.toDisplayString(o.label(e)),1)],42,["href","onClick","onKeydown"]),[[m]])])),_:2},1032,["to"])):n.withDirectives((n.openBlock(),n.createBlock("a",{key:1,href:e.url,class:o.linkClass(e),target:e.target,"aria-haspopup":null!=e.items,"aria-expanded":e===s.activeItem,onClick:t=>o.onItemClick(t,e),onKeydown:t=>o.onItemKeyDown(t,e),role:"menuitem",tabindex:o.disabled(e)?null:"0"},[n.createVNode("span",{class:["p-menuitem-icon",e.icon]},null,2),n.createVNode("span",a,n.toDisplayString(o.label(e)),1),e.items?(n.openBlock(),n.createBlock("span",c)):n.createCommentVNode("",!0)],42,["href","target","aria-haspopup","aria-expanded","onClick","onKeydown","tabindex"])),[[m]])],64)),o.visible(e)&&e.items?(n.openBlock(),n.createBlock(u,{model:e.items,key:o.label(e)+"_sub_",template:i.template,onLeafClick:o.onLeafClick,onKeydownItem:o.onChildItemKeyDown,parentActive:e===s.activeItem,exact:i.exact},null,8,["model","template","onLeafClick","onKeydownItem","parentActive","exact"])):n.createCommentVNode("",!0)],46,["onMouseenter"])):n.createCommentVNode("",!0),o.visible(e)&&e.separator?(n.openBlock(),n.createBlock("li",{class:["p-menu-separator",e.class],style:e.style,key:"separator"+t.toString(),role:"separator"},null,6)):n.createCommentVNode("",!0)],64)))),128))],2)};var d={name:"TieredMenu",inheritAttrs:!1,props:{popup:{type:Boolean,default:!1},model:{type:Array,default:null},appendTo:{type:String,default:"body"},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},exact:{type:Boolean,default:!0}},target:null,container:null,outsideClickListener:null,scrollHandler:null,resizeListener:null,data:()=>({visible:!1}),beforeUnmount(){this.unbindResizeListener(),this.unbindOutsideClickListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.target=null,this.container&&this.autoZIndex&&e.ZIndexUtils.clear(this.container),this.container=null},methods:{itemClick(e){const t=e.item;t.command&&(t.command(e),e.originalEvent.preventDefault()),this.hide()},toggle(e){this.visible?this.hide():this.show(e)},show(e){this.visible=!0,this.target=e.currentTarget},hide(){this.visible=!1},onEnter(t){this.alignOverlay(),this.bindOutsideClickListener(),this.bindResizeListener(),this.bindScrollListener(),this.autoZIndex&&e.ZIndexUtils.set("menu",t,this.baseZIndex+this.$primevue.config.zIndex.menu)},onLeave(){this.unbindOutsideClickListener(),this.unbindResizeListener(),this.unbindScrollListener()},onAfterLeave(t){this.autoZIndex&&e.ZIndexUtils.clear(t)},alignOverlay(){e.DomHandler.absolutePosition(this.container,this.target),this.container.style.minWidth=e.DomHandler.getOuterWidth(this.target)+"px"},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.visible&&this.container&&!this.container.contains(e.target)&&!this.isTargetClicked(e)&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener(){this.scrollHandler||(this.scrollHandler=new e.ConnectedOverlayScrollHandler(this.target,(()=>{this.visible&&this.hide()}))),this.scrollHandler.bindScrollListener()},unbindScrollListener(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener(){this.resizeListener||(this.resizeListener=()=>{this.visible&&this.hide()},window.addEventListener("resize",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},isTargetClicked(e){return this.target&&(this.target===e.target||this.target.contains(e.target))},onLeafClick(){this.popup&&this.hide()},containerRef(e){this.container=e},onOverlayClick(e){s.default.emit("overlay-click",{originalEvent:e,target:this.target})}},computed:{containerClass(){return["p-tieredmenu p-component",{"p-tieredmenu-overlay":this.popup,"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]}},components:{TieredMenuSub:o}};return function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-tieredmenu-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-tieredmenu ul {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n.p-tieredmenu .p-submenu-list {\n    position: absolute;\n    min-width: 100%;\n    z-index: 1;\n    display: none;\n}\n.p-tieredmenu .p-menuitem-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    text-decoration: none;\n    overflow: hidden;\n    position: relative;\n}\n.p-tieredmenu .p-menuitem-text {\n    line-height: 1;\n}\n.p-tieredmenu .p-menuitem {\n    position: relative;\n}\n.p-tieredmenu .p-menuitem-link .p-submenu-icon {\n    margin-left: auto;\n}\n.p-tieredmenu .p-menuitem-active > .p-submenu-list {\n    display: block;\n    left: 100%;\n    top: 0;\n}\n"),d.render=function(e,t,i,l,s,o){const r=n.resolveComponent("TieredMenuSub");return n.openBlock(),n.createBlock(n.Teleport,{to:i.appendTo,disabled:!i.popup},[n.createVNode(n.Transition,{name:"p-connected-overlay",onEnter:o.onEnter,onLeave:o.onLeave,onAfterLeave:o.onAfterLeave},{default:n.withCtx((()=>[!i.popup||s.visible?(n.openBlock(),n.createBlock("div",n.mergeProps({key:0,ref:o.containerRef,class:o.containerClass},e.$attrs,{onClick:t[1]||(t[1]=(...e)=>o.onOverlayClick&&o.onOverlayClick(...e))}),[n.createVNode(r,{model:i.model,root:!0,popup:i.popup,onLeafClick:o.onLeafClick,template:e.$slots.item,exact:i.exact},null,8,["model","popup","onLeafClick","template","exact"])],16)):n.createCommentVNode("",!0)])),_:1},8,["onEnter","onLeave","onAfterLeave"])],8,["to","disabled"])},d}(primevue.utils,primevue.overlayeventbus,primevue.ripple,Vue);
+this.primevue=this.primevue||{},this.primevue.tieredmenu=function(e,t,i,n,l){"use strict";function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=s(t),r=s(i),a={name:"TieredMenuSub",emits:["leaf-click","keydown-item"],props:{model:{type:Array,default:null},root:{type:Boolean,default:!1},popup:{type:Boolean,default:!1},parentActive:{type:Boolean,default:!1},template:{type:Function,default:null},exact:{type:Boolean,default:!0}},documentClickListener:null,watch:{parentActive(e){e||(this.activeItem=null)}},data:()=>({activeItem:null}),updated(){this.root&&this.activeItem&&this.bindDocumentClickListener()},beforeUnmount(){this.unbindDocumentClickListener()},methods:{onItemMouseEnter(e,t){this.disabled(t)?e.preventDefault():this.root?(this.activeItem||this.popup)&&(this.activeItem=t):this.activeItem=t},onItemClick(e,t,i){this.disabled(t)?e.preventDefault():(t.command&&t.command({originalEvent:e,item:t}),t.items&&(this.activeItem&&t===this.activeItem?this.activeItem=null:this.activeItem=t),t.items||this.onLeafClick(),t.to&&i&&i(e))},onLeafClick(){this.activeItem=null,this.$emit("leaf-click")},onItemKeyDown(e,t){let i=e.currentTarget.parentElement;switch(e.which){case 40:var n=this.findNextItem(i);n&&n.children[0].focus(),e.preventDefault();break;case 38:var l=this.findPrevItem(i);l&&l.children[0].focus(),e.preventDefault();break;case 39:t.items&&(this.activeItem=t,setTimeout((()=>{i.children[1].children[0].children[0].focus()}),50)),e.preventDefault()}this.$emit("keydown-item",{originalEvent:e,element:i})},onChildItemKeyDown(e){37===e.originalEvent.which&&(this.activeItem=null,e.element.parentElement.previousElementSibling.focus())},findNextItem(t){let i=t.nextElementSibling;return i?e.DomHandler.hasClass(i,"p-disabled")||!e.DomHandler.hasClass(i,"p-menuitem")?this.findNextItem(i):i:null},findPrevItem(t){let i=t.previousElementSibling;return i?e.DomHandler.hasClass(i,"p-disabled")||!e.DomHandler.hasClass(i,"p-menuitem")?this.findPrevItem(i):i:null},getItemClass(e){return["p-menuitem",e.class,{"p-menuitem-active":this.activeItem===e}]},linkClass(e,t){return["p-menuitem-link",{"p-disabled":this.disabled(e),"router-link-active":t&&t.isActive,"router-link-active-exact":this.exact&&t&&t.isExactActive}]},bindDocumentClickListener(){this.documentClickListener||(this.documentClickListener=e=>{this.$el&&!this.$el.contains(e.target)&&(this.activeItem=null,this.unbindDocumentClickListener())},document.addEventListener("click",this.documentClickListener))},unbindDocumentClickListener(){this.documentClickListener&&(document.removeEventListener("click",this.documentClickListener),this.documentClickListener=null)},visible:e=>"function"==typeof e.visible?e.visible():!1!==e.visible,disabled:e=>"function"==typeof e.disabled?e.disabled():e.disabled,label:e=>"function"==typeof e.label?e.label():e.label},computed:{containerClass(){return{"p-submenu-list":!this.root}}},directives:{ripple:s(n).default}};const c=["onMouseenter"],d=["href","onClick","onKeydown"],m={class:"p-menuitem-text"},u=["href","target","aria-haspopup","aria-expanded","onClick","onKeydown","tabindex"],p={class:"p-menuitem-text"},h={key:0,class:"p-submenu-icon pi pi-angle-right"};a.render=function(e,t,i,n,s,o){const r=l.resolveComponent("router-link"),a=l.resolveComponent("TieredMenuSub",!0),v=l.resolveDirective("ripple");return l.openBlock(),l.createElementBlock("ul",{ref:"element",class:l.normalizeClass(o.containerClass),role:"'menubar' : 'menu'","aria-orientation":"horizontal"},[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(i.model,((e,t)=>(l.openBlock(),l.createElementBlock(l.Fragment,{key:o.label(e)+t.toString()},[o.visible(e)&&!e.separator?(l.openBlock(),l.createElementBlock("li",{key:0,class:l.normalizeClass(o.getItemClass(e)),style:l.normalizeStyle(e.style),onMouseenter:t=>o.onItemMouseEnter(t,e),role:"none"},[i.template?(l.openBlock(),l.createBlock(l.resolveDynamicComponent(i.template),{key:1,item:e},null,8,["item"])):(l.openBlock(),l.createElementBlock(l.Fragment,{key:0},[e.to&&!o.disabled(e)?(l.openBlock(),l.createBlock(r,{key:0,to:e.to,custom:""},{default:l.withCtx((({navigate:t,href:i,isActive:n,isExactActive:s})=>[l.withDirectives((l.openBlock(),l.createElementBlock("a",{href:i,onClick:i=>o.onItemClick(i,e,t),class:l.normalizeClass(o.linkClass(e,{isActive:n,isExactActive:s})),onKeydown:t=>o.onItemKeyDown(t,e),role:"menuitem"},[l.createElementVNode("span",{class:l.normalizeClass(["p-menuitem-icon",e.icon])},null,2),l.createElementVNode("span",m,l.toDisplayString(o.label(e)),1)],42,d)),[[v]])])),_:2},1032,["to"])):l.withDirectives((l.openBlock(),l.createElementBlock("a",{key:1,href:e.url,class:l.normalizeClass(o.linkClass(e)),target:e.target,"aria-haspopup":null!=e.items,"aria-expanded":e===s.activeItem,onClick:t=>o.onItemClick(t,e),onKeydown:t=>o.onItemKeyDown(t,e),role:"menuitem",tabindex:o.disabled(e)?null:"0"},[l.createElementVNode("span",{class:l.normalizeClass(["p-menuitem-icon",e.icon])},null,2),l.createElementVNode("span",p,l.toDisplayString(o.label(e)),1),e.items?(l.openBlock(),l.createElementBlock("span",h)):l.createCommentVNode("",!0)],42,u)),[[v]])],64)),o.visible(e)&&e.items?(l.openBlock(),l.createBlock(a,{model:e.items,key:o.label(e)+"_sub_",template:i.template,onLeafClick:o.onLeafClick,onKeydownItem:o.onChildItemKeyDown,parentActive:e===s.activeItem,exact:i.exact},null,8,["model","template","onLeafClick","onKeydownItem","parentActive","exact"])):l.createCommentVNode("",!0)],46,c)):l.createCommentVNode("",!0),o.visible(e)&&e.separator?(l.openBlock(),l.createElementBlock("li",{class:l.normalizeClass(["p-menu-separator",e.class]),style:l.normalizeStyle(e.style),key:"separator"+t.toString(),role:"separator"},null,6)):l.createCommentVNode("",!0)],64)))),128))],2)};var v={name:"TieredMenu",inheritAttrs:!1,props:{popup:{type:Boolean,default:!1},model:{type:Array,default:null},appendTo:{type:String,default:"body"},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},exact:{type:Boolean,default:!0}},target:null,container:null,outsideClickListener:null,scrollHandler:null,resizeListener:null,data:()=>({visible:!1}),beforeUnmount(){this.unbindResizeListener(),this.unbindOutsideClickListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.target=null,this.container&&this.autoZIndex&&e.ZIndexUtils.clear(this.container),this.container=null},methods:{itemClick(e){const t=e.item;t.command&&(t.command(e),e.originalEvent.preventDefault()),this.hide()},toggle(e){this.visible?this.hide():this.show(e)},show(e){this.visible=!0,this.target=e.currentTarget},hide(){this.visible=!1},onEnter(t){this.alignOverlay(),this.bindOutsideClickListener(),this.bindResizeListener(),this.bindScrollListener(),this.autoZIndex&&e.ZIndexUtils.set("menu",t,this.baseZIndex+this.$primevue.config.zIndex.menu)},onLeave(){this.unbindOutsideClickListener(),this.unbindResizeListener(),this.unbindScrollListener()},onAfterLeave(t){this.autoZIndex&&e.ZIndexUtils.clear(t)},alignOverlay(){e.DomHandler.absolutePosition(this.container,this.target),this.container.style.minWidth=e.DomHandler.getOuterWidth(this.target)+"px"},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.visible&&this.container&&!this.container.contains(e.target)&&!this.isTargetClicked(e)&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener(){this.scrollHandler||(this.scrollHandler=new e.ConnectedOverlayScrollHandler(this.target,(()=>{this.visible&&this.hide()}))),this.scrollHandler.bindScrollListener()},unbindScrollListener(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener(){this.resizeListener||(this.resizeListener=()=>{this.visible&&!e.DomHandler.isTouchDevice()&&this.hide()},window.addEventListener("resize",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},isTargetClicked(e){return this.target&&(this.target===e.target||this.target.contains(e.target))},onLeafClick(){this.popup&&this.hide()},containerRef(e){this.container=e},onOverlayClick(e){o.default.emit("overlay-click",{originalEvent:e,target:this.target})}},computed:{containerClass(){return["p-tieredmenu p-component",{"p-tieredmenu-overlay":this.popup,"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]}},components:{TieredMenuSub:a,Portal:r.default}};return function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-tieredmenu-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-tieredmenu ul {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n.p-tieredmenu .p-submenu-list {\n    position: absolute;\n    min-width: 100%;\n    z-index: 1;\n    display: none;\n}\n.p-tieredmenu .p-menuitem-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    text-decoration: none;\n    overflow: hidden;\n    position: relative;\n}\n.p-tieredmenu .p-menuitem-text {\n    line-height: 1;\n}\n.p-tieredmenu .p-menuitem {\n    position: relative;\n}\n.p-tieredmenu .p-menuitem-link .p-submenu-icon {\n    margin-left: auto;\n}\n.p-tieredmenu .p-menuitem-active > .p-submenu-list {\n    display: block;\n    left: 100%;\n    top: 0;\n}\n"),v.render=function(e,t,i,n,s,o){const r=l.resolveComponent("TieredMenuSub"),a=l.resolveComponent("Portal");return l.openBlock(),l.createBlock(a,{appendTo:i.appendTo,disabled:!i.popup},{default:l.withCtx((()=>[l.createVNode(l.Transition,{name:"p-connected-overlay",onEnter:o.onEnter,onLeave:o.onLeave,onAfterLeave:o.onAfterLeave},{default:l.withCtx((()=>[!i.popup||s.visible?(l.openBlock(),l.createElementBlock("div",l.mergeProps({key:0,ref:o.containerRef,class:o.containerClass},e.$attrs,{onClick:t[0]||(t[0]=(...e)=>o.onOverlayClick&&o.onOverlayClick(...e))}),[l.createVNode(r,{model:i.model,root:!0,popup:i.popup,onLeafClick:o.onLeafClick,template:e.$slots.item,exact:i.exact},null,8,["model","popup","onLeafClick","template","exact"])],16)):l.createCommentVNode("",!0)])),_:1},8,["onEnter","onLeave","onAfterLeave"])])),_:1},8,["appendTo","disabled"])},v}(primevue.utils,primevue.overlayeventbus,primevue.portal,primevue.ripple,Vue);

package/timeline/Timeline.d.ts

@@ -1,7 +1,7 @@
 import { VNode } from 'vue';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
-type TimelineVerticalAlignType = 'left' | 'right' | undefined;
+type TimelineVerticalAlignType = 'left' | 'right' | 'alternate' | undefined;
 
 type TimelineHorizontalAlignType = 'top' | 'bottom' | undefined;
 

package/timeline/timeline.cjs.js

@@ -35,24 +35,26 @@ var script = {
 
 const _hoisted_1 = { class: "p-timeline-event-opposite" };
 const _hoisted_2 = { class: "p-timeline-event-separator" };
-const _hoisted_3 = /*#__PURE__*/vue.createVNode("div", { class: "p-timeline-event-marker" }, null, -1);
-const _hoisted_4 = /*#__PURE__*/vue.createVNode("div", { class: "p-timeline-event-connector" }, null, -1);
+const _hoisted_3 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-timeline-event-marker" }, null, -1);
+const _hoisted_4 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-timeline-event-connector" }, null, -1);
 const _hoisted_5 = { class: "p-timeline-event-content" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createBlock("div", { class: $options.containerClass }, [
-    (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.value, (item, index) => {
-      return (vue.openBlock(), vue.createBlock("div", {
+  return (vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass($options.containerClass)
+  }, [
+    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.value, (item, index) => {
+      return (vue.openBlock(), vue.createElementBlock("div", {
         key: $options.getKey(item, index),
         class: "p-timeline-event"
       }, [
-        vue.createVNode("div", _hoisted_1, [
+        vue.createElementVNode("div", _hoisted_1, [
           vue.renderSlot(_ctx.$slots, "opposite", {
             item: item,
             index: index
           })
         ]),
-        vue.createVNode("div", _hoisted_2, [
+        vue.createElementVNode("div", _hoisted_2, [
           vue.renderSlot(_ctx.$slots, "marker", {
             item: item,
             index: index
@@ -65,7 +67,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               ])
             : vue.createCommentVNode("", true)
         ]),
-        vue.createVNode("div", _hoisted_5, [
+        vue.createElementVNode("div", _hoisted_5, [
           vue.renderSlot(_ctx.$slots, "content", {
             item: item,
             index: index

package/timeline/timeline.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),n=require("vue"),t={name:"Timeline",props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(n,t){return this.dataKey?e.ObjectUtils.resolveFieldData(n,this.dataKey):t}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};const i={class:"p-timeline-event-opposite"},l={class:"p-timeline-event-separator"},o=n.createVNode("div",{class:"p-timeline-event-marker"},null,-1),r=n.createVNode("div",{class:"p-timeline-event-connector"},null,-1),m={class:"p-timeline-event-content"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-event {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    min-height: 70px;\n}\n.p-timeline-event:last-child {\n    min-height: 0;\n}\n.p-timeline-event-opposite {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-separator {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-event-marker {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-item-align: baseline;\n        align-self: baseline;\n}\n.p-timeline-event-connector {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n.p-timeline-horizontal {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector  {\n    width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n"),t.render=function(e,t,a,s,c,p){return n.openBlock(),n.createBlock("div",{class:p.containerClass},[(n.openBlock(!0),n.createBlock(n.Fragment,null,n.renderList(a.value,((t,s)=>(n.openBlock(),n.createBlock("div",{key:p.getKey(t,s),class:"p-timeline-event"},[n.createVNode("div",i,[n.renderSlot(e.$slots,"opposite",{item:t,index:s})]),n.createVNode("div",l,[n.renderSlot(e.$slots,"marker",{item:t,index:s},(()=>[o])),s!==a.value.length-1?n.renderSlot(e.$slots,"connector",{key:0},(()=>[r])):n.createCommentVNode("",!0)]),n.createVNode("div",m,[n.renderSlot(e.$slots,"content",{item:t,index:s})])])))),128))],2)},module.exports=t;
+"use strict";var e=require("primevue/utils"),n=require("vue"),t={name:"Timeline",props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(n,t){return this.dataKey?e.ObjectUtils.resolveFieldData(n,this.dataKey):t}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};const i={class:"p-timeline-event-opposite"},l={class:"p-timeline-event-separator"},o=n.createElementVNode("div",{class:"p-timeline-event-marker"},null,-1),r=n.createElementVNode("div",{class:"p-timeline-event-connector"},null,-1),m={class:"p-timeline-event-content"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-event {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    min-height: 70px;\n}\n.p-timeline-event:last-child {\n    min-height: 0;\n}\n.p-timeline-event-opposite {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-separator {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-event-marker {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-item-align: baseline;\n        align-self: baseline;\n}\n.p-timeline-event-connector {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n.p-timeline-horizontal {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector  {\n    width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n"),t.render=function(e,t,a,s,c,p){return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(p.containerClass)},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(a.value,((t,s)=>(n.openBlock(),n.createElementBlock("div",{key:p.getKey(t,s),class:"p-timeline-event"},[n.createElementVNode("div",i,[n.renderSlot(e.$slots,"opposite",{item:t,index:s})]),n.createElementVNode("div",l,[n.renderSlot(e.$slots,"marker",{item:t,index:s},(()=>[o])),s!==a.value.length-1?n.renderSlot(e.$slots,"connector",{key:0},(()=>[r])):n.createCommentVNode("",!0)]),n.createElementVNode("div",m,[n.renderSlot(e.$slots,"content",{item:t,index:s})])])))),128))],2)},module.exports=t;

package/timeline/timeline.esm.js

@@ -1,5 +1,5 @@
 import { ObjectUtils } from 'primevue/utils';
-import { openBlock, createBlock, Fragment, renderList, createVNode, renderSlot, createCommentVNode } from 'vue';
+import { openBlock, createElementBlock, normalizeClass, Fragment, renderList, createElementVNode, renderSlot, createCommentVNode } from 'vue';
 
 var script = {
     name: 'Timeline',
@@ -33,24 +33,26 @@ var script = {
 
 const _hoisted_1 = { class: "p-timeline-event-opposite" };
 const _hoisted_2 = { class: "p-timeline-event-separator" };
-const _hoisted_3 = /*#__PURE__*/createVNode("div", { class: "p-timeline-event-marker" }, null, -1);
-const _hoisted_4 = /*#__PURE__*/createVNode("div", { class: "p-timeline-event-connector" }, null, -1);
+const _hoisted_3 = /*#__PURE__*/createElementVNode("div", { class: "p-timeline-event-marker" }, null, -1);
+const _hoisted_4 = /*#__PURE__*/createElementVNode("div", { class: "p-timeline-event-connector" }, null, -1);
 const _hoisted_5 = { class: "p-timeline-event-content" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createBlock("div", { class: $options.containerClass }, [
-    (openBlock(true), createBlock(Fragment, null, renderList($props.value, (item, index) => {
-      return (openBlock(), createBlock("div", {
+  return (openBlock(), createElementBlock("div", {
+    class: normalizeClass($options.containerClass)
+  }, [
+    (openBlock(true), createElementBlock(Fragment, null, renderList($props.value, (item, index) => {
+      return (openBlock(), createElementBlock("div", {
         key: $options.getKey(item, index),
         class: "p-timeline-event"
       }, [
-        createVNode("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_1, [
           renderSlot(_ctx.$slots, "opposite", {
             item: item,
             index: index
           })
         ]),
-        createVNode("div", _hoisted_2, [
+        createElementVNode("div", _hoisted_2, [
           renderSlot(_ctx.$slots, "marker", {
             item: item,
             index: index
@@ -63,7 +65,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               ])
             : createCommentVNode("", true)
         ]),
-        createVNode("div", _hoisted_5, [
+        createElementVNode("div", _hoisted_5, [
           renderSlot(_ctx.$slots, "content", {
             item: item,
             index: index
@@ -106,4 +108,4 @@ styleInject(css_248z);
 
 script.render = render;
 
-export default script;
+export { script as default };

package/timeline/timeline.esm.min.js

@@ -1 +1 @@
-import{ObjectUtils as e}from"primevue/utils";import{openBlock as n,createBlock as i,Fragment as t,renderList as l,createVNode as o,renderSlot as r,createCommentVNode as m}from"vue";var a={name:"Timeline",props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(n,i){return this.dataKey?e.resolveFieldData(n,this.dataKey):i}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};const s={class:"p-timeline-event-opposite"},p={class:"p-timeline-event-separator"},x=o("div",{class:"p-timeline-event-marker"},null,-1),c=o("div",{class:"p-timeline-event-connector"},null,-1),d={class:"p-timeline-event-content"};!function(e,n){void 0===n&&(n={});var i=n.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&t.firstChild?t.insertBefore(l,t.firstChild):t.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-event {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    min-height: 70px;\n}\n.p-timeline-event:last-child {\n    min-height: 0;\n}\n.p-timeline-event-opposite {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-separator {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-event-marker {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-item-align: baseline;\n        align-self: baseline;\n}\n.p-timeline-event-connector {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n.p-timeline-horizontal {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector  {\n    width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n"),a.render=function(e,a,v,f,b,h){return n(),i("div",{class:h.containerClass},[(n(!0),i(t,null,l(v.value,((t,l)=>(n(),i("div",{key:h.getKey(t,l),class:"p-timeline-event"},[o("div",s,[r(e.$slots,"opposite",{item:t,index:l})]),o("div",p,[r(e.$slots,"marker",{item:t,index:l},(()=>[x])),l!==v.value.length-1?r(e.$slots,"connector",{key:0},(()=>[c])):m("",!0)]),o("div",d,[r(e.$slots,"content",{item:t,index:l})])])))),128))],2)};export default a;
+import{ObjectUtils as e}from"primevue/utils";import{openBlock as n,createElementBlock as i,normalizeClass as t,Fragment as l,renderList as o,createElementVNode as r,renderSlot as m,createCommentVNode as a}from"vue";var s={name:"Timeline",props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(n,i){return this.dataKey?e.resolveFieldData(n,this.dataKey):i}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};const p={class:"p-timeline-event-opposite"},x={class:"p-timeline-event-separator"},c=r("div",{class:"p-timeline-event-marker"},null,-1),d=r("div",{class:"p-timeline-event-connector"},null,-1),v={class:"p-timeline-event-content"};!function(e,n){void 0===n&&(n={});var i=n.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&t.firstChild?t.insertBefore(l,t.firstChild):t.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-event {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    min-height: 70px;\n}\n.p-timeline-event:last-child {\n    min-height: 0;\n}\n.p-timeline-event-opposite {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-separator {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-event-marker {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-item-align: baseline;\n        align-self: baseline;\n}\n.p-timeline-event-connector {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n.p-timeline-horizontal {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector  {\n    width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n"),s.render=function(e,s,f,b,h,w){return n(),i("div",{class:t(w.containerClass)},[(n(!0),i(l,null,o(f.value,((t,l)=>(n(),i("div",{key:w.getKey(t,l),class:"p-timeline-event"},[r("div",p,[m(e.$slots,"opposite",{item:t,index:l})]),r("div",x,[m(e.$slots,"marker",{item:t,index:l},(()=>[c])),l!==f.value.length-1?m(e.$slots,"connector",{key:0},(()=>[d])):a("",!0)]),r("div",v,[m(e.$slots,"content",{item:t,index:l})])])))),128))],2)};export{s as default};

package/timeline/timeline.js

@@ -34,24 +34,26 @@ this.primevue.timeline = (function (utils, vue) {
 
     const _hoisted_1 = { class: "p-timeline-event-opposite" };
     const _hoisted_2 = { class: "p-timeline-event-separator" };
-    const _hoisted_3 = /*#__PURE__*/vue.createVNode("div", { class: "p-timeline-event-marker" }, null, -1);
-    const _hoisted_4 = /*#__PURE__*/vue.createVNode("div", { class: "p-timeline-event-connector" }, null, -1);
+    const _hoisted_3 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-timeline-event-marker" }, null, -1);
+    const _hoisted_4 = /*#__PURE__*/vue.createElementVNode("div", { class: "p-timeline-event-connector" }, null, -1);
     const _hoisted_5 = { class: "p-timeline-event-content" };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      return (vue.openBlock(), vue.createBlock("div", { class: $options.containerClass }, [
-        (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.value, (item, index) => {
-          return (vue.openBlock(), vue.createBlock("div", {
+      return (vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass($options.containerClass)
+      }, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.value, (item, index) => {
+          return (vue.openBlock(), vue.createElementBlock("div", {
             key: $options.getKey(item, index),
             class: "p-timeline-event"
           }, [
-            vue.createVNode("div", _hoisted_1, [
+            vue.createElementVNode("div", _hoisted_1, [
               vue.renderSlot(_ctx.$slots, "opposite", {
                 item: item,
                 index: index
               })
             ]),
-            vue.createVNode("div", _hoisted_2, [
+            vue.createElementVNode("div", _hoisted_2, [
               vue.renderSlot(_ctx.$slots, "marker", {
                 item: item,
                 index: index
@@ -64,7 +66,7 @@ this.primevue.timeline = (function (utils, vue) {
                   ])
                 : vue.createCommentVNode("", true)
             ]),
-            vue.createVNode("div", _hoisted_5, [
+            vue.createElementVNode("div", _hoisted_5, [
               vue.renderSlot(_ctx.$slots, "content", {
                 item: item,
                 index: index
@@ -109,4 +111,4 @@ this.primevue.timeline = (function (utils, vue) {
 
     return script;
 
-}(primevue.utils, Vue));
+})(primevue.utils, Vue);

package/timeline/timeline.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.timeline=function(e,n){"use strict";var t={name:"Timeline",props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(n,t){return this.dataKey?e.ObjectUtils.resolveFieldData(n,this.dataKey):t}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};const i={class:"p-timeline-event-opposite"},l={class:"p-timeline-event-separator"},o=n.createVNode("div",{class:"p-timeline-event-marker"},null,-1),r=n.createVNode("div",{class:"p-timeline-event-connector"},null,-1),m={class:"p-timeline-event-content"};return function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-event {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    min-height: 70px;\n}\n.p-timeline-event:last-child {\n    min-height: 0;\n}\n.p-timeline-event-opposite {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-separator {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-event-marker {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-item-align: baseline;\n        align-self: baseline;\n}\n.p-timeline-event-connector {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n.p-timeline-horizontal {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector  {\n    width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n"),t.render=function(e,t,a,s,c,p){return n.openBlock(),n.createBlock("div",{class:p.containerClass},[(n.openBlock(!0),n.createBlock(n.Fragment,null,n.renderList(a.value,((t,s)=>(n.openBlock(),n.createBlock("div",{key:p.getKey(t,s),class:"p-timeline-event"},[n.createVNode("div",i,[n.renderSlot(e.$slots,"opposite",{item:t,index:s})]),n.createVNode("div",l,[n.renderSlot(e.$slots,"marker",{item:t,index:s},(()=>[o])),s!==a.value.length-1?n.renderSlot(e.$slots,"connector",{key:0},(()=>[r])):n.createCommentVNode("",!0)]),n.createVNode("div",m,[n.renderSlot(e.$slots,"content",{item:t,index:s})])])))),128))],2)},t}(primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.timeline=function(e,n){"use strict";var t={name:"Timeline",props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(n,t){return this.dataKey?e.ObjectUtils.resolveFieldData(n,this.dataKey):t}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};const i={class:"p-timeline-event-opposite"},l={class:"p-timeline-event-separator"},o=n.createElementVNode("div",{class:"p-timeline-event-marker"},null,-1),r=n.createElementVNode("div",{class:"p-timeline-event-connector"},null,-1),m={class:"p-timeline-event-content"};return function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n    text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n    text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n    text-align: right;\n}\n.p-timeline-event {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    min-height: 70px;\n}\n.p-timeline-event:last-child {\n    min-height: 0;\n}\n.p-timeline-event-opposite {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n    padding: 0 1rem;\n}\n.p-timeline-event-separator {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n.p-timeline-event-marker {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-item-align: baseline;\n        align-self: baseline;\n}\n.p-timeline-event-connector {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n.p-timeline-horizontal {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-flex: 1;\n        -ms-flex: 1;\n            flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n    -webkit-box-flex: 0;\n        -ms-flex: 0;\n            flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector  {\n    width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: column-reverse;\n            flex-direction: column-reverse;\n}\n"),t.render=function(e,t,a,s,c,p){return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(p.containerClass)},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(a.value,((t,s)=>(n.openBlock(),n.createElementBlock("div",{key:p.getKey(t,s),class:"p-timeline-event"},[n.createElementVNode("div",i,[n.renderSlot(e.$slots,"opposite",{item:t,index:s})]),n.createElementVNode("div",l,[n.renderSlot(e.$slots,"marker",{item:t,index:s},(()=>[o])),s!==a.value.length-1?n.renderSlot(e.$slots,"connector",{key:0},(()=>[r])):n.createCommentVNode("",!0)]),n.createElementVNode("div",m,[n.renderSlot(e.$slots,"content",{item:t,index:s})])])))),128))],2)},t}(primevue.utils,Vue);

package/toast/Toast.vue

@@ -1,17 +1,18 @@
 <template>
-    <Teleport to="body">
+    <Portal>
         <div ref="container" :class="containerClass" v-bind="$attrs">
             <transition-group name="p-toast-message" tag="div" @enter="onEnter" @leave="onLeave">
                 <ToastMessage v-for="msg of messages" :key="msg.id" :message="msg" @close="remove($event)" :template="$slots.message"/>
             </transition-group>
         </div>
-    </Teleport>
+    </Portal>
 </template>
 
 <script>
 import ToastEventBus from 'primevue/toasteventbus';
 import ToastMessage from './ToastMessage.vue';
-import {ZIndexUtils,UniqueComponentId} from 'primevue/utils';
+import {ZIndexUtils,UniqueComponentId,ObjectUtils} from 'primevue/utils';
+import Portal from 'primevue/portal';
 
 var messageIdx = 0;
 
@@ -106,7 +107,7 @@ export default {
             }
         },
         onLeave() {
-            if (this.$refs.container && this.autoZIndex) {
+            if (this.$refs.container && this.autoZIndex && ObjectUtils.isEmpty(this.messages)) {
                 ZIndexUtils.clear(this.$refs.container);
             }
         },
@@ -142,7 +143,8 @@ export default {
         }
     },
     components: {
-        'ToastMessage': ToastMessage
+        'ToastMessage': ToastMessage,
+        'Portal': Portal
     },
     computed: {
         containerClass() {