@ehfuse/mui-virtual-data-table 1.1.30 → 1.1.31
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.
- package/README.md +2 -0
- package/dist/index.esm.js +3 -3
- package/dist/index.esm.js.map +2 -2
- package/dist/index.js +3 -3
- package/dist/index.js.map +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -117,6 +117,8 @@ function App() {
|
|
|
117
117
|
// Optional - Infinite Scroll
|
|
118
118
|
loading={boolean} // Loading state (default: false)
|
|
119
119
|
onLoadMore={(offset, limit) => void} // Load more callback (enables infinite scroll when provided)
|
|
120
|
+
// ⚠️ onLoadMore 계약: 호출되면 반드시 이행해서 data 가 늘어나거나 loading 이 토글돼야 합니다.
|
|
121
|
+
// (정렬/검색/필터로 목록을 1페이지로 되돌리면 컴포넌트가 자동으로 더보기 잠금을 풀어 재개합니다.)
|
|
120
122
|
|
|
121
123
|
// Optional - Sorting
|
|
122
124
|
sortBy={string} // Current sort field
|
package/dist/index.esm.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import{forwardRef as Ye,useCallback as De,useMemo as Ke,useRef as K,useEffect as
|
|
1
|
+
import{forwardRef as Ye,useCallback as De,useMemo as Ke,useRef as K,useEffect as we,memo as $t,useState as nt}from"react";import{Box as Me,Table as Nt,TableBody as Ot,TableCell as Ne,TableContainer as Ft,TableHead as Pt,TableFooter as At,TableRow as Ve,TableSortLabel as ot,Paper as zt,Typography as Bt}from"@mui/material";import{TableVirtuoso as qt}from"react-virtuoso";import{jsx as rt}from"react/jsx-runtime";import{useRef as it,useState as mt,useEffect as gt}from"react";import{Box as bt,CircularProgress as xt}from"@mui/material";var Be=function(){return Be=Object.assign||function(m){for(var f,D=1,H=arguments.length;D<H;D++){f=arguments[D];for(var w in f)Object.prototype.hasOwnProperty.call(f,w)&&(m[w]=f[w])}return m},Be.apply(this,arguments)};function lt(l){var m=l.visible,f=l.onComplete,D=l.fadeoutDuration,H=D===void 0?200:D,w=l.exitDelay,b=w===void 0?0:w,M=l.size,I=M===void 0?40:M,G=l.className,J=l.style,j=l.sx,Q=l.indicator,$=l.background,X=$===void 0?{show:!0,color:"255, 255, 255",opacity:.9}:$,ge=it(void 0),a=it(null),U=mt(m),be=U[0],xe=U[1],z=X.show,Z=z===void 0?!0:z,k=X.color,N=k===void 0?"255, 255, 255":k,ae=X.opacity,se=ae===void 0?.9:ae;if(gt(function(){var ce=ge.current;if(ce===!0&&m===!1&&a.current){var ue=a.current;ue.style.opacity="0",setTimeout(function(){xe(!1),f?.()},H+b)}else m===!0&&(xe(!0),a.current&&(a.current.style.opacity="1"));ge.current=m},[m,f,H,b]),!be)return null;var Ee=function(){return typeof Q=="string"?rt("img",{src:Q,alt:"Loading",style:{width:I,height:I}}):Q||rt(xt,{size:I})},ee=function(){return Z?N.startsWith("rgba")?{backgroundColor:N}:/^\d+,\s*\d+,\s*\d+$/.test(N)?{backgroundColor:"rgba(".concat(N,", ").concat(se,")")}:se!==1?{backgroundColor:N,"&::before":{content:'""',position:"absolute",top:0,left:0,right:0,bottom:0,backgroundColor:N,opacity:se,zIndex:-1}}:{backgroundColor:N}:{backgroundColor:"transparent"}};return rt(bt,{ref:a,className:G,style:Be({},J),sx:Be(Be({position:"absolute",top:0,left:0,right:0,bottom:0,display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3,opacity:m?1:0,transition:"opacity ".concat(H,"ms ease-out")},ee()),j),children:Ee()})}import{Fragment as vt,jsx as at,jsxs as wt}from"react/jsx-runtime";var yt=`
|
|
2
2
|
.vdt-css-spinner{box-sizing:border-box;border-radius:50%;border:4px solid rgba(28,64,125,0.14);border-top-color:#1c407d;animation:vdt-css-spinner-spin .75s linear infinite}
|
|
3
3
|
@keyframes vdt-css-spinner-spin{to{transform:rotate(360deg)}}
|
|
4
|
-
`;function st({size:l=54}){return wt(vt,{children:[at("style",{children:yt}),at("span",{className:"vdt-css-spinner",role:"progressbar","aria-label":"loading",style:{display:"inline-block",width:l,height:l}})]})}import{useRef as re,useEffect as me,useState as Y,useCallback as A,useMemo as qe,forwardRef as Mt,useImperativeHandle as Ct,useLayoutEffect as St}from"react";import{jsx as $e,jsxs as ut}from"react/jsx-runtime";var Tt=["editor","textarea","input","select","textfield","form-control","contenteditable","MuiInputBase-input","MuiSelect-select","MuiOutlinedInput-input","MuiFilledInput-input","MuiInput-input","MuiFormControl-root","MuiTextField-root","MuiSelect-root","MuiOutlinedInput-root","MuiFilledInput-root","MuiInput-root","MuiAutocomplete-input","MuiDatePicker-input","MuiSlider-thumb","MuiSlider-rail","MuiSlider-track","MuiSlider-mark","MuiSlider-markLabel","MuiSlider-root","MuiSlider-colorPrimary","MuiSlider-sizeMedium","MuiIconButton-root","MuiButton-root","MuiButtonBase-root","MuiTouchRipple-root","MuiCheckbox-root","MuiRadio-root","MuiSwitch-root","PrivateSwitchBase-root","ant-input","ant-input-affix-wrapper","ant-input-group-addon","ant-input-number","ant-input-number-handler","ant-select","ant-select-selector","ant-select-selection-search","ant-select-dropdown","ant-cascader","ant-cascader-input","ant-picker","ant-picker-input","ant-time-picker","ant-calendar-picker","ant-slider","ant-slider-track","ant-slider-handle","ant-switch","ant-checkbox","ant-checkbox-wrapper","ant-radio","ant-radio-wrapper","ant-rate","ant-upload","ant-upload-drag","ant-form-item","ant-form-item-control","ant-btn","ant-dropdown","ant-dropdown-trigger","ant-menu","ant-menu-item","ant-tooltip","ant-popover","ant-modal","ant-drawer","ant-tree-select","ant-auto-complete","ant-mentions","ant-transfer","ui-input","ui-textarea","ui-select","ui-select-trigger","ui-select-content","ui-select-item","ui-button","ui-checkbox","ui-radio-group","ui-switch","ui-slider","ui-range-slider","ui-calendar","ui-date-picker","ui-combobox","ui-command","ui-command-input","ui-popover","ui-dialog","ui-sheet","ui-dropdown-menu","ui-context-menu","ui-menubar","ui-navigation-menu","ui-form","ui-form-control","ui-form-item","ui-form-field","ui-label","radix-ui","radix-select","radix-dropdown","radix-dialog","radix-popover","radix-accordion","radix-tabs","radix-slider","radix-switch","radix-checkbox","radix-radio","ql-editor","ql-container","ql-toolbar","ql-picker","ql-picker-label","ql-picker-options","ql-formats","ql-snow","ql-bubble","quill","quilleditor","monaco-editor","monaco-editor-background","view-lines","decorationsOverviewRuler","monaco-scrollable-element","CodeMirror","CodeMirror-code","CodeMirror-lines","CodeMirror-scroll","CodeMirror-sizer","cm-editor","cm-focused","cm-content","tox-editor-container","tox-editor-header","tox-edit-area","tox-tinymce","mce-content-body","ck-editor","ck-content","ck-toolbar","ck-editor__editable","ck-widget","slate-editor","slate-content","DraftEditor-root","DraftEditor-editorContainer","public-DraftEditor-content","ehfuse-editor","ehfuse-editor-wrapper","ehfuse-editor-content","ehfuse-toolbar","ehfuse-toolbar-group","ehfuse-cursor","text-editor","rich-text-editor","wysiwyg","ace_editor","ace_content"],ct=(l,m)=>{let f=l.tagName.toLowerCase(),D=["text","password","email","number","search","tel","url","checkbox","radio"];if(f==="input"){let H=l.type;return D.includes(H)}if(["textarea","select","button"].includes(f)||["svg","path","circle","rect","line","polygon","polyline"].includes(f)||l.getAttribute("contenteditable")==="true")return!0;if(m?.excludeSelectors){for(let H of m.excludeSelectors)if(l.matches(H))return!0}return kt(l,m)},kt=(l,m)=>{let f=[...Tt,...m?.excludeClasses||[]],D=l,H=0,w=5;for(;D&&H<=w;){if(f.some(b=>D.classList.contains(b)))return!0;if(D.classList.contains("MuiDialogContent-root"))break;D=D.parentElement,H++}return!1},Lt={},Dt={},Rt={},Et={},Ht={},It=Mt(({className:l="",style:m={},containerStyle:f={},contentStyle:D={},children:H,onScroll:w,thumb:b=Lt,track:M=Dt,arrows:I=Rt,dragScroll:G=Et,autoHide:J=Ht,showScrollbar:W=!0,detectInnerScroll:Q=!1},$)=>{let X=re({});me(()=>{X.current={children:H,onScroll:w,showScrollbar:W,thumb:b,track:M,arrows:I,dragScroll:G,autoHide:J}});let be=re(null),a=re(null),U=re(null),xe=re(null),ye=re(null),z=re(null),[Z,k]=Y(!1),[N,ae]=Y(!1),[se,Ee]=Y(!1),[ee,ce]=Y({y:0,scrollTop:0}),[ue,Xe]=Y(0),[Ue,We]=Y(0),[Oe,je]=Y(!1),[Ce,Se]=Y(!1),[de,Ze]=Y({x:0,y:0,scrollTop:0,scrollLeft:0}),[ft,L]=Y(null),[h,ve]=Y(null),[Je,Fe]=Y(!1),Te=re(null),[Pe,_e]=Y(!1),ke=re(null),we=re(null),pe=re(null),V=qe(()=>{let t=b.color??"#606060";return{width:b.width??8,minHeight:b.minHeight??50,radius:b.radius??(b.width??8)/2,color:t,opacity:b.opacity??.6,hoverColor:b.hoverColor??t,hoverOpacity:b.hoverOpacity??1}},[b]),x=qe(()=>({width:M.width??16,color:M.color??"rgba(128, 128, 128, 0.1)",visible:M.visible??!0,alignment:M.alignment??"center",radius:M.radius??V.radius??4,margin:M.margin??4}),[M,V.radius]),j=qe(()=>{let t=I.color??"#808080";return{visible:I.visible??!1,step:I.step??50,color:t,opacity:I.opacity??.6,hoverColor:I.hoverColor??t,hoverOpacity:I.hoverOpacity??1}},[I]),Le=qe(()=>({enabled:G.enabled??!0,excludeClasses:G.excludeClasses??[],excludeSelectors:G.excludeSelectors??[]}),[G]),y=qe(()=>({enabled:J.enabled??!0,delay:J.delay??1500,delayOnWheel:J.delayOnWheel??700}),[J]),C=V.width,Ae=x.width,fe=V.minHeight,B=j.visible,he=j.step,ne=A(()=>{if(!a.current)return;let t=document.activeElement;t&&a.current.contains(t)&&t!==a.current||a.current.focus()},[]);Ct($,()=>({getScrollContainer:()=>a.current,scrollTo:t=>{a.current&&a.current.scrollTo(t)},get scrollTop(){return a.current?.scrollTop||0},get scrollHeight(){return a.current?.scrollHeight||0},get clientHeight(){return a.current?.clientHeight||0}}),[]);let S=A(()=>{if(z.current){let n=z.current;if(document.contains(n)&&n.scrollHeight>n.clientHeight+2)return n;z.current=null}if(!a.current)return null;if(U.current&&U.current.scrollHeight>a.current.clientHeight+2)return z.current=a.current,a.current;if(!Q)return null;let t=a.current.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]');for(let n of t){let i=n;if(i!==a.current&&i.classList.contains("overlay-scrollbar-container"))continue;let c=i.parentElement,s=!1;for(;c&&c!==a.current;){if(c.classList.contains("overlay-scrollbar-container")&&c!==a.current){s=!0;break}c=c.parentElement}if(!s&&i.scrollHeight>i.clientHeight+2)return z.current=i,i}return null},[]),oe=A(()=>S()!==null,[S]),O=A(()=>{ke.current&&(clearTimeout(ke.current),ke.current=null)},[]),Qe=A(()=>{we.current&&(clearTimeout(we.current),we.current=null)},[]),ie=A(()=>{pe.current&&(clearTimeout(pe.current),pe.current=null)},[]),F=A(t=>{y.enabled&&(O(),ke.current=setTimeout(()=>{k(!1),ke.current=null},t))},[O,y.enabled]),T=A(()=>{let t=S();if(!t){k(!1),je(!1),O();return}if(je(!0),!xe.current)return;y.enabled||(k(!0),O());let n=t.clientHeight,i=t.scrollHeight,c=t.scrollTop,s=0;if(be.current){let Ie=window.getComputedStyle(be.current),tt=parseFloat(Ie.paddingTop)||0,ht=parseFloat(Ie.paddingBottom)||0;s=tt+ht}let v=B?C*2+x.margin*4:x.margin*2,R=n-v+s,E=n/i,te=Math.max(R*E,fe),le=i-n,_=R-te,ze=le>0?c/le*_:0;Xe(te),We(ze)},[S,O,B,C,fe,y.enabled]),et=A(t=>{t.preventDefault(),t.stopPropagation();let n=S();n&&(ae(!0),ce({y:t.clientY,scrollTop:n.scrollTop}),O(),k(!0),ne())},[S,O,ne]),He=A(t=>{if(!N)return;let n=S();if(!n)return;let i=n.clientHeight,c=n.scrollHeight-i,s=t.clientY-ee.y,v=i-ue,R=s/v*c,E=Math.max(0,Math.min(c,ee.scrollTop+R));n.scrollTop=E,T()},[N,ee,ue,T,S]),o=A(()=>{ae(!1),oe()&&F(y.delay)},[oe,F,y.delay]),r=A(t=>{if(!xe.current)return;let n=xe.current.getBoundingClientRect(),i=t.clientY-n.top,c=S();if(!c)return;let s=c.clientHeight,v=c.scrollHeight,R=i/s*(v-s);c.scrollTop=Math.max(0,Math.min(v-s,R)),T(),k(!0),F(y.delay),ne()},[T,F,y.delay,S,ne]),u=A(t=>{if(t.preventDefault(),t.stopPropagation(),!a.current)return;let n=Math.max(0,a.current.scrollTop-he);a.current.scrollTop=n,T(),k(!0),F(y.delay),ne()},[T,F,he,y.delay,ne]),g=A(t=>{if(t.preventDefault(),t.stopPropagation(),!a.current||!U.current)return;let n=a.current,i=U.current.scrollHeight-n.clientHeight,c=Math.min(i,n.scrollTop+he);n.scrollTop=c,T(),k(!0),F(y.delay),ne()},[T,F,he,y.delay,ne]),p=A(t=>{if(!Le.enabled)return;let n=t.target;if(ct(n,Le)||t.button!==0)return;let i=S();i&&(i.scrollHeight<=i.clientHeight||(t.preventDefault(),Se(!0),Ze({x:t.clientX,y:t.clientY,scrollTop:i.scrollTop,scrollLeft:i.scrollLeft||0}),O()))},[Le,ct,S,O]),e=A(t=>{if(!Ce)return;let n=S();if(!n)return;let i=de.x-t.clientX,c=de.y-t.clientY;if(Math.abs(c)<3&&Math.abs(i)<3)return;k(!0);let s=Math.max(0,Math.min(n.scrollHeight-n.clientHeight,de.scrollTop+c));n.scrollTop=s,T()},[Ce,de,S,T]),P=A(()=>{Se(!1),oe()&&F(y.delay)},[oe,F,y.delay]);me(()=>{let t=v=>{T(),O(),k(!0);let R=Pe?y.delayOnWheel:y.delay;F(R),w&&w(v)},n=()=>{_e(!0),Te.current&&clearTimeout(Te.current),Te.current=setTimeout(()=>{_e(!1)},300),O(),ie(),pe.current=setTimeout(()=>{k(!0),pe.current=null},50)},i=[],c=S();c&&i.push(c);let s=a.current;return s&&!c&&(i.push(s),s.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]').forEach(v=>{let R=v;if(R!==s&&R.classList.contains("overlay-scrollbar-container"))return;let E=R.parentElement;for(;E&&E!==s;){if(E.classList.contains("overlay-scrollbar-container")&&E!==s)return;E=E.parentElement}i.push(R)})),i.forEach(v=>{v.addEventListener("scroll",t,{passive:!0}),v.addEventListener("wheel",n,{passive:!0})}),()=>{i.forEach(v=>{v.removeEventListener("scroll",t),v.removeEventListener("wheel",n)}),Te.current&&clearTimeout(Te.current),pe.current&&clearTimeout(pe.current)}},[S,T,w,O,F,y,Pe]),me(()=>{let t=i=>{let c=S();if(!c)return;let{key:s}=i,{scrollTop:v,scrollHeight:R,clientHeight:E}=c,te=R-E,le=50,_=null;switch(s){case"ArrowUp":i.preventDefault(),_=Math.max(0,v-le);break;case"ArrowDown":i.preventDefault(),_=Math.min(te,v+le);break;case"PageUp":i.preventDefault(),_=Math.max(0,v-E);break;case"PageDown":i.preventDefault(),_=Math.min(te,v+E);break;case"Home":i.preventDefault(),_=0;break;case"End":i.preventDefault(),_=te;break;default:return}if(_!==null){let ze=_/te,Ie=B?C*2+x.margin*4:x.margin*2,tt=(E-Ie-ue)*ze;We(tt),c.scrollTop=_,O(),k(!0),F(y.delay)}},n=a.current;if(n)return n.addEventListener("keydown",t),()=>{n.removeEventListener("keydown",t)}},[S,B,C,x.margin,ue,O,F,y.delay]),me(()=>{if(Ce)return document.addEventListener("mousemove",e),document.addEventListener("mouseup",P),()=>{document.removeEventListener("mousemove",e),document.removeEventListener("mouseup",P)}},[Ce,e,P]),me(()=>{if(N)return document.addEventListener("mousemove",He),document.addEventListener("mouseup",o),()=>{document.removeEventListener("mousemove",He),document.removeEventListener("mouseup",o)}},[N,He,o]),me(()=>{T();let t=setTimeout(()=>{T()},100);return()=>clearTimeout(t)},[T]),St(()=>{Fe(!0),T(),!y.enabled&&oe()&&k(!0)},[oe,T,y.enabled]),me(()=>{let t=new ResizeObserver(()=>{T()}),n=[];return a.current&&n.push(a.current),U.current&&n.push(U.current),z.current&&document.contains(z.current)&&n.push(z.current),n.forEach(i=>{t.observe(i)}),()=>t.disconnect()},[T]),me(()=>{if(!a.current)return;let t=new MutationObserver(()=>{z.current=null,T()});return t.observe(a.current,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}),()=>t.disconnect()},[T]);let q=Math.max(Ae,C);return me(()=>{let t="overlay-scrollbar-webkit-hide",n=document.getElementById(t);n&&n.remove();let i=document.createElement("style");return i.id=t,i.textContent=`
|
|
4
|
+
`;function st({size:l=54}){return wt(vt,{children:[at("style",{children:yt}),at("span",{className:"vdt-css-spinner",role:"progressbar","aria-label":"loading",style:{display:"inline-block",width:l,height:l}})]})}import{useRef as re,useEffect as me,useState as Y,useCallback as A,useMemo as qe,forwardRef as Mt,useImperativeHandle as Ct,useLayoutEffect as St}from"react";import{jsx as $e,jsxs as ut}from"react/jsx-runtime";var Tt=["editor","textarea","input","select","textfield","form-control","contenteditable","MuiInputBase-input","MuiSelect-select","MuiOutlinedInput-input","MuiFilledInput-input","MuiInput-input","MuiFormControl-root","MuiTextField-root","MuiSelect-root","MuiOutlinedInput-root","MuiFilledInput-root","MuiInput-root","MuiAutocomplete-input","MuiDatePicker-input","MuiSlider-thumb","MuiSlider-rail","MuiSlider-track","MuiSlider-mark","MuiSlider-markLabel","MuiSlider-root","MuiSlider-colorPrimary","MuiSlider-sizeMedium","MuiIconButton-root","MuiButton-root","MuiButtonBase-root","MuiTouchRipple-root","MuiCheckbox-root","MuiRadio-root","MuiSwitch-root","PrivateSwitchBase-root","ant-input","ant-input-affix-wrapper","ant-input-group-addon","ant-input-number","ant-input-number-handler","ant-select","ant-select-selector","ant-select-selection-search","ant-select-dropdown","ant-cascader","ant-cascader-input","ant-picker","ant-picker-input","ant-time-picker","ant-calendar-picker","ant-slider","ant-slider-track","ant-slider-handle","ant-switch","ant-checkbox","ant-checkbox-wrapper","ant-radio","ant-radio-wrapper","ant-rate","ant-upload","ant-upload-drag","ant-form-item","ant-form-item-control","ant-btn","ant-dropdown","ant-dropdown-trigger","ant-menu","ant-menu-item","ant-tooltip","ant-popover","ant-modal","ant-drawer","ant-tree-select","ant-auto-complete","ant-mentions","ant-transfer","ui-input","ui-textarea","ui-select","ui-select-trigger","ui-select-content","ui-select-item","ui-button","ui-checkbox","ui-radio-group","ui-switch","ui-slider","ui-range-slider","ui-calendar","ui-date-picker","ui-combobox","ui-command","ui-command-input","ui-popover","ui-dialog","ui-sheet","ui-dropdown-menu","ui-context-menu","ui-menubar","ui-navigation-menu","ui-form","ui-form-control","ui-form-item","ui-form-field","ui-label","radix-ui","radix-select","radix-dropdown","radix-dialog","radix-popover","radix-accordion","radix-tabs","radix-slider","radix-switch","radix-checkbox","radix-radio","ql-editor","ql-container","ql-toolbar","ql-picker","ql-picker-label","ql-picker-options","ql-formats","ql-snow","ql-bubble","quill","quilleditor","monaco-editor","monaco-editor-background","view-lines","decorationsOverviewRuler","monaco-scrollable-element","CodeMirror","CodeMirror-code","CodeMirror-lines","CodeMirror-scroll","CodeMirror-sizer","cm-editor","cm-focused","cm-content","tox-editor-container","tox-editor-header","tox-edit-area","tox-tinymce","mce-content-body","ck-editor","ck-content","ck-toolbar","ck-editor__editable","ck-widget","slate-editor","slate-content","DraftEditor-root","DraftEditor-editorContainer","public-DraftEditor-content","ehfuse-editor","ehfuse-editor-wrapper","ehfuse-editor-content","ehfuse-toolbar","ehfuse-toolbar-group","ehfuse-cursor","text-editor","rich-text-editor","wysiwyg","ace_editor","ace_content"],ct=(l,m)=>{let f=l.tagName.toLowerCase(),D=["text","password","email","number","search","tel","url","checkbox","radio"];if(f==="input"){let H=l.type;return D.includes(H)}if(["textarea","select","button"].includes(f)||["svg","path","circle","rect","line","polygon","polyline"].includes(f)||l.getAttribute("contenteditable")==="true")return!0;if(m?.excludeSelectors){for(let H of m.excludeSelectors)if(l.matches(H))return!0}return kt(l,m)},kt=(l,m)=>{let f=[...Tt,...m?.excludeClasses||[]],D=l,H=0,w=5;for(;D&&H<=w;){if(f.some(b=>D.classList.contains(b)))return!0;if(D.classList.contains("MuiDialogContent-root"))break;D=D.parentElement,H++}return!1},Lt={},Dt={},Rt={},Et={},Ht={},It=Mt(({className:l="",style:m={},containerStyle:f={},contentStyle:D={},children:H,onScroll:w,thumb:b=Lt,track:M=Dt,arrows:I=Rt,dragScroll:G=Et,autoHide:J=Ht,showScrollbar:j=!0,detectInnerScroll:Q=!1},$)=>{let X=re({});me(()=>{X.current={children:H,onScroll:w,showScrollbar:j,thumb:b,track:M,arrows:I,dragScroll:G,autoHide:J}});let ge=re(null),a=re(null),U=re(null),be=re(null),xe=re(null),z=re(null),[Z,k]=Y(!1),[N,ae]=Y(!1),[se,Ee]=Y(!1),[ee,ce]=Y({y:0,scrollTop:0}),[ue,Xe]=Y(0),[Ue,We]=Y(0),[Oe,je]=Y(!1),[Ce,Se]=Y(!1),[de,Ze]=Y({x:0,y:0,scrollTop:0,scrollLeft:0}),[ft,L]=Y(null),[h,ye]=Y(null),[Je,Fe]=Y(!1),Te=re(null),[Pe,_e]=Y(!1),ke=re(null),ve=re(null),pe=re(null),V=qe(()=>{let t=b.color??"#606060";return{width:b.width??8,minHeight:b.minHeight??50,radius:b.radius??(b.width??8)/2,color:t,opacity:b.opacity??.6,hoverColor:b.hoverColor??t,hoverOpacity:b.hoverOpacity??1}},[b]),v=qe(()=>({width:M.width??16,color:M.color??"rgba(128, 128, 128, 0.1)",visible:M.visible??!0,alignment:M.alignment??"center",radius:M.radius??V.radius??4,margin:M.margin??4}),[M,V.radius]),W=qe(()=>{let t=I.color??"#808080";return{visible:I.visible??!1,step:I.step??50,color:t,opacity:I.opacity??.6,hoverColor:I.hoverColor??t,hoverOpacity:I.hoverOpacity??1}},[I]),Le=qe(()=>({enabled:G.enabled??!0,excludeClasses:G.excludeClasses??[],excludeSelectors:G.excludeSelectors??[]}),[G]),x=qe(()=>({enabled:J.enabled??!0,delay:J.delay??1500,delayOnWheel:J.delayOnWheel??700}),[J]),C=V.width,Ae=v.width,fe=V.minHeight,B=W.visible,he=W.step,ne=A(()=>{if(!a.current)return;let t=document.activeElement;t&&a.current.contains(t)&&t!==a.current||a.current.focus()},[]);Ct($,()=>({getScrollContainer:()=>a.current,scrollTo:t=>{a.current&&a.current.scrollTo(t)},get scrollTop(){return a.current?.scrollTop||0},get scrollHeight(){return a.current?.scrollHeight||0},get clientHeight(){return a.current?.clientHeight||0}}),[]);let S=A(()=>{if(z.current){let n=z.current;if(document.contains(n)&&n.scrollHeight>n.clientHeight+2)return n;z.current=null}if(!a.current)return null;if(U.current&&U.current.scrollHeight>a.current.clientHeight+2)return z.current=a.current,a.current;if(!Q)return null;let t=a.current.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]');for(let n of t){let i=n;if(i!==a.current&&i.classList.contains("overlay-scrollbar-container"))continue;let c=i.parentElement,s=!1;for(;c&&c!==a.current;){if(c.classList.contains("overlay-scrollbar-container")&&c!==a.current){s=!0;break}c=c.parentElement}if(!s&&i.scrollHeight>i.clientHeight+2)return z.current=i,i}return null},[]),oe=A(()=>S()!==null,[S]),O=A(()=>{ke.current&&(clearTimeout(ke.current),ke.current=null)},[]),Qe=A(()=>{ve.current&&(clearTimeout(ve.current),ve.current=null)},[]),ie=A(()=>{pe.current&&(clearTimeout(pe.current),pe.current=null)},[]),F=A(t=>{x.enabled&&(O(),ke.current=setTimeout(()=>{k(!1),ke.current=null},t))},[O,x.enabled]),T=A(()=>{let t=S();if(!t){k(!1),je(!1),O();return}if(je(!0),!be.current)return;x.enabled||(k(!0),O());let n=t.clientHeight,i=t.scrollHeight,c=t.scrollTop,s=0;if(ge.current){let Ie=window.getComputedStyle(ge.current),tt=parseFloat(Ie.paddingTop)||0,ht=parseFloat(Ie.paddingBottom)||0;s=tt+ht}let y=B?C*2+v.margin*4:v.margin*2,R=n-y+s,E=n/i,te=Math.max(R*E,fe),le=i-n,_=R-te,ze=le>0?c/le*_:0;Xe(te),We(ze)},[S,O,B,C,fe,x.enabled]),et=A(t=>{t.preventDefault(),t.stopPropagation();let n=S();n&&(ae(!0),ce({y:t.clientY,scrollTop:n.scrollTop}),O(),k(!0),ne())},[S,O,ne]),He=A(t=>{if(!N)return;let n=S();if(!n)return;let i=n.clientHeight,c=n.scrollHeight-i,s=t.clientY-ee.y,y=i-ue,R=s/y*c,E=Math.max(0,Math.min(c,ee.scrollTop+R));n.scrollTop=E,T()},[N,ee,ue,T,S]),o=A(()=>{ae(!1),oe()&&F(x.delay)},[oe,F,x.delay]),r=A(t=>{if(!be.current)return;let n=be.current.getBoundingClientRect(),i=t.clientY-n.top,c=S();if(!c)return;let s=c.clientHeight,y=c.scrollHeight,R=i/s*(y-s);c.scrollTop=Math.max(0,Math.min(y-s,R)),T(),k(!0),F(x.delay),ne()},[T,F,x.delay,S,ne]),u=A(t=>{if(t.preventDefault(),t.stopPropagation(),!a.current)return;let n=Math.max(0,a.current.scrollTop-he);a.current.scrollTop=n,T(),k(!0),F(x.delay),ne()},[T,F,he,x.delay,ne]),g=A(t=>{if(t.preventDefault(),t.stopPropagation(),!a.current||!U.current)return;let n=a.current,i=U.current.scrollHeight-n.clientHeight,c=Math.min(i,n.scrollTop+he);n.scrollTop=c,T(),k(!0),F(x.delay),ne()},[T,F,he,x.delay,ne]),p=A(t=>{if(!Le.enabled)return;let n=t.target;if(ct(n,Le)||t.button!==0)return;let i=S();i&&(i.scrollHeight<=i.clientHeight||(t.preventDefault(),Se(!0),Ze({x:t.clientX,y:t.clientY,scrollTop:i.scrollTop,scrollLeft:i.scrollLeft||0}),O()))},[Le,ct,S,O]),e=A(t=>{if(!Ce)return;let n=S();if(!n)return;let i=de.x-t.clientX,c=de.y-t.clientY;if(Math.abs(c)<3&&Math.abs(i)<3)return;k(!0);let s=Math.max(0,Math.min(n.scrollHeight-n.clientHeight,de.scrollTop+c));n.scrollTop=s,T()},[Ce,de,S,T]),P=A(()=>{Se(!1),oe()&&F(x.delay)},[oe,F,x.delay]);me(()=>{let t=y=>{T(),O(),k(!0);let R=Pe?x.delayOnWheel:x.delay;F(R),w&&w(y)},n=()=>{_e(!0),Te.current&&clearTimeout(Te.current),Te.current=setTimeout(()=>{_e(!1)},300),O(),ie(),pe.current=setTimeout(()=>{k(!0),pe.current=null},50)},i=[],c=S();c&&i.push(c);let s=a.current;return s&&!c&&(i.push(s),s.querySelectorAll('[data-virtuoso-scroller], [style*="overflow"], .virtuoso-scroller, [style*="overflow: auto"], [style*="overflow:auto"]').forEach(y=>{let R=y;if(R!==s&&R.classList.contains("overlay-scrollbar-container"))return;let E=R.parentElement;for(;E&&E!==s;){if(E.classList.contains("overlay-scrollbar-container")&&E!==s)return;E=E.parentElement}i.push(R)})),i.forEach(y=>{y.addEventListener("scroll",t,{passive:!0}),y.addEventListener("wheel",n,{passive:!0})}),()=>{i.forEach(y=>{y.removeEventListener("scroll",t),y.removeEventListener("wheel",n)}),Te.current&&clearTimeout(Te.current),pe.current&&clearTimeout(pe.current)}},[S,T,w,O,F,x,Pe]),me(()=>{let t=i=>{let c=S();if(!c)return;let{key:s}=i,{scrollTop:y,scrollHeight:R,clientHeight:E}=c,te=R-E,le=50,_=null;switch(s){case"ArrowUp":i.preventDefault(),_=Math.max(0,y-le);break;case"ArrowDown":i.preventDefault(),_=Math.min(te,y+le);break;case"PageUp":i.preventDefault(),_=Math.max(0,y-E);break;case"PageDown":i.preventDefault(),_=Math.min(te,y+E);break;case"Home":i.preventDefault(),_=0;break;case"End":i.preventDefault(),_=te;break;default:return}if(_!==null){let ze=_/te,Ie=B?C*2+v.margin*4:v.margin*2,tt=(E-Ie-ue)*ze;We(tt),c.scrollTop=_,O(),k(!0),F(x.delay)}},n=a.current;if(n)return n.addEventListener("keydown",t),()=>{n.removeEventListener("keydown",t)}},[S,B,C,v.margin,ue,O,F,x.delay]),me(()=>{if(Ce)return document.addEventListener("mousemove",e),document.addEventListener("mouseup",P),()=>{document.removeEventListener("mousemove",e),document.removeEventListener("mouseup",P)}},[Ce,e,P]),me(()=>{if(N)return document.addEventListener("mousemove",He),document.addEventListener("mouseup",o),()=>{document.removeEventListener("mousemove",He),document.removeEventListener("mouseup",o)}},[N,He,o]),me(()=>{T();let t=setTimeout(()=>{T()},100);return()=>clearTimeout(t)},[T]),St(()=>{Fe(!0),T(),!x.enabled&&oe()&&k(!0)},[oe,T,x.enabled]),me(()=>{let t=new ResizeObserver(()=>{T()}),n=[];return a.current&&n.push(a.current),U.current&&n.push(U.current),z.current&&document.contains(z.current)&&n.push(z.current),n.forEach(i=>{t.observe(i)}),()=>t.disconnect()},[T]),me(()=>{if(!a.current)return;let t=new MutationObserver(()=>{z.current=null,T()});return t.observe(a.current,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}),()=>t.disconnect()},[T]);let q=Math.max(Ae,C);return me(()=>{let t="overlay-scrollbar-webkit-hide",n=document.getElementById(t);n&&n.remove();let i=document.createElement("style");return i.id=t,i.textContent=`
|
|
5
5
|
.overlay-scrollbar-container::-webkit-scrollbar {
|
|
6
6
|
display: none !important;
|
|
7
7
|
width: 0 !important;
|
|
@@ -21,7 +21,7 @@ import{forwardRef as Ye,useCallback as De,useMemo as Ke,useRef as K,useEffect as
|
|
|
21
21
|
outline: 2px solid rgba(0, 123, 255, 0.5);
|
|
22
22
|
outline-offset: -2px;
|
|
23
23
|
}
|
|
24
|
-
`,document.head.appendChild(i),()=>{let c=document.getElementById(t);c&&c.remove()}},[]),ut("div",{ref:be,className:`overlay-scrollbar-wrapper ${l}`,style:{display:"flex",flexDirection:"column",position:"relative",minHeight:0,height:"100%",flex:"1 1 0%",...m},children:[$e("div",{ref:a,className:"overlay-scrollbar-container",tabIndex:-1,onMouseDown:p,style:{display:"flex",width:"100%",flex:"1 1 auto",minHeight:0,overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none",outline:"none",userSelect:Ce?"none":"auto",...f},children:$e("div",{ref:U,className:"overlay-scrollbar-content",style:{flex:"1 1 0%",minHeight:0,display:"flex",flexDirection:"column",...D},children:H})}),W&&Oe&&ut("div",{ref:xe,className:"overlay-scrollbar-track",onMouseEnter:()=>{O(),we.current=setTimeout(()=>{k(!0),we.current=null},100)},onMouseLeave:()=>{Qe(),N||F(y.delay)},style:{position:"absolute",top:0,right:0,width:`${q}px`,height:"100%",opacity:Z?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[x.visible&&$e("div",{className:"overlay-scrollbar-track-background",onClick:t=>{t.preventDefault(),t.stopPropagation(),r(t)},style:{position:"absolute",top:B?`${V.width+x.margin*2}px`:`${x.margin}px`,right:x.alignment==="right"?"0px":`${(q-V.width)/2}px`,width:`${V.width}px`,height:B?`calc(100% - ${V.width*2+x.margin*4}px)`:`calc(100% - ${x.margin*2}px)`,backgroundColor:x.color,borderRadius:`${x.radius}px`,cursor:"pointer"}}),$e("div",{ref:ye,className:"overlay-scrollbar-thumb",onMouseDown:et,onMouseEnter:()=>Ee(!0),onMouseLeave:()=>Ee(!1),style:{position:"absolute",top:`${(B?C+x.margin*2:x.margin)+Ue}px`,right:x.alignment==="right"?"0px":`${(q-C)/2}px`,width:`${C}px`,height:`${Math.max(ue,fe)}px`,backgroundColor:se||N?V.hoverColor:V.color,opacity:se||N?V.hoverOpacity:V.opacity,borderRadius:`${V.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]}),W&&Oe&&B&&$e("div",{className:"overlay-scrollbar-up-arrow",onClick:u,onMouseEnter:()=>ve("up"),onMouseLeave:()=>ve(null),style:{position:"absolute",top:`${x.margin}px`,right:x.alignment==="right"?"0px":`${(q-C)/2}px`,width:`${C}px`,height:`${C}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(C*.75,8)}px`,color:h==="up"?j.hoverColor:j.color,userSelect:"none",zIndex:1001,opacity:Z?h==="up"?j.hoverOpacity:j.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25B2"}),W&&Oe&&B&&$e("div",{className:"overlay-scrollbar-down-arrow",onClick:g,onMouseEnter:()=>ve("down"),onMouseLeave:()=>ve(null),style:{position:"absolute",bottom:`${x.margin}px`,right:x.alignment==="right"?"0px":`${(q-C)/2}px`,width:`${C}px`,height:`${C}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(C*.75,8)}px`,color:h==="down"?j.hoverColor:j.color,userSelect:"none",zIndex:1001,opacity:Z?h==="down"?j.hoverOpacity:j.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25BC"})]})}),dt=It;import{Fragment as Ge,jsx as d,jsxs as Re}from"react/jsx-runtime";var Vt={alignment:"right",margin:0,radius:0},pt=5;function Wt({data:l,loading:m=!1,columns:f,onRowClick:D,getRowId:H,selectedRowId:w,selectedRowSx:b,rowHeight:M=50,columnHeight:I=56,striped:G,rowDivider:J=!0,onSort:W,onLoadMore:Q,sortBy:$,sortDirection:X,showPaper:be=!0,paddingX:a="1rem",paddingTop:U=0,paddingBottom:xe=0,rowHoverColor:ye,rowHoverOpacity:z,viewportBuffer:Z,overscan:k,scrollbars:N,emptyMessage:ae="NO DATA",LoadingComponent:se,showFooter:Ee,footerHeight:ee,footerSx:ce}){let ue=Math.max(M*12,480),Xe=Math.max(M*12,480),Ue=typeof Z=="number"?Z:Z?.top??ue,We=typeof Z=="number"?Z:Z?.bottom??Xe,Oe=Math.max(M*8,420),je=Math.max(M*10,520),Ce=typeof k=="number"?k:{main:k?.main??Oe,reverse:k?.reverse??je},Se=M+(J?1:0),de=!b||typeof b!="function",Ze=Ke(()=>!de||w===null||w===void 0||!b?null:{[`& tbody tr[data-row-id="${String(w).replace(/["\\]/g,"\\$&")}"]`]:b},[de,w,b]),ft=typeof window<"u"&&(window.location.hostname==="localhost"||window.location.hostname==="127.0.0.1"),[L]=nt(()=>typeof window>"u"?!1:window.localStorage.getItem("vdt-perf-debug")==="1"),h=K({wheelEvents:0,wheelInputPx:0,wheelHandlerMs:0,wheelRafFlushes:0,wheelRafMs:0,rangeChangedCalls:0,rangeChangedMs:0,rowContentCalls:0,rowContentMs:0,rowContentMaxMs:0,cellRenderCalls:0,cellRenderMs:0,cellRenderMaxMs:0}),ve=De(o=>{if(!L)return;let r=h.current;if(!(r.wheelEvents>0||r.rangeChangedCalls>0||r.rowContentCalls>0||r.cellRenderCalls>0))return;let g=r.rowContentCalls>0?r.rowContentMs/r.rowContentCalls:0,p=r.cellRenderCalls>0?r.cellRenderMs/r.cellRenderCalls:0;console.log("[VDT perf]",{reason:o,wheel:{events:r.wheelEvents,inputPx:Math.round(r.wheelInputPx),handlerMs:Number(r.wheelHandlerMs.toFixed(2)),rafFlushes:r.wheelRafFlushes,rafMs:Number(r.wheelRafMs.toFixed(2))},rangeChanged:{calls:r.rangeChangedCalls,totalMs:Number(r.rangeChangedMs.toFixed(2))},rowContent:{calls:r.rowContentCalls,totalMs:Number(r.rowContentMs.toFixed(2)),avgMs:Number(g.toFixed(3)),maxMs:Number(r.rowContentMaxMs.toFixed(3))},cellRender:{calls:r.cellRenderCalls,totalMs:Number(r.cellRenderMs.toFixed(2)),avgMs:Number(p.toFixed(3)),maxMs:Number(r.cellRenderMaxMs.toFixed(3))}}),h.current={wheelEvents:0,wheelInputPx:0,wheelHandlerMs:0,wheelRafFlushes:0,wheelRafMs:0,rangeChangedCalls:0,rangeChangedMs:0,rowContentCalls:0,rowContentMs:0,rowContentMaxMs:0,cellRenderCalls:0,cellRenderMs:0,cellRenderMaxMs:0}},[L]);ge(()=>{if(!L||typeof window>"u")return;console.log("[VDT perf] enabled (localStorage vdt-perf-debug=1)");let o=window.setInterval(()=>{ve("interval")},1500);return()=>{window.clearInterval(o),ve("cleanup")}},[ve,L]);let Je=Ke(()=>Ye((o,r)=>{let u=K(null),g=K(0),p=K(null);return ge(()=>{let e=u.current;if(!e)return;let P=q=>{let t=L?performance.now():0;q.preventDefault();let n=q.deltaY;q.deltaMode===1?n*=40:q.deltaMode===2&&(n*=e.clientHeight),L&&(h.current.wheelEvents+=1,h.current.wheelInputPx+=n),g.current+=n,p.current===null&&(p.current=requestAnimationFrame(()=>{let i=L?performance.now():0,c=Math.max(e.clientHeight*.4,160),s=Math.max(-c,Math.min(c,g.current));g.current=0,p.current=null,s!==0&&(e.scrollTop+=s),L&&(h.current.wheelRafFlushes+=1,h.current.wheelRafMs+=performance.now()-i)}),L&&(h.current.wheelHandlerMs+=performance.now()-t))};return e.addEventListener("wheel",P,{passive:!1}),()=>{e.removeEventListener("wheel",P),p.current!==null&&(cancelAnimationFrame(p.current),p.current=null),g.current=0}},[]),d(dt,{detectInnerScroll:!0,track:Vt,...N,children:d(Ft,{component:Me,...o,ref:e=>{u.current=e,typeof r=="function"?r(e):r&&(r.current=e)},sx:{userSelect:"auto",WebkitUserSelect:"auto",position:"relative",width:"100%",height:"100%",overflow:"auto",display:"flex",flexDirection:"column",scrollbarWidth:"none",msOverflowStyle:"none",transform:"translateZ(0)",backfaceVisibility:"hidden",willChange:"scroll-position","&::-webkit-scrollbar":{display:"none"},"& .MuiTable-root":{paddingRight:a,paddingTop:U,paddingBottom:xe}}})})}),[]),Fe=Ke(()=>{if(G===!0)return"#f5f5f5";if(typeof G=="string")return G},[G]),[Te,Pe]=nt(m),[_e,ke]=nt(0);ge(()=>{m&&Pe(!0)},[m]);let we=De(()=>{Pe(!1)},[]),pe=Te,V=m&&l.length>0,x=K(!1),j=K(-1),Le=K(null),y=K(D);y.current=D;let C=K(H);C.current=H;let Ae=!!D,fe=K(!1),B=K({x:0,y:0});ge(()=>{let o=r=>{let u=r.clientX-B.current.x,g=r.clientY-B.current.y;Math.sqrt(u*u+g*g)>pt&&(fe.current=!0)};return document.addEventListener("mousemove",o),()=>{document.removeEventListener("mousemove",o)}},[]),ge(()=>{let o=document.querySelector('[data-testid="virtuoso-scroller"]');o&&o.querySelectorAll(".MuiTableSortLabel-root").forEach(u=>{let g=new MouseEvent("mouseleave",{bubbles:!0,cancelable:!0});u.dispatchEvent(g)})},[$]);let he=De(o=>{if(!W)return;W(o,$===o&&X==="asc"?"desc":"asc")},[W,$,X]),ne=De(o=>{let r=L?performance.now():0;if(!Q){L&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-r);return}if(m&&l.length===0){L&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-r);return}let u=l.length>=30,g=o>=l.length-1,p=j.current===l.length;if(g&&u&&!x.current&&!p){x.current=!0,j.current=l.length;let e=l.length;Q(e,50)}L&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-r)},[l.length,m,Q,L]);ge(()=>{x.current=!1},[l.length]),ge(()=>{m||(x.current=!1)},[m]),ge(()=>{l.length===0&&ke(o=>o+1)},[l.length]);let S=K(l.length),oe=K(void 0);ge(()=>{let o=S.current,r=l.length,u=r>0?C.current?C.current(l[0],0):l[0]:void 0,g=oe.current;if(r>o&&o>0){S.current=r,oe.current=u;return}let p=r<o||o>0&&u!==g;Le.current&&r>0&&p&&Le.current.scrollToIndex({index:0,align:"start",behavior:"auto"}),S.current=r,oe.current=u},[l]);let O=De(()=>{let o={},r=[];if(f.forEach(e=>{e.group?(o[e.group]||(o[e.group]=[]),o[e.group].push(e)):r.push(e)}),!(Object.keys(o).length>0))return d(Ve,{children:f.map(e=>d(Ne,{align:e.align||"left",style:{width:e.width,minWidth:e.width,...e.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e.sortable?d("div",{style:{display:"flex",alignItems:"center",justifyContent:e.align==="center"?"center":e.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:Re(Me,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>he(String(e.id)),children:[e.text,d(ot,{active:$===e.id,direction:$===e.id?X:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:$===e.id?1:0,transition:"opacity 0.2s ease","& .MuiTableSortLabel-icon":{position:"relative",marginLeft:0,marginRight:0,opacity:1,transition:"color 0.2s ease"},"& .MuiTableSortLabel-iconDirectionAsc":{transform:"rotate(180deg)"},"& .MuiTableSortLabel-iconDirectionDesc":{transform:"rotate(0deg)"}}})]})}):e.text},String(e.id)))});let g=[...r.map(e=>d(Ne,{rowSpan:2,align:e.align||"left",style:{width:e.width,minWidth:e.width,...e.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e.sortable&&W?d("div",{style:{display:"flex",alignItems:"center",justifyContent:e.align==="center"?"center":e.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:Re(Me,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>he(String(e.id)),children:[e.text,d(ot,{active:$===e.id,direction:$===e.id?X:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:$===e.id?1:0,transition:"opacity 0.2s ease","&:hover":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}},"& .MuiTableSortLabel-icon":{position:"relative",marginLeft:0,marginRight:0,opacity:1,transition:"color 0.2s ease"},"& .MuiTableSortLabel-iconDirectionAsc":{transform:"rotate(180deg)"},"& .MuiTableSortLabel-iconDirectionDesc":{transform:"rotate(0deg)"}}})]})}):e.text},String(e.id))),...Object.entries(o).map(([e,P])=>d(Ne,{align:"center",colSpan:P.length,style:{fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e},e))],p=[...Object.values(o).flat().map(e=>d(Ne,{align:e.align||"left",style:{width:e.width,minWidth:e.width,...e.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e.sortable&&W?d("div",{style:{display:"flex",alignItems:"center",justifyContent:e.align==="center"?"center":e.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:Re(Me,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>he(String(e.id)),children:[e.text,d(ot,{active:$===e.id,direction:$===e.id?X:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:$===e.id?1:0,transition:"opacity 0.2s ease","&:hover":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}},"& .MuiTableSortLabel-icon":{position:"relative",marginLeft:0,marginRight:0,opacity:1,transition:"color 0.2s ease"},"& .MuiTableSortLabel-iconDirectionAsc":{transform:"rotate(0deg)"},"& .MuiTableSortLabel-iconDirectionDesc":{transform:"rotate(180deg)"}}})]})}):e.text},String(e.id)))];return Re(Ge,{children:[d(Ve,{children:g}),d(Ve,{children:p})]})},[f,$,X,he,W,I]),Qe=De((o,r)=>{let u=L?performance.now():0;if(!r){if(L){h.current.rowContentCalls+=1;let p=performance.now()-u;h.current.rowContentMs+=p,h.current.rowContentMaxMs=Math.max(h.current.rowContentMaxMs,p)}return null}let g=f.map(p=>{let e=L?performance.now():0,P=p.render?p.render(r,o):String(r[p.id]||"");if(L){let q=performance.now()-e;h.current.cellRenderCalls+=1,h.current.cellRenderMs+=q,h.current.cellRenderMaxMs=Math.max(h.current.cellRenderMaxMs,q)}return d(Ne,{align:p.align||"left",style:{width:p.width,minWidth:p.width,...p.style,padding:"8px 16px"},children:P},String(p.id))});if(L){h.current.rowContentCalls+=1;let p=performance.now()-u;h.current.rowContentMs+=p,h.current.rowContentMaxMs=Math.max(h.current.rowContentMaxMs,p)}return d(Ge,{children:g})},[f,L]),ie=Ee??f.some(o=>typeof o.footer=="function"),F=De(()=>{if(!ie)return null;let o=[];for(let r=0;r<f.length;r+=1){let u=f[r],g=u.footerColSpan&&u.footerColSpan>1?Math.min(u.footerColSpan,f.length-r):1;o.push(d(Ne,{align:u.align||"left",colSpan:g>1?g:void 0,style:{...g>1?{}:{width:u.width,minWidth:u.width},...u.style,fontWeight:"bold",padding:"16px"},children:u.footer?u.footer(l):null},String(u.id))),r+=g-1}return d(Ve,{children:o})},[ie,f,l]),et=Ke(()=>({Scroller:Je,Table:o=>d(Nt,{...o,sx:{borderCollapse:"separate",tableLayout:"fixed",marginRight:"16px",...ie?{height:"100%"}:{}}}),TableHead:Ye((o,r)=>d(Pt,{...o,ref:r,sx:{userSelect:"none","& tr":{height:I,"& th":{padding:"16px",position:"sticky",top:0,zIndex:2,fontWeight:"bold"}}}})),TableRow:o=>{let{item:r,selected:u,"aria-selected":g,className:p,...e}=o,P=e["data-index"]??0,q=P%2===1,t=r&&C.current?C.current(r,P):P,n=!de&&w!==null&&w!==void 0&&t===w,i=n&&b?typeof b=="function"?b(r,P):b:void 0,c=String(p??"").split(/\s+/).filter(s=>s!=="Mui-selected"&&s!=="Mui-focusVisible").join(" ");return d(Ve,{...e,"data-row-id":t!=null?String(t):void 0,className:c||void 0,selected:n,onMouseDown:s=>{fe.current=!1,B.current={x:s.clientX,y:s.clientY}},onClick:s=>{let v=s.clientX-B.current.x,R=s.clientY-B.current.y;if(Math.sqrt(v*v+R*R)>pt||fe.current){s.preventDefault(),s.stopPropagation(),fe.current=!1;return}r&&y.current&&y.current(r,P),fe.current=!1},sx:[{userSelect:"none",height:Se,maxHeight:Se,boxSizing:"border-box",backgroundColor:q&&Fe?Fe:"transparent","& td":{padding:"8px 16px",boxSizing:"border-box",borderBottom:J?"1px solid rgba(224, 224, 224, 1)":"none"},"& th":{padding:"8px 16px",borderBottom:"none"},"&:hover":Ae&&!n?{backgroundColor:s=>{let v=s.palette.mode==="dark",E=ye??"#000000",te=z??.06;if(!ye)return v?`rgba(255, 255, 255, ${te})`:`rgba(0, 0, 0, ${te})`;let le=E.replace("#","").trim();if(le.length!==6)return E;let _=parseInt(le.substring(0,2),16),ze=parseInt(le.substring(2,4),16),Ie=parseInt(le.substring(4,6),16);return`rgba(${_}, ${ze}, ${Ie}, ${te})`}}:void 0,cursor:Ae?"pointer":void 0},i]})},TableBody:Ye((o,r)=>{let{children:u,...g}=o;return Re(Ot,{...g,ref:r,sx:ie?{height:"100%"}:void 0,children:[u,ie&&d("tr",{"aria-hidden":!0,style:{height:"100%"},children:d("td",{colSpan:f.length,style:{padding:0,border:0}})})]})}),TableFoot:Ye((o,r)=>d(At,{...o,ref:r,sx:[{"& tr":{height:ee??M,maxHeight:ee??M,boxSizing:"border-box"},"& td":{height:ee??M,boxSizing:"border-box",backgroundColor:u=>u.palette.mode==="dark"?"#1e1e1e":"#ffffff",padding:"0 16px",color:"inherit",fontSize:"0.875rem",border:"none",boxShadow:"inset 0 1px 0 0 #000000"}},...Array.isArray(ce)?ce:ce?[ce]:[]]}))}),[Ae,de?null:w,b,M,Fe,J,I,ye,z,Je,ee,ce,ie,f]),He=Re(Me,{sx:{position:"relative",height:"100%",width:"100%","& .MuiTableHead-root":{backgroundColor:o=>o.palette.mode==="dark"?"#1e1e1e !important":"#ffffff !important"},...Ze??{}},children:[d(qt,{ref:Le,data:l,totalCount:Q?l.length+1:l.length,defaultItemHeight:Se,fixedItemHeight:Se,fixedHeaderContent:O,fixedFooterContent:ie?F:void 0,itemContent:Qe,endReached:ne,style:{height:"100%"},increaseViewportBy:{top:Ue,bottom:We},overscan:Ce,followOutput:!1,components:et},_e),l.length===0&&!m&&d(Me,{sx:{position:"absolute",top:0,left:0,right:0,bottom:0,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2},children:typeof ae=="string"?Re(Ge,{children:[d(Me,{sx:{width:48,height:48,display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"50%",backgroundColor:"#f5f5f5",color:"#999"},children:"\u{1F4C4}"}),d(Bt,{variant:"body1",sx:{color:"text.secondary"},children:ae})]}):ae}),pe&&d(Ge,{children:se?d(se,{visible:m,onComplete:we}):d(lt,{visible:m,onComplete:we,size:40,indicator:d(st,{}),sx:{top:`${f.some(o=>o.group)?I*2:I}px`,bottom:`${ie?ee??M:0}px`},background:{show:l.length===0,opacity:.8}})})]});return be?d(zt,{className:"grow",elevation:1,sx:{padding:0,paddingLeft:a,height:"100%",minHeight:0,flex:1,display:"flex",flexDirection:"column"},children:He}):d(Me,{className:"grow",style:{padding:0,paddingLeft:a,height:"100%",minHeight:0,flex:1,display:"flex",flexDirection:"column"},children:He})}var jt=$t(Wt);export{jt as VirtualDataTable};
|
|
24
|
+
`,document.head.appendChild(i),()=>{let c=document.getElementById(t);c&&c.remove()}},[]),ut("div",{ref:ge,className:`overlay-scrollbar-wrapper ${l}`,style:{display:"flex",flexDirection:"column",position:"relative",minHeight:0,height:"100%",flex:"1 1 0%",...m},children:[$e("div",{ref:a,className:"overlay-scrollbar-container",tabIndex:-1,onMouseDown:p,style:{display:"flex",width:"100%",flex:"1 1 auto",minHeight:0,overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none",outline:"none",userSelect:Ce?"none":"auto",...f},children:$e("div",{ref:U,className:"overlay-scrollbar-content",style:{flex:"1 1 0%",minHeight:0,display:"flex",flexDirection:"column",...D},children:H})}),j&&Oe&&ut("div",{ref:be,className:"overlay-scrollbar-track",onMouseEnter:()=>{O(),ve.current=setTimeout(()=>{k(!0),ve.current=null},100)},onMouseLeave:()=>{Qe(),N||F(x.delay)},style:{position:"absolute",top:0,right:0,width:`${q}px`,height:"100%",opacity:Z?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[v.visible&&$e("div",{className:"overlay-scrollbar-track-background",onClick:t=>{t.preventDefault(),t.stopPropagation(),r(t)},style:{position:"absolute",top:B?`${V.width+v.margin*2}px`:`${v.margin}px`,right:v.alignment==="right"?"0px":`${(q-V.width)/2}px`,width:`${V.width}px`,height:B?`calc(100% - ${V.width*2+v.margin*4}px)`:`calc(100% - ${v.margin*2}px)`,backgroundColor:v.color,borderRadius:`${v.radius}px`,cursor:"pointer"}}),$e("div",{ref:xe,className:"overlay-scrollbar-thumb",onMouseDown:et,onMouseEnter:()=>Ee(!0),onMouseLeave:()=>Ee(!1),style:{position:"absolute",top:`${(B?C+v.margin*2:v.margin)+Ue}px`,right:v.alignment==="right"?"0px":`${(q-C)/2}px`,width:`${C}px`,height:`${Math.max(ue,fe)}px`,backgroundColor:se||N?V.hoverColor:V.color,opacity:se||N?V.hoverOpacity:V.opacity,borderRadius:`${V.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]}),j&&Oe&&B&&$e("div",{className:"overlay-scrollbar-up-arrow",onClick:u,onMouseEnter:()=>ye("up"),onMouseLeave:()=>ye(null),style:{position:"absolute",top:`${v.margin}px`,right:v.alignment==="right"?"0px":`${(q-C)/2}px`,width:`${C}px`,height:`${C}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(C*.75,8)}px`,color:h==="up"?W.hoverColor:W.color,userSelect:"none",zIndex:1001,opacity:Z?h==="up"?W.hoverOpacity:W.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25B2"}),j&&Oe&&B&&$e("div",{className:"overlay-scrollbar-down-arrow",onClick:g,onMouseEnter:()=>ye("down"),onMouseLeave:()=>ye(null),style:{position:"absolute",bottom:`${v.margin}px`,right:v.alignment==="right"?"0px":`${(q-C)/2}px`,width:`${C}px`,height:`${C}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(C*.75,8)}px`,color:h==="down"?W.hoverColor:W.color,userSelect:"none",zIndex:1001,opacity:Z?h==="down"?W.hoverOpacity:W.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25BC"})]})}),dt=It;import{Fragment as Ge,jsx as d,jsxs as Re}from"react/jsx-runtime";var Vt={alignment:"right",margin:0,radius:0},pt=5;function Wt({data:l,loading:m=!1,columns:f,onRowClick:D,getRowId:H,selectedRowId:w,selectedRowSx:b,rowHeight:M=50,columnHeight:I=56,striped:G,rowDivider:J=!0,onSort:j,onLoadMore:Q,sortBy:$,sortDirection:X,showPaper:ge=!0,paddingX:a="1rem",paddingTop:U=0,paddingBottom:be=0,rowHoverColor:xe,rowHoverOpacity:z,viewportBuffer:Z,overscan:k,scrollbars:N,emptyMessage:ae="NO DATA",LoadingComponent:se,showFooter:Ee,footerHeight:ee,footerSx:ce}){let ue=Math.max(M*12,480),Xe=Math.max(M*12,480),Ue=typeof Z=="number"?Z:Z?.top??ue,We=typeof Z=="number"?Z:Z?.bottom??Xe,Oe=Math.max(M*8,420),je=Math.max(M*10,520),Ce=typeof k=="number"?k:{main:k?.main??Oe,reverse:k?.reverse??je},Se=M+(J?1:0),de=!b||typeof b!="function",Ze=Ke(()=>!de||w===null||w===void 0||!b?null:{[`& tbody tr[data-row-id="${String(w).replace(/["\\]/g,"\\$&")}"]`]:b},[de,w,b]),ft=typeof window<"u"&&(window.location.hostname==="localhost"||window.location.hostname==="127.0.0.1"),[L]=nt(()=>typeof window>"u"?!1:window.localStorage.getItem("vdt-perf-debug")==="1"),h=K({wheelEvents:0,wheelInputPx:0,wheelHandlerMs:0,wheelRafFlushes:0,wheelRafMs:0,rangeChangedCalls:0,rangeChangedMs:0,rowContentCalls:0,rowContentMs:0,rowContentMaxMs:0,cellRenderCalls:0,cellRenderMs:0,cellRenderMaxMs:0}),ye=De(o=>{if(!L)return;let r=h.current;if(!(r.wheelEvents>0||r.rangeChangedCalls>0||r.rowContentCalls>0||r.cellRenderCalls>0))return;let g=r.rowContentCalls>0?r.rowContentMs/r.rowContentCalls:0,p=r.cellRenderCalls>0?r.cellRenderMs/r.cellRenderCalls:0;console.log("[VDT perf]",{reason:o,wheel:{events:r.wheelEvents,inputPx:Math.round(r.wheelInputPx),handlerMs:Number(r.wheelHandlerMs.toFixed(2)),rafFlushes:r.wheelRafFlushes,rafMs:Number(r.wheelRafMs.toFixed(2))},rangeChanged:{calls:r.rangeChangedCalls,totalMs:Number(r.rangeChangedMs.toFixed(2))},rowContent:{calls:r.rowContentCalls,totalMs:Number(r.rowContentMs.toFixed(2)),avgMs:Number(g.toFixed(3)),maxMs:Number(r.rowContentMaxMs.toFixed(3))},cellRender:{calls:r.cellRenderCalls,totalMs:Number(r.cellRenderMs.toFixed(2)),avgMs:Number(p.toFixed(3)),maxMs:Number(r.cellRenderMaxMs.toFixed(3))}}),h.current={wheelEvents:0,wheelInputPx:0,wheelHandlerMs:0,wheelRafFlushes:0,wheelRafMs:0,rangeChangedCalls:0,rangeChangedMs:0,rowContentCalls:0,rowContentMs:0,rowContentMaxMs:0,cellRenderCalls:0,cellRenderMs:0,cellRenderMaxMs:0}},[L]);we(()=>{if(!L||typeof window>"u")return;console.log("[VDT perf] enabled (localStorage vdt-perf-debug=1)");let o=window.setInterval(()=>{ye("interval")},1500);return()=>{window.clearInterval(o),ye("cleanup")}},[ye,L]);let Je=Ke(()=>Ye((o,r)=>{let u=K(null),g=K(0),p=K(null);return we(()=>{let e=u.current;if(!e)return;let P=q=>{let t=L?performance.now():0;q.preventDefault();let n=q.deltaY;q.deltaMode===1?n*=40:q.deltaMode===2&&(n*=e.clientHeight),L&&(h.current.wheelEvents+=1,h.current.wheelInputPx+=n),g.current+=n,p.current===null&&(p.current=requestAnimationFrame(()=>{let i=L?performance.now():0,c=Math.max(e.clientHeight*.4,160),s=Math.max(-c,Math.min(c,g.current));g.current=0,p.current=null,s!==0&&(e.scrollTop+=s),L&&(h.current.wheelRafFlushes+=1,h.current.wheelRafMs+=performance.now()-i)}),L&&(h.current.wheelHandlerMs+=performance.now()-t))};return e.addEventListener("wheel",P,{passive:!1}),()=>{e.removeEventListener("wheel",P),p.current!==null&&(cancelAnimationFrame(p.current),p.current=null),g.current=0}},[]),d(dt,{detectInnerScroll:!0,track:Vt,...N,children:d(Ft,{component:Me,...o,ref:e=>{u.current=e,typeof r=="function"?r(e):r&&(r.current=e)},sx:{userSelect:"auto",WebkitUserSelect:"auto",position:"relative",width:"100%",height:"100%",overflow:"auto",display:"flex",flexDirection:"column",scrollbarWidth:"none",msOverflowStyle:"none",transform:"translateZ(0)",backfaceVisibility:"hidden",willChange:"scroll-position","&::-webkit-scrollbar":{display:"none"},"& .MuiTable-root":{paddingRight:a,paddingTop:U,paddingBottom:be}}})})}),[]),Fe=Ke(()=>{if(G===!0)return"#f5f5f5";if(typeof G=="string")return G},[G]),[Te,Pe]=nt(m),[_e,ke]=nt(0);we(()=>{m&&Pe(!0)},[m]);let ve=De(()=>{Pe(!1)},[]),pe=Te,V=m&&l.length>0,v=K(!1),W=K(-1),Le=K(null),x=K(D);x.current=D;let C=K(H);C.current=H;let Ae=!!D,fe=K(!1),B=K({x:0,y:0});we(()=>{let o=r=>{let u=r.clientX-B.current.x,g=r.clientY-B.current.y;Math.sqrt(u*u+g*g)>pt&&(fe.current=!0)};return document.addEventListener("mousemove",o),()=>{document.removeEventListener("mousemove",o)}},[]),we(()=>{let o=document.querySelector('[data-testid="virtuoso-scroller"]');o&&o.querySelectorAll(".MuiTableSortLabel-root").forEach(u=>{let g=new MouseEvent("mouseleave",{bubbles:!0,cancelable:!0});u.dispatchEvent(g)})},[$]);let he=De(o=>{if(!j)return;j(o,$===o&&X==="asc"?"desc":"asc")},[j,$,X]),ne=De(o=>{let r=L?performance.now():0;if(!Q){L&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-r);return}if(m&&l.length===0){L&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-r);return}let u=l.length>=30,g=o>=l.length-1,p=W.current===l.length;if(g&&u&&!v.current&&!p){v.current=!0,W.current=l.length;let e=l.length;Q(e,50)}L&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-r)},[l.length,m,Q,L]);we(()=>{m||(v.current=!1)},[m]),we(()=>{l.length===0&&ke(o=>o+1)},[l.length]);let S=K(l.length),oe=K(void 0);we(()=>{let o=S.current,r=l.length,u=r>0?C.current?C.current(l[0],0):l[0]:void 0,g=oe.current;if(r>o&&o>0){S.current=r,oe.current=u;return}let p=r<o||o>0&&u!==g;p&&(W.current=-1),Le.current&&r>0&&p&&Le.current.scrollToIndex({index:0,align:"start",behavior:"auto"}),S.current=r,oe.current=u},[l]);let O=De(()=>{let o={},r=[];if(f.forEach(e=>{e.group?(o[e.group]||(o[e.group]=[]),o[e.group].push(e)):r.push(e)}),!(Object.keys(o).length>0))return d(Ve,{children:f.map(e=>d(Ne,{align:e.align||"left",style:{width:e.width,minWidth:e.width,...e.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e.sortable?d("div",{style:{display:"flex",alignItems:"center",justifyContent:e.align==="center"?"center":e.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:Re(Me,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>he(String(e.id)),children:[e.text,d(ot,{active:$===e.id,direction:$===e.id?X:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:$===e.id?1:0,transition:"opacity 0.2s ease","& .MuiTableSortLabel-icon":{position:"relative",marginLeft:0,marginRight:0,opacity:1,transition:"color 0.2s ease"},"& .MuiTableSortLabel-iconDirectionAsc":{transform:"rotate(180deg)"},"& .MuiTableSortLabel-iconDirectionDesc":{transform:"rotate(0deg)"}}})]})}):e.text},String(e.id)))});let g=[...r.map(e=>d(Ne,{rowSpan:2,align:e.align||"left",style:{width:e.width,minWidth:e.width,...e.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e.sortable&&j?d("div",{style:{display:"flex",alignItems:"center",justifyContent:e.align==="center"?"center":e.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:Re(Me,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>he(String(e.id)),children:[e.text,d(ot,{active:$===e.id,direction:$===e.id?X:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:$===e.id?1:0,transition:"opacity 0.2s ease","&:hover":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}},"& .MuiTableSortLabel-icon":{position:"relative",marginLeft:0,marginRight:0,opacity:1,transition:"color 0.2s ease"},"& .MuiTableSortLabel-iconDirectionAsc":{transform:"rotate(180deg)"},"& .MuiTableSortLabel-iconDirectionDesc":{transform:"rotate(0deg)"}}})]})}):e.text},String(e.id))),...Object.entries(o).map(([e,P])=>d(Ne,{align:"center",colSpan:P.length,style:{fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e},e))],p=[...Object.values(o).flat().map(e=>d(Ne,{align:e.align||"left",style:{width:e.width,minWidth:e.width,...e.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:e.sortable&&j?d("div",{style:{display:"flex",alignItems:"center",justifyContent:e.align==="center"?"center":e.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:Re(Me,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>he(String(e.id)),children:[e.text,d(ot,{active:$===e.id,direction:$===e.id?X:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:$===e.id?1:0,transition:"opacity 0.2s ease","&:hover":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}},"& .MuiTableSortLabel-icon":{position:"relative",marginLeft:0,marginRight:0,opacity:1,transition:"color 0.2s ease"},"& .MuiTableSortLabel-iconDirectionAsc":{transform:"rotate(0deg)"},"& .MuiTableSortLabel-iconDirectionDesc":{transform:"rotate(180deg)"}}})]})}):e.text},String(e.id)))];return Re(Ge,{children:[d(Ve,{children:g}),d(Ve,{children:p})]})},[f,$,X,he,j,I]),Qe=De((o,r)=>{let u=L?performance.now():0;if(!r){if(L){h.current.rowContentCalls+=1;let p=performance.now()-u;h.current.rowContentMs+=p,h.current.rowContentMaxMs=Math.max(h.current.rowContentMaxMs,p)}return null}let g=f.map(p=>{let e=L?performance.now():0,P=p.render?p.render(r,o):String(r[p.id]||"");if(L){let q=performance.now()-e;h.current.cellRenderCalls+=1,h.current.cellRenderMs+=q,h.current.cellRenderMaxMs=Math.max(h.current.cellRenderMaxMs,q)}return d(Ne,{align:p.align||"left",style:{width:p.width,minWidth:p.width,...p.style,padding:"8px 16px"},children:P},String(p.id))});if(L){h.current.rowContentCalls+=1;let p=performance.now()-u;h.current.rowContentMs+=p,h.current.rowContentMaxMs=Math.max(h.current.rowContentMaxMs,p)}return d(Ge,{children:g})},[f,L]),ie=Ee??f.some(o=>typeof o.footer=="function"),F=De(()=>{if(!ie)return null;let o=[];for(let r=0;r<f.length;r+=1){let u=f[r],g=u.footerColSpan&&u.footerColSpan>1?Math.min(u.footerColSpan,f.length-r):1;o.push(d(Ne,{align:u.align||"left",colSpan:g>1?g:void 0,style:{...g>1?{}:{width:u.width,minWidth:u.width},...u.style,fontWeight:"bold",padding:"16px"},children:u.footer?u.footer(l):null},String(u.id))),r+=g-1}return d(Ve,{children:o})},[ie,f,l]),et=Ke(()=>({Scroller:Je,Table:o=>d(Nt,{...o,sx:{borderCollapse:"separate",tableLayout:"fixed",marginRight:"16px",...ie?{height:"100%"}:{}}}),TableHead:Ye((o,r)=>d(Pt,{...o,ref:r,sx:{userSelect:"none","& tr":{height:I,"& th":{padding:"16px",position:"sticky",top:0,zIndex:2,fontWeight:"bold"}}}})),TableRow:o=>{let{item:r,selected:u,"aria-selected":g,className:p,...e}=o,P=e["data-index"]??0,q=P%2===1,t=r&&C.current?C.current(r,P):P,n=!de&&w!==null&&w!==void 0&&t===w,i=n&&b?typeof b=="function"?b(r,P):b:void 0,c=String(p??"").split(/\s+/).filter(s=>s!=="Mui-selected"&&s!=="Mui-focusVisible").join(" ");return d(Ve,{...e,"data-row-id":t!=null?String(t):void 0,className:c||void 0,selected:n,onMouseDown:s=>{fe.current=!1,B.current={x:s.clientX,y:s.clientY}},onClick:s=>{let y=s.clientX-B.current.x,R=s.clientY-B.current.y;if(Math.sqrt(y*y+R*R)>pt||fe.current){s.preventDefault(),s.stopPropagation(),fe.current=!1;return}r&&x.current&&x.current(r,P),fe.current=!1},sx:[{userSelect:"none",height:Se,maxHeight:Se,boxSizing:"border-box",backgroundColor:q&&Fe?Fe:"transparent","& td":{padding:"8px 16px",boxSizing:"border-box",borderBottom:J?"1px solid rgba(224, 224, 224, 1)":"none"},"& th":{padding:"8px 16px",borderBottom:"none"},"&:hover":Ae&&!n?{backgroundColor:s=>{let y=s.palette.mode==="dark",E=xe??"#000000",te=z??.06;if(!xe)return y?`rgba(255, 255, 255, ${te})`:`rgba(0, 0, 0, ${te})`;let le=E.replace("#","").trim();if(le.length!==6)return E;let _=parseInt(le.substring(0,2),16),ze=parseInt(le.substring(2,4),16),Ie=parseInt(le.substring(4,6),16);return`rgba(${_}, ${ze}, ${Ie}, ${te})`}}:void 0,cursor:Ae?"pointer":void 0},i]})},TableBody:Ye((o,r)=>{let{children:u,...g}=o;return Re(Ot,{...g,ref:r,sx:ie?{height:"100%"}:void 0,children:[u,ie&&d("tr",{"aria-hidden":!0,style:{height:"100%"},children:d("td",{colSpan:f.length,style:{padding:0,border:0}})})]})}),TableFoot:Ye((o,r)=>d(At,{...o,ref:r,sx:[{"& tr":{height:ee??M,maxHeight:ee??M,boxSizing:"border-box"},"& td":{height:ee??M,boxSizing:"border-box",backgroundColor:u=>u.palette.mode==="dark"?"#1e1e1e":"#ffffff",padding:"0 16px",color:"inherit",fontSize:"0.875rem",border:"none",boxShadow:"inset 0 1px 0 0 #000000"}},...Array.isArray(ce)?ce:ce?[ce]:[]]}))}),[Ae,de?null:w,b,M,Fe,J,I,xe,z,Je,ee,ce,ie,f]),He=Re(Me,{sx:{position:"relative",height:"100%",width:"100%","& .MuiTableHead-root":{backgroundColor:o=>o.palette.mode==="dark"?"#1e1e1e !important":"#ffffff !important"},...Ze??{}},children:[d(qt,{ref:Le,data:l,totalCount:Q?l.length+1:l.length,defaultItemHeight:Se,fixedItemHeight:Se,fixedHeaderContent:O,fixedFooterContent:ie?F:void 0,itemContent:Qe,endReached:ne,style:{height:"100%"},increaseViewportBy:{top:Ue,bottom:We},overscan:Ce,followOutput:!1,components:et},_e),l.length===0&&!m&&d(Me,{sx:{position:"absolute",top:0,left:0,right:0,bottom:0,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2},children:typeof ae=="string"?Re(Ge,{children:[d(Me,{sx:{width:48,height:48,display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"50%",backgroundColor:"#f5f5f5",color:"#999"},children:"\u{1F4C4}"}),d(Bt,{variant:"body1",sx:{color:"text.secondary"},children:ae})]}):ae}),pe&&d(Ge,{children:se?d(se,{visible:m,onComplete:ve}):d(lt,{visible:m,onComplete:ve,size:40,indicator:d(st,{}),sx:{top:`${f.some(o=>o.group)?I*2:I}px`,bottom:`${ie?ee??M:0}px`},background:{show:l.length===0,opacity:.8}})})]});return ge?d(zt,{className:"grow",elevation:1,sx:{padding:0,paddingLeft:a,height:"100%",minHeight:0,flex:1,display:"flex",flexDirection:"column"},children:He}):d(Me,{className:"grow",style:{padding:0,paddingLeft:a,height:"100%",minHeight:0,flex:1,display:"flex",flexDirection:"column"},children:He})}var jt=$t(Wt);export{jt as VirtualDataTable};
|
|
25
25
|
/**
|
|
26
26
|
* Virtual Data Table - A high-performance virtual data table component for React
|
|
27
27
|
*
|