useDidElementMove: handle HTMLElement

This change should be temporary, and it will allow us to use the
`useDidElementMove` with ref objects and direct `HTMLElement`s.

packages/@headlessui-react/src/hooks/use-did-element-move.ts

@@ -1,21 +1,33 @@
 import { useRef, type MutableRefObject } from 'react'
 import { useIsoMorphicEffect } from './use-iso-morphic-effect'
 
-export function useDidElementMove(enabled: boolean, element: MutableRefObject<HTMLElement | null>) {
+export function useDidElementMove(
+  enabled: boolean,
+  ref: MutableRefObject<HTMLElement | null> | HTMLElement | null
+) {
   let elementPosition = useRef({ left: 0, top: 0 })
+
   useIsoMorphicEffect(() => {
-    let el = element.current
+    let el = ref === null ? null : ref instanceof HTMLElement ? ref : ref.current
     if (!el) return
 
     let DOMRect = el.getBoundingClientRect()
     if (DOMRect) elementPosition.current = DOMRect
   }, [enabled])
 
-  if (element.current == null) return false
+  let element =
+    typeof window === 'undefined'
+      ? null
+      : ref === null
+        ? null
+        : ref instanceof HTMLElement
+          ? ref
+          : ref.current
+  if (element == null) return false
   if (!enabled) return false
-  if (element.current === document.activeElement) return false
+  if (element === document.activeElement) return false
 
-  let buttonRect = element.current.getBoundingClientRect()
+  let buttonRect = element.getBoundingClientRect()
 
   let didElementMove =
     buttonRect.top !== elementPosition.current.top ||