fix: use offsetWidth/offsetHeight instead of getComputedStyle for clone dimensions

getComputedStyle().width/height can return empty strings during the
initial render cycle (before styles are fully computed), causing the
measurement clone to have 0x0 dimensions. offsetWidth/offsetHeight
are more reliable as they return the layout dimensions immediately.

Author: AnthonyH16

src/hooks/useAlign.ts

@@ -192,11 +192,12 @@ export default function useAlign(
       // (transform: scale()), causing getBoundingClientRect() to return
       // incorrect values and producing wildly wrong popup positions.
       const measureEl = popupElement.cloneNode(false) as HTMLElement;
-      // Copy computed dimensions to the clone since cloneNode(false) produces
+      // Copy layout dimensions to the clone since cloneNode(false) produces
       // an empty element whose size would otherwise collapse to 0x0.
-      const { height, width } = win.getComputedStyle(popupElement);
-      measureEl.style.width = width;
-      measureEl.style.height = height;
+      // Use offsetWidth/offsetHeight instead of getComputedStyle because
+      // computed styles may return empty during the initial render cycle.
+      measureEl.style.width = `${popupElement.offsetWidth}px`;
+      measureEl.style.height = `${popupElement.offsetHeight}px`;
       measureEl.style.left = '0';
       measureEl.style.top = '0';
       measureEl.style.right = 'auto';
@@ -231,6 +232,7 @@ export default function useAlign(
       // Measure from the temporary element (not affected by CSS transforms
       // or transitions on the popup).
       const popupRect = measureEl.getBoundingClientRect();
+      const { height, width } = win.getComputedStyle(popupElement);
       popupRect.x = popupRect.x ?? popupRect.left;
       popupRect.y = popupRect.y ?? popupRect.top;
       const {