@eleven-am/xquery/useIsVisible.js

XQuery is a sophisticated TypeScript wrapper for TanStack React Query, designed to enhance developer productivity with OpenAPI-generated clients. It enables developers to build and execute queries using fully type-safe factories instead of managing query

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useIsVisible = useIsVisible;
const react_1 = require("react");
function useIsVisible({ action, options, triggerOnce } = {}) {
    const intersectionRef = (0, react_1.useRef)(null);
    const callbackRef = (0, react_1.useRef)(action);
    const [isVisible, setIsVisible] = (0, react_1.useState)(false);
    const triggerOnceRef = (0, react_1.useRef)(triggerOnce);
    (0, react_1.useEffect)(() => {
        callbackRef.current = action;
    }, [action]);
    const plugLastElement = (0, react_1.useCallback)((node) => {
        if (intersectionRef.current) {
            intersectionRef.current.disconnect();
        }
        intersectionRef.current = new IntersectionObserver(([entry]) => {
            if (entry.isIntersecting) {
                callbackRef.current?.();
                setIsVisible(true);
                if (triggerOnceRef.current) {
                    intersectionRef.current?.disconnect();
                }
            }
            else {
                setIsVisible(false);
            }
        }, options);
        if (node) {
            intersectionRef.current.observe(node);
        }
    }, [options]);
    return [plugLastElement, isVisible];
}
//# sourceMappingURL=useIsVisible.js.map