UNPKG

react-bottom-scroll-listener

Version:

A simple React component that lets you listen for when you have scrolled to the bottom.

39 lines (38 loc) 1.52 kB
import type { MutableRefObject, JSX } from 'react'; import { type DebounceOptions } from '../hook'; export interface BottomScrollListenerProps { /** * Required callback that will be invoked when scrolled to bottom */ onBottom: () => void; /** * Offset from bottom of page in pixels. E.g. 300 will trigger onBottom 300px from the bottom of the page */ offset?: number; /** * Optional debounce in milliseconds, defaults to 200ms */ debounce?: number; /** * Options passed to lodash.debounce, see https://lodash.com/docs/4.17.15#debounce */ debounceOptions?: DebounceOptions; /** * Triggers the onBottom callback when the page has no scrollbar, defaults to false */ triggerOnNoScroll?: boolean; /** * Optional children to be rendered. * * If children passed is a function, that function will be passed a React.RefObject<HTMLElement> * that ref shall be passed to a child tag that will be used for the scrolling container. * */ children?: JSX.Element | (<T>(ref: ((instance: T | null) => void) | MutableRefObject<T | null> | null) => JSX.Element); } /** * A simple React component that lets you listen for when you have scrolled to the bottom. * * @param {BottomScrollListenerProps} props */ declare const BottomScrollListener: ({ children, onBottom, offset, debounce, debounceOptions, triggerOnNoScroll, }: BottomScrollListenerProps) => JSX.Element | null; export default BottomScrollListener;