monday-ui-react-core
Version:
Official monday.com UI resources for application development in React.js
3 lines (2 loc) • 4.13 kB
JavaScript
import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import i,{forwardRef as r,useState as o,useMemo as n,useRef as l,useCallback as a,useEffect as s}from"react";import{noop as c}from"lodash-es";import{VariableSizeList as u}from"react-window";import f from"react-virtualized-auto-sizer";import m from"../../hooks/usePrevious/index.js";import d from"../../hooks/useThrottledCallback.js";import v from"../../hooks/useMergeRef.js";import{getNormalizedItems as h,getMaxOffset as p,easeInOutQuint as I,getOnItemsRenderedData as S,isLayoutDirectionScrollbarVisible as g}from"../../services/virtualized-service.js";import{getTestId as T}from"../../tests/testIds.js";import{ComponentDefaultTestId as z}from"../../tests/constants.js";import O from"./VirtualizedList.module.scss.js";var b=r((function(r,b){var y=r.className,C=r.id,j=r.items,R=void 0===j?[]:j,w=r.itemRenderer,F=void 0===w?function(t,e,i){return t}:w,L=r.getItemHeight,x=void 0===L?function(t,e){return t.height}:L,V=r.getItemSize,k=void 0===V?null:V,A=r.layout,D=void 0===A?"vertical":A,E=r.onScroll,M=r.overscanCount,N=void 0===M?0:M,U=r.getItemId,_=void 0===U?function(t,e){return t.id}:U,q=r.scrollToId,H=r.scrollDuration,P=void 0===H?200:H,W=r.onScrollToFinished,B=void 0===W?c:W,Z=r.onItemsRendered,G=r.onItemsRenderedThrottleMs,J=void 0===G?200:G,K=r.onSizeUpdate,Q=void 0===K?c:K,X=r.onVerticalScrollbarVisiblityChange,Y=void 0===X?null:X,$=r.onLayoutDirectionScrollbarVisibilityChange,tt=void 0===$?null:$,et=r.virtualListRef,it=r.scrollableClassName,rt=r.role,ot=r.ariaLabel,nt=r.style,lt=r["data-testid"],at=o(0),st=t(at,2),ct=st[0],ut=st[1],ft=o(0),mt=t(ft,2),dt=mt[0],vt=mt[1],ht="horizontal"!==D,pt=n((function(){return ht?ct:dt}),[ht,ct,dt]),It=m(q),St=l(null),gt=l(null),Tt=l(null),zt=l(0),Ot=l({initialized:!1,scrollOffsetInitial:0,scrollOffsetFinal:0,animationStartTime:0}),bt=v(b,St),yt=v(et,Tt),Ct=Ot.current;Ct.initialized||(Ct.initialized=!0,Ct.scrollOffsetInitial=0,Ct.scrollOffsetFinal=0,Ct.animationStartTime=0);var jt=a((function(t,e){var i=(k||x)(t,e);return void 0===i&&console.error("Couldn't get height for item: ",t),i}),[x,k]),Rt=a((function(t,e){var i=_(t,e);return void 0===i&&console.error("Couldn't get id for item: ",t),i}),[_]),wt=n((function(){return h(R,Rt,jt)}),[R,Rt,jt]),Ft=n((function(){return p(pt,wt)}),[pt,wt]),Lt=a((function(t){var e=t.scrollDirection,i=t.scrollOffset,r=t.scrollUpdateWasRequested;zt.current=i,r||(Ct.scrollOffsetInitial=i),E&&E(e,i,r)}),[E,zt,Ct]),xt=a((function(){requestAnimationFrame((function(){var t,e=performance.now()-Ct.animationStartTime,i=Ct.scrollOffsetFinal-Ct.scrollOffsetInitial,r=I(Math.min(1,e/P)),o=Math.min(Ft,Ct.scrollOffsetInitial+i*r);zt.current=o,null===(t=Tt.current)||void 0===t||t.scrollTo(o),P>e?xt():(Ct.animationStartTime=void 0,B&&B())}))}),[P,Ct,Tt,Ft,B]),Vt=a((function(t){var e=t.offsetTop;Ct.animationStartTime?Ct.scrollOffsetFinal=e:Ct.scrollOffsetInitial!==e?(Ct.scrollOffsetFinal=e,Ct.animationStartTime=performance.now(),xt()):B&&B()}),[Ct,xt,B]),kt=a((function(t){var e=t.index;return F(R[e],e,t.style)}),[R,F]),At=a((function(t){return jt(R[t],t)}),[R,jt]),Dt=a((function(t,e){e===ct&&t===dt||setTimeout((function(){ut(e),vt(t),Q(t,e)}),0)}),[ct,dt,Q]),Et=d((function(t){if(Z){var e=S(R,wt,Rt,t.visibleStartIndex,t.visibleStopIndex,pt,zt.current);Z(e)}}),{wait:J,trailing:!0},[Z,R,wt,Rt,pt]);return s((function(){if(q&&It!==q){var t=g(R,wt,Rt,pt),e=wt[q];t&&e&&Vt(e)}}),[It,q,Vt,wt,R,Rt,pt]),s((function(){Tt.current&&Tt.current.resetAfterIndex(0)}),[wt]),s((function(){var t=tt||Y;if(t){var e=g(R,wt,Rt,pt);gt.current!==e&&(gt.current=e,t(e))}}),[tt,Y,R,wt,pt,Rt]),i.createElement("div",{ref:bt,className:e(O.virtualizedListWrapper,y),id:C,role:rt,"aria-label":ot,"data-testid":lt||T(z.VIRTUALIZED_LIST,C),style:nt},i.createElement(f,null,(function(t){var e=t.height,r=t.width;return Dt(r,e),i.createElement(u,{ref:yt,height:e,width:r,itemCount:R.length,itemSize:At,onScroll:Lt,layout:D,overscanCount:N,onItemsRendered:Et,className:it},kt)})))}));export{b as default};
//# sourceMappingURL=VirtualizedList.js.map