Nutmeg Plundering Muse

    intersection-observer-hooks

    1.1.0 • Public • Published

    import {useIntersectionObserver, addTrackedLoader} from "intersection-observer-hooks"

    API:

    useIntersectionObserver(callback, nodeRef, options = {})

    callback: returns a bool of when isIntersecting

    options: Object
    options.once: observe once then unobserve options.rootMargin: the root margin for intersection observer options.rootRef: React ref

    Example use:

    import {useIntersectionObserver, addTrackedLoader} from "intersection-observer-hooks"
     
      useIntersectionObserver((visible) => {
        // then we are not at SSR
        ssr.current = false;
        setOffscreen(!visible);
        onVisibilitySet(visible);
      }, containerRef || ref, {
        once: true,
        rootMargin: '30%',
        rootRef,
      });
     
     
      useEffect(() => {
        if (eager) {
          return addTrackedLoader(
            () => {
              setOffscreen(false);
              onVisibilitySet(true);
            },
            containerRef || ref,
          );
        }
     
        return () => null;
      }, [eager]);

    Keywords

    none

    Install

    npm i intersection-observer-hooks

    DownloadsWeekly Downloads

    1

    Version

    1.1.0

    License

    ISC

    Unpacked Size

    7.59 kB

    Total Files

    5

    Last publish

    Collaborators

    • zackljackson