virtua 0.27.4 → 0.28.0

package/README.md

@@ -14,7 +14,7 @@ This project is a challenge to rethink virtualization. The goals are...
 
 - **Zero-config virtualization:** This library is designed to give the best performance without configuration. It also handles common hard things in the real world (dynamic size measurement, scroll position adjustment while reverse scrolling and imperative scrolling, iOS support, etc).
 - **Fast:** Natural virtual scrolling needs optimization in many aspects (eliminate frame drops by reducing CPU usage and GC and [layout recalculation](https://gist.github.com/paulirish/5d52fb081b3570c81e3a), reduce visual jumps on repaint, optimize with CSS, optimize for frameworks, etc). We are trying to combine the best of them.
-- **Small:** Its bundle size should be small as much as possible to be friendly with modern web development. Currently each components are ~3kB gzipped. The total is [~5kB gzipped](https://bundlephobia.com/package/virtua) and tree-shakeable.
+- **Small:** Its bundle size should be small as much as possible to be friendly with modern web development. Currently each components are ~3kB gzipped and tree-shakeable. The total size for React is [~5kB gzipped](https://bundlephobia.com/package/virtua).
 - **Flexible:** Aiming to support many usecases - fixed size, dynamic size, horizontal scrolling, reverse scrolling, RTL, mobile, infinite scrolling, scroll restoration, DnD, keyboard navigation, sticky, placeholder and more. See [live demo](#demo).
 - **Framework agnostic:** [React](https://react.dev/), [Vue](https://vuejs.org/) and [Solid](https://www.solidjs.com/) are supported. We could support other frameworks in the future.
 
@@ -302,6 +302,8 @@ Virtua try to suppress glitch caused by resize as much as possible, but it will
 It may be dispatched by ResizeObserver in this lib [as described in spec](https://www.w3.org/TR/resize-observer/#deliver-resize-error). If it bothers you,
 [you can safely ignore it](https://github.com/DevExpress/testcafe/issues/4857#issuecomment-598775956).
 
+Especially for `webpack-dev-server`, [you can filter out the specific error with `devServer.client.overlay.runtimeErrors` option](https://webpack.js.org/configuration/dev-server/#overlay).
+
 ## Comparison
 
 ### Features
@@ -314,7 +316,7 @@ It may be dispatched by ResizeObserver in this lib [as described in spec](https:
 | Horizontal scroll in RTL direction                 | ✅                                                                                                               | ❌                                                                                                                               | ✅ ([may be dropped in v2](https://github.com/bvaughn/react-window/issues/302))                                              | ❌                                                                                                                                                                     | ❌                                                                                                                                                 | ❌                                                                                                                                                 | ❌                                                                                                                                       |
 | Grid (Virtualization for two dimension)            | 🟠 (experimental_VGrid)                                                                                          | ❌                                                                                                                               | ✅ (FixedSizeGrid / VariableSizeGrid)                                                                                        | ✅ ([Grid](https://github.com/bvaughn/react-virtualized/blob/master/docs/Grid.md))                                                                                     | 🟠 (needs customization)                                                                                                                           | ❌                                                                                                                                                 | 🟠 (needs customization)                                                                                                                 |
 | Table                                              | 🟠 (needs customization)                                                                                         | ✅ (TableVirtuoso)                                                                                                               | 🟠 (needs customization)                                                                                                     | 🟠 ([Table](https://github.com/bvaughn/react-virtualized/blob/master/docs/Table.md) but it's built with div)                                                           | 🟠 (needs customization)                                                                                                                           | ❌                                                                                                                                                 | 🟠 (needs customization)                                                                                                                 |
-| Window scroller                                    | ✅ (WindowVirtualizer)                                                                                           | ✅                                                                                                                               | ❌                                                                                                                           | ✅ ([WindowScroller](https://github.com/bvaughn/react-virtualized/blob/master/docs/WindowScroller.md))                                                                 | ✅                                                                                                                                                 | ❌                                                                                                                                                 | ❌                                                                                                                                       |
+| Window scroller                                    | ✅ (WindowVirtualizer)                                                                                           | ✅                                                                                                                               | ❌                                                                                                                           | ✅ ([WindowScroller](https://github.com/bvaughn/react-virtualized/blob/master/docs/WindowScroller.md))                                                                 | ✅ (useWindowVirtualizer)                                                                                                                          | ❌                                                                                                                                                 | ❌                                                                                                                                       |
 | Dynamic list size                                  | ✅                                                                                                               | ✅                                                                                                                               | 🟠 (needs [AutoSizer](https://github.com/bvaughn/react-virtualized/blob/master/docs/AutoSizer.md))                           | 🟠 (needs [AutoSizer](https://github.com/bvaughn/react-virtualized/blob/master/docs/AutoSizer.md))                                                                     | ✅                                                                                                                                                 | ❌                                                                                                                                                 | ✅                                                                                                                                       |
 | Dynamic item size                                  | ✅                                                                                                               | ✅                                                                                                                               | 🟠 (needs additional codes and has wrong destination when scrolling to item imperatively)                                    | 🟠 (needs [CellMeasurer](https://github.com/bvaughn/react-virtualized/blob/master/docs/CellMeasurer.md) and has wrong destination when scrolling to item imperatively) | 🟠 (has wrong destination when scrolling to item imperatively)                                                                                     | ❌                                                                                                                                                 | 🟠 (has wrong destination when scrolling to item imperatively)                                                                           |
 | Reverse scroll                                     | ✅                                                                                                               | ✅                                                                                                                               | ❌                                                                                                                           | ❌                                                                                                                                                                     | ❌                                                                                                                                                 | ❌                                                                                                                                                 | ❌                                                                                                                                       |

package/lib/core/types.d.ts

@@ -12,10 +12,12 @@ export interface ScrollToIndexOpts {
     /**
      * Alignment of item.
      *
-     * - `start`(default): Align the item to the start of the list.
+     * - `start`: Align the item to the start of the list.
      * - `center`: Align the item to the center of the list.
      * - `end`: Align the item to the end of the list.
      * - `nearest`: If the item is already completely visible, don't scroll. Otherwise scroll until it becomes visible. That is similar behavior to [`nearest` option of scrollIntoView](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView).
+     *
+     * @defaultValue "start"
      */
     align?: ScrollToIndexAlign;
     /**
@@ -24,5 +26,10 @@ export interface ScrollToIndexOpts {
      * **Using smooth scrolling over many items can kill performance benefit of virtual scroll. Do not overuse it.**
      */
     smooth?: boolean;
+    /**
+     * Additional offset from the scrolled position.
+     * @defaultValue 0
+     */
+    offset?: number;
 }
 export {};

package/lib/core/utils.d.ts

@@ -1 +1 @@
-export declare const microtask: (fn: () => void) => void;
+export {};

package/lib/index.js

@@ -1,3 +1,3 @@
 "use client";
-var e=require("react/jsx-runtime"),t=require("react"),n=require("react-dom");const o=Math.min,r=Math.max,i=Math.abs,s=Array.isArray,l=setTimeout,c=(e,t,n)=>o(n,r(t,e)),u=e=>null!=e,a="function"==typeof queueMicrotask?queueMicrotask:e=>{Promise.resolve().then(e)},f=e=>{let t,n;return(...o)=>(t||(t=!0,n=e(...o)),n)},d=-1,h=(e,t,n)=>{const o=n?"unshift":"push";for(let n=0;n<t;n++)e[o](d);return e},_=(e,t)=>{const n=e.t[t];return n===d?e.o:n},g=(e,t,n)=>{const r=e.t[t]===d;return e.t[t]=n,e.i=o(t,e.i),r},p=(e,t)=>{if(!e.l)return 0;if(e.i>=t)return e.u[t];e.i<0&&(e.u[0]=0,e.i=0);let n=e.i,o=e.u[n];for(;n<t;)o+=_(e,n),e.u[++n]=o;return e.i=t,o},v=(e,t,n)=>{for(;n>=0&&n<e.l;){const o=p(e,n);if(o<=t){if(o+_(e,n)>t)break;n++}else n--}return c(n,0,e.l-1)},m=(e,t,n)=>{const r=t-e.l;return e.i=n?-1:o(t-1,e.i),e.l=t,r>0?(h(e.u,r),h(e.t,r,n),e.o*r):(e.u.splice(r),(n?e.t.splice(0,-r):e.t.splice(r)).reduce(((t,n)=>t-(n===d?e.o:n)),0))},w="undefined"!=typeof window,S=()=>document.documentElement,y=e=>e.ownerDocument,b=e=>e.defaultView,x=/*#__PURE__*/f((()=>!!w&&"rtl"===getComputedStyle(S()).direction)),z=/*#__PURE__*/f((()=>/iP(hone|od|ad)/.test(navigator.userAgent))),I=/*#__PURE__*/f((()=>"scrollBehavior"in S().style)),R=e=>r(e.h(),e._()),k=(e,t,n,i,s)=>(1!==i&&(e-=r(0,n)),2!==i&&(t+=r(0,n)),[r(e,0),o(t,s-1)]),C=(e,t=40,n=0,s,l=!1,u=0,a=0)=>{let f=!!n,w=[],S=0,y=0,b=0,x=0,I=0,R=!1,k=0,C=0,M=0,T=f?[0,r(n-1,0)]:null,O=[0,0],E=0;const H=s||((e,t)=>({o:t,l:e,i:-1,t:h([],e),u:h([],e)}))(e,t),J=new Set,W=e=>((e,t,n,r)=>{const i=v(e,t,o(n,e.l-1));return[i,v(e,t+r,i)]})(H,e,O[0],S),q=()=>(e=>e.l?p(e,e.l-1)+_(e,e.l-1):0)(H),B=()=>q()+u+a,$=()=>r(0,B()-S),A=e=>p(H,e)-I,D=e=>{e&&(z()&&0!==C?I+=e:(x+=e,b++))};return{p:()=>w,v:()=>JSON.parse(JSON.stringify(H)),m:()=>k?O:(O=W(y-u+I+x),T?[o(O[0],T[0]),r(O[1],T[1])]:O),S:e=>H.t[e]===d,I:()=>!!T&&H.t.slice(r(0,T[0]-1),o(H.l-1,T[1]+1)+1).includes(d),R:A,k:e=>_(H,e),C:()=>H.l,M:()=>y,T:()=>C,_:()=>S,O:()=>u,h:q,H:()=>b,J(){const e=x,t=R;return x=0,R=!1,S>B()?[0,!1]:[k=e,t]},W(e,t){const n=[e,t];return J.add(n),()=>{J.delete(n)}},q(e,t){let n,o,s=0;switch(e){case 1:{const e=t.filter((([e,t])=>H.t[e]!==t));if(!e.length)break;let n=!1,i=!1;2===M?y>$()-1.5&&(i=!0):n=!0,D(e.reduce(((e,[t,o])=>{if(!n||(T?t<T[0]:A(t)+(0===C&&0===M?_(H,t):0)<y)){const n=o-_(H,t);(!i||n>0)&&(e+=n)}return e}),0));for(const[t,n]of e){const e=_(H,t),o=g(H,t,n);l&&(E+=n,o||(E-=e))}l&&S&&E>S&&(D(((e,t)=>{let n=0;const o=e.t.filter(((e,o)=>{const r=e!==d;return r&&o<t&&n++,r})),i=e.o;return e.i=-1,((e.o=(e=>{const t=[...e].sort(((e,t)=>e-t)),n=e.length/2|0;return t.length%2==0?(t[n-1]+t[n])/2:t[n]})(o))-i)*r(t-n,0)})(H,O[0])),l=!1),s=2,o=!0;break}case 2:S!==t&&(S=t,s=2);break;case 3:t[1]?(D(m(H,t[0],!0)),M=2,R=!0,s=1):m(H,t[0]);break;case 4:{const e=c(t,0,$()),n=k;if(k=0,e===y)break;const r=e-y,l=i(r);n&&l<i(n)+1||0!==M||(C=r<0?2:1),f&&(T=null,f=!1),o=l>S,y=e,s=5;break}case 5:s=8,0!==C&&(n=!0,s+=1),C=0,M=0,T=null;break;case 6:M=1;break;case 7:T=W(t),s=1}s&&(w=[],n&&I&&(x+=I,I=0,b++),J.forEach((([e,t])=>{s&e&&t(o)})))}}},M=w?t.useLayoutEffect:t.useEffect,T=(e,t)=>t&&x()?-e:e,O=(e,t,n,o,r)=>{const i=Date.now;let s=0,c=!1,a=!1,f=!1,d=!1;const h=(()=>{let t;const n=()=>{u(t)&&clearTimeout(t)},o=()=>{n(),t=l((()=>{t=null,(()=>{if(c||a)return c=!1,void h();f=!1,e.q(5)})()}),150)};return o.B=n,o})(),_=()=>{s=i(),f&&(d=!0),e.q(4,o()),h()},g=t=>{if(c||0===e.T()||t.ctrlKey)return;const o=i()-s;150>o&&50<o&&(n?t.deltaX:t.deltaY)&&(c=!0)},p=()=>{a=!0,f=d=!1},v=()=>{a=!1,z()&&(f=!0)};return t.addEventListener("scroll",_),t.addEventListener("wheel",g,{passive:!0}),t.addEventListener("touchstart",p,{passive:!0}),t.addEventListener("touchend",v,{passive:!0}),{$:()=>{t.removeEventListener("scroll",_),t.removeEventListener("wheel",g),t.removeEventListener("touchstart",p),t.removeEventListener("touchend",v),h.B()},A:()=>{const[t,o]=e.J();t&&(r(T(t,n),o,d),d=!1)}}},E=(e,t)=>{let n,o,r;const i=t?"scrollLeft":"scrollTop",s=t?"overflowX":"overflowY",u=async(o,s)=>{if(!n)return void a((()=>u(o,s)));r&&r();const c=()=>{let t;return[new Promise(((e,n)=>{t=e,l(r=n,150)})),e.W(2,(()=>{t&&t()}))]};if(s&&I()){for(;e.q(7,o()),e.I();){const[e,t]=c();try{await e}catch(e){return}finally{t()}}n.scrollTo({[t?"left":"top"]:T(o(),t),behavior:"smooth"})}else for(;;){const[r,s]=c();try{n[i]=T(o(),t),e.q(6),await r}catch(e){return}finally{s()}}};return{D(c){n=c,o=O(e,c,t,(()=>T(c[i],t)),((t,n,o)=>{if(o){const e=c.style,t=e[s];e[s]="hidden",l((()=>{e[s]=t}))}n?(c[i]=e.M()+t,r&&r()):c[i]+=t}))},$(){o&&o.$()},L(e){u((()=>e))},P(t){t+=e.M(),u((()=>t))},X(t,{align:n,smooth:o}={}){if(t=c(t,0,e.C()-1),"nearest"===n){const o=e.R(t),r=e.M();if(o<r)n="start";else{if(!(o+e.k(t)>r+e._()))return;n="end"}}u((()=>e.O()+e.R(t)+("end"===n?e.k(t)-e._():"center"===n?(e.k(t)-e._())/2:0)),o)},A:()=>{o&&o.A()}}},H=(e,t)=>{let n;return{D(o){let r=0;const i=t?"scrollX":"scrollY",s=y(o),l=b(s),c=s.body,u=(e,t,n,o=0)=>{const r=n?"offsetLeft":"offsetTop",i=o+(n&&x()?l.innerWidth-e[r]-e.offsetWidth:e[r]),s=e.offsetParent;return e!==t&&s?u(s,t,n,i):i};n=O(e,l,t,(()=>T(l[i],t)-(r=u(o,c,t))),((n,o)=>{o?l.scroll({[t?"left":"top"]:e.M()+r+n}):l.scrollBy(t?n:0,t?0:n)}))},$(){n&&n.$()},A:()=>{n&&n.A()}}},J="current",W=(e,t)=>{if(s(e))for(const n of e)W(n,t);else u(e)&&"boolean"!=typeof e&&t.push(e)},q=(e,t)=>{const n=e.key;return u(n)?n:"_"+t},B=e=>{const n=t.useRef();return n[J]||(n[J]=e())},$=e=>{const n=t.useRef(e);return M((()=>{n[J]=e}),[e]),n},A=e=>{let t;return{D(n){(t||(t=new(b(y(n)).ResizeObserver)(e))).observe(n)},Y(e){t.unobserve(e)},$(){t&&t.disconnect()}}},D=(e,t)=>{let n;const o=t?"width":"height",r=new WeakMap,i=A((t=>{const i=[];for(const{target:s,contentRect:l}of t)if(s.offsetParent)if(s===n)e.q(2,l[o]);else{const e=r.get(s);u(e)&&i.push([e,l[o]])}i.length&&e.q(1,i)}));return{j(e){i.D(n=e)},N:(e,t)=>(r.set(e,t),i.D(e),()=>{r.delete(e),i.Y(e)}),$:i.$}},L=(e,t)=>{const n=t?"width":"height",o=t?"innerWidth":"innerHeight",r=new WeakMap,i=A((t=>{const o=[];for(const{target:e,contentRect:i}of t){if(!e.offsetParent)continue;const t=r.get(e);u(t)&&o.push([t,i[n]])}o.length&&e.q(1,o)}));let s;return{j(t){const n=b(y(t)),r=()=>{e.q(2,n[o])};n.addEventListener("resize",r),r(),s=()=>{n.removeEventListener("resize",r)}},N:(e,t)=>(r.set(e,t),i.D(e),()=>{r.delete(e),i.Y(e)}),$(){s&&s(),i.$()}}},P=(e,t)=>{let n;const o="height",i="width",s=new WeakMap,l=new Set,c=new Set,u=new Map,a=(e,t)=>`${e}-${t}`,f=A((f=>{const d=new Set,h=new Set;for(const{target:r,contentRect:l}of f)if(r.offsetParent)if(r===n)e.q(2,l[o]),t.q(2,l[i]);else{const e=s.get(r);if(e){const[t,n]=e,r=a(t,n),s=u.get(r),c=[l[o],l[i]];let f,_;s?(s[0]!==c[0]&&(f=!0),s[1]!==c[1]&&(_=!0)):f=_=!0,f&&d.add(t),_&&h.add(n),(f||_)&&u.set(r,c)}}if(d.size){const t=[];d.forEach((e=>{let n=0;c.forEach((t=>{const o=u.get(a(e,t));o&&(n=r(n,o[0]))})),n&&t.push([e,n])})),e.q(1,t)}if(h.size){const e=[];h.forEach((t=>{let n=0;l.forEach((e=>{const o=u.get(a(e,t));o&&(n=r(n,o[1]))})),n&&e.push([t,n])})),t.q(1,e)}}));return{j(e){f.D(n=e)},N:(e,t,n)=>(s.set(e,[t,n]),l.add(t),c.add(n),f.D(e),()=>{s.delete(e),f.Y(e)}),$:f.$}},X=t.memo((({U:n,V:o,F:r,G:i,K:s,Z:l,ee:c,te:u})=>{const a=t.useRef(null);M((()=>o(a[J],r)),[r]);const f=t.useMemo((()=>{const e={margin:0,padding:0,position:s&&u?void 0:"absolute",[c?"height":"width"]:"100%",[c?"top":"left"]:0,[c?x()?"right":"left":"top"]:i,visibility:!s||u?"visible":"hidden"};return c&&(e.display="flex"),e}),[i,s,u]);return"string"==typeof l?e.jsx(l,{ref:a,style:f,children:n}):e.jsx(l,{ref:a,style:f,index:r,children:n})})),Y=e=>t.useReducer(e.p,void 0,e.p)[1],j=(e,n)=>t.useMemo((()=>{if("function"==typeof e)return[e,n||0];const t=(e=>{const t=[];return W(e,t),t})(e);return[e=>t[e],t.length]}),[e,n]),N=t.forwardRef((({children:o,count:r,overscan:i=4,itemSize:s,shift:l,horizontal:c,cache:u,startMargin:f,endMargin:d,ssrCount:h,as:_="div",item:g="div",scrollRef:p,onScroll:v,onScrollEnd:m,onRangeChange:w},S)=>{const[y,b]=j(o,r),x=t.useRef(null),z=t.useRef(!!h),I=$(v),T=$(m),[O,H,W,A]=B((()=>{const e=!!c,t=C(b,s,h,u,!s,f,d);return[t,D(t,e),E(t,e),e]}));b!==O.C()&&O.q(3,[b,l]);const L=Y(O),[P,N]=O.m(),U=O.T(),V=O.H(),F=O.h(),G=[];M((()=>{z[J]=!1;const e=O.W(3,(e=>{e?n.flushSync(L):L()})),t=O.W(4,(()=>{I[J]&&I[J](O.M())})),o=O.W(8,(()=>{T[J]&&T[J]()})),r=e=>{H.j(e),W.D(e)};return p?a((()=>r(p[J]))):r(x[J].parentElement),()=>{e(),t(),o(),H.$(),W.$()}}),[]),M((()=>{W.A()}),[V]),t.useEffect((()=>{w&&w(P,N)}),[P,N]),t.useImperativeHandle(S,(()=>({get cache(){return O.v()},get scrollOffset(){return O.M()},get scrollSize(){return R(O)},get viewportSize(){return O._()},getItemOffset:O.R,scrollToIndex:W.X,scrollTo:W.L,scrollBy:W.P})),[]);for(let[t,n]=k(P,N,i,U,b);t<=n;t++){const n=y(t);G.push(e.jsx(X,{V:H.N,F:t,G:O.R(t),K:O.S(t),Z:g,U:n,ee:A,te:z[J]},q(n,t)))}return e.jsx(_,{ref:x,style:{overflowAnchor:"none",flex:"none",position:"relative",visibility:"hidden",width:A?F:"100%",height:A?"100%":F,pointerEvents:0!==U?"none":"auto"},children:G})})),U=t.forwardRef((({children:n,count:o,overscan:r,itemSize:i,shift:s,horizontal:l,reverse:c,cache:u,ssrCount:a,item:f,onScroll:d,onScrollEnd:h,onRangeChange:_,style:g,...p},v)=>{const m=t.useRef(null),w=c&&!l;let S=e.jsx(N,{ref:v,scrollRef:w?m:void 0,count:o,overscan:r,itemSize:i,shift:s,horizontal:l,cache:u,ssrCount:a,item:f,onScroll:d,onScrollEnd:h,onRangeChange:_,children:n});return w&&(S=e.jsx("div",{style:{visibility:"hidden",display:"flex",flexDirection:"column",justifyContent:"flex-end",minHeight:"100%"},children:S})),e.jsx("div",{ref:m,...p,style:{display:l?"inline-block":"block",[l?"overflowX":"overflowY"]:"auto",contain:"strict",width:"100%",height:"100%",...g},children:S})})),V=t.forwardRef((({children:o,count:r,overscan:i=4,itemSize:s,shift:l,horizontal:c,cache:u,ssrCount:a,as:f="div",item:d="div",onScrollEnd:h,onRangeChange:_},g)=>{const[p,v]=j(o,r),m=t.useRef(null),w=$(h),S=t.useRef(!!a),[y,b,x,z]=B((()=>{const e=!!c,t=C(v,s,a,u,!s);return[t,L(t,e),H(t,e),e]}));v!==y.C()&&y.q(3,[v,l]);const I=Y(y),[R,T]=y.m(),O=y.T(),E=y.H(),W=y.h(),A=[];M((()=>{S[J]=!1;const e=y.W(3,(e=>{e?n.flushSync(I):I()})),t=y.W(8,(()=>{w[J]&&w[J]()})),o=m[J];return b.j(o),x.D(o),()=>{e(),t(),b.$(),x.$()}}),[]),M((()=>{x.A()}),[E]),t.useEffect((()=>{_&&_(R,T)}),[R,T]),t.useImperativeHandle(g,(()=>({get cache(){return y.v()}})),[]);for(let[t,n]=k(R,T,i,O,v);t<=n;t++){const n=p(t);A.push(e.jsx(X,{V:b.N,F:t,G:y.R(t),K:y.S(t),Z:d,U:n,ee:z,te:S[J]},q(n,t)))}return e.jsx(f,{ref:m,style:{flex:"none",position:"relative",visibility:"hidden",width:z?W:"100%",height:z?"100%":W,pointerEvents:0!==O?"none":"auto"},children:A})})),F=(e,t)=>`${e}-${t}`,G=t.memo((({U:n,V:o,ne:r,oe:i,re:s,ie:l,se:c,le:u,K:a,Z:f})=>{const d=t.useRef(null);return M((()=>o.N(d[J],r,i)),[i,r]),e.jsx(f,{ref:d,style:t.useMemo((()=>({display:"grid",margin:0,padding:0,position:"absolute",top:s,[x()?"right":"left"]:l,visibility:a?"hidden":"visible",minHeight:c,minWidth:u})),[s,l,u,c,a]),children:n})})),K=t.forwardRef((({children:o,row:r,col:i,cellHeight:s=40,cellWidth:l=100,overscan:c=2,initialRowCount:u,initialColCount:a,item:f="div",style:d,...h},_)=>{const[g,p,v,m,w]=B((()=>{const e=C(r,s,u),t=C(i,l,a);return[e,t,P(e,t),E(e,!1),E(t,!0)]}));r!==g.C()&&g.q(3,[r]),i!==p.C()&&p.q(3,[i]);const S=Y(g),y=Y(p),[b,x]=g.m(),[z,I]=p.m(),T=g.T(),O=p.T(),H=g.H(),W=p.H(),q=R(g),$=R(p),A=t.useRef(null);M((()=>{const e=A[J],t=g.W(3,(e=>{e?n.flushSync(S):S()})),o=p.W(3,(e=>{e?n.flushSync(y):y()}));return v.j(e),m.D(e),w.D(e),()=>{t(),o(),v.$(),m.$(),w.$()}}),[]),M((()=>{m.A()}),[H]),M((()=>{w.A()}),[W]),t.useImperativeHandle(_,(()=>({get scrollOffset(){return[p.M(),g.M()]},get scrollSize(){return[R(p),R(g)]},get viewportSize(){return[p._(),g._()]},scrollToIndex(e,t){w.X(e),m.X(t)},scrollTo(e,t){w.L(e),m.L(t)},scrollBy(e,t){w.P(e),m.P(t)}})),[]);const D=t.useMemo((()=>{const e=new Map;return(t,n)=>{let r=e.get(F(t,n));return r||e.set(F(t,n),r=o({rowIndex:t,colIndex:n})),r}}),[o]),[L,X]=k(b,x,c,T,r),[j,N]=k(z,I,c,O,i),U=[];for(let t=L;t<=X;t++)for(let n=j;n<=N;n++)U.push(e.jsx(G,{V:v,ne:t,oe:n,re:g.R(t),ie:p.R(n),se:g.k(t),le:p.k(n),K:g.S(t)||p.S(n),Z:f,U:D(t,n)},F(t,n)));return e.jsx("div",{ref:A,...h,style:{overflow:"auto",contain:"strict",width:"100%",height:"100%",...d},children:e.jsx("div",{style:{overflowAnchor:"none",flex:"none",position:"relative",visibility:"hidden",width:$,height:q,pointerEvents:0!==T||0!==O?"none":"auto"},children:U})})}));exports.VList=U,exports.Virtualizer=N,exports.WindowVirtualizer=V,exports.experimental_VGrid=K;
+var e=require("react/jsx-runtime"),t=require("react"),n=require("react-dom");const r=Math.min,o=Math.max,i=Math.abs,s=Array.isArray,l=setTimeout,c=(e,t,n)=>r(n,o(t,e)),u=e=>null!=e,a="function"==typeof queueMicrotask?queueMicrotask:e=>{Promise.resolve().then(e)},f=e=>{let t,n;return(...r)=>(t||(t=!0,n=e(...r)),n)},d=-1,h=(e,t,n)=>{const r=n?"unshift":"push";for(let n=0;n<t;n++)e[r](d);return e},_=(e,t)=>{const n=e.t[t];return n===d?e.o:n},g=(e,t,n)=>{const o=e.t[t]===d;return e.t[t]=n,e.i=r(t,e.i),o},p=(e,t)=>{if(!e.l)return 0;if(e.i>=t)return e.u[t];e.i<0&&(e.u[0]=0,e.i=0);let n=e.i,r=e.u[n];for(;n<t;)r+=_(e,n),e.u[++n]=r;return e.i=t,r},v=(e,t,n)=>{for(;n>=0&&n<e.l;){const r=p(e,n);if(r<=t){if(r+_(e,n)>t)break;n++}else n--}return c(n,0,e.l-1)},m=(e,t,n)=>{const o=t-e.l;return e.i=n?-1:r(t-1,e.i),e.l=t,o>0?(h(e.u,o),h(e.t,o,n),e.o*o):(e.u.splice(o),(n?e.t.splice(0,-o):e.t.splice(o)).reduce(((t,n)=>t-(n===d?e.o:n)),0))},w="undefined"!=typeof window,S=()=>document.documentElement,y=e=>e.ownerDocument,b=e=>e.defaultView,x=/*#__PURE__*/f((()=>!!w&&"rtl"===getComputedStyle(S()).direction)),z=/*#__PURE__*/f((()=>/iP(hone|od|ad)/.test(navigator.userAgent))),I=/*#__PURE__*/f((()=>"scrollBehavior"in S().style)),R=e=>o(e.h(),e._()),k=(e,t,n,i,s)=>(1!==i&&(e-=o(0,n)),2!==i&&(t+=o(0,n)),[o(e,0),r(t,s-1)]),C=(e,t=40,n=0,s,l=!1,u=0,a=0)=>{let f=!!n,w=[],S=0,y=0,b=0,x=0,I=0,R=!1,k=0,C=0,T=0,M=f?[0,o(n-1,0)]:null,H=[0,0],W=0;const E=((e,t,n)=>({o:n?n[1]:t,t:n?n[0]:h([],e),l:e,i:-1,u:h([],e)}))(e,t,s),J=new Set,q=e=>((e,t,n,o)=>{const i=v(e,t,r(n,e.l-1));return[i,v(e,t+o,i)]})(E,e,H[0],S),B=()=>(e=>e.l?p(e,e.l-1)+_(e,e.l-1):0)(E),O=()=>B()+u+a,L=()=>o(0,O()-S),$=e=>p(E,e)-I,A=e=>_(E,e),D=e=>{e&&(z()&&0!==C?I+=e:(x+=e,b++))};return{p:()=>w,v:()=>(e=>[[...e.t],e.o])(E),m:()=>k?H:(H=q(y-u+I+x),M?[r(H[0],M[0]),o(H[1],M[1])]:H),S:e=>E.t[e]===d,I:()=>!!M&&E.t.slice(o(0,M[0]-1),r(E.l-1,M[1]+1)+1).includes(d),R:$,k:A,C:()=>E.l,T:()=>y,M:()=>C,_:()=>S,H:()=>u,h:B,W:()=>b,J(){const e=x,t=R;return x=0,R=!1,S>O()?[0,!1]:[k=e,t]},q(e,t){const n=[e,t];return J.add(n),()=>{J.delete(n)}},B(e,t){let n,r,s=0;switch(e){case 1:{const e=t.filter((([e,t])=>E.t[e]!==t));if(!e.length)break;let n=!1,i=!1;2===T?y>L()-1.5&&(i=!0):n=!0,D(e.reduce(((e,[t,r])=>{if(!n||(M?t<M[0]:$(t)+(0===C&&0===T?A(t):0)<y)){const n=r-A(t);(!i||n>0)&&(e+=n)}return e}),0));for(const[t,n]of e){const e=A(t),r=g(E,t,n);l&&(W+=n,r||(W-=e))}l&&S&&W>S&&(D(((e,t)=>{let n=0;const r=e.t.filter(((e,r)=>{const o=e!==d;return o&&r<t&&n++,o})),i=e.o;return e.i=-1,((e.o=(e=>{const t=[...e].sort(((e,t)=>e-t)),n=e.length/2|0;return t.length%2==0?(t[n-1]+t[n])/2:t[n]})(r))-i)*o(t-n,0)})(E,H[0])),l=!1),s=3,r=!0;break}case 2:S!==t&&(S=t,s=3);break;case 3:t[1]?(D(m(E,t[0],!0)),T=2,R=!0,s=1):m(E,t[0]);break;case 4:{const e=c(t,0,L()),n=k;if(k=0,e===y)break;const o=e-y,l=i(o);n&&l<i(n)+1||0!==T||(C=o<0?2:1),f&&(M=null,f=!1),r=l>S,y=e,s=5;break}case 5:s=8,0!==C&&(n=!0,s+=1),C=0,T=0,M=null;break;case 6:T=1;break;case 7:M=q(t),s=1}s&&(w=[],n&&I&&(x+=I,I=0,b++),J.forEach((([e,t])=>{s&e&&t(r)})))}}},T=w?t.useLayoutEffect:t.useEffect,M=(e,t)=>t&&x()?-e:e,H=(e,t,n,r,o)=>{const i=Date.now;let s=0,c=!1,a=!1,f=!1,d=!1;const h=(()=>{let t;const n=()=>{u(t)&&clearTimeout(t)},r=()=>{n(),t=l((()=>{t=null,(()=>{if(c||a)return c=!1,void h();f=!1,e.B(5)})()}),150)};return r.O=n,r})(),_=()=>{s=i(),f&&(d=!0),e.B(4,r()),h()},g=t=>{if(c||0===e.M()||t.ctrlKey)return;const r=i()-s;150>r&&50<r&&(n?t.deltaX:t.deltaY)&&(c=!0)},p=()=>{a=!0,f=d=!1},v=()=>{a=!1,z()&&(f=!0)};return t.addEventListener("scroll",_),t.addEventListener("wheel",g,{passive:!0}),t.addEventListener("touchstart",p,{passive:!0}),t.addEventListener("touchend",v,{passive:!0}),{L:()=>{t.removeEventListener("scroll",_),t.removeEventListener("wheel",g),t.removeEventListener("touchstart",p),t.removeEventListener("touchend",v),h.O()},$:()=>{const[t,r]=e.J();t&&(o(M(t,n),r,d),d=!1)}}},W=(e,t)=>{let n,r,o;const i=t?"scrollLeft":"scrollTop",s=t?"overflowX":"overflowY",u=async(r,s)=>{if(!n)return void a((()=>u(r,s)));o&&o();const c=()=>{let t;return[new Promise(((e,n)=>{t=e,l(o=n,150)})),e.q(2,(()=>{t&&t()}))]};if(s&&I()){for(;e.B(7,r()),e.I();){const[e,t]=c();try{await e}catch(e){return}finally{t()}}n.scrollTo({[t?"left":"top"]:M(r(),t),behavior:"smooth"})}else for(;;){const[o,s]=c();try{n[i]=M(r(),t),e.B(6),await o}catch(e){return}finally{s()}}};return{A(c){n=c,r=H(e,c,t,(()=>M(c[i],t)),((t,n,r)=>{if(r){const e=c.style,t=e[s];e[s]="hidden",l((()=>{e[s]=t}))}n?(c[i]=e.T()+t,o&&o()):c[i]+=t}))},L(){r&&r.L()},D(e){u((()=>e))},P(t){t+=e.T(),u((()=>t))},X(t,{align:n,smooth:r,offset:o=0}={}){if(t=c(t,0,e.C()-1),"nearest"===n){const r=e.R(t),o=e.T();if(r<o)n="start";else{if(!(r+e.k(t)>o+e._()))return;n="end"}}u((()=>o+e.H()+e.R(t)+("end"===n?e.k(t)-e._():"center"===n?(e.k(t)-e._())/2:0)),r)},$:()=>{r&&r.$()}}},E=(e,t)=>{let n;return{A(r){let o=0;const i=t?"scrollX":"scrollY",s=y(r),l=b(s),c=s.body,u=(e,t,n,r=0)=>{const o=n?"offsetLeft":"offsetTop",i=r+(n&&x()?l.innerWidth-e[o]-e.offsetWidth:e[o]),s=e.offsetParent;return e!==t&&s?u(s,t,n,i):i};n=H(e,l,t,(()=>M(l[i],t)-(o=u(r,c,t))),((n,r)=>{r?l.scroll({[t?"left":"top"]:e.T()+o+n}):l.scrollBy(t?n:0,t?0:n)}))},L(){n&&n.L()},$:()=>{n&&n.$()}}},J=(e,t)=>{const n=W(e,!1),r=W(t,!0);return{A(e){n.A(e),r.A(e)},L(){n.L(),r.L()},D(e,t){n.D(t),r.D(e)},P(e,t){n.P(t),r.P(e)},X(e,t){n.X(t),r.X(e)},$(){n.$(),r.$()}}},q="current",B=(e,t)=>{if(s(e))for(const n of e)B(n,t);else u(e)&&"boolean"!=typeof e&&t.push(e)},O=(e,t)=>{const n=e.key;return u(n)?n:"_"+t},L=e=>{const n=t.useRef();return n[q]||(n[q]=e())},$=e=>{const n=t.useRef(e);return T((()=>{n[q]=e}),[e]),n},A=e=>{let t;return{A(n){(t||(t=new(b(y(n)).ResizeObserver)(e))).observe(n)},Y(e){t.unobserve(e)},L(){t&&t.disconnect()}}},D=(e,t)=>{let n;const r=t?"width":"height",o=new WeakMap,i=A((t=>{const i=[];for(const{target:s,contentRect:l}of t)if(s.offsetParent)if(s===n)e.B(2,l[r]);else{const e=o.get(s);u(e)&&i.push([e,l[r]])}i.length&&e.B(1,i)}));return{j(e){i.A(n=e)},U:(e,t)=>(o.set(e,t),i.A(e),()=>{o.delete(e),i.Y(e)}),L:i.L}},P=(e,t)=>{const n=t?"width":"height",r=t?"innerWidth":"innerHeight",o=new WeakMap,i=A((t=>{const r=[];for(const{target:e,contentRect:i}of t){if(!e.offsetParent)continue;const t=o.get(e);u(t)&&r.push([t,i[n]])}r.length&&e.B(1,r)}));let s;return{j(t){const n=b(y(t)),o=()=>{e.B(2,n[r])};n.addEventListener("resize",o),o(),s=()=>{n.removeEventListener("resize",o)}},U:(e,t)=>(o.set(e,t),i.A(e),()=>{o.delete(e),i.Y(e)}),L(){s&&s(),i.L()}}},X=(e,t)=>{let n;const r="height",i="width",s=new WeakMap,l=new Set,c=new Set,u=new Map,a=(e,t)=>`${e}-${t}`,f=A((f=>{const d=new Set,h=new Set;for(const{target:o,contentRect:l}of f)if(o.offsetParent)if(o===n)e.B(2,l[r]),t.B(2,l[i]);else{const e=s.get(o);if(e){const[t,n]=e,o=a(t,n),s=u.get(o),c=[l[r],l[i]];let f,_;s?(s[0]!==c[0]&&(f=!0),s[1]!==c[1]&&(_=!0)):f=_=!0,f&&d.add(t),_&&h.add(n),(f||_)&&u.set(o,c)}}if(d.size){const t=[];d.forEach((e=>{let n=0;c.forEach((t=>{const r=u.get(a(e,t));r&&(n=o(n,r[0]))})),n&&t.push([e,n])})),e.B(1,t)}if(h.size){const e=[];h.forEach((t=>{let n=0;l.forEach((e=>{const r=u.get(a(e,t));r&&(n=o(n,r[1]))})),n&&e.push([t,n])})),t.B(1,e)}}));return{j(e){f.A(n=e)},U:(e,t,n)=>(s.set(e,[t,n]),l.add(t),c.add(n),f.A(e),()=>{s.delete(e),f.Y(e)}),L:f.L}},Y=t.memo((({V:n,F:r,G:o,K:i,N:s,Z:l,ee:c,te:u})=>{const a=t.useRef(null);T((()=>r(a[q],o)),[o]);const f=t.useMemo((()=>{const e={margin:0,padding:0,position:s&&u?void 0:"absolute",[c?"height":"width"]:"100%",[c?"top":"left"]:0,[c?x()?"right":"left":"top"]:i,visibility:!s||u?"visible":"hidden"};return c&&(e.display="flex"),e}),[i,s,u]);return"string"==typeof l?e.jsx(l,{ref:a,style:f,children:n}):e.jsx(l,{ref:a,style:f,index:o,children:n})})),j=e=>t.useReducer(e.p,void 0,e.p)[1],U=(e,n)=>t.useMemo((()=>{if("function"==typeof e)return[e,n||0];const t=(e=>{const t=[];return B(e,t),t})(e);return[e=>t[e],t.length]}),[e,n]),V=t.forwardRef((({children:r,count:o,overscan:i=4,itemSize:s,shift:l,horizontal:c,cache:u,startMargin:f,endMargin:d,ssrCount:h,as:_="div",item:g="div",scrollRef:p,onScroll:v,onScrollEnd:m,onRangeChange:w},S)=>{const[y,b]=U(r,o),x=t.useRef(null),z=t.useRef(!!h),I=$(v),M=$(m),[H,E,J,B]=L((()=>{const e=!!c,t=C(b,s,h,u,!s,f,d);return[t,D(t,e),W(t,e),e]}));b!==H.C()&&H.B(3,[b,l]);const A=j(H),[P,X]=H.m(),V=H.M(),F=H.W(),G=H.h(),K=[];T((()=>{z[q]=!1;const e=H.q(1,(e=>{e?n.flushSync(A):A()})),t=H.q(4,(()=>{I[q]&&I[q](H.T())})),r=H.q(8,(()=>{M[q]&&M[q]()})),o=e=>{E.j(e),J.A(e)};return p?a((()=>o(p[q]))):o(x[q].parentElement),()=>{e(),t(),r(),E.L(),J.L()}}),[]),T((()=>{J.$()}),[F]),t.useEffect((()=>{w&&w(P,X)}),[P,X]),t.useImperativeHandle(S,(()=>({get cache(){return H.v()},get scrollOffset(){return H.T()},get scrollSize(){return R(H)},get viewportSize(){return H._()},getItemOffset:H.R,scrollToIndex:J.X,scrollTo:J.D,scrollBy:J.P})),[]);for(let[t,n]=k(P,X,i,V,b);t<=n;t++){const n=y(t);K.push(e.jsx(Y,{F:E.U,G:t,K:H.R(t),N:H.S(t),Z:g,V:n,ee:B,te:z[q]},O(n,t)))}return e.jsx(_,{ref:x,style:{overflowAnchor:"none",flex:"none",position:"relative",visibility:"hidden",width:B?G:"100%",height:B?"100%":G,pointerEvents:0!==V?"none":"auto"},children:K})})),F=t.forwardRef((({children:n,count:r,overscan:o,itemSize:i,shift:s,horizontal:l,reverse:c,cache:u,ssrCount:a,item:f,onScroll:d,onScrollEnd:h,onRangeChange:_,style:g,...p},v)=>{const m=t.useRef(null),w=c&&!l;let S=e.jsx(V,{ref:v,scrollRef:w?m:void 0,count:r,overscan:o,itemSize:i,shift:s,horizontal:l,cache:u,ssrCount:a,item:f,onScroll:d,onScrollEnd:h,onRangeChange:_,children:n});return w&&(S=e.jsx("div",{style:{visibility:"hidden",display:"flex",flexDirection:"column",justifyContent:"flex-end",minHeight:"100%"},children:S})),e.jsx("div",{ref:m,...p,style:{display:l?"inline-block":"block",[l?"overflowX":"overflowY"]:"auto",contain:"strict",width:"100%",height:"100%",...g},children:S})})),G=t.forwardRef((({children:r,count:o,overscan:i=4,itemSize:s,shift:l,horizontal:c,cache:u,ssrCount:a,as:f="div",item:d="div",onScrollEnd:h,onRangeChange:_},g)=>{const[p,v]=U(r,o),m=t.useRef(null),w=$(h),S=t.useRef(!!a),[y,b,x,z]=L((()=>{const e=!!c,t=C(v,s,a,u,!s);return[t,P(t,e),E(t,e),e]}));v!==y.C()&&y.B(3,[v,l]);const I=j(y),[R,M]=y.m(),H=y.M(),W=y.W(),J=y.h(),B=[];T((()=>{S[q]=!1;const e=y.q(1,(e=>{e?n.flushSync(I):I()})),t=y.q(8,(()=>{w[q]&&w[q]()})),r=m[q];return b.j(r),x.A(r),()=>{e(),t(),b.L(),x.L()}}),[]),T((()=>{x.$()}),[W]),t.useEffect((()=>{_&&_(R,M)}),[R,M]),t.useImperativeHandle(g,(()=>({get cache(){return y.v()}})),[]);for(let[t,n]=k(R,M,i,H,v);t<=n;t++){const n=p(t);B.push(e.jsx(Y,{F:b.U,G:t,K:y.R(t),N:y.S(t),Z:d,V:n,ee:z,te:S[q]},O(n,t)))}return e.jsx(f,{ref:m,style:{flex:"none",position:"relative",visibility:"hidden",width:z?J:"100%",height:z?"100%":J,pointerEvents:0!==H?"none":"auto"},children:B})})),K=(e,t)=>`${e}-${t}`,N=t.memo((({V:n,F:r,ne:o,re:i,oe:s,ie:l,se:c,le:u,N:a,Z:f})=>{const d=t.useRef(null);return T((()=>r.U(d[q],o,i)),[i,o]),e.jsx(f,{ref:d,style:t.useMemo((()=>({display:"grid",margin:0,padding:0,position:"absolute",top:s,[x()?"right":"left"]:l,visibility:a?"hidden":"visible",minHeight:c,minWidth:u})),[s,l,u,c,a]),children:n})})),Q=t.forwardRef((({children:r,row:o,col:i,cellHeight:s=40,cellWidth:l=100,overscan:c=2,initialRowCount:u,initialColCount:a,item:f="div",style:d,...h},_)=>{const[g,p,v,m]=L((()=>{const e=C(o,s,u),t=C(i,l,a);return[e,t,X(e,t),J(e,t)]}));o!==g.C()&&g.B(3,[o]),i!==p.C()&&p.B(3,[i]);const w=j(g),S=j(p),[y,b]=g.m(),[x,z]=p.m(),I=g.M(),M=p.M(),H=g.W(),W=p.W(),E=R(g),B=R(p),O=t.useRef(null);T((()=>{const e=O[q],t=g.q(1,(e=>{e?n.flushSync(w):w()})),r=p.q(1,(e=>{e?n.flushSync(S):S()}));return v.j(e),m.A(e),()=>{t(),r(),v.L(),m.L()}}),[]),T((()=>{m.$()}),[H,W]),t.useImperativeHandle(_,(()=>({get scrollTop(){return g.T()},get scrollLeft(){return p.T()},get scrollHeight(){return R(g)},get scrollWidth(){return R(p)},get viewportHeight(){return g._()},get viewportWidth(){return p._()},scrollToIndex:m.X,scrollTo:m.D,scrollBy:m.P})),[]);const $=t.useMemo((()=>{const e=new Map;return(t,n)=>{let o=e.get(K(t,n));return o||e.set(K(t,n),o=r({rowIndex:t,colIndex:n})),o}}),[r]),[A,D]=k(y,b,c,I,o),[P,Y]=k(x,z,c,M,i),U=[];for(let t=A;t<=D;t++)for(let n=P;n<=Y;n++)U.push(e.jsx(N,{F:v,ne:t,re:n,oe:g.R(t),ie:p.R(n),se:g.k(t),le:p.k(n),N:g.S(t)||p.S(n),Z:f,V:$(t,n)},K(t,n)));return e.jsx("div",{ref:O,...h,style:{overflow:"auto",contain:"strict",width:"100%",height:"100%",...d},children:e.jsx("div",{style:{overflowAnchor:"none",flex:"none",position:"relative",visibility:"hidden",width:B,height:E,pointerEvents:0!==I||0!==M?"none":"auto"},children:U})})}));exports.VList=F,exports.Virtualizer=V,exports.WindowVirtualizer=G,exports.experimental_VGrid=Q;
 //# sourceMappingURL=index.js.map