v7.2.0 - useInfiniteScroll hook

What's new

useInfiniteScroll hook

A new named export for building fully custom infinite scroll UIs. The hook manages the IntersectionObserver lifecycle and exposes sentinelRef and isLoading — your markup, your styles, your loader.

import { useInfiniteScroll } from 'react-infinite-scroll-component';

const { sentinelRef, isLoading } = useInfiniteScroll({
  next: fetchMore,
  hasMore,
  dataLength: items.length,
});

Attach sentinelRef to any element at the end of your list. isLoading is true from when next() fires until dataLength changes.

Accepts the same hasMore, dataLength, next, scrollThreshold, scrollableTarget, and inverse props as the InfiniteScroll component.

The InfiniteScroll component is unchanged. This is a purely additive export with no breaking changes.

Documentation

• README overhauled: prop descriptions expanded with behavioral detail and when-to-use guidance, all default values filled in, framework recipes added for Next.js App Router, TanStack Query, and SWR.
• package.json keywords and description updated for better npm discoverability.
• AGENTS.md and llms.txt added for AI tooling compatibility.

Upgrading

No breaking changes. Drop-in compatible with v7.1.0.

v7.1.0 - IntersectionObserver rewrite

What's new

IntersectionObserver-based triggering

next() is now fired by an IntersectionObserver watching an invisible sentinel div at the end of the list, instead of a throttled scroll event listener. IO runs off the main thread and requires no throttling, scripting overhead drops from ~29% to ~23%.

Zero runtime dependencies

throttle-debounce has been removed. The package now ships with no runtime dependencies.

Function component rewrite

The class component has been fully replaced with a function component using useRef/useEffect/useState. The public API is unchanged.

Bug fixes

• Inverse scroll: sentinel is now always the last DOM child. In a flex-direction: column-reverse container this places it at the visual top, so next() fires at the correct threshold as the user scrolls up rather than requiring a full scroll to the opposite end.
• onScroll prop type: corrected from MouseEvent to UIEvent.
• scrollableTarget prop type: corrected from ReactNode to HTMLElement | string | null.

Build tooling

• Rollup 1 → 4
• TypeScript 4 → 5
• Rollup plugins migrated to @rollup/* scoped packages

Notes

• scrollThreshold: semantics are unchanged (0.8 = 80% threshold, "200px" = fixed pixel pre-trigger). Internally this now maps to IO rootMargin rather than a scroll position calculation.
• Inline function props: passing next or refreshFunction as inline arrow functions no longer causes the observer to reconnect on every render. Stable callback refs are used internally.
• Graceful degradation: if IntersectionObserver is unavailable, the component renders silently without triggering next(). No error is thrown.
• SSR / Next.js: safe to render server-side. The IO guard (typeof IntersectionObserver === 'undefined') prevents any server-side attachment.
• React 18 StrictMode: double effect invocation is handled correctly. The observer is disconnected on cleanup and will not fire duplicate next() calls.

Upgrading

No prop changes. Drop-in replacement for v7.0.0.

v7.0.1 - React 18/19 peer dep fix

Bug Fixes

• React 18/19 install error resolved — peer dependency updated from ^17.0.0
  to >=17.0.0, removing the ERESOLVE install failure for React 18 and 19 users (#419).

Notes

No runtime changes. If you were using --legacy-peer-deps or --force as a
workaround, you can drop that after upgrading.

v7.0.0

🎉 v7.0.0

Installation

npm install react-infinite-scroll-component
# or
yarn add react-infinite-scroll-component

What's New

⚛️ React 17+ Required

• Minimum React version is now 17.0.0 (previously 16.0.0)
• Uses the new JSX transform — no more import React boilerplate

🛠️ Modernized Toolchain

• Node.js: Requires 18.18.0+ (dropped Node 16)
• Jest: Upgraded from v24 → v29
• Husky: Upgraded to v9
• Storybook: Upgraded from v5 → v7

---

⚠️ Breaking Changes

Before (v6)	After (v7)
React 16+	React 17+
Node 12+	Node 18.18.0+

---

Migration

Upgrade React if you're on v16:

npm install react@17 react-dom@17

No API changes — the library interface remains the same.

v7.0.0-beta.0

🚧 Beta Release

This is a beta release of v7.0.0. Please test and report any issues.

Installation

npm install react-infinite-scroll-component@beta
# or
yarn add react-infinite-scroll-component@beta

What's New

⚛️ React 17+ Required

• Minimum React version is now 17.0.0 (previously 16.0.0)
• Uses the new JSX transform — no more import React boilerplate

🛠️ Modernized Toolchain

• Node.js: Requires 18.18.0+ (dropped Node 16)
• Jest: Upgraded from v24 → v29
• Husky: Upgraded to v9
• Storybook: Upgraded from v5 → v7

---

⚠️ Breaking Changes

Before (v6)	After (v7)
React 16+	React 17+
Node 12+	Node 18.18.0+

---

Migration

Upgrade React if you're on v16:

npm install react@17 react-dom@17

No API changes — the library interface remains the same.

Feedback

This is a beta release. Please test it in your projects and report any issues. Your feedback helps ensure a stable v7.0.0 release!

CI/CD modernization and comprehensive tests (no runtime changes)

v6.1.1 – CI/CD updates and test suite (no runtime changes)

• Tests: add coverage for threshold parsing, bottom/top triggers (inverse), custom scrollableTarget, pull‑down‑to‑refresh, and loader/hasChildren.
• CI/CD: modern GitHub Actions (checkout/setup-node v4), Node 16/18/20 matrix, yarn cache, lint + prettier check, type‑check, tests with coverage, and build.
• Formatting: applied Prettier to src/; no behavior changes.
• Packaging: unchanged (CJS/ESM/UMD), types unchanged.

No public API or runtime changes. Safe to upgrade.

Remove warning for newer React versions

v6.1.0

Bump version to 6.1.0

v6.0.1

Because I botched the previous release.

Change logic for inverse scroll

v6.0.0

6.0.0

Add infinite scroll in up direction

Thanks to @osmarpb97 for the implementation.