summaryrefslogtreecommitdiff
path: root/apps/web/src/hooks/use-resize-observer.ts
diff options
context:
space:
mode:
Diffstat (limited to 'apps/web/src/hooks/use-resize-observer.ts')
-rw-r--r--apps/web/src/hooks/use-resize-observer.ts26
1 files changed, 26 insertions, 0 deletions
diff --git a/apps/web/src/hooks/use-resize-observer.ts b/apps/web/src/hooks/use-resize-observer.ts
new file mode 100644
index 00000000..a4b3a603
--- /dev/null
+++ b/apps/web/src/hooks/use-resize-observer.ts
@@ -0,0 +1,26 @@
+import { useEffect } from "react";
+
+export function useResizeObserver({
+ ref,
+ onResize,
+}: {
+ ref: React.RefObject<HTMLElement | null>;
+ onResize: (entry: ResizeObserverEntry) => void;
+}) {
+ useEffect(() => {
+ const element = ref.current;
+ if (!element) return;
+
+ const observer = new ResizeObserver((entries) => {
+ for (const entry of entries) {
+ onResize(entry);
+ }
+ });
+
+ observer.observe(element);
+
+ return () => {
+ observer.disconnect();
+ };
+ }, [ref, onResize]);
+}