From e4f36c73c5181fc08db02ab98fb63d780a985f16 Mon Sep 17 00:00:00 2001
From: Cody Bennett <hi@codyb.co>
Date: Thu, 30 Jan 2025 05:57:33 -0600
Subject: [PATCH 1/2] fix: add orientation handling

---
 src/index.ts | 32 ++++++++++++++++++++++++++++++--
 1 file changed, 30 insertions(+), 2 deletions(-)

diff --git a/src/index.ts b/src/index.ts
index 62faff0..84f98c0 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -39,6 +39,7 @@ type State = {
   scrollContainers: HTMLOrSVGElement[] | null
   resizeObserver: ResizeObserver | null
   lastBounds: RectReadOnly
+  orientationHandler: null | (() => void)
 }
 
 export type Options = {
@@ -72,7 +73,13 @@ function useMeasure(
   })
 
   // keep all state in a ref
-  const state = useRef<State>({ element: null, scrollContainers: null, resizeObserver: null, lastBounds: bounds })
+  const state = useRef<State>({
+    element: null,
+    scrollContainers: null,
+    resizeObserver: null,
+    lastBounds: bounds,
+    orientationHandler: null,
+  })
 
   // set actual debounce values early, so effects know if they should react accordingly
   const scrollDebounce = debounce ? (typeof debounce === 'number' ? debounce : debounce.scroll) : null
@@ -129,18 +136,39 @@ function useMeasure(
       state.current.resizeObserver.disconnect()
       state.current.resizeObserver = null
     }
+
+    if (state.current.orientationHandler) {
+      if ('orientation' in screen && 'removeEventListener' in screen.orientation) {
+        screen.orientation.removeEventListener('change', state.current.orientationHandler)
+      } else if ('onorientationchange' in window) {
+        window.removeEventListener('orientationchange', state.current.orientationHandler)
+      }
+    }
   }
 
   // add scroll-listeners / observers
   function addListeners() {
     if (!state.current.element) return
-    state.current.resizeObserver = new ResizeObserver(scrollChange)
+    state.current.resizeObserver = new ResizeObserver(resizeChange)
     state.current.resizeObserver!.observe(state.current.element)
     if (scroll && state.current.scrollContainers) {
       state.current.scrollContainers.forEach((scrollContainer) =>
         scrollContainer.addEventListener('scroll', scrollChange, { capture: true, passive: true }),
       )
     }
+
+    // Handle orientation changes
+    state.current.orientationHandler = () => {
+      scrollChange()
+    }
+
+    // Use screen.orientation if available
+    if ('orientation' in screen && 'addEventListener' in screen.orientation) {
+      screen.orientation.addEventListener('change', state.current.orientationHandler)
+    } else if ('onorientationchange' in window) {
+      // Fallback to orientationchange event
+      window.addEventListener('orientationchange', state.current.orientationHandler)
+    }
   }
 
   // the ref we expose to the user

From c0a7e8ca20770bfe8e4cfe2d2ef7124118c3070c Mon Sep 17 00:00:00 2001
From: Cody Bennett <hi@codyb.co>
Date: Thu, 30 Jan 2025 05:59:18 -0600
Subject: [PATCH 2/2] chore: cleanup

---
 src/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/index.ts b/src/index.ts
index 84f98c0..7bb2a7f 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -149,7 +149,7 @@ function useMeasure(
   // add scroll-listeners / observers
   function addListeners() {
     if (!state.current.element) return
-    state.current.resizeObserver = new ResizeObserver(resizeChange)
+    state.current.resizeObserver = new ResizeObserver(scrollChange)
     state.current.resizeObserver!.observe(state.current.element)
     if (scroll && state.current.scrollContainers) {
       state.current.scrollContainers.forEach((scrollContainer) =>