Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/wojtekmaj/react-hooks. A collection of React Hooks.
hooks react react-hooks
Something went wrong. Try again.
887 B · 31 lines
TypeScript
at main
1234567891011121314151617181920212223242526272829303132import { useCallback, useRef, useState } from 'react';
import useEventListener from './useEventListener.js';
const isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined';
type Direction = 'still' | 'up' | 'down';
/** * Returns current scroll top direction. * * @returns {Direction | null} Scroll top direction */export default function useScrollTopDirection(): Direction | null { const prevScrollTop = useRef<number | null>(null); const [direction, setDirection] = useState<Direction | null>(isBrowser ? 'still' : null);
const onScroll = useCallback(() => { const { scrollY } = window;
if (prevScrollTop.current !== null) { setDirection(prevScrollTop.current < scrollY ? 'down' : 'up'); }
prevScrollTop.current = scrollY; }, []);
useEventListener(isBrowser ? document : null, 'scroll', onScroll);
return direction;}