primevue/dialog/dialog.cjs.min.js

[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue)

"use strict";var e=require("primevue/utils"),n=require("primevue/ripple"),t=require("vue");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o={inheritAttrs:!1,emits:["update:visible","show","hide"],props:{header:null,footer:null,visible:Boolean,modal:Boolean,contentStyle:null,rtl:Boolean,maximizable:Boolean,dismissableMask:Boolean,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},ariaCloseLabel:{type:String,default:"close"},position:{type:String,default:"center"}},data(){return{containerVisible:this.visible,maximized:!1}},documentKeydownListener:null,container:null,mask:null,updated(){this.visible&&(this.containerVisible=this.visible)},beforeUnmount(){this.unbindDocumentState(),this.container=null,this.mask=null},methods:{close(){this.$emit("update:visible",!1)},onBeforeEnter(n){this.autoZIndex&&(n.style.zIndex=String(this.baseZIndex+e.DomHandler.generateZIndex()))},onEnter(){this.mask.style.zIndex=String(parseInt(this.container.style.zIndex,10)-1),this.$emit("show"),this.focus(),this.enableDocumentSettings()},onBeforeLeave(){e.DomHandler.addClass(this.mask,"p-dialog-mask-leave")},onLeave(){this.$emit("hide")},onAfterLeave(){this.containerVisible=!1,this.unbindDocumentState()},onMaskClick(e){this.dismissableMask&&this.closable&&this.modal&&this.mask===e.target&&this.close()},focus(){let e=this.container.querySelector("[autofocus]");e&&e.focus()},maximize(){this.maximized=!this.maximized,this.modal||(this.maximized?e.DomHandler.addClass(document.body,"p-overflow-hidden"):e.DomHandler.removeClass(document.body,"p-overflow-hidden"))},enableDocumentSettings(){this.modal?(e.DomHandler.addClass(document.body,"p-overflow-hidden"),this.bindDocumentKeydownListener()):this.maximizable&&this.maximized&&e.DomHandler.addClass(document.body,"p-overflow-hidden")},unbindDocumentState(){this.modal?(e.DomHandler.removeClass(document.body,"p-overflow-hidden"),this.unbindDocumentKeydownListener()):this.maximizable&&this.maximized&&e.DomHandler.removeClass(document.body,"p-overflow-hidden")},onKeyDown(n){if(9===n.which){n.preventDefault();let t=e.DomHandler.getFocusableElements(this.container);if(t&&t.length>0)if(document.activeElement){let e=t.indexOf(document.activeElement);n.shiftKey?-1==e||0===e?t[t.length-1].focus():t[e-1].focus():-1==e||e===t.length-1?t[0].focus():t[e+1].focus()}else t[0].focus()}else 27===n.which&&this.closeOnEscape&&this.close()},bindDocumentKeydownListener(){this.documentKeydownListener||(this.documentKeydownListener=this.onKeyDown.bind(this),window.document.addEventListener("keydown",this.documentKeydownListener))},unbindDocumentKeydownListener(){this.documentKeydownListener&&(window.document.removeEventListener("keydown",this.documentKeydownListener),this.documentKeydownListener=null)},getPositionClass(){const e=["left","right","top","topleft","topright","bottom","bottomleft","bottomright"].find((e=>e===this.position));return e?`p-dialog-${e}`:""},containerRef(e){this.container=e},maskRef(e){this.mask=e}},computed:{maskClass(){return["p-dialog-mask",{"p-component-overlay":this.modal},this.getPositionClass()]},dialogClass(){return["p-dialog p-component",{"p-dialog-rtl":this.rtl,"p-dialog-maximized":this.maximizable&&this.maximized}]},maximizeIconClass(){return["p-dialog-header-maximize-icon pi",{"pi-window-maximize":!this.maximized,"pi-window-minimize":this.maximized}]},ariaId:()=>e.UniqueComponentId(),ariaLabelledById(){return null!=this.header?this.ariaId+"_header":null}},directives:{ripple:i(n).default}};const a={key:0,class:"p-dialog-header"},l={class:"p-dialog-header-icons"},s=t.createVNode("span",{class:"p-dialog-header-close-icon pi pi-times"},null,-1),d={key:1,class:"p-dialog-footer"};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===t&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}("\n.p-dialog-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    pointer-events: none;\n    background-color: transparent;\n    -webkit-transition-property: background-color;\n    transition-property: background-color;\n}\n.p-dialog-mask.p-component-overlay {\n    pointer-events: auto;\n}\n.p-dialog {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    pointer-events: auto;\n    max-height: 90%;\n    -webkit-transform: scale(1);\n            transform: scale(1);\n}\n.p-dialog-content {\n    overflow-y: auto;\n}\n.p-dialog-header {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: justify;\n        -ms-flex-pack: justify;\n            justify-content: space-between;\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n}\n.p-dialog-footer {\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n}\n.p-dialog .p-dialog-header-icons {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-dialog .p-dialog-header-icon {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    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    -webkit-transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-dialog-leave-active {\n    -webkit-transition: all 150ms cubic-bezier(0.4, 0.0, 0.2, 1);\n    transition: all 150ms cubic-bezier(0.4, 0.0, 0.2, 1);\n}\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n    opacity: 0;\n    -webkit-transform: scale(0.7);\n            transform: scale(0.7);\n}\n.p-dialog-mask.p-dialog-mask-leave {\n    background-color: transparent;\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: .75rem;\n    -webkit-transform: translate3d(0px, 0px, 0px);\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    -webkit-transition: all .3s ease-out;\n    transition: all .3s ease-out;\n}\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n    -webkit-transform: translate3d(0px, -100%, 0px);\n            transform: translate3d(0px, -100%, 0px);\n}\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n    -webkit-transform: translate3d(0px, 100%, 0px);\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    -webkit-transform: translate3d(-100%, 0px, 0px);\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    -webkit-transform: translate3d(100%, 0px, 0px);\n            transform: translate3d(100%, 0px, 0px);\n}\n\n/* Maximize */\n.p-dialog-maximized {\n    -webkit-transition: none;\n    transition: none;\n    -webkit-transform: none;\n            transform: none;\n    width: 100vw !important;\n    max-height: 100%;\n    height: 100%;\n}\n.p-dialog-maximized .p-dialog-content {\n    -webkit-box-flex: 1;\n        -ms-flex-positive: 1;\n            flex-grow: 1;\n}\n\n/* Position */\n.p-dialog-left {\n    -webkit-box-pack: start;\n        -ms-flex-pack: start;\n            justify-content: flex-start;\n}\n.p-dialog-right {\n    -webkit-box-pack: end;\n        -ms-flex-pack: end;\n            justify-content: flex-end;\n}\n.p-dialog-top {\n    -webkit-box-align: start;\n        -ms-flex-align: start;\n            align-items: flex-start;\n}\n.p-dialog-topleft {\n    -webkit-box-pack: start;\n        -ms-flex-pack: start;\n            justify-content: flex-start;\n    -webkit-box-align: start;\n        -ms-flex-align: start;\n            align-items: flex-start;\n}\n.p-dialog-topright {\n    -webkit-box-pack: end;\n        -ms-flex-pack: end;\n            justify-content: flex-end;\n    -webkit-box-align: start;\n        -ms-flex-align: start;\n            align-items: flex-start;\n}\n.p-dialog-bottom {\n    -webkit-box-align: end;\n        -ms-flex-align: end;\n            align-items: flex-end;\n}\n.p-dialog-bottomleft {\n    -webkit-box-pack: start;\n        -ms-flex-pack: start;\n            justify-content: flex-start;\n    -webkit-box-align: end;\n        -ms-flex-align: end;\n            align-items: flex-end;\n}\n.p-dialog-bottomright {\n    -webkit-box-pack: end;\n        -ms-flex-pack: end;\n            justify-content: flex-end;\n    -webkit-box-align: end;\n        -ms-flex-align: end;\n            align-items: flex-end;\n}\n.p-confirm-dialog .p-dialog-content {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n"),o.render=function(e,n,i,o,r,p){const m=t.resolveDirective("ripple");return r.containerVisible?(t.openBlock(),t.createBlock("div",{key:0,ref:p.maskRef,class:p.maskClass,onClick:n[3]||(n[3]=(...e)=>p.onMaskClick&&p.onMaskClick(...e))},[t.createVNode(t.Transition,{name:"p-dialog",onBeforeEnter:p.onBeforeEnter,onEnter:p.onEnter,onBeforeLeave:p.onBeforeLeave,onLeave:p.onLeave,onAfterLeave:p.onAfterLeave,appear:""},{default:t.withCtx((()=>[i.visible?(t.openBlock(),t.createBlock("div",t.mergeProps({key:0,ref:p.containerRef,class:p.dialogClass},e.$attrs,{role:"dialog","aria-labelledby":p.ariaLabelledById,"aria-modal":i.modal}),[i.showHeader?(t.openBlock(),t.createBlock("div",a,[t.renderSlot(e.$slots,"header",{},(()=>[i.header?(t.openBlock(),t.createBlock("span",{key:0,id:p.ariaLabelledById,class:"p-dialog-title"},t.toDisplayString(i.header),9,["id"])):t.createCommentVNode("",!0)])),t.createVNode("div",l,[i.maximizable?t.withDirectives((t.openBlock(),t.createBlock("button",{key:0,class:"p-dialog-header-icon p-dialog-header-maximize p-link",onClick:n[1]||(n[1]=(...e)=>p.maximize&&p.maximize(...e)),type:"button",tabindex:"-1"},[t.createVNode("span",{class:p.maximizeIconClass},null,2)],512)),[[m]]):t.createCommentVNode("",!0),i.closable?t.withDirectives((t.openBlock(),t.createBlock("button",{key:1,class:"p-dialog-header-icon p-dialog-header-close p-link",onClick:n[2]||(n[2]=(...e)=>p.close&&p.close(...e)),"aria-label":i.ariaCloseLabel,type:"button",tabindex:"-1"},[s],8,["aria-label"])),[[m]]):t.createCommentVNode("",!0)])])):t.createCommentVNode("",!0),t.createVNode("div",{class:"p-dialog-content",style:i.contentStyle},[t.renderSlot(e.$slots,"default")],4),i.footer||e.$slots.footer?(t.openBlock(),t.createBlock("div",d,[t.renderSlot(e.$slots,"footer",{},(()=>[t.createTextVNode(t.toDisplayString(i.footer),1)]))])):t.createCommentVNode("",!0)],16,["aria-labelledby","aria-modal"])):t.createCommentVNode("",!0)])),_:1},8,["onBeforeEnter","onEnter","onBeforeLeave","onLeave","onAfterLeave"])],2)):t.createCommentVNode("",!0)},module.exports=o;