Naming Prosecution Mitigator

    react-tiny-autoscroll
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.3 • Public • Published

    react-tiny-autoscroll

    npm version npm downloads npm size commit activity license

    Automatically scrolls the element when the cursor approaches the boundaries.

    Demo

    Mostly helpful when used in combination with drag and drop-like components which do not support scrollable containers.

    Install via npm

    npm install react-tiny-autoscroll

    or

    yarn add react-tiny-autoscroll

    Usage

    const containerRef = useRef();
    
    useAutoScroll({
      containerRef,
    });
    
    // Making our container scrollable
    const style: CSSProperties = {
      height: 400,
      overflowY: "auto",
      border: "1px solid red",
    };
    
    return (
      <div ref={containerRef} style={style}>
        {items.map((n) => (
          <Item key={n} />
        )}
      </div>
    );

    API

    • containerRef - reference to the scrollable container
    • skip - lets you disable/enable the scrolling
    • threshold - distance to boundaries where scrolling will start
    • maxSpeed - maximum number of pixels allowed to scroll in 10ms

    Install

    npm i react-tiny-autoscroll

    DownloadsWeekly Downloads

    189

    Version

    1.2.3

    License

    MIT

    Unpacked Size

    6.5 kB

    Total Files

    5

    Last publish

    Collaborators

    • hosembafer