useResizeObserver

useResizeObserver tracks an element's dimensions via ResizeObserver. Returns a ref callback plus the current width and height.

import { useResizeObserver } from '@ilokesto/utilinent/hooks';

function SizeBox() {
  const { ref, width, height } = useResizeObserver();
  return <div ref={ref}>{width}×{height}</div>;
}

Options

Return value

ref is a callback ref. width and height are numbers (default 0). entry is the latest ResizeObserverEntry when available. SSR-safe: returns zeros when ResizeObserver is unavailable.