@replyke/ui-core-react-js/dist/cjs/components/InfiniteScrollTrigger.js

Replyke: Build interactive apps with social features like comments, votes, feeds, user lists, notifications, and more.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const InfiniteScrollTrigger = ({ onTriggered, }) => {
    const commentsEndRef = (0, react_1.useRef)(null);
    (0, react_1.useEffect)(() => {
        const currentEndRef = commentsEndRef.current;
        const observer = new IntersectionObserver(([entry]) => {
            if (entry.isIntersecting) {
                onTriggered();
            }
        }, {
            root: null, // Use the document's viewport as the container
            rootMargin: "0px",
            threshold: 0.1, // Trigger when 10% of the target is visible
        });
        if (currentEndRef) {
            observer.observe(currentEndRef);
        }
        return () => {
            if (currentEndRef) {
                observer.unobserve(currentEndRef);
            }
        };
    }, [onTriggered]);
    return (0, jsx_runtime_1.jsx)("div", { ref: commentsEndRef, style: { height: 1 } });
};
exports.default = InfiniteScrollTrigger;
//# sourceMappingURL=InfiniteScrollTrigger.js.map