Skip to content

A React library that provides a scroll management component for remembering and navigating back to previous scroll positions.

License

Notifications You must be signed in to change notification settings

kyrers/sentient-scroller

Repository files navigation

Sentient Scroller

npm version npm bundle size npm-typescript npm License Edit on Codesandbox

A React library that provides a scroll management component for remembering and navigating back to previous scroll positions.

Please note that the SentientScroller component currently works for scrolling events in the entire window, as it relies on the window object. Support for scrolling within specific elements (e.g. divs) will be introduced in future versions.

Installation

# npm
npm i sentient-scroller

# yarn
yarn add sentient-scroller

# pnpm
pnpm add sentient-scroller

Usage

import { SentientScroller } from "sentient-scroller";

export default function Home() {
  return (
    <main className={styles.main}>
      <SentientScroller timeThreshold={1000}>
        {...}
      </SentientScroller>
    </main>
  );
}

Props

Name Required Description
timeThreshold Yes The threshold (in milliseconds) for considering a position as stable before storing it. A new position will only be stored if the user remains in the same position for longer than this threshold.
positionThreshold No Defaults to 0. The threshold (in pixels) for considering a position worthy of storing. A new position will only be stored if the distance to the last stored position is longer than this threshold.
behavior No The behavior of the scroll button.
"sequential" (default): Scrolls to the last stored position that's different from the current position.
"static": Scrolls to the first stored position that's different from the current position.

About

A React library that provides a scroll management component for remembering and navigating back to previous scroll positions.

Resources

License

Stars

Watchers

Forks

Packages

No packages published