👍
react-use

^{Collection of essential React Hooks Port of libreact
Translations: 🇨🇳 汉语}

npm i react-use

• Sensors
  • useBattery — tracks device battery state.
  • useGeolocation — tracks geo location state of user's device.
  • useHover and useHoverDirty — tracks mouse hover state of some element.
  • useHash — tracks location hash value.
  • useIdle — tracks whether user is being inactive.
  • useIntersection — tracks an HTML element's intersection.
  • useKey, useKeyPress, useKeyboardJs, and useKeyPressEvent — track keys.
  • useLocation and useSearchParam — tracks page navigation bar location state.
  • useLongPress — tracks long press gesture of some element.
  • useMedia — tracks state of a CSS media query.
  • useMediaDevices — tracks state of connected hardware devices.
  • useMotion — tracks state of device's motion sensor.
  • useMouse and useMouseHovered — tracks state of mouse position.
  • useMouseWheel — tracks deltaY of scrolled mouse wheel.
  • useNetworkState — tracks the state of browser's network connection.
  • useOrientation — tracks…

@react-hookz/web is a library of general-purpose React hooks built with care and SSR compatibility in mind.

This one is pretty simple, everyone knows what to do:

npm i @react-hookz/web
# or
yarn add @react-hookz/web

As hooks was introduced to the world in React 16.8, @react-hookz/web requires - you guessed it - react and react-dom 16.8+ Also, as React does not support IE, @react-hookz/web don't either.

This package distributed with ESNext language level and ES modules system. It means that depending on your browser target you might need to transpile it. Every major bundler provides a way to transpile node_modules fully or partially. Address your bundler documentation for more details.

You can import hooks two ways:

// from the root of package
import { useMountEffect } from '@react-hookz/web';
// or single hook directly
import { useMountEffect } from '@react-hookz/web/useMountEffect/index.js';

In…