virtua/lib/solid/index.cjs

A zero-config, fast and small (~3kB) virtual list (and grid) component for React, Vue, Solid and Svelte.

var e=require("solid-js/web"),t=require("solid-js");const r=null,{min:n,max:o,abs:s,floor:i}=Math,c=(e,t,r)=>n(r,o(t,e)),l=e=>[...e].sort(((e,t)=>e-t)),u="function"==typeof queueMicrotask?queueMicrotask:e=>{Promise.resolve().then(e)},a=()=>{let e;return[new Promise((t=>{e=t})),e]},f=e=>{let t;return()=>(e&&(t=e(),e=void 0),t)},d=(e,t,r)=>{const n=r?"unshift":"push";for(let r=0;r<t;r++)e[n](-1);return e},h=(e,t)=>{const r=e.o[t];return-1===r?e.i:r},g=(e,t,r)=>{const o=-1===e.o[t];return e.o[t]=r,e.l=n(t,e.l),o},v=(e,t)=>{if(!e.u)return 0;if(e.l>=t)return e.h[t];e.l<0&&(e.h[0]=0,e.l=0);let r=e.l,n=e.h[r];for(;r<t;)n+=h(e,r),e.h[++r]=n;return e.l=t,n},p=(e,t,r=0,n=e.u-1)=>{for(;r<=n;){const o=i((r+n)/2);if(v(e,o)<=t){if(v(e,o+1)>t)return o;r=o+1}else n=o-1}return c(r,0,e.u-1)},m=(e,t,r)=>{const o=t-e.u;return e.l=r?-1:n(t-1,e.l),e.u=t,o>0?(d(e.h,o),d(e.o,o,r),e.i*o):(e.h.splice(o),(r?e.o.splice(0,-o):e.o.splice(o)).reduce(((t,r)=>t-(-1===r?e.i:r)),0))},S="undefined"!=typeof window,$=()=>document.documentElement,b=e=>e.ownerDocument,x=e=>e.defaultView,w=/*#__PURE__*/f((()=>!!S&&"rtl"===getComputedStyle($()).direction)),y=/*#__PURE__*/f((()=>!!/iP(hone|od|ad)/.test(navigator.userAgent)||"MacIntel"===navigator.platform&&navigator.maxTouchPoints>0)),z=/*#__PURE__*/f((()=>"scrollBehavior"in $().style)),_=(e,t=40,i=0,c,u=!1)=>{let a=!!i,f=1,S=0,$=0,b=0,x=0,w=0,z=0,_=0,I=0,k=r,T=[0,a?o(i-1,0):-1],M=0;const E=((e,t,r)=>({i:r?r[1]:t,o:r&&r[0]?d(r[0].slice(0,n(e,r[0].length)),o(0,e-r[0].length)):d([],e),u:e,l:-1,h:d([],e+1)}))(e,t,c),O=new Set,R=()=>b-$,q=()=>R()+w+x,J=(e,t)=>((e,t,r,o)=>{if(o=n(o,e.u-1),v(e,o)<=t){const n=p(e,r,o);return[p(e,t,o,n),n]}{const n=p(e,t,void 0,o);return[n,p(e,r,n)]}})(E,e,t,T[0]),B=()=>v(E,E.u),H=e=>v(E,e)-w,L=e=>h(E,e),P=(e,t=-1)=>E.o[e]===t,W=e=>{e&&(y()&&0!==_||k&&1===I?w+=e:x+=e)};return{v:()=>{O.clear()},p:()=>f,m:()=>(e=>[e.o.slice(),e.i])(E),S:(e=200)=>{if(!S||a)return T;let t,r;if(z)[t,r]=T;else{let s=o(0,q()),i=s+S;u||(e=o(0,e),1!==_&&(s-=e),2!==_&&(i+=e)),[t,r]=T=J(o(0,s),o(0,i)),k&&(t=n(t,k[0]),r=o(r,k[1]))}return[o(t,0),n(r,E.u-1)]},$:()=>p(E,q()),_:()=>p(E,q()+S),I:P,k:H,T:L,M:()=>E.u,O:()=>b,R:()=>0!==_,q:()=>S,J:()=>$,B,H:()=>(z=x,x=0,[z,2===I]),L:(e,t)=>{const r=[e,t];return O.add(r),()=>{O.delete(r)}},P:(e,t)=>{let n,i,c=0;switch(e){case 1:{if(t===b&&0===I)break;const e=z;z=0;const r=t-b,n=s(r);e&&n<s(e)+1||0!==I||(_=r<0?2:1),a&&(a=!1),b=t,c=4;const o=R();o>=-S&&o<=B()&&(c+=1,i=n>S);break}case 2:c=8,0!==_&&(n=!0,c+=1),_=0,I=0,k=r;break;case 3:{const e=t.filter((([e,t])=>!P(e,t)));if(!e.length)break;W(e.reduce(((e,[t,r])=>((2===I||(k&&1===I?t<k[0]:H(t+(0===_&&0===I?1:0))<R()))&&(e+=r-L(t)),e)),0));for(const[t,r]of e){const e=L(t),n=g(E,t,r);u&&(M+=n?r:r-e)}u&&S&&M>S&&(W(((e,t)=>{let r=0;const n=[];e.o.forEach(((e,o)=>{-1!==e&&(n.push(e),o<t&&r++)})),e.l=-1;const s=l(n),i=s.length,c=i/2|0,u=i%2==0?(s[c-1]+s[c])/2:s[c],a=e.i;return((e.i=u)-a)*o(t-r,0)})(E,p(E,q()))),u=!1),c=3,i=!0;break}case 4:S!==t&&(S||(i=!0),S=t,c=3);break;case 5:t[1]?(W(m(E,t[0],!0)),I=2,c=1):(m(E,t[0]),c=1);break;case 6:$=t;break;case 7:I=1;break;case 8:k=J(t,t+S),c=1}c&&(f=1+(2147483647&f),n&&w&&(x+=w,w=0),O.forEach((([e,t])=>{c&e&&t(i)})))}}},I=setTimeout,k=(e,t)=>t&&w()?-e:e,T=(e,t,n,o,s,i)=>{const c=Date.now;let l=0,u=!1,a=!1,f=!1,d=!1;const h=(()=>{let t;const n=()=>{t!=r&&clearTimeout(t)},o=()=>{n(),t=I((()=>{t=r,(()=>{if(u||a)return u=!1,void h();f=!1,e.P(2)})()}),150)};return o.W=n,o})(),g=()=>{l=c(),f&&(d=!0),i&&e.P(6,i()),e.P(1,o()),h()},v=t=>{if(u||!e.R()||t.ctrlKey)return;const r=c()-l;150>r&&50<r&&(n?t.deltaX:t.deltaY)&&(u=!0)},p=()=>{a=!0,f=d=!1},m=()=>{a=!1,y()&&(f=!0)};return t.addEventListener("scroll",g),t.addEventListener("wheel",v,{passive:!0}),t.addEventListener("touchstart",p,{passive:!0}),t.addEventListener("touchend",m,{passive:!0}),{j:()=>{t.removeEventListener("scroll",g),t.removeEventListener("wheel",v),t.removeEventListener("touchstart",p),t.removeEventListener("touchend",m),h.W()},C:()=>{const[t,r]=e.H();t&&(s(k(t,n),r,d),d=!1,r&&e.q()>e.B()&&e.P(1,o()))}}},M=(e,t,r)=>{let n;return[async(o,s)=>{if(!await t())return;n&&n();const i=()=>{const[t,r]=a();return n=()=>{r(!1)},e.q()&&I(n,150),[t,e.L(2,(()=>{r(!0)}))]};if(s&&z())e.P(8,o()),u((async()=>{for(;;){let t=!0;for(let[r,n]=e.S();r<=n;r++)if(e.I(r)){t=!1;break}if(t)break;const[r,n]=i();try{if(!await r)return}finally{n()}}e.P(7),r(o(),s)}));else for(;;){const[t,n]=i();try{if(e.P(7),r(o()),!await t)return}finally{n()}}},()=>{n&&n()}]},E=e=>{let t;return{V(r){(t||(t=new(x(b(r)).ResizeObserver)(e))).observe(r)},X(e){t.unobserve(e)},j(){t&&t.disconnect()}}},O=r=>{let n;r=t.mergeProps({Y:"div"},r),t.createEffect((()=>{n&&t.onCleanup(r.D(n,r.U))}));const o=t.createMemo((()=>{const e=r.A,t={contain:"layout style",position:"absolute",[e?"height":"width"]:"100%",[e?"top":"left"]:"0px",[e?w()?"right":"left":"top"]:r.F+"px",visibility:r.G?"hidden":"visible"};return e&&(t.display="inline-flex"),t}));return e.createComponent(e.Dynamic,{get component(){return r.Y},get index(){return r.U},ref(e){"function"==typeof n?n(e):n=e},get style(){return o()},get children(){return r.K}})},R=(e,t)=>e[0]===t[0]&&e[1]===t[1],q=n=>{let s;const{itemSize:i,horizontal:u=!1,cache:f}=n;n=t.mergeProps({as:"div"},n);const d=_(n.data.length,i,void 0,f,!i),h=((e,t)=>{let n;const o=t?"width":"height",s=new WeakMap,i=E((t=>{const i=[];for(const{target:c,contentRect:l}of t)if(c.offsetParent)if(c===n)e.P(4,l[o]);else{const e=s.get(c);e!=r&&i.push([e,l[o]])}i.length&&e.P(3,i)}));return{N(e){i.V(n=e)},Z:(e,t)=>(s.set(e,t),i.V(e),()=>{s.delete(e),i.X(e)}),v:i.j}})(d,u),g=((e,t)=>{let r,n,o=a();const s=t?"scrollLeft":"scrollTop",i=t?"overflowX":"overflowY",[l,u]=M(e,(()=>o[0]),((e,n)=>{e=k(e,t),n?r.scrollTo({[t?"left":"top"]:e,behavior:"smooth"}):r[s]=e}));return{ee(c){r=c,n=T(e,c,t,(()=>k(c[s],t)),((t,r,n)=>{if(n){const e=c.style,t=e[i];e[i]="hidden",I((()=>{e[i]=t}))}c[s]=e.O()+t,r&&u()})),o[1](!0)},v(){n&&n.j(),o[1](!1),o=a()},te(e){l((()=>e))},re(t){t+=e.O(),l((()=>t))},ne(t,{align:r,smooth:n,offset:o=0}={}){if(t=c(t,0,e.M()-1),"nearest"===r){const n=e.k(t),o=e.O();if(n<o)r="start";else{if(!(n+e.T(t)>o+e.q()))return;r="end"}}l((()=>o+e.J()+e.k(t)+("end"===r?e.T(t)-e.q():"center"===r?(e.T(t)-e.q())/2:0)),n)},oe:()=>{n&&n.C()}}})(d,u),[v,p]=t.createSignal(d.p());d.L(1,(()=>{p(d.p())})),d.L(4,(()=>{var e;null===(e=n.onScroll)||void 0===e||e.call(n,d.O())})),d.L(8,(()=>{var e;null===(e=n.onScrollEnd)||void 0===e||e.call(n)}));const m=t.createMemo((e=>{v();const t=d.S(n.bufferSize);return e&&R(e,t)?e:t})),S=t.createMemo((()=>v()&&d.R())),$=t.createMemo((()=>v()&&d.B()));t.onMount((()=>{n.ref&&n.ref({get cache(){return d.m()},get scrollOffset(){return d.O()},get scrollSize(){return(e=>o(e.B(),e.q()))(d)},get viewportSize(){return d.q()},findStartIndex:d.$,findEndIndex:d._,getItemOffset:d.k,getItemSize:d.T,scrollToIndex:g.ne,scrollTo:g.te,scrollBy:g.re});const e=n.scrollRef||s.parentElement;h.N(e),g.ee(e),t.onCleanup((()=>{n.ref&&n.ref(),d.v(),h.v(),g.v()}))})),t.createComputed(t.on((()=>n.startMargin||0),(e=>{e!==d.J()&&d.P(6,e)}))),t.createEffect(t.on(v,(()=>{g.oe()})));const b=t.createMemo((()=>{const e=n.data.length;t.untrack((()=>{e!==d.M()&&d.P(5,[e,n.shift])}));const r=[],o=[];if(n.keepMounted){const e=new Set(n.keepMounted);for(let[t,r]=m();t<=r;t++)e.add(t);l([...e]).forEach((e=>{r.push(n.data[e]),o.push(e)}))}else for(let[e,t]=m();e<=t;e++)r.push(n.data[e]),o.push(e);return{se:r,ie:o}}));return e.createComponent(e.Dynamic,{get component(){return n.as},ref(e){"function"==typeof s?s(e):s=e},get style(){return{contain:"size style","overflow-anchor":"none",flex:"none",position:"relative",width:u?$()+"px":"100%",height:u?"100%":$()+"px","pointer-events":S()?"none":void 0}},get children(){return e.createComponent(t.For,{get each(){return b().se},children:(r,o)=>((r,o)=>{const s=t.createMemo((()=>(v(),d.k(o())))),i=t.createMemo((()=>(v(),d.I(o())))),c=t.createMemo((()=>t.untrack((()=>n.children(r,o)))));return e.createComponent(O,{get Y(){return n.item},get U(){return o()},get D(){return h.Z},get F(){return s()},get G(){return i()},get K(){return c()},A:u})})(r,t.createMemo((()=>b().ie[o()])))})}})};var J=/*#__PURE__*/e.template("<div>"),B=/*#__PURE__*/e.template("<div style=overflow-anchor:none>");exports.VList=r=>{const[n,o]=t.splitProps(r,["ref","data","children","bufferSize","itemSize","shift","horizontal","keepMounted","cache","item","onScroll","onScrollEnd","style"]);return s=J(),e.spread(s,e.mergeProps(o,{get style(){return{display:n.horizontal?"inline-block":"block",[n.horizontal?"overflow-x":"overflow-y"]:"auto",contain:"strict",width:"100%",height:"100%",...n.style}}}),!1,!0),e.insert(s,e.createComponent(q,{ref(e){var t=n.ref;"function"==typeof t?t(e):n.ref=e},get data(){return n.data},get bufferSize(){return n.bufferSize},get itemSize(){return n.itemSize},get shift(){return n.shift},get horizontal(){return n.horizontal},get keepMounted(){return n.keepMounted},get cache(){return n.cache},get item(){return n.item},get onScroll(){return n.onScroll},get onScrollEnd(){return n.onScrollEnd},get children(){return n.children}})),s;var s},exports.Virtualizer=q,exports.WindowVirtualizer=n=>{let o;const{ref:s,data:i,children:l,itemSize:f,shift:d,horizontal:h=!1,cache:g,onScrollEnd:v}=n,p=_(n.data.length,f,void 0,g,!f),m=((e,t)=>{const n=t?"width":"height",o=t?"innerWidth":"innerHeight",s=new WeakMap,i=E((t=>{const o=[];for(const{target:e,contentRect:i}of t){if(!e.offsetParent)continue;const t=s.get(e);t!=r&&o.push([t,i[n]])}o.length&&e.P(3,o)}));let c;return{N(t){const r=x(b(t)),n=()=>{e.P(4,r[o])};r.addEventListener("resize",n),u(n),c=()=>{r.removeEventListener("resize",n)}},Z:(e,t)=>(s.set(e,t),i.V(e),()=>{s.delete(e),i.X(e)}),v(){c&&c(),i.j()}}})(p,h),S=((e,t)=>{let r,n,o=a();const s=t?"left":"top",[i]=M(e,(()=>o[0]),((e,n)=>{e=k(e,t);const o=x(b(r));n?o.scroll({[s]:e,behavior:"smooth"}):o.scroll({[s]:e})})),l=(e,t,r,n,o=0)=>{const s=n?"offsetLeft":"offsetTop",i=o+(n&&w()?r.innerWidth-e[s]-e.offsetWidth:e[s]),c=e.offsetParent;return e!==t&&c?l(c,t,r,n,i):i};return{ee(i){r=i;const c=t?"scrollX":"scrollY",u=b(i),a=x(u);n=T(e,a,t,(()=>k(a[c],t)),((t,r)=>{r?a.scroll({[s]:e.O()+t}):a.scrollBy({[s]:t})}),(()=>l(i,u.body,a,t))),o[1](!0)},v(){n&&n.j(),r=void 0,o[1](!1),o=a()},oe:()=>{n&&n.C()},ne(n,{align:o,smooth:s,offset:u=0}={}){if(!r)return;if(n=c(n,0,e.M()-1),"nearest"===o){const t=e.k(n),r=e.O();if(t<r)o="start";else{if(!(t+e.T(n)>r+e.q()))return;o="end"}}const a=b(r),f=x(a),d=a.documentElement,h=()=>e.q()-(t?d.clientWidth:d.clientHeight);i((()=>u+l(r,a.body,f,t)+e.k(n)+("end"===o?e.T(n)-(e.q()-h()):"center"===o?(e.T(n)-(e.q()-h()))/2:0)),s)}}})(p,h),[$,y]=t.createSignal(p.p());p.L(1,(()=>{y(p.p())})),p.L(4,(()=>{var e;null===(e=n.onScroll)||void 0===e||e.call(n)})),p.L(8,(()=>{var e;null===(e=n.onScrollEnd)||void 0===e||e.call(n)}));const z=t.createMemo((e=>{$();const t=p.S(n.bufferSize);return e&&R(e,t)?e:t})),I=t.createMemo((()=>$()&&p.R())),q=t.createMemo((()=>$()&&p.B()));t.onMount((()=>{n.ref&&n.ref({get cache(){return p.m()},findStartIndex:p.$,findEndIndex:p._,scrollToIndex:S.ne}),m.N(o),S.ee(o),t.onCleanup((()=>{n.ref&&n.ref(),p.v(),m.v(),S.v()}))})),t.createEffect(t.on($,(()=>{S.oe()})));const J=t.createMemo((()=>{const e=n.data.length;t.untrack((()=>{e!==p.M()&&p.P(5,[e,n.shift])}));const r=[];for(let[e,t]=z();e<=t;e++)r.push(n.data[e]);return r}));return H=B(),"function"==typeof(L=o)?e.use(L,H):o=H,e.setStyleProperty(H,"contain","size style"),e.setStyleProperty(H,"flex","none"),e.setStyleProperty(H,"position","relative"),e.insert(H,e.createComponent(t.For,{get each(){return J()},children:(r,o)=>{const s=t.createMemo((()=>z()[0]+o())),i=t.createMemo((()=>($(),p.k(s())))),c=t.createMemo((()=>($(),p.I(s())))),l=t.createMemo((()=>t.untrack((()=>n.children(r,s)))));return e.createComponent(O,{get U(){return s()},get D(){return m.Z},get F(){return i()},get G(){return c()},get K(){return l()},A:h})}})),e.effect((t=>{var r=h?q()+"px":"100%",n=h?"100%":q()+"px",o=I()?"none":void 0;return r!==t.e&&e.setStyleProperty(H,"width",t.e=r),n!==t.t&&e.setStyleProperty(H,"height",t.t=n),o!==t.a&&e.setStyleProperty(H,"pointer-events",t.a=o),t}),{e:void 0,t:void 0,a:void 0}),H;var H,L};
//# sourceMappingURL=index.cjs.map