@mantine/hooks
Version:
A collection of 50+ hooks for state and UI management
25 lines (22 loc) • 679 B
JavaScript
'use client';
import { useRef, useState, useMemo, useEffect } from 'react';
function useInViewport() {
const ref = useRef(null);
const [inViewport, setInViewport] = useState(false);
const observer = useMemo(() => {
if (typeof IntersectionObserver === "undefined") {
return null;
}
return new IntersectionObserver(([entry]) => setInViewport(entry.isIntersecting));
}, [ref]);
useEffect(() => {
if (ref.current && observer) {
observer.observe(ref.current);
return () => observer.disconnect();
}
return () => null;
}, []);
return { ref, inViewport };
}
export { useInViewport };
//# sourceMappingURL=use-in-viewport.mjs.map