Resize observer

EuiResizeObserver is a wrapper around the Resizer Observer API which allows watching for changes to the content rectangle of DOM elements. Unlike EuiMutationObserver, EuiResizeObserver does not take parameters, but it does fire a more efficient and informative callback when resize events occur.

This is a render prop component, EuiResizeObserver will pass a ref callback which you must put on the element you wish to observe.

useResizeObserver hook

There is also a React hook, useResizeObserver, which provides the same observation functionality.

Props

EuiResizeObserver


Prop	Description and type	Default value
Prop children#	Description and type ReactNode to render as this component's content Type: `(ref: (e: HTMLElement) => void) => ReactNode`	Default value Required
Prop onResize#	Description and type Type: `(dimensions: { height: number; width: number; }) => void`	Default value Required