diff options
Diffstat (limited to 'apps/web/src/hooks/use-container-size.ts')
| -rw-r--r-- | apps/web/src/hooks/use-container-size.ts | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/apps/web/src/hooks/use-container-size.ts b/apps/web/src/hooks/use-container-size.ts new file mode 100644 index 00000000..8b46f20e --- /dev/null +++ b/apps/web/src/hooks/use-container-size.ts @@ -0,0 +1,29 @@ +import { useEffect, useState } from "react"; + +export function useContainerSize({ + containerRef, +}: { + containerRef: React.RefObject<HTMLElement | null>; +}) { + const [size, setSize] = useState({ width: 0, height: 0 }); + + useEffect(() => { + const container = containerRef.current; + if (!container) return; + + const observer = new ResizeObserver((entries) => { + for (const entry of entries) { + const { width, height } = entry.contentRect; + setSize({ width, height }); + } + }); + + observer.observe(container); + + return () => { + observer.disconnect(); + }; + }, [containerRef]); + + return size; +} |
