react-laze
Version:
Lazily render components in React
2 lines (1 loc) • 841 B
JavaScript
import{useDebugValue as d,useEffect as L,useState as v}from"react";import{useDebugValue as x,useState as O}from"react";import{useDebugValue as R}from"react";import{useDebugValue as p,useRef as T}from"react";function s(t){let e=T();return e.current||(e.current={current:t()}),p(e.current),e.current}function l(t){let{current:e}=s(t);return R(e),e}function c(t){let[e,u]=O(t),n=s(t);n.current!==e&&(n.current=e);let r=l(()=>({get current(){return n.current},set current(o){u(()=>o)}}));return x(r),r}function b(t){let[e,u]=v(!1),n=c(()=>null),{current:r}=n,o=t==null?void 0:t.refresh;L(()=>{if(u(!1),r){let f=new IntersectionObserver(m=>{for(let i of m)o?u(i.isIntersecting):i.isIntersecting&&(u(!0),f.disconnect())});return f.observe(r),()=>{f.unobserve(r),f.disconnect()}}},[r,o]);let a={ref:n,visible:e};return d(a),a}export{b as default};