Skip to main content


Subscribes to a ResizeObserver on the component exposing the Ref to detect changes in the size of DOM elements. The ResizeObserver API is required. If you are targeting browsers that do not support that API, please add polyfill appropriately.

function useResizeObserver<E extends HTMLElement = HTMLElement>(onResize: OnResize): EffectRef<E>;


const ref =
useResizeObserver <
HTMLButtonElement >
(entry => {
const { width, height } = entry.contentRect;
console.log('size changed:', width, height);

<button ref={ref}>...</button>;