@artifak/usewindowsize

A React hook that returns the window size on resize.

Usage no npm install needed!

<script type="module">
  import artifakUsewindowsize from 'https://cdn.skypack.dev/@artifak/usewindowsize';
</script>

README

@artifak/usewindowsize

A React hook that allows you to get the window dimensions within your React component. Returns an object consisting of properties: innerWidth, innerHeight, outerWidth and outerHeight.

Installation

Yarn

yarn add @artifak/usewindowsize

NPM

npm install @artifak/usewindowsize

Usage

import { useWindowSize } from 'artifak';
import { ExampleMobile } from './ExampleMobile';
import { ExampleDesktop } from './ExampleDesktop';

export function Nav() {
  const windowSize = useWindowSize();

  return (
    <>
      {windowSize.innerWidth < 1000 && <ExampleMobile />}
      <ExampleDesktop />
    </>
  );
}