react-anchorlist 0.1.1 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatVirtualList.d.ts","sourceRoot":"","sources":["../../src/components/ChatVirtualList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ChatVirtualList.d.ts","sourceRoot":"","sources":["../../src/components/ChatVirtualList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,qBAAqB,EAAE,oBAAoB,EAAe,MAAM,UAAU,CAAA;AAgHxF,eAAO,MAAM,eAAe,EAAuC,CAAC,CAAC,EACnE,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAA;CAAE,KACxE,KAAK,CAAC,YAAY,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VirtualList.d.ts","sourceRoot":"","sources":["../../src/components/VirtualList.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"VirtualList.d.ts","sourceRoot":"","sources":["../../src/components/VirtualList.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAe,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAE7D,gGAAgG;AAChG,wBAAgB,WAAW,CAAC,CAAC,EAAE,EAC7B,IAAI,EACJ,WAAW,EACX,cAAc,EACd,iBAAsB,EACtB,QAAa,EACb,YAAY,EACZ,mBAAyB,EACzB,UAAe,EACf,SAAS,EACT,KAAK,GACN,EAAE,gBAAgB,CAAC,CAAC,CAAC,2CAwDrB"}
|
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
import { UseVirtualEngineReturn } from '../types';
|
|
2
2
|
|
|
3
|
+
/**
|
|
4
|
+
* Core virtual engine.
|
|
5
|
+
*
|
|
6
|
+
* KEY DESIGN DECISIONS:
|
|
7
|
+
* - All scroll/layout state lives in refs, NOT in React state
|
|
8
|
+
* - A simple counter state is used ONLY to trigger re-renders
|
|
9
|
+
* - virtualItems are computed from refs DURING render (always fresh, zero lag)
|
|
10
|
+
* - Scroll handler uses rAF throttle to avoid excessive renders
|
|
11
|
+
* - Overscan defaults to 20 items (not 5) for smooth fast-scroll
|
|
12
|
+
*/
|
|
3
13
|
export declare function useVirtualEngine<T>(options: {
|
|
4
14
|
items: T[];
|
|
5
15
|
getKey: (item: T, index: number) => string | number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useVirtualEngine.d.ts","sourceRoot":"","sources":["../../src/hooks/useVirtualEngine.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,sBAAsB,EAAe,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"useVirtualEngine.d.ts","sourceRoot":"","sources":["../../src/hooks/useVirtualEngine.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,sBAAsB,EAAe,MAAM,UAAU,CAAA;AAEnE;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,OAAO,EAAE;IAC3C,KAAK,EAAE,CAAC,EAAE,CAAA;IACV,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAA;IACnD,iBAAiB,EAAE,MAAM,CAAA;IACzB,QAAQ,EAAE,MAAM,CAAA;IAChB,gBAAgB,EAAE,KAAK,GAAG,QAAQ,CAAA;CACnC,GAAG,sBAAsB,CAAC,CAAC,CAAC,CAoN5B"}
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const H=require("react/jsx-runtime"),c=require("react");function D(s){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const t in s)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(s,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>s[t]})}}return e.default=s,Object.freeze(e)}const K=D(c);class q{constructor(e,t){this.defaultSize=t,this.sizes=e>0?Array(e).fill(t):[],this.offsets=e>0?Array(e).fill(0):[],e>0&&this._recalcFrom(0)}_recalcFrom(e){for(let t=e;t<this.sizes.length;t++)this.offsets[t]=t===0?0:(this.offsets[t-1]??0)+(this.sizes[t-1]??this.defaultSize)}getOffset(e){return this.offsets[e]??0}getSize(e){return this.sizes[e]??this.defaultSize}setSize(e,t){return this.sizes[e]===t?!1:(this.sizes[e]=t,this._recalcFrom(e+1),!0)}prepend(e){const t=Array(e).fill(this.defaultSize);this.sizes=[...t,...this.sizes],this.offsets=Array(this.sizes.length).fill(0),this._recalcFrom(0)}append(e){const t=this.sizes.length;for(let r=0;r<e;r++)this.sizes.push(this.defaultSize),this.offsets.push(0);this._recalcFrom(t)}resize(e){const t=this.sizes.length;e>t?this.append(e-t):e<t&&(this.sizes=this.sizes.slice(0,e),this.offsets=this.offsets.slice(0,e))}totalSize(){if(this.sizes.length===0)return 0;const e=this.sizes.length-1;return(this.offsets[e]??0)+(this.sizes[e]??this.defaultSize)}get count(){return this.sizes.length}getOffsets(){return this.offsets}getSizes(){return this.sizes}}class G{constructor(){this.cache=new Map}get(e){return this.cache.get(e)}set(e,t){this.cache.set(e,t)}has(e){return this.cache.has(e)}delete(e){this.cache.delete(e)}clear(){this.cache.clear()}applyToOffsetMap(e,t){for(const[r,i]of this.cache){const a=t.get(r);a!==void 0&&e.setSize(a,i)}}}function U(s,e){if(s.length===0)return 0;let t=0,r=s.length-1;for(;t<r;){const i=t+r>>1;(s[i]??0)<e?t=i+1:r=i}return Math.max(0,t>0&&(s[t]??0)>e?t-1:t)}function Z(s,e,t){if(s.length===0)return 0;for(let r=s.length-1;r>=0;r--)if((s[r]??0)<t)return r;return 0}function Y(s){const{firstVisible:e,lastVisible:t,itemCount:r,overscan:i}=s;return r===0?{start:0,end:-1}:{start:Math.max(0,e-i),end:Math.min(r-1,t+i)}}function $(s,e){return c.useCallback((t,r)=>{const i=s.current,a=e.current;if(!i||!a)return;const l=a.getOffset(t),d=a.getSize(t),S=(r==null?void 0:r.align)??"start",y=(r==null?void 0:r.behavior)??"auto",v=(r==null?void 0:r.offset)??0;let E;S==="start"?E=l+v:S==="center"?E=l-i.clientHeight/2+d/2+v:E=l-i.clientHeight+d+v,i.scrollTo({top:Math.max(0,E),behavior:y})},[s,e])}function J(s,e){switch(e.type){case"SCROLL":return{...s,scrollTop:e.scrollTop,totalSize:e.totalSize,renderRange:e.renderRange};case"RESIZE_CONTAINER":return{...s,containerHeight:e.height,totalSize:e.totalSize,renderRange:e.renderRange};case"MEASURE":return{...s,totalSize:e.totalSize};case"ITEMS_CHANGED":return{...s,renderRange:e.renderRange,totalSize:e.totalSize}}}function N(s){const{items:e,getKey:t,estimatedItemSize:r,overscan:i,initialAlignment:a}=s,l=c.useRef(null),d=c.useRef(null),S=c.useRef(new G),y=c.useRef([]),v=c.useRef(!1),E=c.useRef(i);E.current=i,d.current||(d.current=new q(e.length,r));const z=c.useCallback((o,m)=>{const n=d.current;if(!n||n.count===0)return{start:0,end:-1};const u=n.getOffsets(),h=n.getSizes(),T=U(u,o),I=Z(u,h,o+m);return Y({firstVisible:T,lastVisible:I,itemCount:n.count,overscan:E.current})},[]),[b,f]=c.useReducer(J,{renderRange:{start:0,end:Math.min(e.length-1,i*2)},scrollTop:0,containerHeight:0,totalSize:d.current.totalSize()});c.useEffect(()=>{const o=d.current,m=e.map((M,F)=>t(M,F)),n=y.current,u=n.length,h=m.length;h===0?o.resize(0):u===0?o.resize(h):h>u?n.length>0&&m[h-u]===n[0]?o.prepend(h-u):o.resize(h):h<u&&o.resize(h);const T=new Map;m.forEach((M,F)=>T.set(M,F)),S.current.applyToOffsetMap(o,T),y.current=m;const I=l.current,k=(I==null?void 0:I.scrollTop)??0,L=(I==null?void 0:I.clientHeight)??0,j=z(k,L);f({type:"ITEMS_CHANGED",renderRange:j,totalSize:o.totalSize()})},[e,t,z]),c.useEffect(()=>{const o=l.current;if(!o)return;const m=()=>{const n=d.current,u=o.scrollTop,h=o.clientHeight,T=z(u,h);f({type:"SCROLL",scrollTop:u,totalSize:n.totalSize(),renderRange:T})};return o.addEventListener("scroll",m,{passive:!0}),()=>o.removeEventListener("scroll",m)},[z]),c.useEffect(()=>{const o=l.current;if(!o)return;const m=new ResizeObserver(([n])=>{if(!n)return;const u=n.contentRect.height,h=d.current,T=o.scrollTop,I=z(T,u);f({type:"RESIZE_CONTAINER",height:u,totalSize:h.totalSize(),renderRange:I})});return m.observe(o),()=>m.disconnect()},[z]),c.useEffect(()=>{if(v.current||e.length===0)return;const o=l.current;o&&(a==="bottom"&&(o.scrollTop=o.scrollHeight),v.current=!0)},[a,e.length]);const O=c.useCallback((o,m)=>{const n=d.current;if(!n)return;S.current.set(o,m);const u=y.current.indexOf(o);if(u===-1)return;n.setSize(u,m)&&f({type:"MEASURE",totalSize:n.totalSize()})},[]),P=c.useCallback((o,m="auto")=>{var n;(n=l.current)==null||n.scrollTo({top:o,behavior:m})},[]),p=$(l,d),R=d.current,{start:A,end:x}=b.renderRange,w=[];if(R&&x>=A)for(let o=A;o<=x&&o<e.length;o++)w.push({key:y.current[o]??t(e[o],o),index:o,start:R.getOffset(o),size:R.getSize(o),data:e[o]});const g=l.current,C=g?g.scrollHeight-g.scrollTop-g.clientHeight:1/0;return{scrollerRef:l,virtualItems:w,totalSize:b.totalSize,measureItem:O,scrollToIndex:p,scrollToOffset:P,isAtTop:b.scrollTop<=0,isAtBottom:C<=0,scrollTop:b.scrollTop}}function Q(s,e){const t=c.useRef(0),r=c.useRef(0),i=c.useRef(!1),a=c.useCallback(()=>{const l=s.current;l&&(t.current=l.scrollTop,r.current=l.scrollHeight,i.current=!0)},[s]);return c.useLayoutEffect(()=>{if(!i.current)return;const l=s.current;if(!l)return;const d=l.scrollHeight-r.current;d>0&&(l.scrollTop=t.current+d),i.current=!1},[e,s]),{prepareAnchor:a}}function W(s,e){const[t,r]=c.useState(!0),i=c.useRef(null);return c.useEffect(()=>{const a=s.current;if(!a)return;const l=()=>{const S=a.scrollHeight-a.scrollTop-a.clientHeight;r(S<=e)},d=()=>{i.current!==null&&cancelAnimationFrame(i.current),i.current=requestAnimationFrame(l)};return a.addEventListener("scroll",d,{passive:!0}),l(),()=>{a.removeEventListener("scroll",d),i.current!==null&&cancelAnimationFrame(i.current)}},[s,e]),t}function X(s){const{itemCount:e,isAtBottom:t,scrollToIndex:r,mode:i}=s,a=c.useRef(e);c.useLayoutEffect(()=>{i&&(e>a.current&&t&&e>0&&r(e-1,{align:"end",behavior:i==="smooth"?"smooth":"auto"}),a.current=e)},[e,t,r,i])}function V(s){const{items:e,getKey:t,estimatedItemSize:r=80,overscan:i=5,atBottomThreshold:a=200,followOutput:l="auto",initialAlignment:d="bottom",onStartReached:S,onEndReached:y,startReachedThreshold:v=300,endReachedThreshold:E=300,scrollToMessageKey:z,onScrollToMessageComplete:b}=s,f=N({items:e,getKey:t,estimatedItemSize:r,overscan:i,initialAlignment:d}),O=W(f.scrollerRef,a),{prepareAnchor:P}=Q(f.scrollerRef,e.length);X({itemCount:e.length,isAtBottom:O,scrollToIndex:f.scrollToIndex,mode:l??!1});const p=c.useRef(!1);c.useEffect(()=>{const g=f.scrollerRef.current;if(!g||!S)return;const C=()=>{g.scrollTop<=v&&!p.current&&(p.current=!0,Promise.resolve(S()).finally(()=>{p.current=!1}))};return g.addEventListener("scroll",C,{passive:!0}),()=>g.removeEventListener("scroll",C)},[f.scrollerRef,S,v]);const R=c.useRef(!1);c.useEffect(()=>{const g=f.scrollerRef.current;if(!g||!y)return;const C=()=>{g.scrollHeight-g.scrollTop-g.clientHeight<=E&&!R.current&&(R.current=!0,Promise.resolve(y()).finally(()=>{R.current=!1}))};return g.addEventListener("scroll",C,{passive:!0}),()=>g.removeEventListener("scroll",C)},[f.scrollerRef,y,E]);const A=c.useRef(null);c.useEffect(()=>{if(!z||A.current===z)return;const g=e.findIndex((C,o)=>t(C,o)===z);g!==-1&&(A.current=z,f.scrollToIndex(g,{align:"center",behavior:"smooth"}),b==null||b())},[z,e,t,f,b]);const x=c.useCallback((g="auto")=>{e.length!==0&&f.scrollToIndex(e.length-1,{align:"end",behavior:g})},[e.length,f]),w=c.useCallback((g,C)=>{const o=e.findIndex((m,n)=>t(m,n)===g);o!==-1&&f.scrollToIndex(o,C)},[e,t,f]);return{scrollerRef:f.scrollerRef,virtualItems:f.virtualItems,totalSize:f.totalSize,measureItem:f.measureItem,scrollToIndex:f.scrollToIndex,scrollToBottom:x,scrollToKey:w,isAtBottom:O,prepareAnchor:P}}function B({scrollerRef:s,totalSize:e,children:t,className:r,style:i}){return H.jsx("div",{ref:s,className:r,style:{overflow:"auto",height:"100%",position:"relative",...i},children:H.jsx("div",{style:{height:e,position:"relative",width:"100%"},children:t})})}function _({virtualItem:s,measureItem:e,children:t}){const r=c.useRef(null);return c.useEffect(()=>{const i=r.current;if(!i)return;const a=new ResizeObserver(([l])=>{l&&e(s.key,l.contentRect.height)});return a.observe(i),()=>a.disconnect()},[s.key,e]),H.jsx("div",{ref:r,style:{position:"absolute",top:0,transform:`translateY(${s.start}px)`,width:"100%",minHeight:s.size},children:t})}function ee(s,e){const{data:t,itemContent:r,computeItemKey:i,estimatedItemSize:a=80,overscan:l=5,followOutput:d="auto",atBottomThreshold:S=200,initialAlignment:y="bottom",onStartReached:v,onEndReached:E,startReachedThreshold:z=300,endReachedThreshold:b=300,scrollToMessageKey:f,onScrollToMessageComplete:O,onAtBottomChange:P,components:p={},className:R,style:A}=s,{scrollerRef:x,virtualItems:w,totalSize:g,measureItem:C,scrollToIndex:o,scrollToBottom:m,scrollToKey:n,isAtBottom:u,prepareAnchor:h}=V({items:t,getKey:(j,M)=>i(M,j),estimatedItemSize:a,overscan:l,atBottomThreshold:S,followOutput:d,initialAlignment:y,onStartReached:v,onEndReached:E,startReachedThreshold:z,endReachedThreshold:b,scrollToMessageKey:f,onScrollToMessageComplete:O}),T=K.useRef(u);K.useEffect(()=>{T.current!==u&&(T.current=u,P==null||P(u))},[u,P]),c.useImperativeHandle(e,()=>({scrollToBottom:m,scrollToIndex:o,scrollToKey:n,getScrollTop:()=>{var j;return((j=x.current)==null?void 0:j.scrollTop)??0},isAtBottom:()=>u,prepareAnchor:h}),[m,o,n,x,u,h]);const{Header:I,Footer:k,EmptyPlaceholder:L}=p;return t.length===0&&L?H.jsx(L,{}):H.jsxs("div",{style:{display:"flex",flexDirection:"column",height:"100%"},children:[I&&H.jsx(I,{}),H.jsx(B,{scrollerRef:x,totalSize:g,className:R,style:{flex:1,minHeight:0,...A},children:w.map(j=>H.jsx(_,{virtualItem:j,measureItem:C,children:r(j.index,j.data)},j.key))}),k&&H.jsx(k,{})]})}const te=c.forwardRef(ee);function re({data:s,itemContent:e,computeItemKey:t,estimatedItemSize:r=80,overscan:i=5,onEndReached:a,endReachedThreshold:l=300,components:d={},className:S,style:y}){const{scrollerRef:v,virtualItems:E,totalSize:z,measureItem:b}=N({items:s,getKey:(p,R)=>t(R,p),estimatedItemSize:r,overscan:i,initialAlignment:"top"});K.useEffect(()=>{const p=v.current;if(!p||!a)return;let R=!1;const A=()=>{p.scrollHeight-p.scrollTop-p.clientHeight<=l&&!R&&(R=!0,Promise.resolve(a()).finally(()=>{R=!1}))};return p.addEventListener("scroll",A,{passive:!0}),()=>p.removeEventListener("scroll",A)},[v,a,l]);const{Header:f,Footer:O,EmptyPlaceholder:P}=d;return s.length===0&&P?H.jsx(P,{}):H.jsxs("div",{style:{display:"flex",flexDirection:"column",height:"100%"},children:[f&&H.jsx(f,{}),H.jsx(B,{scrollerRef:v,totalSize:z,className:S,style:{flex:1,minHeight:0,...y},children:E.map(p=>H.jsx(_,{virtualItem:p,measureItem:b,children:e(p.index,p.data)},p.key))}),O&&H.jsx(O,{})]})}function se(s){const{fetcher:e,initialPage:t=1,direction:r="append",getKey:i,onPageLoaded:a,onError:l}=s,[d,S]=c.useState([]),[y,v]=c.useState(t),[E,z]=c.useState(!0),[b,f]=c.useState(!1),[O,P]=c.useState(!1),[p,R]=c.useState(!1),A=c.useRef(new Set),x=c.useRef(!1),w=c.useCallback(n=>i?n.filter(u=>{const h=i(u);return A.current.has(h)?!1:(A.current.add(h),!0)}):n,[i]),g=c.useCallback(async()=>{if(!(x.current||!E)){x.current=!0,R(!0);try{const n=y+1,u=await e(n),h=w(u.data);S(T=>r==="prepend"?[...h,...T]:[...T,...h]),v(n),z(u.hasNextPage),f(u.hasPrevPage),a==null||a(n,h)}catch(n){l==null||l(n instanceof Error?n:new Error(String(n)))}finally{R(!1),x.current=!1}}},[y,E,e,w,r,a,l]),C=c.useCallback(async()=>{if(!(x.current||!b)){x.current=!0,R(!0);try{const n=y-1,u=await e(n),h=w(u.data);S(T=>[...h,...T]),v(n),f(u.hasPrevPage),z(u.hasNextPage),a==null||a(n,h)}catch(n){l==null||l(n instanceof Error?n:new Error(String(n)))}finally{R(!1),x.current=!1}}},[y,b,e,w,a,l]),o=c.useCallback(async()=>{if(!x.current){x.current=!0,P(!0);try{const n=await e(t),u=n.data;if(i){const h=new Set(u.map(i));u.forEach(T=>A.current.add(i(T))),S(T=>{const I=T.filter(k=>!h.has(i(k)));return r==="prepend"?[...u,...I]:[...I,...u]})}else S(u);v(t),z(n.hasNextPage),f(n.hasPrevPage),a==null||a(t,u)}catch(n){l==null||l(n instanceof Error?n:new Error(String(n)))}finally{P(!1),x.current=!1}}},[e,t,i,r,a,l]),m=c.useCallback(()=>{S([]),v(t),z(!0),f(!1),P(!1),R(!1),A.current.clear(),x.current=!1},[t]);return{items:d,loadNextPage:g,loadPrevPage:C,hasNextPage:E,hasPrevPage:b,loading:O,loadingMore:p,refresh:o,reset:m,currentPage:y}}exports.ChatVirtualList=te;exports.VirtualList=re;exports.useChatVirtualizer=V;exports.usePagination=se;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const j=require("react/jsx-runtime"),r=require("react");function _(c){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const t in c)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(c,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>c[t]})}}return e.default=c,Object.freeze(e)}const M=_(r);class q{constructor(e,t){this.defaultSize=t,this.sizes=e>0?Array(e).fill(t):[],this.offsets=e>0?Array(e).fill(0):[],e>0&&this._recalcFrom(0)}_recalcFrom(e){for(let t=e;t<this.sizes.length;t++)this.offsets[t]=t===0?0:(this.offsets[t-1]??0)+(this.sizes[t-1]??this.defaultSize)}getOffset(e){return this.offsets[e]??0}getSize(e){return this.sizes[e]??this.defaultSize}setSize(e,t){return this.sizes[e]===t?!1:(this.sizes[e]=t,this._recalcFrom(e+1),!0)}prepend(e){const t=Array(e).fill(this.defaultSize);this.sizes=[...t,...this.sizes],this.offsets=Array(this.sizes.length).fill(0),this._recalcFrom(0)}append(e){const t=this.sizes.length;for(let s=0;s<e;s++)this.sizes.push(this.defaultSize),this.offsets.push(0);this._recalcFrom(t)}resize(e){const t=this.sizes.length;e>t?this.append(e-t):e<t&&(this.sizes=this.sizes.slice(0,e),this.offsets=this.offsets.slice(0,e))}totalSize(){if(this.sizes.length===0)return 0;const e=this.sizes.length-1;return(this.offsets[e]??0)+(this.sizes[e]??this.defaultSize)}get count(){return this.sizes.length}getOffsets(){return this.offsets}getSizes(){return this.sizes}}class D{constructor(){this.cache=new Map}get(e){return this.cache.get(e)}set(e,t){this.cache.set(e,t)}has(e){return this.cache.has(e)}delete(e){this.cache.delete(e)}clear(){this.cache.clear()}applyToOffsetMap(e,t){for(const[s,i]of this.cache){const o=t.get(s);o!==void 0&&e.setSize(o,i)}}}function Y(c,e){if(c.length===0)return 0;let t=0,s=c.length-1;for(;t<s;){const i=t+s>>1;(c[i]??0)<e?t=i+1:s=i}return Math.max(0,t>0&&(c[t]??0)>e?t-1:t)}function $(c,e,t){if(c.length===0)return 0;for(let s=c.length-1;s>=0;s--)if((c[s]??0)<t)return s;return 0}function G(c){const{firstVisible:e,lastVisible:t,itemCount:s,overscan:i}=c;return s===0?{start:0,end:-1}:{start:Math.max(0,e-i),end:Math.min(s-1,t+i)}}function J(c,e){return r.useCallback((t,s)=>{const i=c.current,o=e.current;if(!i||!o)return;const l=o.getOffset(t),p=o.getSize(t),v=(s==null?void 0:s.align)??"start",z=(s==null?void 0:s.behavior)??"auto",x=(s==null?void 0:s.offset)??0;let T;v==="start"?T=l+x:v==="center"?T=l-i.clientHeight/2+p/2+x:T=l-i.clientHeight+p+x,i.scrollTo({top:Math.max(0,T),behavior:z})},[c,e])}function V(c){const{items:e,getKey:t,estimatedItemSize:s,overscan:i,initialAlignment:o}=c,l=r.useRef(null),p=r.useRef(null),v=r.useRef(new D),z=r.useRef([]),x=r.useRef(!1),T=r.useRef(0),b=r.useRef(0),I=r.useRef(null),[,f]=r.useState(0),A=r.useCallback(()=>f(n=>n+1),[]);p.current||(p.current=new q(e.length,s));const w=r.useRef(e.length);if(e.length!==w.current||e.some((n,a)=>{const R=t(n,a);return z.current[a]!==R})){const n=p.current,a=e.map((L,K)=>t(L,K)),R=z.current,k=R.length,C=a.length;C===0?n.resize(0):k===0?n.resize(C):C>k?R.length>0&&a[C-k]===R[0]?n.prepend(C-k):n.resize(C):C<k&&n.resize(C);const m=new Map;a.forEach((L,K)=>m.set(L,K)),v.current.applyToOffsetMap(n,m),z.current=a,w.current=e.length}r.useEffect(()=>{const n=l.current;if(!n)return;const a=()=>{I.current===null&&(I.current=requestAnimationFrame(()=>{I.current=null,T.current=n.scrollTop,b.current=n.clientHeight,A()}))};return n.addEventListener("scroll",a,{passive:!0}),()=>{n.removeEventListener("scroll",a),I.current!==null&&(cancelAnimationFrame(I.current),I.current=null)}},[A]),r.useEffect(()=>{const n=l.current;if(!n)return;b.current=n.clientHeight,T.current=n.scrollTop;const a=new ResizeObserver(([R])=>{R&&(b.current=R.contentRect.height,A())});return a.observe(n),()=>a.disconnect()},[A]),r.useLayoutEffect(()=>{if(x.current||e.length===0)return;const n=l.current;n&&(o==="bottom"&&(n.scrollTop=n.scrollHeight,T.current=n.scrollTop),x.current=!0)},[o,e.length]),r.useEffect(()=>{e.length===0&&(x.current=!1)},[e.length]);const P=r.useCallback((n,a)=>{const R=p.current;if(!R||v.current.get(n)===a)return;v.current.set(n,a);const C=z.current.indexOf(n);if(C===-1)return;R.setSize(C,a)&&A()},[A]),O=r.useCallback((n,a="auto")=>{var R;(R=l.current)==null||R.scrollTo({top:n,behavior:a})},[]),E=J(l,p),S=p.current,d=S?S.totalSize():0,g=l.current,H=(g==null?void 0:g.scrollTop)??T.current,F=(g==null?void 0:g.clientHeight)??b.current;let u=[];if(S&&S.count>0&&F>0){const n=S.getOffsets(),a=S.getSizes(),R=Y(n,H),k=$(n,a,H+F),C=G({firstVisible:R,lastVisible:k,itemCount:S.count,overscan:i});for(let m=C.start;m<=C.end&&m<e.length;m++)u.push({key:z.current[m]??t(e[m],m),index:m,start:S.getOffset(m),size:S.getSize(m),data:e[m]})}else if(S&&S.count>0){const n=Math.min(e.length-1,i*2);for(let a=0;a<=n;a++)u.push({key:z.current[a]??t(e[a],a),index:a,start:S.getOffset(a),size:S.getSize(a),data:e[a]})}const h=g?g.scrollHeight-g.scrollTop-g.clientHeight:1/0;return{scrollerRef:l,virtualItems:u,totalSize:d,measureItem:P,scrollToIndex:E,scrollToOffset:O,isAtTop:H<=0,isAtBottom:h<=0,scrollTop:H}}function Q(c,e){const t=r.useRef(0),s=r.useRef(0),i=r.useRef(!1),o=r.useCallback(()=>{const l=c.current;l&&(t.current=l.scrollTop,s.current=l.scrollHeight,i.current=!0)},[c]);return r.useLayoutEffect(()=>{if(!i.current)return;const l=c.current;if(!l)return;const p=l.scrollHeight-s.current;p>0&&(l.scrollTop=t.current+p),i.current=!1},[e,c]),{prepareAnchor:o}}function U(c,e){const[t,s]=r.useState(!0),i=r.useRef(null);return r.useEffect(()=>{const o=c.current;if(!o)return;const l=()=>{const v=o.scrollHeight-o.scrollTop-o.clientHeight;s(v<=e)},p=()=>{i.current!==null&&cancelAnimationFrame(i.current),i.current=requestAnimationFrame(l)};return o.addEventListener("scroll",p,{passive:!0}),l(),()=>{o.removeEventListener("scroll",p),i.current!==null&&cancelAnimationFrame(i.current)}},[c,e]),t}function W(c){const{itemCount:e,isAtBottom:t,scrollToIndex:s,mode:i}=c,o=r.useRef(e);r.useLayoutEffect(()=>{i&&(e>o.current&&t&&e>0&&s(e-1,{align:"end",behavior:i==="smooth"?"smooth":"auto"}),o.current=e)},[e,t,s,i])}function B(c){const{items:e,getKey:t,estimatedItemSize:s=80,overscan:i=20,atBottomThreshold:o=200,followOutput:l="auto",initialAlignment:p="bottom",onStartReached:v,onEndReached:z,startReachedThreshold:x=300,endReachedThreshold:T=300,scrollToMessageKey:b,onScrollToMessageComplete:I}=c,f=V({items:e,getKey:t,estimatedItemSize:s,overscan:i,initialAlignment:p}),A=U(f.scrollerRef,o),{prepareAnchor:w}=Q(f.scrollerRef,e.length);W({itemCount:e.length,isAtBottom:A,scrollToIndex:f.scrollToIndex,mode:l??!1});const y=r.useRef(!1);r.useEffect(()=>{const d=f.scrollerRef.current;if(!d||!v)return;const g=()=>{d.scrollTop<=x&&!y.current&&(y.current=!0,Promise.resolve(v()).finally(()=>{y.current=!1}))};return d.addEventListener("scroll",g,{passive:!0}),()=>d.removeEventListener("scroll",g)},[f.scrollerRef,v,x]);const P=r.useRef(!1);r.useEffect(()=>{const d=f.scrollerRef.current;if(!d||!z)return;const g=()=>{d.scrollHeight-d.scrollTop-d.clientHeight<=T&&!P.current&&(P.current=!0,Promise.resolve(z()).finally(()=>{P.current=!1}))};return d.addEventListener("scroll",g,{passive:!0}),()=>d.removeEventListener("scroll",g)},[f.scrollerRef,z,T]);const O=r.useRef(null);r.useEffect(()=>{if(!b||O.current===b)return;const d=e.findIndex((g,H)=>t(g,H)===b);d!==-1&&(O.current=b,f.scrollToIndex(d,{align:"center",behavior:"smooth"}),I==null||I())},[b,e,t,f,I]);const E=r.useCallback((d="auto")=>{e.length!==0&&f.scrollToIndex(e.length-1,{align:"end",behavior:d})},[e.length,f]),S=r.useCallback((d,g)=>{const H=e.findIndex((F,u)=>t(F,u)===d);H!==-1&&f.scrollToIndex(H,g)},[e,t,f]);return{scrollerRef:f.scrollerRef,virtualItems:f.virtualItems,totalSize:f.totalSize,measureItem:f.measureItem,scrollToIndex:f.scrollToIndex,scrollToBottom:E,scrollToKey:S,isAtBottom:A,prepareAnchor:w}}function N({virtualItem:c,measureItem:e,children:t}){const s=r.useRef(null);return r.useEffect(()=>{const i=s.current;if(!i)return;const o=new ResizeObserver(([l])=>{l&&e(c.key,l.contentRect.height)});return o.observe(i),()=>o.disconnect()},[c.key,e]),j.jsx("div",{ref:s,style:{position:"absolute",top:0,transform:`translateY(${c.start}px)`,width:"100%",minHeight:c.size},children:t})}function X(c,e){const{data:t,itemContent:s,computeItemKey:i,estimatedItemSize:o=80,overscan:l=20,followOutput:p="auto",atBottomThreshold:v=200,initialAlignment:z="bottom",onStartReached:x,onEndReached:T,startReachedThreshold:b=300,endReachedThreshold:I=300,scrollToMessageKey:f,onScrollToMessageComplete:A,onAtBottomChange:w,components:y={},className:P,style:O}=c,{scrollerRef:E,virtualItems:S,totalSize:d,measureItem:g,scrollToIndex:H,scrollToBottom:F,scrollToKey:u,isAtBottom:h,prepareAnchor:n}=B({items:t,getKey:(m,L)=>i(L,m),estimatedItemSize:o,overscan:l,atBottomThreshold:v,followOutput:p,initialAlignment:z,onStartReached:x,onEndReached:T,startReachedThreshold:b,endReachedThreshold:I,scrollToMessageKey:f,onScrollToMessageComplete:A}),a=M.useRef(h);M.useEffect(()=>{a.current!==h&&(a.current=h,w==null||w(h))},[h,w]),r.useImperativeHandle(e,()=>({scrollToBottom:F,scrollToIndex:H,scrollToKey:u,getScrollTop:()=>{var m;return((m=E.current)==null?void 0:m.scrollTop)??0},isAtBottom:()=>h,prepareAnchor:n}),[F,H,u,E,h,n]);const{Header:R,Footer:k,EmptyPlaceholder:C}=y;return t.length===0&&C?j.jsx(C,{}):j.jsxs("div",{ref:E,className:P,style:{overflow:"auto",height:"100%",position:"relative",...O},children:[R&&j.jsx(R,{}),j.jsx("div",{style:{height:d,position:"relative",width:"100%"},children:S.map(m=>j.jsx(N,{virtualItem:m,measureItem:g,children:s(m.index,m.data)},m.key))}),k&&j.jsx(k,{})]})}const Z=r.forwardRef(X);function ee({data:c,itemContent:e,computeItemKey:t,estimatedItemSize:s=60,overscan:i=20,onEndReached:o,endReachedThreshold:l=300,components:p={},className:v,style:z}){const{scrollerRef:x,virtualItems:T,totalSize:b,measureItem:I}=V({items:c,getKey:(y,P)=>t(P,y),estimatedItemSize:s,overscan:i,initialAlignment:"top"});M.useEffect(()=>{const y=x.current;if(!y||!o)return;let P=!1;const O=()=>{y.scrollHeight-y.scrollTop-y.clientHeight<=l&&!P&&(P=!0,Promise.resolve(o()).finally(()=>{P=!1}))};return y.addEventListener("scroll",O,{passive:!0}),()=>y.removeEventListener("scroll",O)},[x,o,l]);const{Header:f,Footer:A,EmptyPlaceholder:w}=p;return c.length===0&&w?j.jsx(w,{}):j.jsxs("div",{ref:x,className:v,style:{overflow:"auto",height:"100%",position:"relative",...z},children:[f&&j.jsx(f,{}),j.jsx("div",{style:{height:b,position:"relative",width:"100%"},children:T.map(y=>j.jsx(N,{virtualItem:y,measureItem:I,children:e(y.index,y.data)},y.key))}),A&&j.jsx(A,{})]})}function te(c){const{fetcher:e,initialPage:t=1,direction:s="append",getKey:i,onPageLoaded:o,onError:l}=c,[p,v]=r.useState([]),[z,x]=r.useState(t),[T,b]=r.useState(!0),[I,f]=r.useState(!1),[A,w]=r.useState(!1),[y,P]=r.useState(!1),O=r.useRef(new Set),E=r.useRef(!1),S=r.useCallback(u=>i?u.filter(h=>{const n=i(h);return O.current.has(n)?!1:(O.current.add(n),!0)}):u,[i]),d=r.useCallback(async()=>{if(!(E.current||!T)){E.current=!0,P(!0);try{const u=z+1,h=await e(u),n=S(h.data);v(a=>s==="prepend"?[...n,...a]:[...a,...n]),x(u),b(h.hasNextPage),f(h.hasPrevPage),o==null||o(u,n)}catch(u){l==null||l(u instanceof Error?u:new Error(String(u)))}finally{P(!1),E.current=!1}}},[z,T,e,S,s,o,l]),g=r.useCallback(async()=>{if(!(E.current||!I)){E.current=!0,P(!0);try{const u=z-1,h=await e(u),n=S(h.data);v(a=>[...n,...a]),x(u),f(h.hasPrevPage),b(h.hasNextPage),o==null||o(u,n)}catch(u){l==null||l(u instanceof Error?u:new Error(String(u)))}finally{P(!1),E.current=!1}}},[z,I,e,S,o,l]),H=r.useCallback(async()=>{if(!E.current){E.current=!0,w(!0);try{const u=await e(t),h=u.data;if(i){const n=new Set(h.map(i));h.forEach(a=>O.current.add(i(a))),v(a=>{const R=a.filter(k=>!n.has(i(k)));return s==="prepend"?[...h,...R]:[...R,...h]})}else v(h);x(t),b(u.hasNextPage),f(u.hasPrevPage),o==null||o(t,h)}catch(u){l==null||l(u instanceof Error?u:new Error(String(u)))}finally{w(!1),E.current=!1}}},[e,t,i,s,o,l]),F=r.useCallback(()=>{v([]),x(t),b(!0),f(!1),w(!1),P(!1),O.current.clear(),E.current=!1},[t]);return{items:p,loadNextPage:d,loadPrevPage:g,hasNextPage:T,hasPrevPage:I,loading:A,loadingMore:y,refresh:H,reset:F,currentPage:z}}exports.ChatVirtualList=Z;exports.VirtualList=ee;exports.useChatVirtualizer=B;exports.usePagination=te;
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import * as
|
|
3
|
-
import { useCallback as
|
|
1
|
+
import { jsx as M, jsxs as q } from "react/jsx-runtime";
|
|
2
|
+
import * as _ from "react";
|
|
3
|
+
import { useCallback as C, useRef as I, useState as L, useEffect as V, useLayoutEffect as j, forwardRef as $, useImperativeHandle as G } from "react";
|
|
4
4
|
class J {
|
|
5
5
|
constructor(e, t) {
|
|
6
6
|
this.defaultSize = t, this.sizes = e > 0 ? Array(e).fill(t) : [], this.offsets = e > 0 ? Array(e).fill(0) : [], e > 0 && this._recalcFrom(0);
|
|
@@ -70,244 +70,241 @@ class Q {
|
|
|
70
70
|
/** Re-applies all cached sizes to the OffsetMap using a key→index map */
|
|
71
71
|
applyToOffsetMap(e, t) {
|
|
72
72
|
for (const [n, s] of this.cache) {
|
|
73
|
-
const
|
|
74
|
-
|
|
73
|
+
const i = t.get(n);
|
|
74
|
+
i !== void 0 && e.setSize(i, s);
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
77
|
}
|
|
78
|
-
function
|
|
79
|
-
if (
|
|
80
|
-
let t = 0, n =
|
|
78
|
+
function U(l, e) {
|
|
79
|
+
if (l.length === 0) return 0;
|
|
80
|
+
let t = 0, n = l.length - 1;
|
|
81
81
|
for (; t < n; ) {
|
|
82
82
|
const s = t + n >> 1;
|
|
83
|
-
(
|
|
83
|
+
(l[s] ?? 0) < e ? t = s + 1 : n = s;
|
|
84
84
|
}
|
|
85
|
-
return Math.max(0, t > 0 && (
|
|
85
|
+
return Math.max(0, t > 0 && (l[t] ?? 0) > e ? t - 1 : t);
|
|
86
86
|
}
|
|
87
|
-
function
|
|
88
|
-
if (
|
|
89
|
-
for (let n =
|
|
90
|
-
if ((
|
|
87
|
+
function W(l, e, t) {
|
|
88
|
+
if (l.length === 0) return 0;
|
|
89
|
+
for (let n = l.length - 1; n >= 0; n--)
|
|
90
|
+
if ((l[n] ?? 0) < t) return n;
|
|
91
91
|
return 0;
|
|
92
92
|
}
|
|
93
|
-
function
|
|
94
|
-
const { firstVisible: e, lastVisible: t, itemCount: n, overscan: s } =
|
|
93
|
+
function X(l) {
|
|
94
|
+
const { firstVisible: e, lastVisible: t, itemCount: n, overscan: s } = l;
|
|
95
95
|
return n === 0 ? { start: 0, end: -1 } : {
|
|
96
96
|
start: Math.max(0, e - s),
|
|
97
97
|
end: Math.min(n - 1, t + s)
|
|
98
98
|
};
|
|
99
99
|
}
|
|
100
|
-
function
|
|
101
|
-
return
|
|
100
|
+
function Z(l, e) {
|
|
101
|
+
return C(
|
|
102
102
|
(t, n) => {
|
|
103
|
-
const s =
|
|
104
|
-
if (!s || !
|
|
105
|
-
const
|
|
103
|
+
const s = l.current, i = e.current;
|
|
104
|
+
if (!s || !i) return;
|
|
105
|
+
const o = i.getOffset(t), m = i.getSize(t), p = (n == null ? void 0 : n.align) ?? "start", v = (n == null ? void 0 : n.behavior) ?? "auto", S = (n == null ? void 0 : n.offset) ?? 0;
|
|
106
106
|
let x;
|
|
107
|
-
p === "start" ? x =
|
|
107
|
+
p === "start" ? x = o + S : p === "center" ? x = o - s.clientHeight / 2 + m / 2 + S : x = o - s.clientHeight + m + S, s.scrollTo({ top: Math.max(0, x), behavior: v });
|
|
108
108
|
},
|
|
109
|
-
[
|
|
109
|
+
[l, e]
|
|
110
110
|
);
|
|
111
111
|
}
|
|
112
|
-
function
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
112
|
+
function D(l) {
|
|
113
|
+
const { items: e, getKey: t, estimatedItemSize: n, overscan: s, initialAlignment: i } = l, o = I(null), m = I(null), p = I(new Q()), v = I([]), S = I(!1), x = I(0), R = I(0), P = I(null), [, u] = L(0), b = C(() => u((r) => r + 1), []);
|
|
114
|
+
m.current || (m.current = new J(e.length, n));
|
|
115
|
+
const E = I(e.length);
|
|
116
|
+
if (e.length !== E.current || e.some((r, c) => {
|
|
117
|
+
const T = t(r, c);
|
|
118
|
+
return v.current[c] !== T;
|
|
119
|
+
})) {
|
|
120
|
+
const r = m.current, c = e.map((k, N) => t(k, N)), T = v.current, K = T.length, w = c.length;
|
|
121
|
+
w === 0 ? r.resize(0) : K === 0 ? r.resize(w) : w > K ? T.length > 0 && c[w - K] === T[0] ? r.prepend(w - K) : r.resize(w) : w < K && r.resize(w);
|
|
122
|
+
const g = /* @__PURE__ */ new Map();
|
|
123
|
+
c.forEach((k, N) => g.set(k, N)), p.current.applyToOffsetMap(r, g), v.current = c, E.current = e.length;
|
|
122
124
|
}
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
const a = r.getOffsets(), f = r.getSizes(), R = W(a, i), A = X(a, f, i + g);
|
|
131
|
-
return ee({
|
|
132
|
-
firstVisible: R,
|
|
133
|
-
lastVisible: A,
|
|
134
|
-
itemCount: r.count,
|
|
135
|
-
overscan: x.current
|
|
136
|
-
});
|
|
137
|
-
}, []), [I, u] = q(re, {
|
|
138
|
-
renderRange: { start: 0, end: Math.min(e.length - 1, s * 2) },
|
|
139
|
-
scrollTop: 0,
|
|
140
|
-
containerHeight: 0,
|
|
141
|
-
totalSize: h.current.totalSize()
|
|
142
|
-
});
|
|
143
|
-
K(() => {
|
|
144
|
-
const i = h.current, g = e.map((B, _) => t(B, _)), r = v.current, a = r.length, f = g.length;
|
|
145
|
-
f === 0 ? i.resize(0) : a === 0 ? i.resize(f) : f > a ? r.length > 0 && g[f - a] === r[0] ? i.prepend(f - a) : i.resize(f) : f < a && i.resize(f);
|
|
146
|
-
const R = /* @__PURE__ */ new Map();
|
|
147
|
-
g.forEach((B, _) => R.set(B, _)), p.current.applyToOffsetMap(i, R), v.current = g;
|
|
148
|
-
const A = c.current, N = (A == null ? void 0 : A.scrollTop) ?? 0, V = (A == null ? void 0 : A.clientHeight) ?? 0, F = z(N, V);
|
|
149
|
-
u({ type: "ITEMS_CHANGED", renderRange: F, totalSize: i.totalSize() });
|
|
150
|
-
}, [e, t, z]), K(() => {
|
|
151
|
-
const i = c.current;
|
|
152
|
-
if (!i) return;
|
|
153
|
-
const g = () => {
|
|
154
|
-
const r = h.current, a = i.scrollTop, f = i.clientHeight, R = z(a, f);
|
|
155
|
-
u({ type: "SCROLL", scrollTop: a, totalSize: r.totalSize(), renderRange: R });
|
|
125
|
+
V(() => {
|
|
126
|
+
const r = o.current;
|
|
127
|
+
if (!r) return;
|
|
128
|
+
const c = () => {
|
|
129
|
+
P.current === null && (P.current = requestAnimationFrame(() => {
|
|
130
|
+
P.current = null, x.current = r.scrollTop, R.current = r.clientHeight, b();
|
|
131
|
+
}));
|
|
156
132
|
};
|
|
157
|
-
return
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
const
|
|
162
|
-
if (!r) return;
|
|
163
|
-
const a = r.contentRect.height, f = h.current, R = i.scrollTop, A = z(R, a);
|
|
164
|
-
u({ type: "RESIZE_CONTAINER", height: a, totalSize: f.totalSize(), renderRange: A });
|
|
165
|
-
});
|
|
166
|
-
return g.observe(i), () => g.disconnect();
|
|
167
|
-
}, [z]), K(() => {
|
|
168
|
-
if (y.current || e.length === 0) return;
|
|
169
|
-
const i = c.current;
|
|
170
|
-
i && (l === "bottom" && (i.scrollTop = i.scrollHeight), y.current = !0);
|
|
171
|
-
}, [l, e.length]);
|
|
172
|
-
const M = O((i, g) => {
|
|
173
|
-
const r = h.current;
|
|
133
|
+
return r.addEventListener("scroll", c, { passive: !0 }), () => {
|
|
134
|
+
r.removeEventListener("scroll", c), P.current !== null && (cancelAnimationFrame(P.current), P.current = null);
|
|
135
|
+
};
|
|
136
|
+
}, [b]), V(() => {
|
|
137
|
+
const r = o.current;
|
|
174
138
|
if (!r) return;
|
|
175
|
-
|
|
176
|
-
const
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
139
|
+
R.current = r.clientHeight, x.current = r.scrollTop;
|
|
140
|
+
const c = new ResizeObserver(([T]) => {
|
|
141
|
+
T && (R.current = T.contentRect.height, b());
|
|
142
|
+
});
|
|
143
|
+
return c.observe(r), () => c.disconnect();
|
|
144
|
+
}, [b]), j(() => {
|
|
145
|
+
if (S.current || e.length === 0) return;
|
|
146
|
+
const r = o.current;
|
|
147
|
+
r && (i === "bottom" && (r.scrollTop = r.scrollHeight, x.current = r.scrollTop), S.current = !0);
|
|
148
|
+
}, [i, e.length]), V(() => {
|
|
149
|
+
e.length === 0 && (S.current = !1);
|
|
150
|
+
}, [e.length]);
|
|
151
|
+
const A = C((r, c) => {
|
|
152
|
+
const T = m.current;
|
|
153
|
+
if (!T || p.current.get(r) === c) return;
|
|
154
|
+
p.current.set(r, c);
|
|
155
|
+
const w = v.current.indexOf(r);
|
|
156
|
+
if (w === -1) return;
|
|
157
|
+
T.setSize(w, c) && b();
|
|
158
|
+
}, [b]), O = C(
|
|
159
|
+
(r, c = "auto") => {
|
|
160
|
+
var T;
|
|
161
|
+
(T = o.current) == null || T.scrollTo({ top: r, behavior: c });
|
|
183
162
|
},
|
|
184
163
|
[]
|
|
185
|
-
),
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
164
|
+
), H = Z(o, m), y = m.current, h = y ? y.totalSize() : 0, d = o.current, F = (d == null ? void 0 : d.scrollTop) ?? x.current, B = (d == null ? void 0 : d.clientHeight) ?? R.current;
|
|
165
|
+
let a = [];
|
|
166
|
+
if (y && y.count > 0 && B > 0) {
|
|
167
|
+
const r = y.getOffsets(), c = y.getSizes(), T = U(r, F), K = W(r, c, F + B), w = X({
|
|
168
|
+
firstVisible: T,
|
|
169
|
+
lastVisible: K,
|
|
170
|
+
itemCount: y.count,
|
|
171
|
+
overscan: s
|
|
172
|
+
});
|
|
173
|
+
for (let g = w.start; g <= w.end && g < e.length; g++)
|
|
174
|
+
a.push({
|
|
175
|
+
key: v.current[g] ?? t(e[g], g),
|
|
176
|
+
index: g,
|
|
177
|
+
start: y.getOffset(g),
|
|
178
|
+
size: y.getSize(g),
|
|
179
|
+
data: e[g]
|
|
194
180
|
});
|
|
195
|
-
|
|
181
|
+
} else if (y && y.count > 0) {
|
|
182
|
+
const r = Math.min(e.length - 1, s * 2);
|
|
183
|
+
for (let c = 0; c <= r; c++)
|
|
184
|
+
a.push({
|
|
185
|
+
key: v.current[c] ?? t(e[c], c),
|
|
186
|
+
index: c,
|
|
187
|
+
start: y.getOffset(c),
|
|
188
|
+
size: y.getSize(c),
|
|
189
|
+
data: e[c]
|
|
190
|
+
});
|
|
191
|
+
}
|
|
192
|
+
const f = d ? d.scrollHeight - d.scrollTop - d.clientHeight : 1 / 0;
|
|
196
193
|
return {
|
|
197
|
-
scrollerRef:
|
|
198
|
-
virtualItems:
|
|
199
|
-
totalSize:
|
|
200
|
-
measureItem:
|
|
201
|
-
scrollToIndex:
|
|
202
|
-
scrollToOffset:
|
|
203
|
-
isAtTop:
|
|
204
|
-
isAtBottom:
|
|
205
|
-
scrollTop:
|
|
194
|
+
scrollerRef: o,
|
|
195
|
+
virtualItems: a,
|
|
196
|
+
totalSize: h,
|
|
197
|
+
measureItem: A,
|
|
198
|
+
scrollToIndex: H,
|
|
199
|
+
scrollToOffset: O,
|
|
200
|
+
isAtTop: F <= 0,
|
|
201
|
+
isAtBottom: f <= 0,
|
|
202
|
+
scrollTop: F
|
|
206
203
|
};
|
|
207
204
|
}
|
|
208
|
-
function
|
|
209
|
-
const t =
|
|
210
|
-
const
|
|
211
|
-
|
|
212
|
-
}, [
|
|
205
|
+
function ee(l, e) {
|
|
206
|
+
const t = I(0), n = I(0), s = I(!1), i = C(() => {
|
|
207
|
+
const o = l.current;
|
|
208
|
+
o && (t.current = o.scrollTop, n.current = o.scrollHeight, s.current = !0);
|
|
209
|
+
}, [l]);
|
|
213
210
|
return j(() => {
|
|
214
211
|
if (!s.current) return;
|
|
215
|
-
const
|
|
216
|
-
if (!
|
|
217
|
-
const
|
|
218
|
-
|
|
219
|
-
}, [e,
|
|
212
|
+
const o = l.current;
|
|
213
|
+
if (!o) return;
|
|
214
|
+
const m = o.scrollHeight - n.current;
|
|
215
|
+
m > 0 && (o.scrollTop = t.current + m), s.current = !1;
|
|
216
|
+
}, [e, l]), { prepareAnchor: i };
|
|
220
217
|
}
|
|
221
|
-
function
|
|
222
|
-
const [t, n] = L(!0), s =
|
|
223
|
-
return
|
|
224
|
-
const
|
|
225
|
-
if (!
|
|
226
|
-
const
|
|
227
|
-
const p =
|
|
218
|
+
function te(l, e) {
|
|
219
|
+
const [t, n] = L(!0), s = I(null);
|
|
220
|
+
return V(() => {
|
|
221
|
+
const i = l.current;
|
|
222
|
+
if (!i) return;
|
|
223
|
+
const o = () => {
|
|
224
|
+
const p = i.scrollHeight - i.scrollTop - i.clientHeight;
|
|
228
225
|
n(p <= e);
|
|
229
|
-
},
|
|
230
|
-
s.current !== null && cancelAnimationFrame(s.current), s.current = requestAnimationFrame(
|
|
226
|
+
}, m = () => {
|
|
227
|
+
s.current !== null && cancelAnimationFrame(s.current), s.current = requestAnimationFrame(o);
|
|
231
228
|
};
|
|
232
|
-
return
|
|
233
|
-
|
|
229
|
+
return i.addEventListener("scroll", m, { passive: !0 }), o(), () => {
|
|
230
|
+
i.removeEventListener("scroll", m), s.current !== null && cancelAnimationFrame(s.current);
|
|
234
231
|
};
|
|
235
|
-
}, [
|
|
232
|
+
}, [l, e]), t;
|
|
236
233
|
}
|
|
237
|
-
function
|
|
238
|
-
const { itemCount: e, isAtBottom: t, scrollToIndex: n, mode: s } =
|
|
234
|
+
function re(l) {
|
|
235
|
+
const { itemCount: e, isAtBottom: t, scrollToIndex: n, mode: s } = l, i = I(e);
|
|
239
236
|
j(() => {
|
|
240
|
-
s && (e >
|
|
237
|
+
s && (e > i.current && t && e > 0 && n(e - 1, {
|
|
241
238
|
align: "end",
|
|
242
239
|
behavior: s === "smooth" ? "smooth" : "auto"
|
|
243
|
-
}),
|
|
240
|
+
}), i.current = e);
|
|
244
241
|
}, [e, t, n, s]);
|
|
245
242
|
}
|
|
246
|
-
function
|
|
243
|
+
function ne(l) {
|
|
247
244
|
const {
|
|
248
245
|
items: e,
|
|
249
246
|
getKey: t,
|
|
250
247
|
estimatedItemSize: n = 80,
|
|
251
|
-
overscan: s =
|
|
252
|
-
atBottomThreshold:
|
|
253
|
-
followOutput:
|
|
254
|
-
initialAlignment:
|
|
248
|
+
overscan: s = 20,
|
|
249
|
+
atBottomThreshold: i = 200,
|
|
250
|
+
followOutput: o = "auto",
|
|
251
|
+
initialAlignment: m = "bottom",
|
|
255
252
|
onStartReached: p,
|
|
256
253
|
onEndReached: v,
|
|
257
|
-
startReachedThreshold:
|
|
254
|
+
startReachedThreshold: S = 300,
|
|
258
255
|
endReachedThreshold: x = 300,
|
|
259
|
-
scrollToMessageKey:
|
|
260
|
-
onScrollToMessageComplete:
|
|
261
|
-
} =
|
|
256
|
+
scrollToMessageKey: R,
|
|
257
|
+
onScrollToMessageComplete: P
|
|
258
|
+
} = l, u = D({
|
|
262
259
|
items: e,
|
|
263
260
|
getKey: t,
|
|
264
261
|
estimatedItemSize: n,
|
|
265
262
|
overscan: s,
|
|
266
|
-
initialAlignment:
|
|
267
|
-
}),
|
|
268
|
-
|
|
263
|
+
initialAlignment: m
|
|
264
|
+
}), b = te(u.scrollerRef, i), { prepareAnchor: E } = ee(u.scrollerRef, e.length);
|
|
265
|
+
re({
|
|
269
266
|
itemCount: e.length,
|
|
270
|
-
isAtBottom:
|
|
267
|
+
isAtBottom: b,
|
|
271
268
|
scrollToIndex: u.scrollToIndex,
|
|
272
|
-
mode:
|
|
269
|
+
mode: o ?? !1
|
|
273
270
|
});
|
|
274
|
-
const
|
|
275
|
-
|
|
276
|
-
const
|
|
277
|
-
if (!
|
|
278
|
-
const
|
|
279
|
-
|
|
280
|
-
|
|
271
|
+
const z = I(!1);
|
|
272
|
+
V(() => {
|
|
273
|
+
const h = u.scrollerRef.current;
|
|
274
|
+
if (!h || !p) return;
|
|
275
|
+
const d = () => {
|
|
276
|
+
h.scrollTop <= S && !z.current && (z.current = !0, Promise.resolve(p()).finally(() => {
|
|
277
|
+
z.current = !1;
|
|
281
278
|
}));
|
|
282
279
|
};
|
|
283
|
-
return
|
|
284
|
-
}, [u.scrollerRef, p,
|
|
285
|
-
const
|
|
286
|
-
|
|
287
|
-
const
|
|
288
|
-
if (!
|
|
289
|
-
const
|
|
290
|
-
|
|
291
|
-
|
|
280
|
+
return h.addEventListener("scroll", d, { passive: !0 }), () => h.removeEventListener("scroll", d);
|
|
281
|
+
}, [u.scrollerRef, p, S]);
|
|
282
|
+
const A = I(!1);
|
|
283
|
+
V(() => {
|
|
284
|
+
const h = u.scrollerRef.current;
|
|
285
|
+
if (!h || !v) return;
|
|
286
|
+
const d = () => {
|
|
287
|
+
h.scrollHeight - h.scrollTop - h.clientHeight <= x && !A.current && (A.current = !0, Promise.resolve(v()).finally(() => {
|
|
288
|
+
A.current = !1;
|
|
292
289
|
}));
|
|
293
290
|
};
|
|
294
|
-
return
|
|
291
|
+
return h.addEventListener("scroll", d, { passive: !0 }), () => h.removeEventListener("scroll", d);
|
|
295
292
|
}, [u.scrollerRef, v, x]);
|
|
296
|
-
const
|
|
297
|
-
|
|
298
|
-
if (!
|
|
299
|
-
const
|
|
300
|
-
|
|
301
|
-
}, [
|
|
302
|
-
const
|
|
303
|
-
(
|
|
304
|
-
e.length !== 0 && u.scrollToIndex(e.length - 1, { align: "end", behavior:
|
|
293
|
+
const O = I(null);
|
|
294
|
+
V(() => {
|
|
295
|
+
if (!R || O.current === R) return;
|
|
296
|
+
const h = e.findIndex((d, F) => t(d, F) === R);
|
|
297
|
+
h !== -1 && (O.current = R, u.scrollToIndex(h, { align: "center", behavior: "smooth" }), P == null || P());
|
|
298
|
+
}, [R, e, t, u, P]);
|
|
299
|
+
const H = C(
|
|
300
|
+
(h = "auto") => {
|
|
301
|
+
e.length !== 0 && u.scrollToIndex(e.length - 1, { align: "end", behavior: h });
|
|
305
302
|
},
|
|
306
303
|
[e.length, u]
|
|
307
|
-
),
|
|
308
|
-
(
|
|
309
|
-
const
|
|
310
|
-
|
|
304
|
+
), y = C(
|
|
305
|
+
(h, d) => {
|
|
306
|
+
const F = e.findIndex((B, a) => t(B, a) === h);
|
|
307
|
+
F !== -1 && u.scrollToIndex(F, d);
|
|
311
308
|
},
|
|
312
309
|
[e, t, u]
|
|
313
310
|
);
|
|
@@ -317,43 +314,26 @@ function oe(o) {
|
|
|
317
314
|
totalSize: u.totalSize,
|
|
318
315
|
measureItem: u.measureItem,
|
|
319
316
|
scrollToIndex: u.scrollToIndex,
|
|
320
|
-
scrollToBottom:
|
|
321
|
-
scrollToKey:
|
|
322
|
-
isAtBottom:
|
|
323
|
-
prepareAnchor:
|
|
317
|
+
scrollToBottom: H,
|
|
318
|
+
scrollToKey: y,
|
|
319
|
+
isAtBottom: b,
|
|
320
|
+
prepareAnchor: E
|
|
324
321
|
};
|
|
325
322
|
}
|
|
326
|
-
function
|
|
327
|
-
|
|
328
|
-
totalSize: e,
|
|
329
|
-
children: t,
|
|
330
|
-
className: n,
|
|
331
|
-
style: s
|
|
332
|
-
}) {
|
|
333
|
-
return /* @__PURE__ */ b(
|
|
334
|
-
"div",
|
|
335
|
-
{
|
|
336
|
-
ref: o,
|
|
337
|
-
className: n,
|
|
338
|
-
style: { overflow: "auto", height: "100%", position: "relative", ...s },
|
|
339
|
-
children: /* @__PURE__ */ b("div", { style: { height: e, position: "relative", width: "100%" }, children: t })
|
|
340
|
-
}
|
|
341
|
-
);
|
|
342
|
-
}
|
|
343
|
-
function Z({
|
|
344
|
-
virtualItem: o,
|
|
323
|
+
function Y({
|
|
324
|
+
virtualItem: l,
|
|
345
325
|
measureItem: e,
|
|
346
326
|
children: t
|
|
347
327
|
}) {
|
|
348
|
-
const n =
|
|
349
|
-
return
|
|
328
|
+
const n = I(null);
|
|
329
|
+
return V(() => {
|
|
350
330
|
const s = n.current;
|
|
351
331
|
if (!s) return;
|
|
352
|
-
const
|
|
353
|
-
|
|
332
|
+
const i = new ResizeObserver(([o]) => {
|
|
333
|
+
o && e(l.key, o.contentRect.height);
|
|
354
334
|
});
|
|
355
|
-
return
|
|
356
|
-
}, [
|
|
335
|
+
return i.observe(s), () => i.disconnect();
|
|
336
|
+
}, [l.key, e]), /* @__PURE__ */ M(
|
|
357
337
|
"div",
|
|
358
338
|
{
|
|
359
339
|
ref: n,
|
|
@@ -361,235 +341,243 @@ function Z({
|
|
|
361
341
|
position: "absolute",
|
|
362
342
|
top: 0,
|
|
363
343
|
// transform instead of top: avoids reflow, uses GPU compositor layer
|
|
364
|
-
transform: `translateY(${
|
|
344
|
+
transform: `translateY(${l.start}px)`,
|
|
365
345
|
width: "100%",
|
|
366
346
|
// Reserve estimated height to prevent layout collapse before first measure
|
|
367
|
-
minHeight:
|
|
347
|
+
minHeight: l.size
|
|
368
348
|
},
|
|
369
349
|
children: t
|
|
370
350
|
}
|
|
371
351
|
);
|
|
372
352
|
}
|
|
373
|
-
function
|
|
353
|
+
function se(l, e) {
|
|
374
354
|
const {
|
|
375
355
|
data: t,
|
|
376
356
|
itemContent: n,
|
|
377
357
|
computeItemKey: s,
|
|
378
|
-
estimatedItemSize:
|
|
379
|
-
overscan:
|
|
380
|
-
followOutput:
|
|
358
|
+
estimatedItemSize: i = 80,
|
|
359
|
+
overscan: o = 20,
|
|
360
|
+
followOutput: m = "auto",
|
|
381
361
|
atBottomThreshold: p = 200,
|
|
382
362
|
initialAlignment: v = "bottom",
|
|
383
|
-
onStartReached:
|
|
363
|
+
onStartReached: S,
|
|
384
364
|
onEndReached: x,
|
|
385
|
-
startReachedThreshold:
|
|
386
|
-
endReachedThreshold:
|
|
365
|
+
startReachedThreshold: R = 300,
|
|
366
|
+
endReachedThreshold: P = 300,
|
|
387
367
|
scrollToMessageKey: u,
|
|
388
|
-
onScrollToMessageComplete:
|
|
389
|
-
onAtBottomChange:
|
|
390
|
-
components:
|
|
391
|
-
className:
|
|
392
|
-
style:
|
|
393
|
-
} =
|
|
394
|
-
scrollerRef:
|
|
395
|
-
virtualItems:
|
|
396
|
-
totalSize:
|
|
397
|
-
measureItem:
|
|
398
|
-
scrollToIndex:
|
|
399
|
-
scrollToBottom:
|
|
400
|
-
scrollToKey:
|
|
401
|
-
isAtBottom:
|
|
402
|
-
prepareAnchor:
|
|
403
|
-
} =
|
|
368
|
+
onScrollToMessageComplete: b,
|
|
369
|
+
onAtBottomChange: E,
|
|
370
|
+
components: z = {},
|
|
371
|
+
className: A,
|
|
372
|
+
style: O
|
|
373
|
+
} = l, {
|
|
374
|
+
scrollerRef: H,
|
|
375
|
+
virtualItems: y,
|
|
376
|
+
totalSize: h,
|
|
377
|
+
measureItem: d,
|
|
378
|
+
scrollToIndex: F,
|
|
379
|
+
scrollToBottom: B,
|
|
380
|
+
scrollToKey: a,
|
|
381
|
+
isAtBottom: f,
|
|
382
|
+
prepareAnchor: r
|
|
383
|
+
} = ne({
|
|
404
384
|
items: t,
|
|
405
|
-
getKey: (
|
|
406
|
-
estimatedItemSize:
|
|
407
|
-
overscan:
|
|
385
|
+
getKey: (g, k) => s(k, g),
|
|
386
|
+
estimatedItemSize: i,
|
|
387
|
+
overscan: o,
|
|
408
388
|
atBottomThreshold: p,
|
|
409
|
-
followOutput:
|
|
389
|
+
followOutput: m,
|
|
410
390
|
initialAlignment: v,
|
|
411
|
-
onStartReached:
|
|
391
|
+
onStartReached: S,
|
|
412
392
|
onEndReached: x,
|
|
413
|
-
startReachedThreshold:
|
|
414
|
-
endReachedThreshold:
|
|
393
|
+
startReachedThreshold: R,
|
|
394
|
+
endReachedThreshold: P,
|
|
415
395
|
scrollToMessageKey: u,
|
|
416
|
-
onScrollToMessageComplete:
|
|
417
|
-
}),
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
}, [
|
|
396
|
+
onScrollToMessageComplete: b
|
|
397
|
+
}), c = _.useRef(f);
|
|
398
|
+
_.useEffect(() => {
|
|
399
|
+
c.current !== f && (c.current = f, E == null || E(f));
|
|
400
|
+
}, [f, E]), G(
|
|
421
401
|
e,
|
|
422
402
|
() => ({
|
|
423
|
-
scrollToBottom:
|
|
424
|
-
scrollToIndex:
|
|
425
|
-
scrollToKey:
|
|
403
|
+
scrollToBottom: B,
|
|
404
|
+
scrollToIndex: F,
|
|
405
|
+
scrollToKey: a,
|
|
426
406
|
getScrollTop: () => {
|
|
427
|
-
var
|
|
428
|
-
return ((
|
|
407
|
+
var g;
|
|
408
|
+
return ((g = H.current) == null ? void 0 : g.scrollTop) ?? 0;
|
|
429
409
|
},
|
|
430
|
-
isAtBottom: () =>
|
|
431
|
-
prepareAnchor:
|
|
410
|
+
isAtBottom: () => f,
|
|
411
|
+
prepareAnchor: r
|
|
432
412
|
}),
|
|
433
|
-
[
|
|
413
|
+
[B, F, a, H, f, r]
|
|
434
414
|
);
|
|
435
|
-
const { Header:
|
|
436
|
-
return t.length === 0 &&
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
415
|
+
const { Header: T, Footer: K, EmptyPlaceholder: w } = z;
|
|
416
|
+
return t.length === 0 && w ? /* @__PURE__ */ M(w, {}) : /* @__PURE__ */ q(
|
|
417
|
+
"div",
|
|
418
|
+
{
|
|
419
|
+
ref: H,
|
|
420
|
+
className: A,
|
|
421
|
+
style: {
|
|
422
|
+
overflow: "auto",
|
|
423
|
+
height: "100%",
|
|
424
|
+
position: "relative",
|
|
425
|
+
...O
|
|
426
|
+
},
|
|
427
|
+
children: [
|
|
428
|
+
T && /* @__PURE__ */ M(T, {}),
|
|
429
|
+
/* @__PURE__ */ M("div", { style: { height: h, position: "relative", width: "100%" }, children: y.map((g) => /* @__PURE__ */ M(
|
|
430
|
+
Y,
|
|
447
431
|
{
|
|
448
|
-
virtualItem:
|
|
449
|
-
measureItem:
|
|
450
|
-
children: n(
|
|
432
|
+
virtualItem: g,
|
|
433
|
+
measureItem: d,
|
|
434
|
+
children: n(g.index, g.data)
|
|
451
435
|
},
|
|
452
|
-
|
|
453
|
-
))
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
436
|
+
g.key
|
|
437
|
+
)) }),
|
|
438
|
+
K && /* @__PURE__ */ M(K, {})
|
|
439
|
+
]
|
|
440
|
+
}
|
|
441
|
+
);
|
|
458
442
|
}
|
|
459
|
-
const
|
|
460
|
-
function
|
|
461
|
-
data:
|
|
443
|
+
const ce = $(se);
|
|
444
|
+
function le({
|
|
445
|
+
data: l,
|
|
462
446
|
itemContent: e,
|
|
463
447
|
computeItemKey: t,
|
|
464
|
-
estimatedItemSize: n =
|
|
465
|
-
overscan: s =
|
|
466
|
-
onEndReached:
|
|
467
|
-
endReachedThreshold:
|
|
468
|
-
components:
|
|
448
|
+
estimatedItemSize: n = 60,
|
|
449
|
+
overscan: s = 20,
|
|
450
|
+
onEndReached: i,
|
|
451
|
+
endReachedThreshold: o = 300,
|
|
452
|
+
components: m = {},
|
|
469
453
|
className: p,
|
|
470
454
|
style: v
|
|
471
455
|
}) {
|
|
472
|
-
const { scrollerRef:
|
|
473
|
-
items:
|
|
474
|
-
getKey: (
|
|
456
|
+
const { scrollerRef: S, virtualItems: x, totalSize: R, measureItem: P } = D({
|
|
457
|
+
items: l,
|
|
458
|
+
getKey: (z, A) => t(A, z),
|
|
475
459
|
estimatedItemSize: n,
|
|
476
460
|
overscan: s,
|
|
477
461
|
initialAlignment: "top"
|
|
478
462
|
});
|
|
479
|
-
|
|
480
|
-
const
|
|
481
|
-
if (!
|
|
482
|
-
let
|
|
483
|
-
const
|
|
484
|
-
|
|
485
|
-
|
|
463
|
+
_.useEffect(() => {
|
|
464
|
+
const z = S.current;
|
|
465
|
+
if (!z || !i) return;
|
|
466
|
+
let A = !1;
|
|
467
|
+
const O = () => {
|
|
468
|
+
z.scrollHeight - z.scrollTop - z.clientHeight <= o && !A && (A = !0, Promise.resolve(i()).finally(() => {
|
|
469
|
+
A = !1;
|
|
486
470
|
}));
|
|
487
471
|
};
|
|
488
|
-
return
|
|
489
|
-
}, [
|
|
490
|
-
const { Header: u, Footer:
|
|
491
|
-
return
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
472
|
+
return z.addEventListener("scroll", O, { passive: !0 }), () => z.removeEventListener("scroll", O);
|
|
473
|
+
}, [S, i, o]);
|
|
474
|
+
const { Header: u, Footer: b, EmptyPlaceholder: E } = m;
|
|
475
|
+
return l.length === 0 && E ? /* @__PURE__ */ M(E, {}) : /* @__PURE__ */ q(
|
|
476
|
+
"div",
|
|
477
|
+
{
|
|
478
|
+
ref: S,
|
|
479
|
+
className: p,
|
|
480
|
+
style: {
|
|
481
|
+
overflow: "auto",
|
|
482
|
+
height: "100%",
|
|
483
|
+
position: "relative",
|
|
484
|
+
...v
|
|
485
|
+
},
|
|
486
|
+
children: [
|
|
487
|
+
u && /* @__PURE__ */ M(u, {}),
|
|
488
|
+
/* @__PURE__ */ M("div", { style: { height: R, position: "relative", width: "100%" }, children: x.map((z) => /* @__PURE__ */ M(
|
|
489
|
+
Y,
|
|
502
490
|
{
|
|
503
|
-
virtualItem:
|
|
504
|
-
measureItem:
|
|
505
|
-
children: e(
|
|
491
|
+
virtualItem: z,
|
|
492
|
+
measureItem: P,
|
|
493
|
+
children: e(z.index, z.data)
|
|
506
494
|
},
|
|
507
|
-
|
|
508
|
-
))
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
495
|
+
z.key
|
|
496
|
+
)) }),
|
|
497
|
+
b && /* @__PURE__ */ M(b, {})
|
|
498
|
+
]
|
|
499
|
+
}
|
|
500
|
+
);
|
|
513
501
|
}
|
|
514
|
-
function
|
|
502
|
+
function ae(l) {
|
|
515
503
|
const {
|
|
516
504
|
fetcher: e,
|
|
517
505
|
initialPage: t = 1,
|
|
518
506
|
direction: n = "append",
|
|
519
507
|
getKey: s,
|
|
520
|
-
onPageLoaded:
|
|
521
|
-
onError:
|
|
522
|
-
} =
|
|
523
|
-
(
|
|
524
|
-
const
|
|
525
|
-
return
|
|
526
|
-
}) :
|
|
508
|
+
onPageLoaded: i,
|
|
509
|
+
onError: o
|
|
510
|
+
} = l, [m, p] = L([]), [v, S] = L(t), [x, R] = L(!0), [P, u] = L(!1), [b, E] = L(!1), [z, A] = L(!1), O = I(/* @__PURE__ */ new Set()), H = I(!1), y = C(
|
|
511
|
+
(a) => s ? a.filter((f) => {
|
|
512
|
+
const r = s(f);
|
|
513
|
+
return O.current.has(r) ? !1 : (O.current.add(r), !0);
|
|
514
|
+
}) : a,
|
|
527
515
|
[s]
|
|
528
|
-
),
|
|
529
|
-
if (!(
|
|
530
|
-
|
|
516
|
+
), h = C(async () => {
|
|
517
|
+
if (!(H.current || !x)) {
|
|
518
|
+
H.current = !0, A(!0);
|
|
531
519
|
try {
|
|
532
|
-
const
|
|
520
|
+
const a = v + 1, f = await e(a), r = y(f.data);
|
|
533
521
|
p(
|
|
534
|
-
(
|
|
535
|
-
),
|
|
536
|
-
} catch (
|
|
537
|
-
|
|
522
|
+
(c) => n === "prepend" ? [...r, ...c] : [...c, ...r]
|
|
523
|
+
), S(a), R(f.hasNextPage), u(f.hasPrevPage), i == null || i(a, r);
|
|
524
|
+
} catch (a) {
|
|
525
|
+
o == null || o(a instanceof Error ? a : new Error(String(a)));
|
|
538
526
|
} finally {
|
|
539
|
-
|
|
527
|
+
A(!1), H.current = !1;
|
|
540
528
|
}
|
|
541
529
|
}
|
|
542
|
-
}, [v, x, e,
|
|
543
|
-
if (!(
|
|
544
|
-
|
|
530
|
+
}, [v, x, e, y, n, i, o]), d = C(async () => {
|
|
531
|
+
if (!(H.current || !P)) {
|
|
532
|
+
H.current = !0, A(!0);
|
|
545
533
|
try {
|
|
546
|
-
const
|
|
547
|
-
p((
|
|
548
|
-
} catch (
|
|
549
|
-
|
|
534
|
+
const a = v - 1, f = await e(a), r = y(f.data);
|
|
535
|
+
p((c) => [...r, ...c]), S(a), u(f.hasPrevPage), R(f.hasNextPage), i == null || i(a, r);
|
|
536
|
+
} catch (a) {
|
|
537
|
+
o == null || o(a instanceof Error ? a : new Error(String(a)));
|
|
550
538
|
} finally {
|
|
551
|
-
|
|
539
|
+
A(!1), H.current = !1;
|
|
552
540
|
}
|
|
553
541
|
}
|
|
554
|
-
}, [v,
|
|
555
|
-
if (!
|
|
556
|
-
|
|
542
|
+
}, [v, P, e, y, i, o]), F = C(async () => {
|
|
543
|
+
if (!H.current) {
|
|
544
|
+
H.current = !0, E(!0);
|
|
557
545
|
try {
|
|
558
|
-
const
|
|
546
|
+
const a = await e(t), f = a.data;
|
|
559
547
|
if (s) {
|
|
560
|
-
const
|
|
561
|
-
|
|
562
|
-
const
|
|
563
|
-
return n === "prepend" ? [...
|
|
548
|
+
const r = new Set(f.map(s));
|
|
549
|
+
f.forEach((c) => O.current.add(s(c))), p((c) => {
|
|
550
|
+
const T = c.filter((K) => !r.has(s(K)));
|
|
551
|
+
return n === "prepend" ? [...f, ...T] : [...T, ...f];
|
|
564
552
|
});
|
|
565
553
|
} else
|
|
566
|
-
p(
|
|
567
|
-
|
|
568
|
-
} catch (
|
|
569
|
-
|
|
554
|
+
p(f);
|
|
555
|
+
S(t), R(a.hasNextPage), u(a.hasPrevPage), i == null || i(t, f);
|
|
556
|
+
} catch (a) {
|
|
557
|
+
o == null || o(a instanceof Error ? a : new Error(String(a)));
|
|
570
558
|
} finally {
|
|
571
|
-
|
|
559
|
+
E(!1), H.current = !1;
|
|
572
560
|
}
|
|
573
561
|
}
|
|
574
|
-
}, [e, t, s, n,
|
|
575
|
-
p([]),
|
|
562
|
+
}, [e, t, s, n, i, o]), B = C(() => {
|
|
563
|
+
p([]), S(t), R(!0), u(!1), E(!1), A(!1), O.current.clear(), H.current = !1;
|
|
576
564
|
}, [t]);
|
|
577
565
|
return {
|
|
578
|
-
items:
|
|
579
|
-
loadNextPage:
|
|
580
|
-
loadPrevPage:
|
|
566
|
+
items: m,
|
|
567
|
+
loadNextPage: h,
|
|
568
|
+
loadPrevPage: d,
|
|
581
569
|
hasNextPage: x,
|
|
582
|
-
hasPrevPage:
|
|
583
|
-
loading:
|
|
584
|
-
loadingMore:
|
|
585
|
-
refresh:
|
|
586
|
-
reset:
|
|
570
|
+
hasPrevPage: P,
|
|
571
|
+
loading: b,
|
|
572
|
+
loadingMore: z,
|
|
573
|
+
refresh: F,
|
|
574
|
+
reset: B,
|
|
587
575
|
currentPage: v
|
|
588
576
|
};
|
|
589
577
|
}
|
|
590
578
|
export {
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
579
|
+
ce as ChatVirtualList,
|
|
580
|
+
le as VirtualList,
|
|
581
|
+
ne as useChatVirtualizer,
|
|
582
|
+
ae as usePagination
|
|
595
583
|
};
|