diff --git a/packages/@headlessui-react/CHANGELOG.md b/packages/@headlessui-react/CHANGELOG.md
index 8a84e31..bd25204 100644
--- a/packages/@headlessui-react/CHANGELOG.md
+++ b/packages/@headlessui-react/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Improve `Portal` detection for `Popover` components ([#1842](https://github.com/tailwindlabs/headlessui/pull/1842))
+- Fix `useOutsideClick` swallowing events inside ShadowDOM ([#1876](https://github.com/tailwindlabs/headlessui/pull/1876))
 
 ## [1.7.2] - 2022-09-15
 
diff --git a/packages/@headlessui-react/src/hooks/use-outside-click.ts b/packages/@headlessui-react/src/hooks/use-outside-click.ts
index d877d96..7f73603 100644
--- a/packages/@headlessui-react/src/hooks/use-outside-click.ts
+++ b/packages/@headlessui-react/src/hooks/use-outside-click.ts
@@ -96,7 +96,7 @@ export function useOutsideClick(
     'mousedown',
     (event) => {
       if (enabledRef.current) {
-        initialClickTarget.current = event.target
+        initialClickTarget.current = event.composedPath?.()?.[0] || event.target
       }
     },
     true
diff --git a/packages/@headlessui-vue/CHANGELOG.md b/packages/@headlessui-vue/CHANGELOG.md
index 18329d6..7edfe6a 100644
--- a/packages/@headlessui-vue/CHANGELOG.md
+++ b/packages/@headlessui-vue/CHANGELOG.md
@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Call `displayValue` with a v-model of `ref(undefined)` on `ComboboxInput` ([#1865](https://github.com/tailwindlabs/headlessui/pull/1865))
 - Improve `Portal` detection for `Popover` components ([#1842](https://github.com/tailwindlabs/headlessui/pull/1842))
 - Fix crash when `children` are `undefined` ([#1885](https://github.com/tailwindlabs/headlessui/pull/1885))
+- Fix `useOutsideClick` swallowing events inside ShadowDOM ([#1876](https://github.com/tailwindlabs/headlessui/pull/1876))
 
 ## [1.7.2] - 2022-09-15
 
diff --git a/packages/@headlessui-vue/src/hooks/use-outside-click.ts b/packages/@headlessui-vue/src/hooks/use-outside-click.ts
index 5083ccf..b89fead 100644
--- a/packages/@headlessui-vue/src/hooks/use-outside-click.ts
+++ b/packages/@headlessui-vue/src/hooks/use-outside-click.ts
@@ -82,7 +82,7 @@ export function useOutsideClick(
     'mousedown',
     (event) => {
       if (enabled.value) {
-        initialClickTarget.value = event.target
+        initialClickTarget.value = event.composedPath?.()?.[0] || event.target
       }
     },
     true