react-use: Collection of React Hooks
Pre-built hooks wrapping browser APIs and common patterns.
Learn more about react-use
react-use is a React Hooks library that provides pre-built hooks for managing state and side effects in functional components. The library wraps browser APIs and common patterns into composable hooks, allowing developers to handle sensor data, DOM measurements, keyboard input, and navigation state. It covers a broad range of use cases from device battery tracking to scroll position monitoring to media query detection. The hooks are designed to integrate directly into React functional components without requiring class-based wrappers or higher-order components.
Comprehensive sensor coverage
Provides hooks for accessing device APIs including battery status, geolocation, motion sensors, media devices, and network state. This allows functional components to directly consume hardware and browser sensor data.
DOM and layout tracking
Includes hooks for monitoring element measurements, scroll positions, intersection state, and hover status. Components can respond to layout changes and user interactions without manual event listener management.
Port of libreact patterns
The library adapts patterns from the libreact project to React Hooks, providing a migration path for developers familiar with that API while leveraging modern React functional component patterns.
import React from 'react';
import { useMouse } from 'react-use';
function MouseTracker() {
const ref = React.useRef(null);
const { docX, docY } = useMouse(ref);
return (
<div ref={ref}>
Mouse position: {docX}, {docY}
</div>
);
}Adds optional onChange callback to useWindowSize hook for reacting to dimension changes.
- –Pass an onChange callback to useWindowSize to execute custom logic when window dimensions update.
- –No breaking changes or migration steps required; existing useWindowSize calls work unchanged.
Patch release updating the nano-css dependency; no breaking changes or new requirements documented.
- –Update nano-css to a newer version to resolve an unspecified bug.
- –Release notes do not specify the nature of the bug or impact on existing code.
Adds `isFirst` and `isLast` boolean helpers to the `useStateList` hook return value; no breaking changes or migration required.
- –Use `isFirst` and `isLast` from `useStateList` to check boundary positions without manual index comparison.
- –Update code relying on `useStateList` to leverage the new boolean flags for cleaner conditional logic.
Related Repositories
Discover similar tools and frameworks used by developers
lucide
Framework-agnostic SVG icons with native component packages.
imgui
Immediate mode GUI library for 3D applications.
chakra-ui
Themeable React components with built-in accessibility and Emotion styling.
query
Declarative server-state caching with automatic background synchronization.
components
Material Design components and utilities for Angular applications.