primevue 3.30.2 → 3.32.0

package/dialog/dialog.js

@@ -12,7 +12,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
     var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
     var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 
-    var styles = "\n.p-dialog-mask {\n    pointer-events: none;\n}\n\n.p-dialog-mask.p-component-overlay {\n    pointer-events: auto;\n}\n\n.p-dialog {\n    pointer-events: auto;\n    max-height: 90%;\n    transform: scale(1);\n}\n\n.p-dialog-content {\n    overflow-y: auto;\n}\n\n.p-dialog-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    flex-shrink: 0;\n}\n\n.p-dialog-footer {\n    flex-shrink: 0;\n}\n\n.p-dialog .p-dialog-header-icons {\n    display: flex;\n    align-items: center;\n}\n\n.p-dialog .p-dialog-header-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Fluid */\n.p-fluid .p-dialog-footer .p-button {\n    width: auto;\n}\n\n/* Animation */\n/* Center */\n.p-dialog-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-dialog-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n\n/* Top, Bottom, Left, Right, Top* and Bottom* */\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n    margin: 0.75rem;\n    transform: translate3d(0px, 0px, 0px);\n}\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n    transition: all 0.3s ease-out;\n}\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n    transform: translate3d(0px, -100%, 0px);\n}\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n    transform: translate3d(0px, 100%, 0px);\n}\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n    transform: translate3d(-100%, 0px, 0px);\n}\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n    transform: translate3d(100%, 0px, 0px);\n}\n\n/* Maximize */\n.p-dialog-maximized {\n    -webkit-transition: none;\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    top: 0px !important;\n    left: 0px !important;\n    max-height: 100%;\n    height: 100%;\n}\n.p-dialog-maximized .p-dialog-content {\n    flex-grow: 1;\n}\n\n.p-confirm-dialog .p-dialog-content {\n    display: flex;\n    align-items: center;\n}\n";
+    var styles = "\n.p-dialog-mask.p-component-overlay {\n    pointer-events: auto;\n}\n\n.p-dialog {\n    max-height: 90%;\n    transform: scale(1);\n}\n\n.p-dialog-content {\n    overflow-y: auto;\n}\n\n.p-dialog-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    flex-shrink: 0;\n}\n\n.p-dialog-footer {\n    flex-shrink: 0;\n}\n\n.p-dialog .p-dialog-header-icons {\n    display: flex;\n    align-items: center;\n}\n\n.p-dialog .p-dialog-header-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Fluid */\n.p-fluid .p-dialog-footer .p-button {\n    width: auto;\n}\n\n/* Animation */\n/* Center */\n.p-dialog-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-dialog-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n\n/* Top, Bottom, Left, Right, Top* and Bottom* */\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n    margin: 0.75rem;\n    transform: translate3d(0px, 0px, 0px);\n}\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n    transition: all 0.3s ease-out;\n}\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n    transform: translate3d(0px, -100%, 0px);\n}\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n    transform: translate3d(0px, 100%, 0px);\n}\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n    transform: translate3d(-100%, 0px, 0px);\n}\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n    transform: translate3d(100%, 0px, 0px);\n}\n\n/* Maximize */\n.p-dialog-maximized {\n    -webkit-transition: none;\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    top: 0px !important;\n    left: 0px !important;\n    max-height: 100%;\n    height: 100%;\n}\n.p-dialog-maximized .p-dialog-content {\n    flex-grow: 1;\n}\n\n.p-confirm-dialog .p-dialog-content {\n    display: flex;\n    align-items: center;\n}\n";
 
     /* Position */
     var inlineStyles = {
@@ -28,12 +28,13 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
           display: 'flex',
           justifyContent: position === 'left' || position === 'topleft' || position === 'bottomleft' ? 'flex-start' : position === 'right' || position === 'topright' || position === 'bottomright' ? 'flex-end' : 'center',
           alignItems: position === 'top' || position === 'topleft' || position === 'topright' ? 'flex-start' : position === 'bottom' || position === 'bottomleft' || position === 'bottomright' ? 'flex-end' : 'center',
-          pointerEvents: !modal && 'none'
+          pointerEvents: modal ? 'auto' : 'none'
         };
       },
       root: {
         display: 'flex',
-        flexDirection: 'column'
+        flexDirection: 'column',
+        pointerEvents: 'auto'
       }
     };
     var classes = {
@@ -379,8 +380,10 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
         },
         createStyle: function createStyle() {
           if (!this.styleElement && !this.isUnstyled) {
+            var _this$$primevue;
             this.styleElement = document.createElement('style');
             this.styleElement.type = 'text/css';
+            utils.DomHandler.setAttribute(this.styleElement, 'nonce', (_this$$primevue = this.$primevue) === null || _this$$primevue === void 0 || (_this$$primevue = _this$$primevue.config) === null || _this$$primevue === void 0 || (_this$$primevue = _this$$primevue.csp) === null || _this$$primevue === void 0 ? void 0 : _this$$primevue.nonce);
             document.head.appendChild(this.styleElement);
             var innerHTML = '';
             for (var breakpoint in this.breakpoints) {
@@ -538,7 +541,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
             onClick: _cache[3] || (_cache[3] = function () {
               return $options.onMaskClick && $options.onMaskClick.apply($options, arguments);
             })
-          }, _ctx.ptm('mask')), [vue.createVNode(vue.Transition, {
+          }, _ctx.ptm('mask')), [vue.createVNode(vue.Transition, vue.mergeProps({
             name: "p-dialog",
             onBeforeEnter: $options.onBeforeEnter,
             onEnter: $options.onEnter,
@@ -546,7 +549,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
             onLeave: $options.onLeave,
             onAfterLeave: $options.onAfterLeave,
             appear: ""
-          }, {
+          }, _ctx.ptm('transition')), {
             "default": vue.withCtx(function () {
               return [_ctx.visible ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 0,
@@ -620,7 +623,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
               }]]) : vue.createCommentVNode("", true)];
             }),
             _: 3
-          }, 8, ["onBeforeEnter", "onEnter", "onBeforeLeave", "onLeave", "onAfterLeave"])], 16)) : vue.createCommentVNode("", true)];
+          }, 16, ["onBeforeEnter", "onEnter", "onBeforeLeave", "onLeave", "onAfterLeave"])], 16)) : vue.createCommentVNode("", true)];
         }),
         _: 3
       }, 8, ["appendTo"]);

package/dialog/dialog.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.dialog=function(e,t,n,o,i,a,l,r,s,d){"use strict";function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=c(e),p=c(t),u=c(n),f=c(o),g=c(i),h=c(a),b=c(s),v=d.useStyle("\n.p-dialog-mask {\n    pointer-events: none;\n}\n\n.p-dialog-mask.p-component-overlay {\n    pointer-events: auto;\n}\n\n.p-dialog {\n    pointer-events: auto;\n    max-height: 90%;\n    transform: scale(1);\n}\n\n.p-dialog-content {\n    overflow-y: auto;\n}\n\n.p-dialog-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    flex-shrink: 0;\n}\n\n.p-dialog-footer {\n    flex-shrink: 0;\n}\n\n.p-dialog .p-dialog-header-icons {\n    display: flex;\n    align-items: center;\n}\n\n.p-dialog .p-dialog-header-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Fluid */\n.p-fluid .p-dialog-footer .p-button {\n    width: auto;\n}\n\n/* Animation */\n/* Center */\n.p-dialog-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-dialog-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n\n/* Top, Bottom, Left, Right, Top* and Bottom* */\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n    margin: 0.75rem;\n    transform: translate3d(0px, 0px, 0px);\n}\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n    transition: all 0.3s ease-out;\n}\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n    transform: translate3d(0px, -100%, 0px);\n}\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n    transform: translate3d(0px, 100%, 0px);\n}\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n    transform: translate3d(-100%, 0px, 0px);\n}\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n    transform: translate3d(100%, 0px, 0px);\n}\n\n/* Maximize */\n.p-dialog-maximized {\n    -webkit-transition: none;\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    top: 0px !important;\n    left: 0px !important;\n    max-height: 100%;\n    height: 100%;\n}\n.p-dialog-maximized .p-dialog-content {\n    flex-grow: 1;\n}\n\n.p-confirm-dialog .p-dialog-content {\n    display: flex;\n    align-items: center;\n}\n",{name:"dialog",manual:!0}),y={name:"Dialog",extends:{name:"BaseDialog",extends:b.default,props:{header:{type:null,default:null},footer:{type:null,default:null},visible:{type:Boolean,default:!1},modal:{type:Boolean,default:null},contentStyle:{type:null,default:null},contentClass:{type:String,default:null},contentProps:{type:null,default:null},rtl:{type:Boolean,default:null},maximizable:{type:Boolean,default:!1},dismissableMask:{type:Boolean,default:!1},closable:{type:Boolean,default:!0},closeOnEscape:{type:Boolean,default:!0},showHeader:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},autoZIndex:{type:Boolean,default:!0},position:{type:String,default:"center"},breakpoints:{type:Object,default:null},draggable:{type:Boolean,default:!0},keepInViewport:{type:Boolean,default:!0},minX:{type:Number,default:0},minY:{type:Number,default:0},appendTo:{type:String,default:"body"},closeIcon:{type:String,default:void 0},maximizeIcon:{type:String,default:void 0},minimizeIcon:{type:String,default:void 0},closeButtonProps:{type:null,default:null},_instance:null},css:{classes:{mask:function(e){var t=e.props,n=["left","right","top","topleft","topright","bottom","bottomleft","bottomright"].find((function(e){return e===t.position}));return["p-dialog-mask",{"p-component-overlay p-component-overlay-enter":t.modal},n?"p-dialog-".concat(n):""]},root:function(e){var t=e.props,n=e.instance;return["p-dialog p-component",{"p-dialog-rtl":t.rtl,"p-dialog-maximized":t.maximizable&&n.maximized,"p-input-filled":"filled"===n.$primevue.config.inputStyle,"p-ripple-disabled":!1===n.$primevue.config.ripple}]},header:"p-dialog-header",headerTitle:"p-dialog-title",headerIcons:"p-dialog-header-icons",maximizableButton:"p-dialog-header-icon p-dialog-header-maximize p-link",maximizableIcon:"p-dialog-header-maximize-icon",closeButton:"p-dialog-header-icon p-dialog-header-close p-link",closeButtonIcon:"p-dialog-header-close-icon",content:"p-dialog-content",footer:"p-dialog-footer"},inlineStyles:{mask:function(e){var t=e.position;return{position:"fixed",height:"100%",width:"100%",left:0,top:0,display:"flex",justifyContent:"left"===t||"topleft"===t||"bottomleft"===t?"flex-start":"right"===t||"topright"===t||"bottomright"===t?"flex-end":"center",alignItems:"top"===t||"topleft"===t||"topright"===t?"flex-start":"bottom"===t||"bottomleft"===t||"bottomright"===t?"flex-end":"center",pointerEvents:!e.modal&&"none"}},root:{display:"flex",flexDirection:"column"}},loadStyle:v.load},provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["update:visible","show","hide","after-hide","maximize","unmaximize","dragend"],provide:function(){var e=this;return{dialogRef:r.computed((function(){return e._instance}))}},data:function(){return{containerVisible:this.visible,maximized:!1,focusableMax:null,focusableClose:null}},documentKeydownListener:null,container:null,mask:null,content:null,headerContainer:null,footerContainer:null,maximizableButton:null,closeButton:null,styleElement:null,dragging:null,documentDragListener:null,documentDragEndListener:null,lastPageX:null,lastPageY:null,updated:function(){this.visible&&(this.containerVisible=this.visible)},beforeUnmount:function(){this.unbindDocumentState(),this.unbindGlobalListeners(),this.destroyStyle(),this.mask&&this.autoZIndex&&l.ZIndexUtils.clear(this.mask),this.container=null,this.mask=null},mounted:function(){this.breakpoints&&this.createStyle()},methods:{close:function(){this.$emit("update:visible",!1)},onBeforeEnter:function(e){e.setAttribute(this.attributeSelector,"")},onEnter:function(){this.$emit("show"),this.focus(),this.enableDocumentSettings(),this.bindGlobalListeners(),this.autoZIndex&&l.ZIndexUtils.set("modal",this.mask,this.baseZIndex+this.$primevue.config.zIndex.modal)},onBeforeLeave:function(){this.modal&&!this.isUnstyled&&l.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide"),this.focusableClose=null,this.focusableMax=null},onAfterLeave:function(){this.autoZIndex&&l.ZIndexUtils.clear(this.mask),this.containerVisible=!1,this.unbindDocumentState(),this.unbindGlobalListeners(),this.$emit("after-hide")},onMaskClick:function(e){this.dismissableMask&&this.modal&&this.mask===e.target&&this.close()},focus:function(){var e=function(e){return e.querySelector("[autofocus]")},t=this.$slots.footer&&e(this.footerContainer);t||(t=this.$slots.header&&e(this.headerContainer))||(t=this.$slots.default&&e(this.content))||(this.maximizable?(this.focusableMax=!0,t=this.maximizableButton):(this.focusableClose=!0,t=this.closeButton)),t&&l.DomHandler.focus(t)},maximize:function(e){this.maximized?(this.maximized=!1,this.$emit("unmaximize",e)):(this.maximized=!0,this.$emit("maximize",e)),this.modal||(this.maximized?l.DomHandler.addClass(document.body,"p-overflow-hidden"):l.DomHandler.removeClass(document.body,"p-overflow-hidden"))},enableDocumentSettings:function(){(this.modal||this.maximizable&&this.maximized)&&l.DomHandler.addClass(document.body,"p-overflow-hidden")},unbindDocumentState:function(){(this.modal||this.maximizable&&this.maximized)&&l.DomHandler.removeClass(document.body,"p-overflow-hidden")},onKeyDown:function(e){"Escape"===e.code&&this.closeOnEscape&&this.close()},bindDocumentKeyDownListener:function(){this.documentKeydownListener||(this.documentKeydownListener=this.onKeyDown.bind(this),window.document.addEventListener("keydown",this.documentKeydownListener))},unbindDocumentKeyDownListener:function(){this.documentKeydownListener&&(window.document.removeEventListener("keydown",this.documentKeydownListener),this.documentKeydownListener=null)},containerRef:function(e){this.container=e},maskRef:function(e){this.mask=e},contentRef:function(e){this.content=e},headerContainerRef:function(e){this.headerContainer=e},footerContainerRef:function(e){this.footerContainer=e},maximizableRef:function(e){this.maximizableButton=e},closeButtonRef:function(e){this.closeButton=e},createStyle:function(){if(!this.styleElement&&!this.isUnstyled){this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);var e="";for(var t in this.breakpoints)e+="\n                        @media screen and (max-width: ".concat(t,") {\n                            .p-dialog[").concat(this.attributeSelector,"] {\n                                width: ").concat(this.breakpoints[t]," !important;\n                            }\n                        }\n                    ");this.styleElement.innerHTML=e}},destroyStyle:function(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},initDrag:function(e){l.DomHandler.findSingle(e.target,'[data-pc-section="headeraction"]')||l.DomHandler.findSingle(e.target.parentElement,'[data-pc-section="headeraction"]')||this.draggable&&(this.dragging=!0,this.lastPageX=e.pageX,this.lastPageY=e.pageY,this.container.style.margin="0",!this.isUnstyled&&l.DomHandler.addClass(document.body,"p-unselectable-text"))},bindGlobalListeners:function(){this.draggable&&(this.bindDocumentDragListener(),this.bindDocumentDragEndListener()),this.closeOnEscape&&this.closable&&this.bindDocumentKeyDownListener()},unbindGlobalListeners:function(){this.unbindDocumentDragListener(),this.unbindDocumentDragEndListener(),this.unbindDocumentKeyDownListener()},bindDocumentDragListener:function(){var e=this;this.documentDragListener=function(t){if(e.dragging){var n=l.DomHandler.getOuterWidth(e.container),o=l.DomHandler.getOuterHeight(e.container),i=t.pageX-e.lastPageX,a=t.pageY-e.lastPageY,r=e.container.getBoundingClientRect(),s=r.left+i,d=r.top+a,c=l.DomHandler.getViewport();e.container.style.position="fixed",e.keepInViewport?(s>=e.minX&&s+n<c.width&&(e.lastPageX=t.pageX,e.container.style.left=s+"px"),d>=e.minY&&d+o<c.height&&(e.lastPageY=t.pageY,e.container.style.top=d+"px")):(e.lastPageX=t.pageX,e.container.style.left=s+"px",e.lastPageY=t.pageY,e.container.style.top=d+"px")}},window.document.addEventListener("mousemove",this.documentDragListener)},unbindDocumentDragListener:function(){this.documentDragListener&&(window.document.removeEventListener("mousemove",this.documentDragListener),this.documentDragListener=null)},bindDocumentDragEndListener:function(){var e=this;this.documentDragEndListener=function(t){e.dragging&&(e.dragging=!1,!e.isUnstyled&&l.DomHandler.removeClass(document.body,"p-unselectable-text"),e.$emit("dragend",t))},window.document.addEventListener("mouseup",this.documentDragEndListener)},unbindDocumentDragEndListener:function(){this.documentDragEndListener&&(window.document.removeEventListener("mouseup",this.documentDragEndListener),this.documentDragEndListener=null)}},computed:{maximizeIconComponent:function(){return this.maximized?this.minimizeIcon?"span":"WindowMinimizeIcon":this.maximizeIcon?"span":"WindowMaximizeIcon"},ariaId:function(){return l.UniqueComponentId()},ariaLabelledById:function(){return null!=this.header||null!==this.$attrs["aria-labelledby"]?this.ariaId+"_header":null},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0},attributeSelector:function(){return l.UniqueComponentId()},contentStyleClass:function(){return["p-dialog-content",this.contentClass]}},directives:{ripple:h.default,focustrap:m.default},components:{Portal:g.default,WindowMinimizeIcon:f.default,WindowMaximizeIcon:u.default,TimesIcon:p.default}};function x(e){return x="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},x(e)}function D(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function w(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?D(Object(n),!0).forEach((function(t){k(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):D(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function k(e,t,n){return(t=B(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function B(e){var t=z(e,"string");return"symbol"===x(t)?t:String(t)}function z(e,t){if("object"!==x(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==x(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var L=["aria-labelledby","aria-modal"],C=["id"],E=["autofocus","tabindex"],I=["autofocus","aria-label"];return y.render=function(e,t,n,o,i,a){var l=r.resolveComponent("Portal"),s=r.resolveDirective("ripple"),d=r.resolveDirective("focustrap");return r.openBlock(),r.createBlock(l,{appendTo:e.appendTo},{default:r.withCtx((function(){return[i.containerVisible?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:a.maskRef,class:e.cx("mask"),style:e.sx("mask",!0,{position:e.position,modal:e.modal}),onClick:t[3]||(t[3]=function(){return a.onMaskClick&&a.onMaskClick.apply(a,arguments)})},e.ptm("mask")),[r.createVNode(r.Transition,{name:"p-dialog",onBeforeEnter:a.onBeforeEnter,onEnter:a.onEnter,onBeforeLeave:a.onBeforeLeave,onLeave:a.onLeave,onAfterLeave:a.onAfterLeave,appear:""},{default:r.withCtx((function(){return[e.visible?r.withDirectives((r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:a.containerRef,class:e.cx("root"),style:e.sx("root"),role:"dialog","aria-labelledby":a.ariaLabelledById,"aria-modal":e.modal},w(w({},e.$attrs),e.ptm("root"))),[e.showHeader?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:a.headerContainerRef,class:e.cx("header"),onMousedown:t[2]||(t[2]=function(){return a.initDrag&&a.initDrag.apply(a,arguments)})},e.ptm("header")),[r.renderSlot(e.$slots,"header",{},(function(){return[e.header?(r.openBlock(),r.createElementBlock("span",r.mergeProps({key:0,id:a.ariaLabelledById,class:e.cx("headerTitle")},e.ptm("headerTitle")),r.toDisplayString(e.header),17,C)):r.createCommentVNode("",!0)]})),r.createElementVNode("div",r.mergeProps({class:e.cx("headerIcons")},e.ptm("headerIcons")),[e.maximizable?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:0,ref:a.maximizableRef,autofocus:i.focusableMax,class:e.cx("maximizableButton"),onClick:t[0]||(t[0]=function(){return a.maximize&&a.maximize.apply(a,arguments)}),type:"button",tabindex:e.maximizable?"0":"-1"},e.ptm("maximizableButton"),{"data-pc-group-section":"headericon"}),[r.renderSlot(e.$slots,"maximizeicon",{maximized:i.maximized},(function(){return[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(a.maximizeIconComponent),r.mergeProps({class:[e.cx("maximizableIcon"),i.maximized?e.minimizeIcon:e.maximizeIcon]},e.ptm("maximizableIcon")),null,16,["class"]))]}))],16,E)),[[s]]):r.createCommentVNode("",!0),e.closable?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:1,ref:a.closeButtonRef,autofocus:i.focusableClose,class:e.cx("closeButton"),onClick:t[1]||(t[1]=function(){return a.close&&a.close.apply(a,arguments)}),"aria-label":a.closeAriaLabel,type:"button"},w(w({},e.closeButtonProps),e.ptm("closeButton")),{"data-pc-group-section":"headericon"}),[r.renderSlot(e.$slots,"closeicon",{},(function(){return[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.closeIcon?"span":"TimesIcon"),r.mergeProps({class:[e.cx("closeButtonIcon"),e.closeIcon]},e.ptm("closeButtonIcon")),null,16,["class"]))]}))],16,I)),[[s]]):r.createCommentVNode("",!0)],16)],16)):r.createCommentVNode("",!0),r.createElementVNode("div",r.mergeProps({ref:a.contentRef,class:[e.cx("content"),e.contentClass],style:e.contentStyle},w(w({},e.contentProps),e.ptm("content"))),[r.renderSlot(e.$slots,"default")],16),e.footer||e.$slots.footer?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:1,ref:a.footerContainerRef,class:e.cx("footer")},e.ptm("footer")),[r.renderSlot(e.$slots,"footer",{},(function(){return[r.createTextVNode(r.toDisplayString(e.footer),1)]}))],16)):r.createCommentVNode("",!0)],16,L)),[[d,{disabled:!e.modal}]]):r.createCommentVNode("",!0)]})),_:3},8,["onBeforeEnter","onEnter","onBeforeLeave","onLeave","onAfterLeave"])],16)):r.createCommentVNode("",!0)]})),_:3},8,["appendTo"])},y}(primevue.focustrap,primevue.icons.times,primevue.icons.windowmaximize,primevue.icons.windowminimize,primevue.portal,primevue.ripple,primevue.utils,Vue,primevue.basecomponent,primevue.usestyle);
+this.primevue=this.primevue||{},this.primevue.dialog=function(e,t,n,o,i,a,l,r,s,d){"use strict";function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=c(e),p=c(t),u=c(n),f=c(o),g=c(i),h=c(a),b=c(s),v=d.useStyle("\n.p-dialog-mask.p-component-overlay {\n    pointer-events: auto;\n}\n\n.p-dialog {\n    max-height: 90%;\n    transform: scale(1);\n}\n\n.p-dialog-content {\n    overflow-y: auto;\n}\n\n.p-dialog-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    flex-shrink: 0;\n}\n\n.p-dialog-footer {\n    flex-shrink: 0;\n}\n\n.p-dialog .p-dialog-header-icons {\n    display: flex;\n    align-items: center;\n}\n\n.p-dialog .p-dialog-header-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n\n/* Fluid */\n.p-fluid .p-dialog-footer .p-button {\n    width: auto;\n}\n\n/* Animation */\n/* Center */\n.p-dialog-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-dialog-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n\n/* Top, Bottom, Left, Right, Top* and Bottom* */\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n    margin: 0.75rem;\n    transform: translate3d(0px, 0px, 0px);\n}\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n    transition: all 0.3s ease-out;\n}\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n    transform: translate3d(0px, -100%, 0px);\n}\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n    transform: translate3d(0px, 100%, 0px);\n}\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n    transform: translate3d(-100%, 0px, 0px);\n}\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n    transform: translate3d(100%, 0px, 0px);\n}\n\n/* Maximize */\n.p-dialog-maximized {\n    -webkit-transition: none;\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    top: 0px !important;\n    left: 0px !important;\n    max-height: 100%;\n    height: 100%;\n}\n.p-dialog-maximized .p-dialog-content {\n    flex-grow: 1;\n}\n\n.p-confirm-dialog .p-dialog-content {\n    display: flex;\n    align-items: center;\n}\n",{name:"dialog",manual:!0}),y={name:"Dialog",extends:{name:"BaseDialog",extends:b.default,props:{header:{type:null,default:null},footer:{type:null,default:null},visible:{type:Boolean,default:!1},modal:{type:Boolean,default:null},contentStyle:{type:null,default:null},contentClass:{type:String,default:null},contentProps:{type:null,default:null},rtl:{type:Boolean,default:null},maximizable:{type:Boolean,default:!1},dismissableMask:{type:Boolean,default:!1},closable:{type:Boolean,default:!0},closeOnEscape:{type:Boolean,default:!0},showHeader:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},autoZIndex:{type:Boolean,default:!0},position:{type:String,default:"center"},breakpoints:{type:Object,default:null},draggable:{type:Boolean,default:!0},keepInViewport:{type:Boolean,default:!0},minX:{type:Number,default:0},minY:{type:Number,default:0},appendTo:{type:String,default:"body"},closeIcon:{type:String,default:void 0},maximizeIcon:{type:String,default:void 0},minimizeIcon:{type:String,default:void 0},closeButtonProps:{type:null,default:null},_instance:null},css:{classes:{mask:function(e){var t=e.props,n=["left","right","top","topleft","topright","bottom","bottomleft","bottomright"].find((function(e){return e===t.position}));return["p-dialog-mask",{"p-component-overlay p-component-overlay-enter":t.modal},n?"p-dialog-".concat(n):""]},root:function(e){var t=e.props,n=e.instance;return["p-dialog p-component",{"p-dialog-rtl":t.rtl,"p-dialog-maximized":t.maximizable&&n.maximized,"p-input-filled":"filled"===n.$primevue.config.inputStyle,"p-ripple-disabled":!1===n.$primevue.config.ripple}]},header:"p-dialog-header",headerTitle:"p-dialog-title",headerIcons:"p-dialog-header-icons",maximizableButton:"p-dialog-header-icon p-dialog-header-maximize p-link",maximizableIcon:"p-dialog-header-maximize-icon",closeButton:"p-dialog-header-icon p-dialog-header-close p-link",closeButtonIcon:"p-dialog-header-close-icon",content:"p-dialog-content",footer:"p-dialog-footer"},inlineStyles:{mask:function(e){var t=e.position;return{position:"fixed",height:"100%",width:"100%",left:0,top:0,display:"flex",justifyContent:"left"===t||"topleft"===t||"bottomleft"===t?"flex-start":"right"===t||"topright"===t||"bottomright"===t?"flex-end":"center",alignItems:"top"===t||"topleft"===t||"topright"===t?"flex-start":"bottom"===t||"bottomleft"===t||"bottomright"===t?"flex-end":"center",pointerEvents:e.modal?"auto":"none"}},root:{display:"flex",flexDirection:"column",pointerEvents:"auto"}},loadStyle:v.load},provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["update:visible","show","hide","after-hide","maximize","unmaximize","dragend"],provide:function(){var e=this;return{dialogRef:r.computed((function(){return e._instance}))}},data:function(){return{containerVisible:this.visible,maximized:!1,focusableMax:null,focusableClose:null}},documentKeydownListener:null,container:null,mask:null,content:null,headerContainer:null,footerContainer:null,maximizableButton:null,closeButton:null,styleElement:null,dragging:null,documentDragListener:null,documentDragEndListener:null,lastPageX:null,lastPageY:null,updated:function(){this.visible&&(this.containerVisible=this.visible)},beforeUnmount:function(){this.unbindDocumentState(),this.unbindGlobalListeners(),this.destroyStyle(),this.mask&&this.autoZIndex&&l.ZIndexUtils.clear(this.mask),this.container=null,this.mask=null},mounted:function(){this.breakpoints&&this.createStyle()},methods:{close:function(){this.$emit("update:visible",!1)},onBeforeEnter:function(e){e.setAttribute(this.attributeSelector,"")},onEnter:function(){this.$emit("show"),this.focus(),this.enableDocumentSettings(),this.bindGlobalListeners(),this.autoZIndex&&l.ZIndexUtils.set("modal",this.mask,this.baseZIndex+this.$primevue.config.zIndex.modal)},onBeforeLeave:function(){this.modal&&!this.isUnstyled&&l.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide"),this.focusableClose=null,this.focusableMax=null},onAfterLeave:function(){this.autoZIndex&&l.ZIndexUtils.clear(this.mask),this.containerVisible=!1,this.unbindDocumentState(),this.unbindGlobalListeners(),this.$emit("after-hide")},onMaskClick:function(e){this.dismissableMask&&this.modal&&this.mask===e.target&&this.close()},focus:function(){var e=function(e){return e.querySelector("[autofocus]")},t=this.$slots.footer&&e(this.footerContainer);t||(t=this.$slots.header&&e(this.headerContainer))||(t=this.$slots.default&&e(this.content))||(this.maximizable?(this.focusableMax=!0,t=this.maximizableButton):(this.focusableClose=!0,t=this.closeButton)),t&&l.DomHandler.focus(t)},maximize:function(e){this.maximized?(this.maximized=!1,this.$emit("unmaximize",e)):(this.maximized=!0,this.$emit("maximize",e)),this.modal||(this.maximized?l.DomHandler.addClass(document.body,"p-overflow-hidden"):l.DomHandler.removeClass(document.body,"p-overflow-hidden"))},enableDocumentSettings:function(){(this.modal||this.maximizable&&this.maximized)&&l.DomHandler.addClass(document.body,"p-overflow-hidden")},unbindDocumentState:function(){(this.modal||this.maximizable&&this.maximized)&&l.DomHandler.removeClass(document.body,"p-overflow-hidden")},onKeyDown:function(e){"Escape"===e.code&&this.closeOnEscape&&this.close()},bindDocumentKeyDownListener:function(){this.documentKeydownListener||(this.documentKeydownListener=this.onKeyDown.bind(this),window.document.addEventListener("keydown",this.documentKeydownListener))},unbindDocumentKeyDownListener:function(){this.documentKeydownListener&&(window.document.removeEventListener("keydown",this.documentKeydownListener),this.documentKeydownListener=null)},containerRef:function(e){this.container=e},maskRef:function(e){this.mask=e},contentRef:function(e){this.content=e},headerContainerRef:function(e){this.headerContainer=e},footerContainerRef:function(e){this.footerContainer=e},maximizableRef:function(e){this.maximizableButton=e},closeButtonRef:function(e){this.closeButton=e},createStyle:function(){if(!this.styleElement&&!this.isUnstyled){var e;this.styleElement=document.createElement("style"),this.styleElement.type="text/css",l.DomHandler.setAttribute(this.styleElement,"nonce",null===(e=this.$primevue)||void 0===e||null===(e=e.config)||void 0===e||null===(e=e.csp)||void 0===e?void 0:e.nonce),document.head.appendChild(this.styleElement);var t="";for(var n in this.breakpoints)t+="\n                        @media screen and (max-width: ".concat(n,") {\n                            .p-dialog[").concat(this.attributeSelector,"] {\n                                width: ").concat(this.breakpoints[n]," !important;\n                            }\n                        }\n                    ");this.styleElement.innerHTML=t}},destroyStyle:function(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},initDrag:function(e){l.DomHandler.findSingle(e.target,'[data-pc-section="headeraction"]')||l.DomHandler.findSingle(e.target.parentElement,'[data-pc-section="headeraction"]')||this.draggable&&(this.dragging=!0,this.lastPageX=e.pageX,this.lastPageY=e.pageY,this.container.style.margin="0",!this.isUnstyled&&l.DomHandler.addClass(document.body,"p-unselectable-text"))},bindGlobalListeners:function(){this.draggable&&(this.bindDocumentDragListener(),this.bindDocumentDragEndListener()),this.closeOnEscape&&this.closable&&this.bindDocumentKeyDownListener()},unbindGlobalListeners:function(){this.unbindDocumentDragListener(),this.unbindDocumentDragEndListener(),this.unbindDocumentKeyDownListener()},bindDocumentDragListener:function(){var e=this;this.documentDragListener=function(t){if(e.dragging){var n=l.DomHandler.getOuterWidth(e.container),o=l.DomHandler.getOuterHeight(e.container),i=t.pageX-e.lastPageX,a=t.pageY-e.lastPageY,r=e.container.getBoundingClientRect(),s=r.left+i,d=r.top+a,c=l.DomHandler.getViewport();e.container.style.position="fixed",e.keepInViewport?(s>=e.minX&&s+n<c.width&&(e.lastPageX=t.pageX,e.container.style.left=s+"px"),d>=e.minY&&d+o<c.height&&(e.lastPageY=t.pageY,e.container.style.top=d+"px")):(e.lastPageX=t.pageX,e.container.style.left=s+"px",e.lastPageY=t.pageY,e.container.style.top=d+"px")}},window.document.addEventListener("mousemove",this.documentDragListener)},unbindDocumentDragListener:function(){this.documentDragListener&&(window.document.removeEventListener("mousemove",this.documentDragListener),this.documentDragListener=null)},bindDocumentDragEndListener:function(){var e=this;this.documentDragEndListener=function(t){e.dragging&&(e.dragging=!1,!e.isUnstyled&&l.DomHandler.removeClass(document.body,"p-unselectable-text"),e.$emit("dragend",t))},window.document.addEventListener("mouseup",this.documentDragEndListener)},unbindDocumentDragEndListener:function(){this.documentDragEndListener&&(window.document.removeEventListener("mouseup",this.documentDragEndListener),this.documentDragEndListener=null)}},computed:{maximizeIconComponent:function(){return this.maximized?this.minimizeIcon?"span":"WindowMinimizeIcon":this.maximizeIcon?"span":"WindowMaximizeIcon"},ariaId:function(){return l.UniqueComponentId()},ariaLabelledById:function(){return null!=this.header||null!==this.$attrs["aria-labelledby"]?this.ariaId+"_header":null},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0},attributeSelector:function(){return l.UniqueComponentId()},contentStyleClass:function(){return["p-dialog-content",this.contentClass]}},directives:{ripple:h.default,focustrap:m.default},components:{Portal:g.default,WindowMinimizeIcon:f.default,WindowMaximizeIcon:u.default,TimesIcon:p.default}};function x(e){return x="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},x(e)}function D(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function w(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?D(Object(n),!0).forEach((function(t){k(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):D(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function k(e,t,n){return(t=B(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function B(e){var t=z(e,"string");return"symbol"===x(t)?t:String(t)}function z(e,t){if("object"!==x(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==x(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var L=["aria-labelledby","aria-modal"],E=["id"],C=["autofocus","tabindex"],I=["autofocus","aria-label"];return y.render=function(e,t,n,o,i,a){var l=r.resolveComponent("Portal"),s=r.resolveDirective("ripple"),d=r.resolveDirective("focustrap");return r.openBlock(),r.createBlock(l,{appendTo:e.appendTo},{default:r.withCtx((function(){return[i.containerVisible?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:a.maskRef,class:e.cx("mask"),style:e.sx("mask",!0,{position:e.position,modal:e.modal}),onClick:t[3]||(t[3]=function(){return a.onMaskClick&&a.onMaskClick.apply(a,arguments)})},e.ptm("mask")),[r.createVNode(r.Transition,r.mergeProps({name:"p-dialog",onBeforeEnter:a.onBeforeEnter,onEnter:a.onEnter,onBeforeLeave:a.onBeforeLeave,onLeave:a.onLeave,onAfterLeave:a.onAfterLeave,appear:""},e.ptm("transition")),{default:r.withCtx((function(){return[e.visible?r.withDirectives((r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:a.containerRef,class:e.cx("root"),style:e.sx("root"),role:"dialog","aria-labelledby":a.ariaLabelledById,"aria-modal":e.modal},w(w({},e.$attrs),e.ptm("root"))),[e.showHeader?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:a.headerContainerRef,class:e.cx("header"),onMousedown:t[2]||(t[2]=function(){return a.initDrag&&a.initDrag.apply(a,arguments)})},e.ptm("header")),[r.renderSlot(e.$slots,"header",{},(function(){return[e.header?(r.openBlock(),r.createElementBlock("span",r.mergeProps({key:0,id:a.ariaLabelledById,class:e.cx("headerTitle")},e.ptm("headerTitle")),r.toDisplayString(e.header),17,E)):r.createCommentVNode("",!0)]})),r.createElementVNode("div",r.mergeProps({class:e.cx("headerIcons")},e.ptm("headerIcons")),[e.maximizable?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:0,ref:a.maximizableRef,autofocus:i.focusableMax,class:e.cx("maximizableButton"),onClick:t[0]||(t[0]=function(){return a.maximize&&a.maximize.apply(a,arguments)}),type:"button",tabindex:e.maximizable?"0":"-1"},e.ptm("maximizableButton"),{"data-pc-group-section":"headericon"}),[r.renderSlot(e.$slots,"maximizeicon",{maximized:i.maximized},(function(){return[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(a.maximizeIconComponent),r.mergeProps({class:[e.cx("maximizableIcon"),i.maximized?e.minimizeIcon:e.maximizeIcon]},e.ptm("maximizableIcon")),null,16,["class"]))]}))],16,C)),[[s]]):r.createCommentVNode("",!0),e.closable?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:1,ref:a.closeButtonRef,autofocus:i.focusableClose,class:e.cx("closeButton"),onClick:t[1]||(t[1]=function(){return a.close&&a.close.apply(a,arguments)}),"aria-label":a.closeAriaLabel,type:"button"},w(w({},e.closeButtonProps),e.ptm("closeButton")),{"data-pc-group-section":"headericon"}),[r.renderSlot(e.$slots,"closeicon",{},(function(){return[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.closeIcon?"span":"TimesIcon"),r.mergeProps({class:[e.cx("closeButtonIcon"),e.closeIcon]},e.ptm("closeButtonIcon")),null,16,["class"]))]}))],16,I)),[[s]]):r.createCommentVNode("",!0)],16)],16)):r.createCommentVNode("",!0),r.createElementVNode("div",r.mergeProps({ref:a.contentRef,class:[e.cx("content"),e.contentClass],style:e.contentStyle},w(w({},e.contentProps),e.ptm("content"))),[r.renderSlot(e.$slots,"default")],16),e.footer||e.$slots.footer?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:1,ref:a.footerContainerRef,class:e.cx("footer")},e.ptm("footer")),[r.renderSlot(e.$slots,"footer",{},(function(){return[r.createTextVNode(r.toDisplayString(e.footer),1)]}))],16)):r.createCommentVNode("",!0)],16,L)),[[d,{disabled:!e.modal}]]):r.createCommentVNode("",!0)]})),_:3},16,["onBeforeEnter","onEnter","onBeforeLeave","onLeave","onAfterLeave"])],16)):r.createCommentVNode("",!0)]})),_:3},8,["appendTo"])},y}(primevue.focustrap,primevue.icons.times,primevue.icons.windowmaximize,primevue.icons.windowminimize,primevue.portal,primevue.ripple,primevue.utils,Vue,primevue.basecomponent,primevue.usestyle);

package/divider/BaseDivider.vue

@@ -19,18 +19,6 @@ const styles = `
     content: '';
 }
 
-.p-divider-horizontal.p-divider-left {
-    justify-content: flex-start;
-}
-
-.p-divider-horizontal.p-divider-right {
-    justify-content: flex-end;
-}
-
-.p-divider-horizontal.p-divider-center {
-    justify-content: center;
-}
-
 .p-divider-content {
     z-index: 1;
 }
@@ -52,18 +40,6 @@ const styles = `
     content: '';
 }
 
-.p-divider-vertical.p-divider-top {
-    align-items: flex-start;
-}
-
-.p-divider-vertical.p-divider-center {
-    align-items: center;
-}
-
-.p-divider-vertical.p-divider-bottom {
-    align-items: flex-end;
-}
-
 .p-divider-solid.p-divider-horizontal:before {
     border-top-style: solid;
 }
@@ -89,6 +65,14 @@ const styles = `
 }
 `;
 
+/* Position */
+const inlineStyles = {
+    root: ({ props }) => ({
+        justifyContent: props.layout === 'horizontal' ? (props.align === 'center' || props.align === null ? 'center' : props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : null) : null,
+        alignItems: props.layout === 'vertical' ? (props.align === 'center' || props.align === null ? 'center' : props.align === 'top' ? 'flex-start' : props.align === 'bottom' ? 'flex-end' : null) : null
+    })
+};
+
 const classes = {
     root: ({ props }) => [
         'p-divider p-component',
@@ -125,6 +109,7 @@ export default {
     },
     css: {
         classes,
+        inlineStyles,
         loadStyle
     },
     provide() {

package/divider/Divider.d.ts

@@ -27,15 +27,15 @@ export interface DividerPassThroughMethodOptions {
  */
 export interface DividerPassThroughOptions {
     /**
-     * Uses to pass attributes to the root's DOM element.
+     * Used to pass attributes to the root's DOM element.
      */
     root?: DividerPassThroughOptionType;
     /**
-     * Uses to pass attributes to the content's DOM element.
+     * Used to pass attributes to the content's DOM element.
      */
     content?: DividerPassThroughOptionType;
     /**
-     * Uses to manage all lifecycle hooks
+     * Used to manage all lifecycle hooks
      * @see {@link BaseComponent.ComponentHooks}
      */
     hooks?: ComponentHooks;
@@ -67,7 +67,7 @@ export interface DividerProps {
      */
     type?: 'solid' | 'dashed' | 'dotted' | undefined;
     /**
-     * Uses to pass attributes to DOM elements inside the component.
+     * Used to pass attributes to DOM elements inside the component.
      * @type {DividerPassThroughOptions}
      */
     pt?: DividerPassThroughOptions;

package/divider/Divider.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" role="separator" :aria-orientation="layout" v-bind="ptm('root')" data-pc-name="divider">
+    <div :class="cx('root')" :style="sx('root')" role="separator" :aria-orientation="layout" v-bind="ptm('root')" data-pc-name="divider">
         <div v-if="$slots.default" :class="cx('content')" v-bind="ptm('content')">
             <slot></slot>
         </div>

package/divider/divider.cjs.js

@@ -8,10 +8,21 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 
-var styles = "\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-horizontal.p-divider-left {\n    justify-content: flex-start;\n}\n\n.p-divider-horizontal.p-divider-right {\n    justify-content: flex-end;\n}\n\n.p-divider-horizontal.p-divider-center {\n    justify-content: center;\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-vertical.p-divider-top {\n    align-items: flex-start;\n}\n\n.p-divider-vertical.p-divider-center {\n    align-items: center;\n}\n\n.p-divider-vertical.p-divider-bottom {\n    align-items: flex-end;\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n";
-var classes = {
+var styles = "\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n";
+
+/* Position */
+var inlineStyles = {
   root: function root(_ref) {
     var props = _ref.props;
+    return {
+      justifyContent: props.layout === 'horizontal' ? props.align === 'center' || props.align === null ? 'center' : props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : null : null,
+      alignItems: props.layout === 'vertical' ? props.align === 'center' || props.align === null ? 'center' : props.align === 'top' ? 'flex-start' : props.align === 'bottom' ? 'flex-end' : null : null
+    };
+  }
+};
+var classes = {
+  root: function root(_ref2) {
+    var props = _ref2.props;
     return ['p-divider p-component', 'p-divider-' + props.layout, 'p-divider-' + props.type, {
       'p-divider-left': props.layout === 'horizontal' && (!props.align || props.align === 'left')
     }, {
@@ -52,6 +63,7 @@ var script$1 = {
   },
   css: {
     classes: classes,
+    inlineStyles: inlineStyles,
     loadStyle: loadStyle
   },
   provide: function provide() {
@@ -70,6 +82,7 @@ var _hoisted_1 = ["aria-orientation"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
     "class": _ctx.cx('root'),
+    style: _ctx.sx('root'),
     role: "separator",
     "aria-orientation": _ctx.layout
   }, _ctx.ptm('root'), {

package/divider/divider.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/basecomponent"),n=require("primevue/usestyle"),t=require("vue");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e),d=n.useStyle("\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-horizontal.p-divider-left {\n    justify-content: flex-start;\n}\n\n.p-divider-horizontal.p-divider-right {\n    justify-content: flex-end;\n}\n\n.p-divider-horizontal.p-divider-center {\n    justify-content: center;\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-vertical.p-divider-top {\n    align-items: flex-start;\n}\n\n.p-divider-vertical.p-divider-center {\n    align-items: center;\n}\n\n.p-divider-vertical.p-divider-bottom {\n    align-items: flex-end;\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n",{name:"divider",manual:!0}),o={name:"Divider",extends:{name:"BaseDivider",extends:r.default,props:{align:{type:String,default:null},layout:{type:String,default:"horizontal"},type:{type:String,default:"solid"}},css:{classes:{root:function(e){var n=e.props;return["p-divider p-component","p-divider-"+n.layout,"p-divider-"+n.type,{"p-divider-left":"horizontal"===n.layout&&(!n.align||"left"===n.align)},{"p-divider-center":"horizontal"===n.layout&&"center"===n.align},{"p-divider-right":"horizontal"===n.layout&&"right"===n.align},{"p-divider-top":"vertical"===n.layout&&"top"===n.align},{"p-divider-center":"vertical"===n.layout&&(!n.align||"center"===n.align)},{"p-divider-bottom":"vertical"===n.layout&&"bottom"===n.align}]},content:"p-divider-content"},loadStyle:d.load},provide:function(){return{$parentInstance:this}}}},l=["aria-orientation"];o.render=function(e,n,i,r,d,o){return t.openBlock(),t.createElementBlock("div",t.mergeProps({class:e.cx("root"),role:"separator","aria-orientation":e.layout},e.ptm("root"),{"data-pc-name":"divider"}),[e.$slots.default?(t.openBlock(),t.createElementBlock("div",t.mergeProps({key:0,class:e.cx("content")},e.ptm("content")),[t.renderSlot(e.$slots,"default")],16)):t.createCommentVNode("",!0)],16,l)},module.exports=o;
+"use strict";var e=require("primevue/basecomponent"),t=require("primevue/usestyle"),n=require("vue");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e),o=t.useStyle("\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n",{name:"divider",manual:!0}),l={name:"Divider",extends:{name:"BaseDivider",extends:r.default,props:{align:{type:String,default:null},layout:{type:String,default:"horizontal"},type:{type:String,default:"solid"}},css:{classes:{root:function(e){var t=e.props;return["p-divider p-component","p-divider-"+t.layout,"p-divider-"+t.type,{"p-divider-left":"horizontal"===t.layout&&(!t.align||"left"===t.align)},{"p-divider-center":"horizontal"===t.layout&&"center"===t.align},{"p-divider-right":"horizontal"===t.layout&&"right"===t.align},{"p-divider-top":"vertical"===t.layout&&"top"===t.align},{"p-divider-center":"vertical"===t.layout&&(!t.align||"center"===t.align)},{"p-divider-bottom":"vertical"===t.layout&&"bottom"===t.align}]},content:"p-divider-content"},inlineStyles:{root:function(e){var t=e.props;return{justifyContent:"horizontal"===t.layout?"center"===t.align||null===t.align?"center":"left"===t.align?"flex-start":"right"===t.align?"flex-end":null:null,alignItems:"vertical"===t.layout?"center"===t.align||null===t.align?"center":"top"===t.align?"flex-start":"bottom"===t.align?"flex-end":null:null}}},loadStyle:o.load},provide:function(){return{$parentInstance:this}}}},d=["aria-orientation"];l.render=function(e,t,i,r,o,l){return n.openBlock(),n.createElementBlock("div",n.mergeProps({class:e.cx("root"),style:e.sx("root"),role:"separator","aria-orientation":e.layout},e.ptm("root"),{"data-pc-name":"divider"}),[e.$slots.default?(n.openBlock(),n.createElementBlock("div",n.mergeProps({key:0,class:e.cx("content")},e.ptm("content")),[n.renderSlot(e.$slots,"default")],16)):n.createCommentVNode("",!0)],16,d)},module.exports=l;

package/divider/divider.esm.js

@@ -2,10 +2,21 @@ import BaseComponent from 'primevue/basecomponent';
 import { useStyle } from 'primevue/usestyle';
 import { openBlock, createElementBlock, mergeProps, renderSlot, createCommentVNode } from 'vue';
 
-var styles = "\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-horizontal.p-divider-left {\n    justify-content: flex-start;\n}\n\n.p-divider-horizontal.p-divider-right {\n    justify-content: flex-end;\n}\n\n.p-divider-horizontal.p-divider-center {\n    justify-content: center;\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-vertical.p-divider-top {\n    align-items: flex-start;\n}\n\n.p-divider-vertical.p-divider-center {\n    align-items: center;\n}\n\n.p-divider-vertical.p-divider-bottom {\n    align-items: flex-end;\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n";
-var classes = {
+var styles = "\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n";
+
+/* Position */
+var inlineStyles = {
   root: function root(_ref) {
     var props = _ref.props;
+    return {
+      justifyContent: props.layout === 'horizontal' ? props.align === 'center' || props.align === null ? 'center' : props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : null : null,
+      alignItems: props.layout === 'vertical' ? props.align === 'center' || props.align === null ? 'center' : props.align === 'top' ? 'flex-start' : props.align === 'bottom' ? 'flex-end' : null : null
+    };
+  }
+};
+var classes = {
+  root: function root(_ref2) {
+    var props = _ref2.props;
     return ['p-divider p-component', 'p-divider-' + props.layout, 'p-divider-' + props.type, {
       'p-divider-left': props.layout === 'horizontal' && (!props.align || props.align === 'left')
     }, {
@@ -46,6 +57,7 @@ var script$1 = {
   },
   css: {
     classes: classes,
+    inlineStyles: inlineStyles,
     loadStyle: loadStyle
   },
   provide: function provide() {
@@ -64,6 +76,7 @@ var _hoisted_1 = ["aria-orientation"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", mergeProps({
     "class": _ctx.cx('root'),
+    style: _ctx.sx('root'),
     role: "separator",
     "aria-orientation": _ctx.layout
   }, _ctx.ptm('root'), {

package/divider/divider.esm.min.js

@@ -1 +1 @@
-import e from"primevue/basecomponent";import{useStyle as n}from"primevue/usestyle";import{openBlock as i,createElementBlock as t,mergeProps as r,renderSlot as d,createCommentVNode as o}from"vue";var l=n("\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-horizontal.p-divider-left {\n    justify-content: flex-start;\n}\n\n.p-divider-horizontal.p-divider-right {\n    justify-content: flex-end;\n}\n\n.p-divider-horizontal.p-divider-center {\n    justify-content: center;\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-vertical.p-divider-top {\n    align-items: flex-start;\n}\n\n.p-divider-vertical.p-divider-center {\n    align-items: center;\n}\n\n.p-divider-vertical.p-divider-bottom {\n    align-items: flex-end;\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n",{name:"divider",manual:!0}),a={name:"Divider",extends:{name:"BaseDivider",extends:e,props:{align:{type:String,default:null},layout:{type:String,default:"horizontal"},type:{type:String,default:"solid"}},css:{classes:{root:function(e){var n=e.props;return["p-divider p-component","p-divider-"+n.layout,"p-divider-"+n.type,{"p-divider-left":"horizontal"===n.layout&&(!n.align||"left"===n.align)},{"p-divider-center":"horizontal"===n.layout&&"center"===n.align},{"p-divider-right":"horizontal"===n.layout&&"right"===n.align},{"p-divider-top":"vertical"===n.layout&&"top"===n.align},{"p-divider-center":"vertical"===n.layout&&(!n.align||"center"===n.align)},{"p-divider-bottom":"vertical"===n.layout&&"bottom"===n.align}]},content:"p-divider-content"},loadStyle:l.load},provide:function(){return{$parentInstance:this}}}},p=["aria-orientation"];a.render=function(e,n,l,a,v,s){return i(),t("div",r({class:e.cx("root"),role:"separator","aria-orientation":e.layout},e.ptm("root"),{"data-pc-name":"divider"}),[e.$slots.default?(i(),t("div",r({key:0,class:e.cx("content")},e.ptm("content")),[d(e.$slots,"default")],16)):o("",!0)],16,p)};export{a as default};
+import e from"primevue/basecomponent";import{useStyle as n}from"primevue/usestyle";import{openBlock as t,createElementBlock as i,mergeProps as r,renderSlot as o,createCommentVNode as l}from"vue";var d=n("\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n",{name:"divider",manual:!0}),a={name:"Divider",extends:{name:"BaseDivider",extends:e,props:{align:{type:String,default:null},layout:{type:String,default:"horizontal"},type:{type:String,default:"solid"}},css:{classes:{root:function(e){var n=e.props;return["p-divider p-component","p-divider-"+n.layout,"p-divider-"+n.type,{"p-divider-left":"horizontal"===n.layout&&(!n.align||"left"===n.align)},{"p-divider-center":"horizontal"===n.layout&&"center"===n.align},{"p-divider-right":"horizontal"===n.layout&&"right"===n.align},{"p-divider-top":"vertical"===n.layout&&"top"===n.align},{"p-divider-center":"vertical"===n.layout&&(!n.align||"center"===n.align)},{"p-divider-bottom":"vertical"===n.layout&&"bottom"===n.align}]},content:"p-divider-content"},inlineStyles:{root:function(e){var n=e.props;return{justifyContent:"horizontal"===n.layout?"center"===n.align||null===n.align?"center":"left"===n.align?"flex-start":"right"===n.align?"flex-end":null:null,alignItems:"vertical"===n.layout?"center"===n.align||null===n.align?"center":"top"===n.align?"flex-start":"bottom"===n.align?"flex-end":null:null}}},loadStyle:d.load},provide:function(){return{$parentInstance:this}}}},p=["aria-orientation"];a.render=function(e,n,d,a,s,v){return t(),i("div",r({class:e.cx("root"),style:e.sx("root"),role:"separator","aria-orientation":e.layout},e.ptm("root"),{"data-pc-name":"divider"}),[e.$slots.default?(t(),i("div",r({key:0,class:e.cx("content")},e.ptm("content")),[o(e.$slots,"default")],16)):l("",!0)],16,p)};export{a as default};

package/divider/divider.js

@@ -6,10 +6,21 @@ this.primevue.divider = (function (BaseComponent, usestyle, vue) {
 
     var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 
-    var styles = "\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-horizontal.p-divider-left {\n    justify-content: flex-start;\n}\n\n.p-divider-horizontal.p-divider-right {\n    justify-content: flex-end;\n}\n\n.p-divider-horizontal.p-divider-center {\n    justify-content: center;\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-vertical.p-divider-top {\n    align-items: flex-start;\n}\n\n.p-divider-vertical.p-divider-center {\n    align-items: center;\n}\n\n.p-divider-vertical.p-divider-bottom {\n    align-items: flex-end;\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n";
-    var classes = {
+    var styles = "\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n";
+
+    /* Position */
+    var inlineStyles = {
       root: function root(_ref) {
         var props = _ref.props;
+        return {
+          justifyContent: props.layout === 'horizontal' ? props.align === 'center' || props.align === null ? 'center' : props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : null : null,
+          alignItems: props.layout === 'vertical' ? props.align === 'center' || props.align === null ? 'center' : props.align === 'top' ? 'flex-start' : props.align === 'bottom' ? 'flex-end' : null : null
+        };
+      }
+    };
+    var classes = {
+      root: function root(_ref2) {
+        var props = _ref2.props;
         return ['p-divider p-component', 'p-divider-' + props.layout, 'p-divider-' + props.type, {
           'p-divider-left': props.layout === 'horizontal' && (!props.align || props.align === 'left')
         }, {
@@ -50,6 +61,7 @@ this.primevue.divider = (function (BaseComponent, usestyle, vue) {
       },
       css: {
         classes: classes,
+        inlineStyles: inlineStyles,
         loadStyle: loadStyle
       },
       provide: function provide() {
@@ -68,6 +80,7 @@ this.primevue.divider = (function (BaseComponent, usestyle, vue) {
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         "class": _ctx.cx('root'),
+        style: _ctx.sx('root'),
         role: "separator",
         "aria-orientation": _ctx.layout
       }, _ctx.ptm('root'), {

package/divider/divider.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.divider=function(e,n,t){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e),d=n.useStyle("\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-horizontal.p-divider-left {\n    justify-content: flex-start;\n}\n\n.p-divider-horizontal.p-divider-right {\n    justify-content: flex-end;\n}\n\n.p-divider-horizontal.p-divider-center {\n    justify-content: center;\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-vertical.p-divider-top {\n    align-items: flex-start;\n}\n\n.p-divider-vertical.p-divider-center {\n    align-items: center;\n}\n\n.p-divider-vertical.p-divider-bottom {\n    align-items: flex-end;\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n",{name:"divider",manual:!0}),o={name:"Divider",extends:{name:"BaseDivider",extends:r.default,props:{align:{type:String,default:null},layout:{type:String,default:"horizontal"},type:{type:String,default:"solid"}},css:{classes:{root:function(e){var n=e.props;return["p-divider p-component","p-divider-"+n.layout,"p-divider-"+n.type,{"p-divider-left":"horizontal"===n.layout&&(!n.align||"left"===n.align)},{"p-divider-center":"horizontal"===n.layout&&"center"===n.align},{"p-divider-right":"horizontal"===n.layout&&"right"===n.align},{"p-divider-top":"vertical"===n.layout&&"top"===n.align},{"p-divider-center":"vertical"===n.layout&&(!n.align||"center"===n.align)},{"p-divider-bottom":"vertical"===n.layout&&"bottom"===n.align}]},content:"p-divider-content"},loadStyle:d.load},provide:function(){return{$parentInstance:this}}}},l=["aria-orientation"];return o.render=function(e,n,i,r,d,o){return t.openBlock(),t.createElementBlock("div",t.mergeProps({class:e.cx("root"),role:"separator","aria-orientation":e.layout},e.ptm("root"),{"data-pc-name":"divider"}),[e.$slots.default?(t.openBlock(),t.createElementBlock("div",t.mergeProps({key:0,class:e.cx("content")},e.ptm("content")),[t.renderSlot(e.$slots,"default")],16)):t.createCommentVNode("",!0)],16,l)},o}(primevue.basecomponent,primevue.usestyle,Vue);
+this.primevue=this.primevue||{},this.primevue.divider=function(e,t,n){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e),o=t.useStyle("\n.p-divider-horizontal {\n    display: flex;\n    width: 100%;\n    position: relative;\n    align-items: center;\n}\n\n.p-divider-horizontal:before {\n    position: absolute;\n    display: block;\n    top: 50%;\n    left: 0;\n    width: 100%;\n    content: '';\n}\n\n.p-divider-content {\n    z-index: 1;\n}\n\n.p-divider-vertical {\n    min-height: 100%;\n    margin: 0 1rem;\n    display: flex;\n    position: relative;\n    justify-content: center;\n}\n\n.p-divider-vertical:before {\n    position: absolute;\n    display: block;\n    top: 0;\n    left: 50%;\n    height: 100%;\n    content: '';\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n    border-top-style: solid;\n}\n\n.p-divider-solid.p-divider-vertical:before {\n    border-left-style: solid;\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n    border-top-style: dashed;\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n    border-left-style: dashed;\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n    border-top-style: dotted;\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n    border-left-style: dotted;\n}\n",{name:"divider",manual:!0}),l={name:"Divider",extends:{name:"BaseDivider",extends:r.default,props:{align:{type:String,default:null},layout:{type:String,default:"horizontal"},type:{type:String,default:"solid"}},css:{classes:{root:function(e){var t=e.props;return["p-divider p-component","p-divider-"+t.layout,"p-divider-"+t.type,{"p-divider-left":"horizontal"===t.layout&&(!t.align||"left"===t.align)},{"p-divider-center":"horizontal"===t.layout&&"center"===t.align},{"p-divider-right":"horizontal"===t.layout&&"right"===t.align},{"p-divider-top":"vertical"===t.layout&&"top"===t.align},{"p-divider-center":"vertical"===t.layout&&(!t.align||"center"===t.align)},{"p-divider-bottom":"vertical"===t.layout&&"bottom"===t.align}]},content:"p-divider-content"},inlineStyles:{root:function(e){var t=e.props;return{justifyContent:"horizontal"===t.layout?"center"===t.align||null===t.align?"center":"left"===t.align?"flex-start":"right"===t.align?"flex-end":null:null,alignItems:"vertical"===t.layout?"center"===t.align||null===t.align?"center":"top"===t.align?"flex-start":"bottom"===t.align?"flex-end":null:null}}},loadStyle:o.load},provide:function(){return{$parentInstance:this}}}},d=["aria-orientation"];return l.render=function(e,t,i,r,o,l){return n.openBlock(),n.createElementBlock("div",n.mergeProps({class:e.cx("root"),style:e.sx("root"),role:"separator","aria-orientation":e.layout},e.ptm("root"),{"data-pc-name":"divider"}),[e.$slots.default?(n.openBlock(),n.createElementBlock("div",n.mergeProps({key:0,class:e.cx("content")},e.ptm("content")),[n.renderSlot(e.$slots,"default")],16)):n.createCommentVNode("",!0)],16,d)},l}(primevue.basecomponent,primevue.usestyle,Vue);

package/dock/BaseDock.vue

@@ -111,7 +111,7 @@ const styles = `
 `;
 
 const classes = {
-    root: ({ props }) => ['p-dock p-component', `p-dock-${props.position}`, props.class],
+    root: ({ props }) => ['p-dock p-component', `p-dock-${props.position}`],
     container: 'p-dock-list-container',
     menu: 'p-dock-list',
     menuitem: ({ instance, processedItem, index, id }) => [

package/dock/Dock.d.ts

@@ -30,35 +30,35 @@ export interface DockPassThroughMethodOptions {
  */
 export interface DockPassThroughOptions {
     /**
-     * Uses to pass attributes to the root's DOM element.
+     * Used to pass attributes to the root's DOM element.
      */
     root?: DockPassThroughOptionType;
     /**
-     * Uses to pass attributes to the container's DOM element.
+     * Used to pass attributes to the container's DOM element.
      */
     container?: DockPassThroughOptionType;
     /**
-     * Uses to pass attributes to the list's DOM element.
+     * Used to pass attributes to the list's DOM element.
      */
     menu?: DockPassThroughOptionType;
     /**
-     * Uses to pass attributes to the list item's DOM element.
+     * Used to pass attributes to the list item's DOM element.
      */
     menuitem?: DockPassThroughOptionType;
     /**
-     * Uses to pass attributes to the content's DOM element.
+     * Used to pass attributes to the content's DOM element.
      */
     content?: DockPassThroughOptionType;
     /**
-     * Uses to pass attributes to the action's DOM element.
+     * Used to pass attributes to the action's DOM element.
      */
     action?: DockPassThroughOptionType;
     /**
-     * Uses to pass attributes to the icon's DOM element.
+     * Used to pass attributes to the icon's DOM element.
      */
     icon?: DockPassThroughOptionType;
     /**
-     * Uses to manage all lifecycle hooks
+     * Used to manage all lifecycle hooks
      * @see {@link BaseComponent.ComponentHooks}
      */
     hooks?: ComponentHooks;
@@ -104,6 +104,10 @@ export interface DockContext {
      * Current index of the menuitem.
      */
     index: number;
+    /**
+     * Current menuitem
+     */
+    item: any;
     /**
      * Current active state of menuitem as a boolean.
      * @defaultValue false
@@ -178,7 +182,7 @@ export interface DockProps {
      */
     'aria-label'?: string | undefined;
     /**
-     * Uses to pass attributes to DOM elements inside the component.
+     * Used to pass attributes to DOM elements inside the component.
      * @type {DockPassThroughOptions}
      */
     pt?: DockPassThroughOptions;

package/dock/Dock.vue

@@ -1,6 +1,18 @@
 <template>
-    <div :class="cx('root')" :style="style" v-bind="ptm('root')" data-pc-name="dock">
-        <DockSub :model="model" :templates="$slots" :exact="exact" :tooltipOptions="tooltipOptions" :position="position" :menuId="menuId" :aria-label="ariaLabel" :aria-labelledby="ariaLabelledby" :tabindex="tabindex" :pt="pt"></DockSub>
+    <div :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="dock">
+        <DockSub
+            :model="model"
+            :templates="$slots"
+            :exact="exact"
+            :tooltipOptions="tooltipOptions"
+            :position="position"
+            :menuId="menuId"
+            :aria-label="ariaLabel"
+            :aria-labelledby="ariaLabelledby"
+            :tabindex="tabindex"
+            :pt="pt"
+            :unstyled="unstyled"
+        ></DockSub>
     </div>
 </template>
 
@@ -11,6 +23,11 @@ import DockSub from './DockSub.vue';
 export default {
     name: 'Dock',
     extends: BaseDock,
+    computed: {
+        containerClass() {
+            return [this.class, this.cx('root')];
+        }
+    },
     components: {
         DockSub
     }

package/dock/DockSub.vue

@@ -25,11 +25,11 @@
                     :aria-disabled="disabled(processedItem)"
                     @click="onItemClick($event, processedItem)"
                     @mouseenter="onItemMouseEnter(index)"
-                    v-bind="getPTOptions('menuitem', index)"
+                    v-bind="getPTOptions('menuitem', processedItem, index)"
                     :data-p-focused="isItemActive(getItemId(index))"
                     :data-p-disabled="disabled(processedItem) || false"
                 >
-                    <div :class="cx('content')" v-bind="getPTOptions('content', index)">
+                    <div :class="cx('content')" v-bind="getPTOptions('content', processedItem, index)">
                         <template v-if="!templates['item']">
                             <router-link v-if="processedItem.to && !disabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="processedItem.to" custom>
                                 <a
@@ -40,10 +40,10 @@
                                     tabindex="-1"
                                     aria-hidden="true"
                                     @click="onItemActionClick($event, processedItem, navigate)"
-                                    v-bind="getPTOptions('action', index)"
+                                    v-bind="getPTOptions('action', processedItem, index)"
                                 >
                                     <template v-if="!templates['icon']">
-                                        <span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', index)"></span>
+                                        <span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', processedItem, index)"></span>
                                     </template>
                                     <component v-else :is="templates['icon']" :item="processedItem" :class="cx('icon')"></component>
                                 </a>
@@ -56,10 +56,10 @@
                                 :target="processedItem.target"
                                 tabindex="-1"
                                 aria-hidden="true"
-                                v-bind="getPTOptions('action', index)"
+                                v-bind="getPTOptions('action', processedItem, index)"
                             >
                                 <template v-if="!templates['icon']">
-                                    <span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', index)"></span>
+                                    <span v-ripple :class="[cx('icon'), processedItem.icon]" v-bind="getPTOptions('icon', processedItem, index)"></span>
                                 </template>
                                 <component v-else :is="templates['icon']" :item="processedItem" :class="cx('icon')"></component>
                             </a>
@@ -141,10 +141,11 @@ export default {
         getItemProp(processedItem, name) {
             return processedItem && processedItem.item ? ObjectUtils.getItemValue(processedItem.item[name]) : undefined;
         },
-        getPTOptions(key, index) {
+        getPTOptions(key, item, index) {
             return this.ptm(key, {
                 context: {
                     index,
+                    item,
                     active: this.isItemActive(this.getItemId(index))
                 }
             });