From 265a45622a62208095f66d128d0bc8b87f1f3a23 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Fri, 7 Jul 2023 09:04:39 +0300
Subject: [PATCH] Refactor #3965 - Refactor on Dialog

---
 components/lib/dialog/BaseDialog.vue | 5 +++--
 components/lib/dialog/Dialog.vue     | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/components/lib/dialog/BaseDialog.vue b/components/lib/dialog/BaseDialog.vue
index 4e30a72d4..8c4c45a6e 100644
--- a/components/lib/dialog/BaseDialog.vue
+++ b/components/lib/dialog/BaseDialog.vue
@@ -143,7 +143,7 @@ const styles = `
 
 /* Position */
 const inlineStyles = {
-    mask: ({ position }) => ({
+    mask: ({ position, modal }) => ({
         position: 'fixed',
         height: '100%',
         width: '100%',
@@ -151,7 +151,8 @@ const inlineStyles = {
         top: 0,
         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'
+        alignItems: position === 'top' || position === 'topleft' || position === 'topright' ? 'flex-start' : position === 'bottom' || position === 'bottomleft' || position === 'bottomright' ? 'flex-end' : 'center',
+        pointerEvents: !modal && 'none'
     }),
     root: {
         display: 'flex',
diff --git a/components/lib/dialog/Dialog.vue b/components/lib/dialog/Dialog.vue
index 5346cd7ce..930cc9c8f 100755
--- a/components/lib/dialog/Dialog.vue
+++ b/components/lib/dialog/Dialog.vue
@@ -1,6 +1,6 @@
 <template>
     <Portal :appendTo="appendTo">
-        <div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position })" @click="onMaskClick" v-bind="ptm('mask')">
+        <div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @click="onMaskClick" v-bind="ptm('mask')">
             <transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear>
                 <div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="{ ...$attrs, ...ptm('root') }">
                     <div v-if="showHeader" :ref="headerContainerRef" :class="cx('header')" @mousedown="initDrag" v-bind="ptm('header')">