react-use/src/useScrolling.ts

34 lines
818 B
TypeScript

import { RefObject, useEffect, useState } from 'react';
const useScrolling = (ref: RefObject<HTMLElement>): boolean => {
const [scrolling, setScrolling] = useState<boolean>(false);
useEffect(() => {
if (ref.current) {
let scrollingTimeout;
const handleScrollEnd = () => {
setScrolling(false);
};
const handleScroll = () => {
setScrolling(true);
clearTimeout(scrollingTimeout);
scrollingTimeout = setTimeout(() => handleScrollEnd(), 150);
};
ref.current.addEventListener('scroll', handleScroll, false);
return () => {
if (ref.current) {
ref.current.removeEventListener('scroll', handleScroll, false);
}
};
}
return () => {};
}, [ref]);
return scrolling;
};
export default useScrolling;