From 715384bf4e4efcafa4a2a756e0dcc4fa81d58795 Mon Sep 17 00:00:00 2001
From: Giwayume <Giwayume@users.noreply.github.com>
Date: Thu, 20 Oct 2022 20:50:41 -0400
Subject: [PATCH] fix(components): [dialog] click allow focus out (#10160)

Co-authored-by: OpenGraphica <opengraphica@gmail.com>
---
 packages/components/dialog/src/dialog.vue    | 2 ++
 packages/components/dialog/src/use-dialog.ts | 7 +++++++
 2 files changed, 9 insertions(+)

diff --git a/packages/components/dialog/src/dialog.vue b/packages/components/dialog/src/dialog.vue
index 3df83da0b7..1aea23ba08 100644
--- a/packages/components/dialog/src/dialog.vue
+++ b/packages/components/dialog/src/dialog.vue
@@ -31,6 +31,7 @@
             focus-start-el="container"
             @focus-after-trapped="onOpenAutoFocus"
             @focus-after-released="onCloseAutoFocus"
+            @focusout-prevented="onFocusoutPrevented"
             @release-requested="onCloseRequested"
           >
             <el-dialog-content
@@ -132,6 +133,7 @@ const {
   onOpenAutoFocus,
   onCloseAutoFocus,
   onCloseRequested,
+  onFocusoutPrevented,
 } = useDialog(props, dialogRef)
 
 provide(dialogInjectionKey, {
diff --git a/packages/components/dialog/src/use-dialog.ts b/packages/components/dialog/src/use-dialog.ts
index 1c100df224..b357a4ceb4 100644
--- a/packages/components/dialog/src/use-dialog.ts
+++ b/packages/components/dialog/src/use-dialog.ts
@@ -138,6 +138,12 @@ export const useDialog = (
     emit('closeAutoFocus')
   }
 
+  function onFocusoutPrevented(event: CustomEvent) {
+    if (event.detail?.focusReason === 'pointer') {
+      event.preventDefault()
+    }
+  }
+
   if (props.lockScroll) {
     useLockscreen(visible)
   }
@@ -204,6 +210,7 @@ export const useDialog = (
     onOpenAutoFocus,
     onCloseAutoFocus,
     onCloseRequested,
+    onFocusoutPrevented,
     titleId,
     bodyId,
     closed,