ensure we stop the event from propagating

tailwindlabs · Sep 12, 2021 · 3ad86ad · 3ad86ad
1 parent 452b2c2
commit 3ad86ad
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 0 deletions.
diff --git a/packages/@headlessui-react/src/components/popover/popover.tsx b/packages/@headlessui-react/src/components/popover/popover.tsx
@@ -353,6 +353,8 @@ let Button = forwardRefWithAs(function Button<TTag extends ElementType = typeof
             if (state.popoverState !== PopoverStates.Open) return closeOthers?.(state.buttonId)
             if (!internalButtonRef.current) return
             if (!internalButtonRef.current.contains(document.activeElement)) return
+            event.preventDefault()
+            event.stopPropagation()
             dispatch({ type: ActionTypes.ClosePopover })
             break
 
@@ -603,6 +605,7 @@ let Panel = forwardRefWithAs(function Panel<TTag extends ElementType = typeof DE
           if (!internalPanelRef.current) return
           if (!internalPanelRef.current.contains(document.activeElement)) return
           event.preventDefault()
+          event.stopPropagation()
           dispatch({ type: ActionTypes.ClosePopover })
           state.button?.focus()
           break

diff --git a/packages/@headlessui-vue/src/components/popover/popover.ts b/packages/@headlessui-vue/src/components/popover/popover.ts
@@ -304,6 +304,8 @@ export let PopoverButton = defineComponent({
               if (api.popoverState.value !== PopoverStates.Open) return closeOthers?.(api.buttonId)
               if (!dom(api.button)) return
               if (!dom(api.button)?.contains(document.activeElement)) return
+              event.preventDefault()
+              event.stopPropagation()
               api.closePopover()
               break
 
@@ -571,6 +573,7 @@ export let PopoverPanel = defineComponent({
             if (!dom(api.panel)) return
             if (!dom(api.panel)?.contains(document.activeElement)) return
             event.preventDefault()
+            event.stopPropagation()
             api.closePopover()
             dom(api.button)?.focus()
             break