this repo has no description
Random unused IntersectionView
Keeping this for future use
+29
+29
src/components/intersection-view.jsx
+29
src/components/intersection-view.jsx
···
1
+
import { useLayoutEffect, useRef, useState } from 'preact/hooks';
2
+
3
+
const IntersectionView = ({ children, root = null, fallback = null }) => {
4
+
const ref = useRef();
5
+
const [show, setShow] = useState(false);
6
+
useLayoutEffect(() => {
7
+
const observer = new IntersectionObserver(
8
+
(entries) => {
9
+
const entry = entries[0];
10
+
if (entry.isIntersecting) {
11
+
setShow(true);
12
+
observer.unobserve(ref.current);
13
+
}
14
+
},
15
+
{
16
+
root,
17
+
rootMargin: `${screen.height}px`,
18
+
},
19
+
);
20
+
if (ref.current) observer.observe(ref.current);
21
+
return () => {
22
+
if (ref.current) observer.unobserve(ref.current);
23
+
};
24
+
}, []);
25
+
26
+
return show ? children : <div ref={ref}>{fallback}</div>;
27
+
};
28
+
29
+
export default IntersectionView;