fix(onClickOutside): call handler if click event is fired by a keyp…

…ress (#2426)
vueuse · Nov 13, 2022 · ff96dc7 · ff96dc7
1 parent 6886ed1
commit ff96dc7
Showing 1 changed file with 9 additions and 4 deletions.
diff --git a/packages/core/onClickOutside/index.ts b/packages/core/onClickOutside/index.ts
@@ -1,5 +1,4 @@
 import type { Fn } from '@vueuse/shared'
-import { ref } from 'vue-demi'
 import type { MaybeElementRef } from '../unrefElement'
 import { unrefElement } from '../unrefElement'
 import { useEventListener } from '../useEventListener'
@@ -43,7 +42,7 @@ export function onClickOutside<T extends OnClickOutsideOptions>(
   if (!window)
     return
 
-  const shouldListen = ref(true)
+  let shouldListen = true
 
   let fallback: number
 
@@ -52,9 +51,14 @@ export function onClickOutside<T extends OnClickOutsideOptions>(
 
     const el = unrefElement(target)
 
-    if (!el || el === event.target || event.composedPath().includes(el) || !shouldListen.value)
+    if (!el || el === event.target || event.composedPath().includes(el))
       return
 
+    if (!shouldListen) {
+      shouldListen = true
+      return
+    }
+
     handler(event)
   }
 
@@ -69,7 +73,8 @@ export function onClickOutside<T extends OnClickOutsideOptions>(
     useEventListener(window, 'click', listener, { passive: true, capture }),
     useEventListener(window, 'pointerdown', (e) => {
       const el = unrefElement(target)
-      shouldListen.value = !!el && !e.composedPath().includes(el) && !shouldIgnore(e)
+      if (el)
+        shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e)
     }, { passive: true }),
     useEventListener(window, 'pointerup', (e) => {
       if (e.button === 0) {