HooksuseWindowSize

useWindowSize

A React hook that returns the current size of the browser window.

Installation

npm install @madeinhaus/hooks

Import

import { useWindowSize } from '@madeinhaus/hooks';

Returns

  • (Size) (object): An object with the following properties:
    • width (number | undefined): The current width of the browser window, or undefined if it has not been initialized yet.
    • height (number | undefined): The current height of the browser window, or undefined if it has not been initialized yet.

Usage

import { useWindowSize } from '@madeinhaus/hooks';
 
function MyComponent() {
  const { width, height } = useWindowSize();
 
  return (
    <div>
      <p>Window width: {width}</p>
      <p>Window height: {height}</p>
    </div>
  );
}

In this example, we import the useWindowSize hook from the @madeinhaus/hooks package and use it to get the current size of the browser window.