useWindowSize

useWindowSize(): Service<ResizeProps>

The viewport size. It names the default case of useResize().

Usage

import { useWindowSize } from '@studiometa/js-toolkit';

const unsubscribe = useWindowSize().subscribe(({ width, height, orientation }) => {
  console.log(width, height, orientation);
});

Props are useResize()'s.

The viewport is not an observed box

A ResizeObserver reports the box of the element it observes. For the root element, clientWidth and clientHeight report the viewport and are decoupled from that box, so this service keeps a resize listener beside the observer.

That is the difference between asking for the window and asking for an element that happens to be full-width.