ResizeObserver

The ResizeObserver component is used for listening to resize events on a container.

import { ResizeObserver } from '@sajari/react-components';

import { ResizeObserver } from '@sajari/react-components';

Usage

Editable Example

Width: 0

function Example() {
  const [width, setWidth] = React.useState(0);

  return (
    <ResizeObserver onResize={(rect) => setWidth(rect.width)}>
      <Text>{`Width: ${width}`}</Text>
    </ResizeObserver>
  );
}

function Example() {
  const [width, setWidth] = React.useState(0);
  return (
    <ResizeObserver onResize={(rect) => setWidth(rect.width)}>
      <Text>{`Width: ${width}`}</Text>
    </ResizeObserver>
  );
}

Props

Name	Type	Default	Description
`onResize`	`({ height: number; width: number; }) => void`		Callback when a resize event occurs.
`children`	`React.ReactNode`	`null`

React SDK

Suggestions

ResizeObserver

Usage

Editable Example

Props