useResizeObserver

Custom hook that observes the size of an element using the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).

Custom hook that observes the size of an element using the ResizeObserver API.

Usage

import { useResizeObserver } from "@tilt-legal/cubitt-components/utilities/hooks";

const myRef = useRef(null);
const { width = 0, height = 0 } = useResizeObserver({
  ref: myRef,
  box: 'content-box',
});

<div ref={myRef}>Hello, world!</div>

API

Signature

declare function useResizeObserver<T extends HTMLElement = HTMLElement>(options: UseResizeObserverOptions<T>): Size;

Parameters

ParameterTypeDescriptionDefault
optionsUseResizeObserverOptions&lt;T&gt;The options for the ResizeObserver.-

Return Value

ValueTypeDescription
returnSize- The size of the observed element.

On this page