react-chat-bottom-pin v1.0.6

react-chat-bottom-pin

This is a fork of react-bottom-scroll

Installation

npm install react-chat-bottom-pin

Upgrade

npm install react-chat-bottom-pin@latest

Usage

use the component to wrap the content which you want to scroll to the bottom

import { ScrollWrapper } from "react-chat-bottom-pin";
import "react-chat-bottom-pin/dist/styles.css";

const topCallback = () => {
  // callback to load new content at the top of the wrapper. eg loading more chat at the top
  console.log("Reached top of container");
};

const bottomCallback = () => {
  //callback to handle reaching bottom of the page eg. setting read status to true
  console.log("Reached bottom of container");
};

<ScrollWrapper
  minScroll={100}
  smoothBehavior
  topCallback={topCallback}
  bottomCallback={bottomCallback}
>
  {content}
</ScrollWrapper>;

here contents can be a list of div's or any other html elements.

Props