import { useEffect } from 'react';
import { useCallbackRef } from './use-callback-ref';

export function useScroll(cb: (e: Event) => void, scrollEl: HTMLElement | Window = window) {
  const cbRef = useCallbackRef(cb);
  useEffect(() => {
    if (scrollEl) {
      const cb = (e: Event) => cbRef.current(e);
      scrollEl.addEventListener('scroll', cb, { passive: true });
      return () => scrollEl.removeEventListener('scroll', cb);
    }
  }, [scrollEl, cbRef]);
}