Fix closing of Popover.Panel in React 18 (#1409)

* remove unnecessary `SetPanel` action

* update changelog

Author: RobinMalfait

CHANGELOG.md

@@ -13,7 +13,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased - @headlessui/react]
 
-- Nothing yet!
+### Fixed
+
+- Fix closing of `Popover.Panel` in React 18 ([#1409](https://github.com/tailwindlabs/headlessui/pull/1409))
 
 ## [@headlessui/react@1.6.1] - 2022-05-03
 

packages/@headlessui-react/src/components/popover/popover.tsx

@@ -640,9 +640,6 @@ let Panel = forwardRefWithAs(function Panel<TTag extends ElementType = typeof DE
     [state, internalPanelRef, dispatch]
   )
 
-  // Unlink on "unmount" myself
-  useEffect(() => () => dispatch({ type: ActionTypes.SetPanel, panel: null }), [dispatch])
-
   // Unlink on "unmount" children
   useEffect(() => {
     if (props.static) return

packages/@headlessui-vue/src/components/popover/popover.ts

@@ -1,15 +1,14 @@
 import {
+  computed,
   defineComponent,
   inject,
-  onUnmounted,
   provide,
   ref,
   watchEffect,
 
   // Types
   InjectionKey,
   Ref,
-  computed,
 } from 'vue'
 
 import { match } from '../../utils/match'
@@ -477,10 +476,6 @@ export let PopoverPanel = defineComponent({
 
     provide(PopoverPanelContext, api.panelId)
 
-    onUnmounted(() => {
-      api.panel.value = null
-    })
-
     // Move focus within panel
     watchEffect(() => {
       if (!focus) return