Fix transition and focus prop combination for PopoverPanel comp…

…onent (#3361)

* trigger effect when ref value changes

* update changelog

packages/@headlessui-react/CHANGELOG.md

@@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Ensure `unmount` on `Dialog` works in combination with the `transition` prop on `DialogBackdrop` and `DialogPanel` components ([#3352](https://github.com/tailwindlabs/headlessui/pull/3352))
 - Fix crash in `Combobox` component when in `virtual` mode when options are empty ([#3356](https://github.com/tailwindlabs/headlessui/pull/3356))
 - Fix hanging tests when using `anchor` prop ([#3357](https://github.com/tailwindlabs/headlessui/pull/3357))
+- Fix `transition` and `focus` prop combination for `PopoverPanel` component ([#3361](https://github.com/tailwindlabs/headlessui/pull/3361))
 
 ## [2.1.1] - 2024-06-26
 

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

@@ -930,7 +930,7 @@ function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
     if (internalPanelRef.current.contains(activeElement)) return // Already focused within Dialog
 
     focusIn(internalPanelRef.current, Focus.First)
-  }, [state.__demoMode, focus, internalPanelRef, state.popoverState])
+  }, [state.__demoMode, focus, internalPanelRef.current, state.popoverState])
 
   let slot = useMemo(() => {
     return {