@dossierhq/design/lib/hooks/useIsClippedObserver.js

The design system for Dossier.

import { useEffect, useState } from 'react';
let observerInstance = null;
function getObserver() {
    if (!observerInstance) {
        observerInstance = new IntersectionObserver((entries) => {
            for (const entry of entries) {
                entry.target.classList.toggle('is-clipped', entry.intersectionRatio < 1.0);
            }
        }, { threshold: [1.0] });
    }
    return observerInstance;
}
export function useIsClippedObserver() {
    const [currentElement, setCurrentElement] = useState();
    useEffect(() => {
        const observer = getObserver();
        if (currentElement) {
            observer.observe(currentElement);
            return () => {
                return observer.unobserve(currentElement);
            };
        }
    }, [currentElement]);
    const ref = setCurrentElement;
    return ref;
}
//# sourceMappingURL=useIsClippedObserver.js.map