@ehfuse/mui-virtual-data-table 1.4.3 → 1.5.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.
- package/README.md +24 -0
- package/dist/HeaderMenu.d.ts +126 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.esm.js +2 -2
- package/dist/index.esm.js.map +4 -4
- package/dist/index.js +2 -2
- package/dist/index.js.map +4 -4
- package/dist/types.d.ts +6 -4
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -192,6 +192,30 @@ Header context menu (1.4.0) — right-click a header cell:
|
|
|
192
192
|
<VirtualDataTable onHeaderContextMenu={(col, e) => (col.id === "owner" ? (openOwnerMenu(e), true) : false)} … />
|
|
193
193
|
```
|
|
194
194
|
|
|
195
|
+
Shared header menu (1.5.0) — open it yourself from a custom header button / toolbar button:
|
|
196
|
+
|
|
197
|
+
```tsx
|
|
198
|
+
import { HeaderMenu, headerMenuAnchor } from "@ehfuse/mui-virtual-data-table";
|
|
199
|
+
|
|
200
|
+
const [pos, setPos] = useState<{ left: number; top: number } | null>(null);
|
|
201
|
+
<button onClick={(e) => setPos(headerMenuAnchor(e.currentTarget))}>상태</button>
|
|
202
|
+
<HeaderMenu
|
|
203
|
+
open={Boolean(pos)}
|
|
204
|
+
anchorPosition={pos}
|
|
205
|
+
onClose={() => setPos(null)}
|
|
206
|
+
sort={{ active: sortDir, onChange: (d) => setSortDir(d) }} // null = 풀기
|
|
207
|
+
filter={{
|
|
208
|
+
options: [{ value: "open", label: "진행", icon: <Dot color="green" /> }],
|
|
209
|
+
value: picked, onChange: setPicked,
|
|
210
|
+
multiple: true, // false = radio (closes on pick), allLabel: "전체"
|
|
211
|
+
emptyLabel: "비어 있음", // adds value ""
|
|
212
|
+
searchable: undefined, // default: > 10 options
|
|
213
|
+
}}
|
|
214
|
+
>
|
|
215
|
+
{/* extra items */}
|
|
216
|
+
</HeaderMenu>
|
|
217
|
+
```
|
|
218
|
+
|
|
195
219
|
Pinned rows example (1.3.0):
|
|
196
220
|
|
|
197
221
|
```tsx
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* HeaderMenu.tsx - 표 머리 메뉴 공용 부품(1.5.0)
|
|
3
|
+
*
|
|
4
|
+
* MIT License — Copyright (c) 2025 KIM YOUNG JIN (ehfuse@gmail.com)
|
|
5
|
+
*
|
|
6
|
+
* 머리 칸의 정렬 · 거르기 메뉴를 한 벌로 둔다. 화면마다(고객 · 계약 · 업무함 · 월별 표 …) 메뉴를 따로 만들어
|
|
7
|
+
* 글자 크기 · 줄 높이 · 체크 모양이 제각각이었다(고객 목록 메뉴만 글자가 컸다). 크기 규칙은 이 파일의 상수 한 곳에서 정한다 —
|
|
8
|
+
* 항목 글자 14px · 아이콘 18px · 줄 높이 34px · 좌우 여백 12px. 표의 내장 머리 메뉴(열 옵션 filterOptions)도 이 부품으로 그린다.
|
|
9
|
+
*/
|
|
10
|
+
import React from "react";
|
|
11
|
+
import { type SxProps, type Theme } from "@mui/material";
|
|
12
|
+
/** 메뉴 크기 규칙 — 모든 머리 메뉴가 같은 값을 쓴다. */
|
|
13
|
+
export declare const HEADER_MENU_FONT_SIZE = 14;
|
|
14
|
+
export declare const HEADER_MENU_ICON_SIZE = 18;
|
|
15
|
+
export declare const HEADER_MENU_ITEM_HEIGHT = 34;
|
|
16
|
+
/** 메뉴 아이콘(Material 경로) — @mui/icons-material 을 의존성으로 들이지 않으려고 경로만 옮겨 둔다. */
|
|
17
|
+
export declare const HEADER_MENU_ICON_PATHS: {
|
|
18
|
+
asc: string;
|
|
19
|
+
desc: string;
|
|
20
|
+
checked: string;
|
|
21
|
+
unchecked: string;
|
|
22
|
+
radioOn: string;
|
|
23
|
+
radioOff: string;
|
|
24
|
+
filter: string;
|
|
25
|
+
search: string;
|
|
26
|
+
};
|
|
27
|
+
/** 경로 하나로 그린 아이콘 — 크기 기본은 메뉴 아이콘 크기. */
|
|
28
|
+
export declare function HeaderMenuIcon({ d, size, color }: {
|
|
29
|
+
d: string;
|
|
30
|
+
size?: number;
|
|
31
|
+
color?: string;
|
|
32
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
33
|
+
/** 항목 모양 — 다른 메뉴(도구 줄 단추 메뉴 등)도 이 sx 로 같은 크기를 쓴다. */
|
|
34
|
+
export declare const HEADER_MENU_ITEM_SX: {
|
|
35
|
+
readonly gap: 1;
|
|
36
|
+
readonly fontSize: 14;
|
|
37
|
+
readonly lineHeight: 1.43;
|
|
38
|
+
readonly minHeight: 34;
|
|
39
|
+
readonly py: 0.5;
|
|
40
|
+
readonly px: 1.5;
|
|
41
|
+
};
|
|
42
|
+
export interface HeaderMenuItemProps {
|
|
43
|
+
/** 앞 아이콘 자리(18px). 없으면 비우지 않는다 — 아이콘 줄을 맞추려면 iconSpace 를 켠다. */
|
|
44
|
+
icon?: React.ReactNode;
|
|
45
|
+
/** 아이콘이 없는 줄도 아이콘 폭만큼 비워 글자 줄을 맞춘다. */
|
|
46
|
+
iconSpace?: boolean;
|
|
47
|
+
selected?: boolean;
|
|
48
|
+
disabled?: boolean;
|
|
49
|
+
/** 흐린 글자(풀기 · 해제 같은 보조 동작). */
|
|
50
|
+
muted?: boolean;
|
|
51
|
+
onClick?: (event: React.MouseEvent<HTMLLIElement>) => void;
|
|
52
|
+
sx?: SxProps<Theme>;
|
|
53
|
+
children?: React.ReactNode;
|
|
54
|
+
}
|
|
55
|
+
/** 머리 메뉴 항목 한 줄 — 크기 규칙(14px · 34px)을 지킨 MenuItem. */
|
|
56
|
+
export declare function HeaderMenuItem({ icon, iconSpace, selected, disabled, muted, onClick, sx, children }: HeaderMenuItemProps): import("react/jsx-runtime").JSX.Element;
|
|
57
|
+
/** 메뉴 칸 나누는 선 — 위아래 여백을 줄인다(기본 8px 은 34px 줄 사이에서 헐겁다). */
|
|
58
|
+
export declare function HeaderMenuDivider(): import("react/jsx-runtime").JSX.Element;
|
|
59
|
+
/** 머리 칸(또는 단추) 바로 아래 왼쪽 자리 — 메뉴는 요소가 아니라 좌표에 띄운다(표가 머리 칸을 다시 붙여도 메뉴가 튀지 않게). */
|
|
60
|
+
export declare function headerMenuAnchor(element: Element, x?: number): {
|
|
61
|
+
left: number;
|
|
62
|
+
top: number;
|
|
63
|
+
};
|
|
64
|
+
export type HeaderMenuSortDirection = "asc" | "desc";
|
|
65
|
+
/** 고를 값 하나. render 를 주면 글자 자리에 그대로 그린다(색 칩 · 아바타 + 이름). */
|
|
66
|
+
export interface HeaderMenuOption {
|
|
67
|
+
value: string;
|
|
68
|
+
label: string;
|
|
69
|
+
/** 글자 앞에 붙는 작은 표시(색 점 · 아바타). */
|
|
70
|
+
icon?: React.ReactNode;
|
|
71
|
+
/** 글자 자리를 통째로 바꾼다(색 칩). 찾기는 label 로 한다. */
|
|
72
|
+
render?: React.ReactNode;
|
|
73
|
+
/** 오른쪽 옅은 숫자(그 값의 줄 수). */
|
|
74
|
+
count?: number;
|
|
75
|
+
}
|
|
76
|
+
export interface HeaderMenuSortConfig {
|
|
77
|
+
/** 지금 이 칸의 정렬 방향(이 칸으로 정렬 중이 아니면 null). */
|
|
78
|
+
active: HeaderMenuSortDirection | null | undefined;
|
|
79
|
+
/** 고른 방향 — 풀면 null. */
|
|
80
|
+
onChange: (direction: HeaderMenuSortDirection | null) => void;
|
|
81
|
+
/** "정렬 풀기" 항목을 둔다(정렬 중일 때만 보인다). 같은 방향을 다시 고르면 풀린다. 기본 true. */
|
|
82
|
+
clearable?: boolean;
|
|
83
|
+
}
|
|
84
|
+
export interface HeaderMenuFilterConfig {
|
|
85
|
+
options: HeaderMenuOption[];
|
|
86
|
+
/** 지금 고른 값들(빈 배열 = 거르지 않음). */
|
|
87
|
+
value: string[];
|
|
88
|
+
onChange: (values: string[]) => void;
|
|
89
|
+
/** 여러 개 고르기(체크 목록, 기본) / false = 하나만(라디오, 고르면 닫힌다). */
|
|
90
|
+
multiple?: boolean;
|
|
91
|
+
/** 값 ""(비어 있음) 항목을 끝에 더한다 — 그 이름. options 에 "" 가 이미 있으면 더하지 않는다. */
|
|
92
|
+
emptyLabel?: string;
|
|
93
|
+
/** 하나 고르기에서 맨 위 "전체" 항목(고르면 값 []). */
|
|
94
|
+
allLabel?: string;
|
|
95
|
+
/** 맨 위 찾기 칸 — 기본: 값이 10개를 넘으면. */
|
|
96
|
+
searchable?: boolean;
|
|
97
|
+
searchPlaceholder?: string;
|
|
98
|
+
/** 풀기 항목 이름(기본 "거르기 풀기"). 걸려 있을 때만 보인다. */
|
|
99
|
+
clearLabel?: string;
|
|
100
|
+
/** 고를 값이 없을 때 글(기본 "고를 값이 없습니다."). */
|
|
101
|
+
emptyText?: string;
|
|
102
|
+
}
|
|
103
|
+
export interface HeaderMenuProps {
|
|
104
|
+
open: boolean;
|
|
105
|
+
/** 띄울 자리(좌표) — headerMenuAnchor(요소) 로 만든다. anchorEl 보다 이것을 권한다. */
|
|
106
|
+
anchorPosition?: {
|
|
107
|
+
left: number;
|
|
108
|
+
top: number;
|
|
109
|
+
} | null;
|
|
110
|
+
/** 요소에 붙여 띄울 때(요소가 다시 붙지 않는 곳만). */
|
|
111
|
+
anchorEl?: HTMLElement | null;
|
|
112
|
+
onClose: () => void;
|
|
113
|
+
sort?: HeaderMenuSortConfig;
|
|
114
|
+
filter?: HeaderMenuFilterConfig;
|
|
115
|
+
/** 정렬 · 거르기 앞에 둘 항목(HeaderMenuItem 들). */
|
|
116
|
+
header?: React.ReactNode;
|
|
117
|
+
/** 맨 뒤에 둘 항목(HeaderMenuItem 들 · 범위 입력 등). */
|
|
118
|
+
children?: React.ReactNode;
|
|
119
|
+
minWidth?: number;
|
|
120
|
+
maxHeight?: number;
|
|
121
|
+
}
|
|
122
|
+
/**
|
|
123
|
+
* 머리 메뉴 — 정렬(오름 · 내림 · 풀기) · 값 거르기(여러 개 체크 / 하나 라디오 · 비어 있음 · 찾기 · 풀기)를 필요한 것만 그린다.
|
|
124
|
+
* 누른 자리에서 바로 뜬다(transitionDuration 0 — 펼침 애니메이션은 메뉴가 늦게 따라오는 것처럼 보인다).
|
|
125
|
+
*/
|
|
126
|
+
export declare function HeaderMenu({ open, anchorPosition, anchorEl, onClose, sort, filter, header, children, minWidth, maxHeight, }: HeaderMenuProps): import("react/jsx-runtime").JSX.Element;
|
package/dist/index.d.ts
CHANGED
|
@@ -6,4 +6,6 @@
|
|
|
6
6
|
* @author 김영진 (ehfuse@gmail.com)
|
|
7
7
|
*/
|
|
8
8
|
export { VirtualDataTable } from "./VirtualDataTable";
|
|
9
|
+
export { HeaderMenu, HeaderMenuItem, HeaderMenuDivider, HeaderMenuIcon, headerMenuAnchor, HEADER_MENU_ICON_PATHS, HEADER_MENU_ITEM_SX, HEADER_MENU_FONT_SIZE, HEADER_MENU_ICON_SIZE, HEADER_MENU_ITEM_HEIGHT, } from "./HeaderMenu";
|
|
10
|
+
export type { HeaderMenuProps, HeaderMenuItemProps, HeaderMenuOption, HeaderMenuSortConfig, HeaderMenuFilterConfig, HeaderMenuSortDirection, } from "./HeaderMenu";
|
|
9
11
|
export type { DataColumn, SortDirection, SortableFilter, VirtualDataTableProps, } from "./types";
|
package/dist/index.esm.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import{forwardRef as
|
|
1
|
+
import{forwardRef as $e,useCallback as O,useMemo as ce,useRef as M,useEffect as q,memo as _n,useState as ke}from"react";import{Box as D,Table as zn,TableBody as Wt,TableCell as ue,TableContainer as Fn,TableHead as Vn,TableFooter as Wn,TableRow as Le,TableSortLabel as ht,Paper as $n,Typography as Xn,useTheme as Yn}from"@mui/material";import{TableVirtuoso as Kn}from"react-virtuoso";import{jsx as st}from"react/jsx-runtime";import{useRef as Ot,useState as wn,useEffect as Sn}from"react";import{Box as Tn,CircularProgress as Rn}from"@mui/material";var Ee=function(){return Ee=Object.assign||function(c){for(var l,E=1,p=arguments.length;E<p;E++){l=arguments[E];for(var s in l)Object.prototype.hasOwnProperty.call(l,s)&&(c[s]=l[s])}return c},Ee.apply(this,arguments)};function Bt(o){var c=o.visible,l=o.onComplete,E=o.fadeoutDuration,p=E===void 0?200:E,s=o.exitDelay,I=s===void 0?0:s,U=o.size,ne=U===void 0?40:U,Z=o.className,J=o.style,R=o.sx,P=o.indicator,k=o.background,L=k===void 0?{show:!0,color:"255, 255, 255",opacity:.9}:k,x=Ot(void 0),w=Ot(null),re=wn(c),$=re[0],v=re[1],be=L.show,u=be===void 0?!0:be,S=L.color,T=S===void 0?"255, 255, 255":S,j=L.opacity,oe=j===void 0?.9:j;if(Sn(function(){var Ie=x.current;if(Ie===!0&&c===!1&&w.current){var Xe=w.current;Xe.style.opacity="0",setTimeout(function(){v(!1),l?.()},p+I)}else c===!0&&(v(!0),w.current&&(w.current.style.opacity="1"));x.current=c},[c,l,p,I]),!$)return null;var Q=function(){return typeof P=="string"?st("img",{src:P,alt:"Loading",style:{width:ne,height:ne}}):P||st(Rn,{size:ne})},B=function(){return u?T.startsWith("rgba")?{backgroundColor:T}:/^\d+,\s*\d+,\s*\d+$/.test(T)?{backgroundColor:"rgba(".concat(T,", ").concat(oe,")")}:oe!==1?{backgroundColor:T,"&::before":{content:'""',position:"absolute",top:0,left:0,right:0,bottom:0,backgroundColor:T,opacity:oe,zIndex:-1}}:{backgroundColor:T}:{backgroundColor:"transparent"}};return st(Tn,{ref:w,className:Z,style:Ee({},J),sx:Ee(Ee({position:"absolute",top:0,left:0,right:0,bottom:0,display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3,opacity:c?1:0,transition:"opacity ".concat(p,"ms ease-out")},B()),R),children:Q()})}import{Fragment as En,jsx as _t,jsxs as kn}from"react/jsx-runtime";var Hn=`
|
|
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 It({size:i=54}){return Cn(yn,{children:[Ht("style",{children:xn}),Ht("span",{className:"vdt-css-spinner",role:"progressbar","aria-label":"loading",style:{display:"inline-block",width:i,height:i}})]})}import In from"@ehfuse/overlay-scrollbar";import{Fragment as Me,jsx as r,jsxs as R}from"react/jsx-runtime";var Pn={alignment:"default",margin:0,radius:0},st=5,zn={bg:"#ffffff",border:"#e6e6e3",borderStrong:"#dedddb",headerColor:"#787774",hoverBg:"#f8f8f7",emptyColor:"#9b9a97",selectedBg:"#dbeafe",selectedBar:"#3b82f6"},Bt="12px",Bn={bg:"#1e1e1e",border:"#2c333c",borderStrong:"#3b434e",headerColor:"#a3adbb",hoverBg:"#272d36",emptyColor:"#7d8590",selectedBg:"rgba(59, 130, 246, 0.22)",selectedBar:"#60a5fa"},te={asc:"M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z",desc:"M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z",checked:"M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z",unchecked:"M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z",check:"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z",filter:"M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z"};function we({d:i,size:u=18,color:s}){return r(kn,{sx:{fontSize:u,flexShrink:0,color:s},children:r("path",{d:i})})}function At(i){return!!(i.filterOptions&&i.onFilterChange)}function An({data:i,loading:u=!1,columns:s,onRowClick:B,getRowId:v,selectedRowId:w,selectedRowSx:Te,rowHeight:Se,columnHeight:ne,striped:U,rowDivider:re=!0,onSort:D,onSortClear:V,onHeaderContextMenu:oe,onLoadMore:W,sortBy:C,sortDirection:k,showPaper:Re=!0,paddingX:Ve,paddingTop:ke=0,paddingBottom:Le=0,rowHoverColor:We,rowHoverOpacity:De,viewportBuffer:M,overscan:_,scrollbars:ae,emptyMessage:$="NO DATA",autoHeight:H=!1,LoadingComponent:Ee,showFooter:$e,footerHeight:ie,footerSx:le,variant:Ot="default",framed:Z=!0,headerTopBorder:Ft=!1,rowHeightMode:Nt="fixed",tableLayout:He="fixed",renderFullWidthRow:_e,fullWidthRowSx:se,onRowContextMenu:ct,pinnedRows:ce,pinnedRowsMaxHeight:Ye,pinnedRowsSx:de,resetScrollOnDataChange:dt=!0,rowKeyFromId:Vt=!1,onEndReached:ut,colorMode:Wt}){let p=Ot==="notion",je=En(),h=(Wt??je.palette.mode)==="dark"?Bn:zn,pt=(ce?.length??0)>0,Y=ne??(p?40:56),A=Se??(p?48:50),Ie=Z?Ve??(p?"12px":"1rem"):0,Xe=Nt==="auto",Ke=We??(p?h.hoverBg:void 0),ft=De??(p?1:void 0),$t=Math.max(A*12,480),_t=Math.max(A*12,480),Yt=typeof M=="number"?M:M?.top??$t,jt=typeof M=="number"?M:M?.bottom??_t,Xt=Math.max(A*8,420),Kt=Math.max(A*10,520),qt=typeof _=="number"?_:{main:_?.main??Xt,reverse:_?.reverse??Kt},ue=A+(re?1:0),Gt=G(()=>p?{backgroundColor:h.selectedBg,"& > td:first-of-type":{boxShadow:`inset 3px 0 0 ${h.selectedBar}`},"& > td[data-vdt-pinned]":{backgroundColor:h.selectedBg}}:void 0,[p,h]),O=Te??Gt,Pe=!O||typeof O!="function",Jt=G(()=>!Pe||w===null||w===void 0||!O?null:{[`& tbody tr[data-row-id="${String(w).replace(/["\\]/g,"\\$&")}"]`]:O},[Pe,w,O]),Fn=typeof window<"u"&&(window.location.hostname==="localhost"||window.location.hostname==="127.0.0.1"),[b]=ye(()=>typeof window>"u"?!1:window.localStorage.getItem("vdt-perf-debug")==="1"),d=m({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}),qe=E(t=>{if(!b)return;let e=d.current;if(!(e.wheelEvents>0||e.rangeChangedCalls>0||e.rowContentCalls>0||e.cellRenderCalls>0))return;let l=e.rowContentCalls>0?e.rowContentMs/e.rowContentCalls:0,c=e.cellRenderCalls>0?e.cellRenderMs/e.cellRenderCalls:0;console.log("[VDT perf]",{reason:t,wheel:{events:e.wheelEvents,inputPx:Math.round(e.wheelInputPx),handlerMs:Number(e.wheelHandlerMs.toFixed(2)),rafFlushes:e.wheelRafFlushes,rafMs:Number(e.wheelRafMs.toFixed(2))},rangeChanged:{calls:e.rangeChangedCalls,totalMs:Number(e.rangeChangedMs.toFixed(2))},rowContent:{calls:e.rowContentCalls,totalMs:Number(e.rowContentMs.toFixed(2)),avgMs:Number(l.toFixed(3)),maxMs:Number(e.rowContentMaxMs.toFixed(3))},cellRender:{calls:e.cellRenderCalls,totalMs:Number(e.cellRenderMs.toFixed(2)),avgMs:Number(c.toFixed(3)),maxMs:Number(e.cellRenderMaxMs.toFixed(3))}}),d.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}},[b]);N(()=>{if(!b||typeof window>"u")return;console.log("[VDT perf] enabled (localStorage vdt-perf-debug=1)");let t=window.setInterval(()=>{qe("interval")},1500);return()=>{window.clearInterval(t),qe("cleanup")}},[qe,b]);let ht=G(()=>Ne((t,e)=>{let o=m(null),l=m(0),c=m(null);return N(()=>{let n=o.current;if(!n)return;let a=y=>{let L=b?performance.now():0;if(y.shiftKey||Math.abs(y.deltaX)>Math.abs(y.deltaY))return;let x=y.target?.closest?.("[data-vdt-inner-scroll]");if(x&&n.contains(x)&&(y.deltaY<0?x.scrollTop>0:x.scrollTop+x.clientHeight<x.scrollHeight-1))return;y.preventDefault();let f=y.deltaY;y.deltaMode===1?f*=40:y.deltaMode===2&&(f*=n.clientHeight),b&&(d.current.wheelEvents+=1,d.current.wheelInputPx+=f),l.current+=f,c.current===null&&(c.current=requestAnimationFrame(()=>{let T=b?performance.now():0,g=Math.max(n.clientHeight*.4,160),P=Math.max(-g,Math.min(g,l.current));l.current=0,c.current=null,P!==0&&(n.scrollTop+=P),b&&(d.current.wheelRafFlushes+=1,d.current.wheelRafMs+=performance.now()-T)}),b&&(d.current.wheelHandlerMs+=performance.now()-L))};return n.addEventListener("wheel",a,{passive:!1}),()=>{n.removeEventListener("wheel",a),c.current!==null&&(cancelAnimationFrame(c.current),c.current=null),l.current=0}},[]),r(In,{detectInnerScroll:!0,track:Pn,...ae,children:r(Mn,{component:S,...t,ref:n=>{o.current=n,typeof e=="function"?e(n):e&&(e.current=n)},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:p?0:Ie,paddingTop:ke,paddingBottom:Le}}})})}),[]),Ge=G(()=>{if(U===!0)return"#f5f5f5";if(typeof U=="string")return U},[U]),[Ut,gt]=ye(u),[Zt,Qt]=ye(0);N(()=>{u&>(!0)},[u]);let bt=E(()=>{gt(!1)},[]),en=Ut,Nn=u&&i.length>0,Je=m(!1),Ue=m(-1),Ze=m(null),Qe=m(null),[tn,nn]=ye(!1),ze=E(()=>{let t=Qe.current;t&&nn(t.scrollHeight>t.clientHeight+1)},[]);N(()=>{let t=Qe.current;if(!t||typeof ResizeObserver>"u")return;let e=new ResizeObserver(()=>ze());return e.observe(t),()=>e.disconnect()},[ze,H]);let et=m(B);et.current=B;let pe=m(v);pe.current=v;let tt=m(ct);tt.current=ct;let mt=m(ut);mt.current=ut;let xt=m(null),Be=G(()=>{let t=new Map,e=0;return s.forEach(o=>{o.pinned==="left"&&(t.set(String(o.id),e),e+=typeof o.width=="number"?o.width:0)}),t},[s]),nt=G(()=>{if(s.some(t=>typeof t.minWidth=="number"))return s.reduce((t,e)=>t+(typeof e.width=="number"?e.width:typeof e.minWidth=="number"?e.minWidth:0),0)},[s]),Q=E((t,e)=>{let o=Be.get(String(t.id));return o===void 0?{}:{position:"sticky",left:o,zIndex:e?3:1}},[Be]),Ae=!!B,fe=m(!1),j=m({x:0,y:0});N(()=>{let t=e=>{let o=e.clientX-j.current.x,l=e.clientY-j.current.y;Math.sqrt(o*o+l*l)>st&&(fe.current=!0)};return document.addEventListener("mousemove",t),()=>{document.removeEventListener("mousemove",t)}},[]),N(()=>{let t=document.querySelector('[data-testid="virtuoso-scroller"]');t&&t.querySelectorAll(".MuiTableSortLabel-root").forEach(o=>{let l=new MouseEvent("mouseleave",{bubbles:!0,cancelable:!0});o.dispatchEvent(l)})},[C]);let Oe=E(t=>{if(!D)return;D(t,C===t&&k==="asc"?"desc":"asc")},[D,C,k]),[he,yt]=ye(null),Ct=m(oe);Ct.current=oe;let vt=m(D);vt.current=D;let ge=E((t,e)=>{if(!t){e.preventDefault();return}t.headerProps?.onContextMenu?.(e);let o=e.defaultPrevented;if(o||(o=Ct.current?.(t,e)===!0||e.defaultPrevented),e.preventDefault(),o||t.headerMenu===!1||!!!((t.sortMenu??t.sortable)&&vt.current)&&!At(t))return;let c=e.currentTarget.getBoundingClientRect();yt({colId:String(t.id),x:e.clientX,y:c.bottom})},[]),X=E(t=>t.filterValues&&t.filterValues.length>0?R(S,{component:"span",sx:{display:"inline-flex",alignItems:"center",gap:.5,maxWidth:"100%",color:"primary.main",fontWeight:600,verticalAlign:"middle"},children:[r(S,{component:"span",sx:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.text}),r(we,{d:te.filter,size:16})]}):t.text,[]),rn=E(t=>{let e=b?performance.now():0;if(mt.current?.(),!W){b&&(d.current.rangeChangedCalls+=1,d.current.rangeChangedMs+=performance.now()-e);return}if(u&&i.length===0){b&&(d.current.rangeChangedCalls+=1,d.current.rangeChangedMs+=performance.now()-e);return}let o=i.length>=30,l=t>=i.length-1,c=Ue.current===i.length;if(l&&o&&!Je.current&&!c){Je.current=!0,Ue.current=i.length;let n=i.length;W(n,50)}b&&(d.current.rangeChangedCalls+=1,d.current.rangeChangedMs+=performance.now()-e)},[i.length,u,W,b]);N(()=>{u||(Je.current=!1)},[u]),N(()=>{i.length===0&&Qt(t=>t+1)},[i.length]);let wt=m(dt);wt.current=dt;let rt=m(i.length),ot=m(void 0);N(()=>{let t=rt.current,e=i.length,o=e>0?pe.current?pe.current(i[0],0):i[0]:void 0,l=ot.current;if(e>t&&t>0){rt.current=e,ot.current=o;return}let c=e<t||t>0&&o!==l;c&&(Ue.current=-1),Ze.current&&e>0&&c&&wt.current&&Ze.current.scrollToIndex({index:0,align:"start",behavior:"auto"}),rt.current=e,ot.current=o},[i]);let Mt=E(()=>{let t={},e=[];if(s.forEach(n=>{n.group?(t[n.group]||(t[n.group]=[]),t[n.group].push(n)):e.push(n)}),!(Object.keys(t).length>0))return r(Ce,{children:s.map(n=>r(J,{align:n.align||"left",...n.headerProps,onContextMenu:a=>ge(n,a),style:{width:n.width,minWidth:n.width??n.minWidth,...n.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px",...Q(n,!0),...n.headerProps?.style},children:n.sortable?r("div",{style:{display:"flex",alignItems:"center",justifyContent:n.align==="center"?"center":n.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:R(S,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>Oe(String(n.id)),children:[X(n),r(lt,{active:C===n.id,direction:C===n.id?k:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:C===n.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)"}}})]})}):X(n)},String(n.id)))});let l=[...e.map(n=>r(J,{rowSpan:2,align:n.align||"left",...n.headerProps,onContextMenu:a=>ge(n,a),style:{width:n.width,minWidth:n.width,...n.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px",...Q(n,!0),...n.headerProps?.style},children:n.sortable&&D?r("div",{style:{display:"flex",alignItems:"center",justifyContent:n.align==="center"?"center":n.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:R(S,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>Oe(String(n.id)),children:[X(n),r(lt,{active:C===n.id,direction:C===n.id?k:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:C===n.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)"}}})]})}):X(n)},String(n.id))),...Object.entries(t).map(([n,a])=>r(J,{align:"center",colSpan:a.length,onContextMenu:y=>ge(null,y),style:{fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:n},n))],c=[...Object.values(t).flat().map(n=>r(J,{align:n.align||"left",...n.headerProps,onContextMenu:a=>ge(n,a),style:{width:n.width,minWidth:n.width,...n.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px",...Q(n,!0),...n.headerProps?.style},children:n.sortable&&D?r("div",{style:{display:"flex",alignItems:"center",justifyContent:n.align==="center"?"center":n.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:R(S,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>Oe(String(n.id)),children:[X(n),r(lt,{active:C===n.id,direction:C===n.id?k:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:C===n.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)"}}})]})}):X(n)},String(n.id)))];return R(Me,{children:[r(Ce,{children:l}),r(Ce,{children:c})]})},[s,C,k,Oe,D,Y,Q,ge,X]),Fe=E((t,e)=>{let o=b?performance.now():0;if(!e){if(b){d.current.rowContentCalls+=1;let a=performance.now()-o;d.current.rowContentMs+=a,d.current.rowContentMaxMs=Math.max(d.current.rowContentMaxMs,a)}return null}let l=_e?_e(e,t):null;if(l!=null)return r(J,{colSpan:s.length,"data-vdt-pad":"",sx:[{padding:p?"0 14px":"8px 16px"},...Array.isArray(se)?se:se?[se]:[]],children:l});let c=0,n=s.map((a,y)=>{if(c>0)return c-=1,null;let L=a.colSpan?Math.max(1,Math.min(a.colSpan(e,t),s.length-y)):1;c=L-1;let x=b?performance.now():0,f=a.render?a.render(e,t):String(e[a.id]||"");if(b){let z=performance.now()-x;d.current.cellRenderCalls+=1,d.current.cellRenderMs+=z,d.current.cellRenderMaxMs=Math.max(d.current.cellRenderMaxMs,z)}let T=Be.has(String(a.id)),g=a.cellPadding!==void 0,P=a.rowSpan?a.rowSpan(e,t):1;if(P<=0)return null;let K=a.onCellClick;return r(J,{align:a.align||"left",rowSpan:P>1?P:void 0,colSpan:L>1?L:void 0,"data-vdt-pad":g?"":void 0,"data-vdt-pinned":T?"":void 0,"data-vdt-cell-click":K?"":void 0,onClick:K?z=>{let ee=z.clientX-j.current.x,q=z.clientY-j.current.y;z.stopPropagation(),!(Math.sqrt(ee*ee+q*q)>st)&&K(e,t,z)}:void 0,style:{...L>1?{}:{width:a.width,minWidth:a.width??a.minWidth},...a.primary?{fontSize:15}:{},...a.style,...a.cellStyle?a.cellStyle(e,t):{},padding:g?a.cellPadding:"8px 16px",...Q(a,!1)},children:f},String(a.id))});if(b){d.current.rowContentCalls+=1;let a=performance.now()-o;d.current.rowContentMs+=a,d.current.rowContentMaxMs=Math.max(d.current.rowContentMaxMs,a)}return r(Me,{children:n})},[s,b,_e,se,p,Be,Q]),Tt=E(()=>{let t=Mt();if(!ce||ce.length===0)return t;let e=xt.current;return R(Me,{children:[t,r("tr",{"data-vdt-pinned-area":"",children:r("td",{colSpan:s.length,style:{padding:0,border:0},children:r(S,{"data-vdt-inner-scroll":"",sx:[{maxHeight:Ye,overflowY:Ye?"auto":"visible",overflowX:"hidden",scrollbarWidth:"thin",borderBottom:`1px solid ${p?h.borderStrong:"rgba(224, 224, 224, 1)"}`,"& tbody tr:last-of-type > td":{borderBottom:"none"}},...Array.isArray(de)?de:de?[de]:[]],children:R("table",{style:{width:"100%",tableLayout:He,borderCollapse:"separate",borderSpacing:0},children:[r("colgroup",{children:s.map(o=>r("col",{style:{width:o.width,minWidth:o.width??o.minWidth}},String(o.id)))}),r(Pt,{children:ce.map((o,l)=>e?r(e,{item:o,"data-index":l,"data-vdt-pinned-row":"",children:Fe(l,o)},v?String(v(o,l)):`p${l}`):null)})]})})})})]})},[Mt,ce,Ye,de,s,Fe,He,v,p,h]),F=$e??s.some(t=>typeof t.footer=="function"),St=E(()=>{if(!F)return null;let t=[];for(let e=0;e<s.length;e+=1){let o=s[e],l=o.footerColSpan&&o.footerColSpan>1?Math.min(o.footerColSpan,s.length-e):1;t.push(r(J,{align:o.align||"left",colSpan:l>1?l:void 0,style:{...l>1?{}:{width:o.width,minWidth:o.width},...o.style,fontWeight:"bold",padding:p?"0 14px":"16px"},children:o.footer?o.footer(i):null},String(o.id))),e+=l-1}return r(Ce,{children:t})},[F,s,i,p]),at=G(()=>({Scroller:ht,Table:t=>r(wn,{...t,sx:{borderCollapse:"separate",tableLayout:He,...nt?{minWidth:nt}:{},marginRight:Z?"16px":0,...F?{height:"100%"}:{}}}),TableHead:Ne((t,e)=>r(Tn,{...t,ref:e,sx:{userSelect:"none","& > tr":{height:Y,"& > th":{padding:"16px",position:"sticky",top:0,zIndex:2,fontWeight:"bold"}}}})),TableRow:t=>{let{item:e,selected:o,"aria-selected":l,className:c,...n}=t,a=n["data-index"]??0,y=a%2===1,L=e&&pe.current?pe.current(e,a):a,x=!Pe&&w!==null&&w!==void 0&&L===w,f=x&&O?typeof O=="function"?O(e,a):O:void 0,T=String(c??"").split(/\s+/).filter(g=>g!=="Mui-selected"&&g!=="Mui-focusVisible").join(" ");return r(Ce,{...n,"data-row-id":L!=null?String(L):void 0,className:T||void 0,selected:x,onMouseDown:g=>{fe.current=!1,j.current={x:g.clientX,y:g.clientY}},onContextMenu:g=>{e&&tt.current&&tt.current(e,a,g)},onClick:g=>{let P=g.clientX-j.current.x,K=g.clientY-j.current.y;if(Math.sqrt(P*P+K*K)>st||fe.current){g.preventDefault(),g.stopPropagation(),fe.current=!1;return}e&&et.current&&et.current(e,a),fe.current=!1},sx:[{userSelect:"none",...Xe?{"& > td":{height:ue}}:{height:ue,maxHeight:ue},boxSizing:"border-box",backgroundColor:y&&Ge?Ge:"transparent","& td:not([data-vdt-pad])":{padding:"8px 16px"},"& td":{boxSizing:"border-box",borderBottom:re?"1px solid rgba(224, 224, 224, 1)":"none"},"& th":{padding:"8px 16px",borderBottom:"none"},"&:hover":Ae&&!x?{backgroundColor:g=>{let P=g.palette.mode==="dark",z=Ke??"#000000",ee=ft??.06;if(!Ke)return P?`rgba(255, 255, 255, ${ee})`:`rgba(0, 0, 0, ${ee})`;let q=z.replace("#","").trim();if(q.length!==6)return z;let un=parseInt(q.substring(0,2),16),pn=parseInt(q.substring(2,4),16),fn=parseInt(q.substring(4,6),16);return`rgba(${un}, ${pn}, ${fn}, ${ee})`}}:void 0,cursor:Ae?"pointer":void 0},f]})},TableBody:Ne((t,e)=>{let{children:o,...l}=t;return R(Pt,{...l,ref:e,sx:F?{height:"100%"}:void 0,children:[o,F&&r("tr",{"aria-hidden":!0,style:{height:"100%"},children:r("td",{colSpan:s.length,style:{padding:0,border:0}})})]})}),TableFoot:Ne((t,e)=>r(Sn,{...t,ref:e,sx:[{"& tr":{height:ie??A,maxHeight:ie??A,boxSizing:"border-box"},"& td":{height:ie??A,boxSizing:"border-box",backgroundColor:o=>o.palette.mode==="dark"?"#1e1e1e":"#ffffff",padding:"0 16px",color:"inherit",fontSize:"0.875rem",border:"none",boxShadow:`inset 0 1px 0 0 ${p?h.borderStrong:"#000000"}`}},...Array.isArray(le)?le:le?[le]:[]]}))}),[Ae,Pe?null:w,O,A,Ge,re,Y,Ke,ft,ht,ie,le,F,p,h,s,He,Z,Xe,nt]);xt.current=at.TableRow;let on=at,be=at,an=be.Table,ln=be.TableHead,sn=be.TableBody,cn=be.TableRow,dn=be.TableFoot,I=he?s.find(t=>String(t.id)===he.colId):void 0,me=()=>yt(null),Rt=null;if(he&&I){let t=String(I.id),e=!!((I.sortMenu??I.sortable)&&D),o=At(I),l=C===t?k:void 0,c=I.filterValues??[],n=I.filterMultiple!==!1,a={gap:1,fontSize:14,minHeight:36},y=f=>{if(me(),l===f){V?.();return}D?.(t,f)},L=f=>{let T=c.includes(f);if(n){I.onFilterChange?.(T?c.filter(g=>g!==f):[...c,f]);return}me(),I.onFilterChange?.(T?[]:[f])},x=[];e&&(x.push(R(ve,{selected:l==="asc",onClick:()=>y("asc"),sx:a,children:[r(we,{d:te.asc,color:"text.secondary"}),"\uC624\uB984\uCC28\uC21C \uC815\uB82C"]},"asc"),R(ve,{selected:l==="desc",onClick:()=>y("desc"),sx:a,children:[r(we,{d:te.desc,color:"text.secondary"}),"\uB0B4\uB9BC\uCC28\uC21C \uC815\uB82C"]},"desc")),l&&V&&x.push(r(ve,{onClick:()=>{me(),V()},sx:{...a,color:"text.secondary"},children:"\uC815\uB82C \uD480\uAE30"},"sort-clear"))),e&&o&&x.push(r(zt,{},"div-sort")),o&&((I.filterOptions??[]).forEach(f=>{let T=c.includes(f.value);x.push(R(ve,{selected:!n&&T,onClick:()=>L(f.value),sx:a,children:[n?r(we,{d:T?te.checked:te.unchecked,color:T?"primary.main":"text.disabled"}):r(S,{component:"span",sx:{display:"inline-flex",width:18,flexShrink:0,color:"primary.main"},children:T?r(we,{d:te.check}):null}),f.label]},`f:${f.value}`))}),c.length>0&&x.push(r(zt,{},"div-filter"),r(ve,{onClick:()=>{me(),I.onFilterChange?.([])},sx:{...a,color:"text.secondary"},children:"\uAC70\uB974\uAE30 \uD480\uAE30"},"filter-clear"))),Rt=r(Rn,{open:!0,anchorReference:"anchorPosition",anchorPosition:{left:he.x,top:he.y},onClose:me,transitionDuration:0,onContextMenu:f=>f.preventDefault(),slotProps:{paper:{sx:{maxHeight:420,minWidth:180}}},children:x})}let kt=R(S,{sx:{position:"relative",height:H?"auto":"100%",width:"100%","& .MuiTableHead-root":{backgroundColor:t=>p?`${h.bg} !important`:t.palette.mode==="dark"?"#1e1e1e !important":"#ffffff !important"},...Jt??{},"& tbody td[data-vdt-pinned]":{backgroundColor:p?h.bg:je.palette.background.paper},"& tbody td[data-vdt-cell-click]":{cursor:"pointer"},"& tbody td[data-vdt-cell-click]:hover":{backgroundColor:p?h.hoverBg:je.palette.mode==="dark"?"rgba(255, 255, 255, 0.06)":"rgba(0, 0, 0, 0.04)"},...p&&Ae?{"& tbody tr:hover td[data-vdt-pinned]":{backgroundColor:h.hoverBg}}:{},...p?{...Z?{border:`1px solid ${h.borderStrong}`,borderRadius:"4px"}:{"& table":{backgroundColor:h.bg}},overflow:"hidden","& thead tr th > *":{verticalAlign:"middle"},"& thead tr th":{height:Y,boxSizing:"border-box",padding:"0 14px !important",fontSize:13,fontWeight:"500 !important",color:h.headerColor,backgroundColor:`${h.bg} !important`,borderTop:!Z&&Ft?`1px solid ${h.borderStrong}`:"none",borderBottom:`1px solid ${h.borderStrong}`,borderRight:`1px solid ${h.border}`,"&:last-of-type":{borderRight:"none"}},"& tbody tr td:not([data-vdt-pad])":{padding:"0 14px !important"},"& tbody tr td":{fontSize:14,borderBottom:`1px solid ${h.border}`},...i.length>0&&(H||tn||F)?{[`& tbody tr[data-index="${i.length-1}"]:not([data-vdt-pinned-row]) td`]:{borderBottom:"none"}}:{}}:{}},children:[H?r(S,{sx:{overflowX:"auto",width:"100%"},children:R(an,{children:[r(ln,{children:Tt()}),r(sn,{children:i.map((t,e)=>r(cn,{item:t,"data-index":e,children:Fe(e,t)},v?String(v(t,e)):e))}),F?r(dn,{children:St()}):null]})}):r(Hn,{ref:Ze,data:i,totalCount:W?i.length+1:i.length,defaultItemHeight:ue,fixedItemHeight:Xe?void 0:ue,fixedHeaderContent:Tt,fixedFooterContent:F?St:void 0,itemContent:Fe,...Vt&&v?{computeItemKey:(t,e)=>e?v(e,t):`vdt-${t}`}:{},endReached:rn,scrollerRef:t=>{Qe.current=t instanceof HTMLElement?t:null,ze()},totalListHeightChanged:ze,style:{height:"100%"},increaseViewportBy:{top:Yt,bottom:jt},overscan:qt,followOutput:!1,components:on},Zt),i.length===0&&!u&&!pt&&p&&typeof $=="string"&&r(S,{sx:{position:H?"static":"absolute",top:Y,left:0,right:0,py:6,textAlign:"center",fontSize:14,color:h.emptyColor,pointerEvents:"none"},children:$}),i.length===0&&!u&&!pt&&!(p&&typeof $=="string")&&r(S,{sx:{position:"absolute",top:0,left:0,right:0,bottom:0,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,pointerEvents:"none","& > *":{pointerEvents:"auto"}},children:typeof $=="string"?R(Me,{children:[r(S,{sx:{width:48,height:48,display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"50%",backgroundColor:"#f5f5f5",color:"#999"},children:"\u{1F4C4}"}),r(Dn,{variant:"body1",sx:{color:"text.secondary"},children:$})]}):$}),Rt,en&&r(Me,{children:Ee?r(Ee,{visible:u,onComplete:bt}):r(Et,{visible:u,onComplete:bt,size:40,indicator:r(It,{}),sx:{top:`${s.some(t=>t.group)?Y*2:Y}px`,bottom:`${F?ie??A:0}px`},background:{show:i.length===0,opacity:.8}})})]}),Lt=p&&Z?{paddingRight:Ie,paddingTop:Bt,paddingBottom:Bt}:{};return Re?r(Ln,{className:"grow",elevation:1,sx:{padding:0,paddingLeft:Ie,...Lt,boxSizing:"border-box",height:H?"auto":"100%",minHeight:0,flex:H?"none":1,display:"flex",flexDirection:"column"},children:kt}):r(S,{className:"grow",style:{padding:0,paddingLeft:Ie,...Lt,boxSizing:"border-box",height:H?"auto":"100%",minHeight:0,flex:H?"none":1,display:"flex",flexDirection:"column"},children:kt})}var On=vn(An);export{On as VirtualDataTable};
|
|
4
|
+
`;function zt({size:o=54}){return kn(En,{children:[_t("style",{children:Hn}),_t("span",{className:"vdt-css-spinner",role:"progressbar","aria-label":"loading",style:{display:"inline-block",width:o,height:o}})]})}import Ft,{useMemo as Ln,useState as Dn}from"react";import{Box as Ve,Divider as In,InputBase as Pn,Menu as An,MenuItem as Nn,SvgIcon as On}from"@mui/material";import{jsx as g,jsxs as dt}from"react/jsx-runtime";var ct=14,ut=18,pt=34,N={asc:"M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z",desc:"M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z",checked:"M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z",unchecked:"M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z",radioOn:"M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z",radioOff:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z",filter:"M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z",search:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"};function te({d:o,size:c=ut,color:l}){return g(On,{sx:{fontSize:c,flexShrink:0,color:l},children:g("path",{d:o})})}var Vt={gap:1,fontSize:ct,lineHeight:1.43,minHeight:pt,py:.5,px:1.5};function G({icon:o,iconSpace:c,selected:l,disabled:E,muted:p,onClick:s,sx:I,children:U}){return dt(Nn,{selected:l,disabled:E,onClick:s,sx:[Vt,p?{color:"text.secondary"}:{},...Array.isArray(I)?I:I?[I]:[]],children:[o??(c?g(Ve,{component:"span",sx:{width:ut,flexShrink:0}}):null),U]})}function We(){return g(In,{sx:{my:"4px !important"}})}function Bn(o,c){let l=o.getBoundingClientRect();return{left:c??l.left,top:l.bottom}}function ft({open:o,anchorPosition:c,anchorEl:l,onClose:E,sort:p,filter:s,header:I,children:U,minWidth:ne=180,maxHeight:Z=420}){let[J,R]=Dn(""),P=s?.multiple!==!1,k=s?.value??[],L=Ln(()=>{if(!s)return[];let u=s.options;return s.emptyLabel&&!u.some(S=>S.value==="")?[...u,{value:"",label:s.emptyLabel}]:u},[s]),x=!!s&&(s?.searchable??L.length>10),w=J.trim().toLowerCase(),re=w?L.filter(u=>u.label.toLowerCase().includes(w)):L,$=()=>{R(""),E()},v=[];if(I&&v.push(g(Ft.Fragment,{children:I},"header")),p){let u=S=>{$(),p.onChange(p.active===S&&p.clearable!==!1?null:S)};v.push(g(G,{selected:p.active==="asc",onClick:()=>u("asc"),icon:g(te,{d:N.asc,color:"text.secondary"}),children:"\uC624\uB984\uCC28\uC21C \uC815\uB82C"},"sort-asc"),g(G,{selected:p.active==="desc",onClick:()=>u("desc"),icon:g(te,{d:N.desc,color:"text.secondary"}),children:"\uB0B4\uB9BC\uCC28\uC21C \uC815\uB82C"},"sort-desc")),p.active&&p.clearable!==!1&&v.push(g(G,{muted:!0,iconSpace:!0,onClick:()=>{$(),p.onChange(null)},children:"\uC815\uB82C \uD480\uAE30"},"sort-clear"))}return p&&s&&v.push(g(We,{},"div-sort")),s&&(x&&v.push(dt(Ve,{onKeyDown:u=>u.stopPropagation(),sx:{display:"flex",alignItems:"center",gap:1,px:1.5,pb:.5,minHeight:pt},children:[g(te,{d:N.search,color:"text.secondary"}),g(Pn,{autoFocus:!0,value:J,onChange:u=>R(u.target.value),placeholder:s.searchPlaceholder??"\uCC3E\uAE30",sx:{flex:1,fontSize:ct}})]},"search")),!P&&s.allLabel&&v.push(g(G,{selected:k.length===0,onClick:()=>{$(),s.onChange([])},icon:g(te,{d:k.length===0?N.radioOn:N.radioOff,color:k.length===0?"primary.main":"text.disabled"}),children:s.allLabel},"f-all")),L.length===0&&v.push(g(G,{disabled:!0,iconSpace:!0,children:s.emptyText??"\uACE0\uB97C \uAC12\uC774 \uC5C6\uC2B5\uB2C8\uB2E4."},"f-none")),re.forEach(u=>{let S=k.includes(u.value),T=()=>{if(P){s.onChange(S?k.filter(oe=>oe!==u.value):[...k,u.value]);return}$(),s.onChange(S?[]:[u.value])},j=P?S?N.checked:N.unchecked:S?N.radioOn:N.radioOff;v.push(dt(G,{selected:!P&&S,onClick:T,icon:g(te,{d:j,color:S?"primary.main":"text.disabled"}),children:[u.icon,g(Ve,{component:"span",sx:{flex:1,minWidth:0,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:u.render??u.label}),typeof u.count=="number"?g(Ve,{component:"span",sx:{color:"text.secondary",ml:1,fontVariantNumeric:"tabular-nums"},children:u.count}):null]},`f:${u.value||"(empty)"}`))}),x&&w&&re.length===0&&v.push(g(G,{disabled:!0,iconSpace:!0,children:"\uCC3E\uB294 \uAC12\uC774 \uC5C6\uC2B5\uB2C8\uB2E4."},"f-nohit")),k.length>0&&v.push(g(We,{},"div-filter"),g(G,{muted:!0,iconSpace:!0,onClick:()=>{$(),s.onChange([])},children:s.clearLabel??"\uAC70\uB974\uAE30 \uD480\uAE30"},"f-clear"))),U&&(v.length>0&&v.push(g(We,{},"div-children")),v.push(g(Ft.Fragment,{children:U},"children"))),g(An,{open:o&&(!!c||!!l),...!c&&!!l?{anchorEl:l}:{anchorReference:"anchorPosition",anchorPosition:c??void 0},onClose:$,transitionDuration:0,disableAutoFocusItem:x,onContextMenu:u=>u.preventDefault(),onClick:u=>u.stopPropagation(),slotProps:{paper:{sx:{maxHeight:Z,minWidth:ne}},list:{sx:{py:.5}}},children:v})}import Un from"@ehfuse/overlay-scrollbar";import{Fragment as De,jsx as a,jsxs as W}from"react/jsx-runtime";var jn={alignment:"default",margin:0,radius:0},gt=5,Gn={bg:"#ffffff",border:"#e6e6e3",borderStrong:"#dedddb",headerColor:"#787774",hoverBg:"#f8f8f7",emptyColor:"#9b9a97",selectedBg:"#dbeafe",selectedBar:"#3b82f6"},$t="12px",qn={bg:"#1e1e1e",border:"#2c333c",borderStrong:"#3b434e",headerColor:"#a3adbb",hoverBg:"#272d36",emptyColor:"#7d8590",selectedBg:"rgba(59, 130, 246, 0.22)",selectedBar:"#60a5fa"};function Xt(o){return!!(o.filterOptions&&o.onFilterChange)}function Zn({data:o,loading:c=!1,columns:l,onRowClick:E,getRowId:p,selectedRowId:s,selectedRowSx:I,rowHeight:U,columnHeight:ne,striped:Z,rowDivider:J=!0,onSort:R,onSortClear:P,onHeaderContextMenu:k,onLoadMore:L,sortBy:x,sortDirection:w,showPaper:re=!0,paddingX:$,paddingTop:v=0,paddingBottom:be=0,rowHoverColor:u,rowHoverOpacity:S,viewportBuffer:T,overscan:j,scrollbars:oe,emptyMessage:Q="NO DATA",autoHeight:B=!1,LoadingComponent:Ie,showFooter:Xe,footerHeight:me,footerSx:xe,variant:Yt="default",framed:pe=!0,headerTopBorder:Kt=!1,rowHeightMode:Ut="fixed",tableLayout:Pe="fixed",renderFullWidthRow:Ye,fullWidthRowSx:ye,onRowContextMenu:bt,pinnedRows:Ce,pinnedRowsMaxHeight:Ke,pinnedRowsSx:Me,resetScrollOnDataChange:mt=!0,rowKeyFromId:jt=!1,onEndReached:xt,colorMode:Gt}){let b=Yt==="notion",Ue=Yn(),m=(Gt??Ue.palette.mode)==="dark"?qn:Gn,yt=(Ce?.length??0)>0,ae=ne??(b?40:56),X=U??(b?48:50),Ae=pe?$??(b?"12px":"1rem"):0,je=Ut==="auto",Ge=u??(b?m.hoverBg:void 0),Ct=S??(b?1:void 0),qt=Math.max(X*12,480),Zt=Math.max(X*12,480),Jt=typeof T=="number"?T:T?.top??qt,Qt=typeof T=="number"?T:T?.bottom??Zt,en=Math.max(X*8,420),tn=Math.max(X*10,520),nn=typeof j=="number"?j:{main:j?.main??en,reverse:j?.reverse??tn},ve=X+(J?1:0),rn=ce(()=>b?{backgroundColor:m.selectedBg,"& > td:first-of-type":{boxShadow:`inset 3px 0 0 ${m.selectedBar}`},"& > td[data-vdt-pinned]":{backgroundColor:m.selectedBg}}:void 0,[b,m]),Y=I??rn,Ne=!Y||typeof Y!="function",on=ce(()=>!Ne||s===null||s===void 0||!Y?null:{[`& tbody tr[data-row-id="${String(s).replace(/["\\]/g,"\\$&")}"]`]:Y},[Ne,s,Y]),Qn=typeof window<"u"&&(window.location.hostname==="localhost"||window.location.hostname==="127.0.0.1"),[y]=ke(()=>typeof window>"u"?!1:window.localStorage.getItem("vdt-perf-debug")==="1"),h=M({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}),qe=O(t=>{if(!y)return;let e=h.current;if(!(e.wheelEvents>0||e.rangeChangedCalls>0||e.rowContentCalls>0||e.cellRenderCalls>0))return;let d=e.rowContentCalls>0?e.rowContentMs/e.rowContentCalls:0,f=e.cellRenderCalls>0?e.cellRenderMs/e.cellRenderCalls:0;console.log("[VDT perf]",{reason:t,wheel:{events:e.wheelEvents,inputPx:Math.round(e.wheelInputPx),handlerMs:Number(e.wheelHandlerMs.toFixed(2)),rafFlushes:e.wheelRafFlushes,rafMs:Number(e.wheelRafMs.toFixed(2))},rangeChanged:{calls:e.rangeChangedCalls,totalMs:Number(e.rangeChangedMs.toFixed(2))},rowContent:{calls:e.rowContentCalls,totalMs:Number(e.rowContentMs.toFixed(2)),avgMs:Number(d.toFixed(3)),maxMs:Number(e.rowContentMaxMs.toFixed(3))},cellRender:{calls:e.cellRenderCalls,totalMs:Number(e.cellRenderMs.toFixed(2)),avgMs:Number(f.toFixed(3)),maxMs:Number(e.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}},[y]);q(()=>{if(!y||typeof window>"u")return;console.log("[VDT perf] enabled (localStorage vdt-perf-debug=1)");let t=window.setInterval(()=>{qe("interval")},1500);return()=>{window.clearInterval(t),qe("cleanup")}},[qe,y]);let Mt=ce(()=>$e((t,e)=>{let r=M(null),d=M(0),f=M(null);return q(()=>{let n=r.current;if(!n)return;let i=H=>{let z=y?performance.now():0;if(H.shiftKey||Math.abs(H.deltaX)>Math.abs(H.deltaY))return;let A=H.target?.closest?.("[data-vdt-inner-scroll]");if(A&&n.contains(A)&&(H.deltaY<0?A.scrollTop>0:A.scrollTop+A.clientHeight<A.scrollHeight-1))return;H.preventDefault();let ee=H.deltaY;H.deltaMode===1?ee*=40:H.deltaMode===2&&(ee*=n.clientHeight),y&&(h.current.wheelEvents+=1,h.current.wheelInputPx+=ee),d.current+=ee,f.current===null&&(f.current=requestAnimationFrame(()=>{let he=y?performance.now():0,C=Math.max(n.clientHeight*.4,160),F=Math.max(-C,Math.min(C,d.current));d.current=0,f.current=null,F!==0&&(n.scrollTop+=F),y&&(h.current.wheelRafFlushes+=1,h.current.wheelRafMs+=performance.now()-he)}),y&&(h.current.wheelHandlerMs+=performance.now()-z))};return n.addEventListener("wheel",i,{passive:!1}),()=>{n.removeEventListener("wheel",i),f.current!==null&&(cancelAnimationFrame(f.current),f.current=null),d.current=0}},[]),a(Un,{detectInnerScroll:!0,track:jn,...oe,children:a(Fn,{component:D,...t,ref:n=>{r.current=n,typeof e=="function"?e(n):e&&(e.current=n)},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:b?0:Ae,paddingTop:v,paddingBottom:be}}})})}),[]),Ze=ce(()=>{if(Z===!0)return"#f5f5f5";if(typeof Z=="string")return Z},[Z]),[an,vt]=ke(c),[ln,sn]=ke(0);q(()=>{c&&vt(!0)},[c]);let wt=O(()=>{vt(!1)},[]),dn=an,er=c&&o.length>0,Je=M(!1),Qe=M(-1),et=M(null),tt=M(null),[cn,un]=ke(!1),Oe=O(()=>{let t=tt.current;t&&un(t.scrollHeight>t.clientHeight+1)},[]);q(()=>{let t=tt.current;if(!t||typeof ResizeObserver>"u")return;let e=new ResizeObserver(()=>Oe());return e.observe(t),()=>e.disconnect()},[Oe,B]);let nt=M(E);nt.current=E;let we=M(p);we.current=p;let rt=M(bt);rt.current=bt;let St=M(xt);St.current=xt;let Tt=M(null),Be=ce(()=>{let t=new Map,e=0;return l.forEach(r=>{r.pinned==="left"&&(t.set(String(r.id),e),e+=typeof r.width=="number"?r.width:0)}),t},[l]),ot=ce(()=>{if(l.some(t=>typeof t.minWidth=="number"))return l.reduce((t,e)=>t+(typeof e.width=="number"?e.width:typeof e.minWidth=="number"?e.minWidth:0),0)},[l]),fe=O((t,e)=>{let r=Be.get(String(t.id));return r===void 0?{}:{position:"sticky",left:r,zIndex:e?3:1}},[Be]),_e=!!E,Se=M(!1),ie=M({x:0,y:0});q(()=>{let t=e=>{let r=e.clientX-ie.current.x,d=e.clientY-ie.current.y;Math.sqrt(r*r+d*d)>gt&&(Se.current=!0)};return document.addEventListener("mousemove",t),()=>{document.removeEventListener("mousemove",t)}},[]),q(()=>{let t=document.querySelector('[data-testid="virtuoso-scroller"]');t&&t.querySelectorAll(".MuiTableSortLabel-root").forEach(r=>{let d=new MouseEvent("mouseleave",{bubbles:!0,cancelable:!0});r.dispatchEvent(d)})},[x]);let ze=O(t=>{if(!R)return;R(t,x===t&&w==="asc"?"desc":"asc")},[R,x,w]),[Te,Rt]=ke(null),Ht=M(k);Ht.current=k;let Et=M(R);Et.current=R;let Re=O((t,e)=>{if(!t){e.preventDefault();return}t.headerProps?.onContextMenu?.(e);let r=e.defaultPrevented;if(r||(r=Ht.current?.(t,e)===!0||e.defaultPrevented),e.preventDefault(),r||t.headerMenu===!1||!!!((t.sortMenu??t.sortable)&&Et.current)&&!Xt(t))return;let f=e.currentTarget.getBoundingClientRect();Rt({colId:String(t.id),x:e.clientX,y:f.bottom})},[]),le=O(t=>t.filterValues&&t.filterValues.length>0?W(D,{component:"span",sx:{display:"inline-flex",alignItems:"center",gap:.5,maxWidth:"100%",color:"primary.main",fontWeight:600,verticalAlign:"middle"},children:[a(D,{component:"span",sx:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.text}),a(te,{d:N.filter,size:16})]}):t.text,[]),pn=O(t=>{let e=y?performance.now():0;if(St.current?.(),!L){y&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-e);return}if(c&&o.length===0){y&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-e);return}let r=o.length>=30,d=t>=o.length-1,f=Qe.current===o.length;if(d&&r&&!Je.current&&!f){Je.current=!0,Qe.current=o.length;let n=o.length;L(n,50)}y&&(h.current.rangeChangedCalls+=1,h.current.rangeChangedMs+=performance.now()-e)},[o.length,c,L,y]);q(()=>{c||(Je.current=!1)},[c]),q(()=>{o.length===0&&sn(t=>t+1)},[o.length]);let kt=M(mt);kt.current=mt;let at=M(o.length),it=M(void 0);q(()=>{let t=at.current,e=o.length,r=e>0?we.current?we.current(o[0],0):o[0]:void 0,d=it.current;if(e>t&&t>0){at.current=e,it.current=r;return}let f=e<t||t>0&&r!==d;f&&(Qe.current=-1),et.current&&e>0&&f&&kt.current&&et.current.scrollToIndex({index:0,align:"start",behavior:"auto"}),at.current=e,it.current=r},[o]);let Lt=O(()=>{let t={},e=[];if(l.forEach(n=>{n.group?(t[n.group]||(t[n.group]=[]),t[n.group].push(n)):e.push(n)}),!(Object.keys(t).length>0))return a(Le,{children:l.map(n=>a(ue,{align:n.align||"left",title:typeof n.text=="string"?n.text:void 0,...n.headerProps,onContextMenu:i=>Re(n,i),style:{width:n.width,minWidth:n.width??n.minWidth,...n.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px",...fe(n,!0),...n.headerProps?.style},children:n.sortable?a("div",{style:{display:"flex",alignItems:"center",justifyContent:n.align==="center"?"center":n.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:W(D,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>ze(String(n.id)),children:[le(n),a(ht,{active:x===n.id,direction:x===n.id?w:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:x===n.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)"}}})]})}):le(n)},String(n.id)))});let d=[...e.map(n=>a(ue,{rowSpan:2,align:n.align||"left",title:typeof n.text=="string"?n.text:void 0,...n.headerProps,onContextMenu:i=>Re(n,i),style:{width:n.width,minWidth:n.width,...n.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px",...fe(n,!0),...n.headerProps?.style},children:n.sortable&&R?a("div",{style:{display:"flex",alignItems:"center",justifyContent:n.align==="center"?"center":n.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:W(D,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>ze(String(n.id)),children:[le(n),a(ht,{active:x===n.id,direction:x===n.id?w:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:x===n.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)"}}})]})}):le(n)},String(n.id))),...Object.entries(t).map(([n,i])=>a(ue,{align:"center",colSpan:i.length,onContextMenu:H=>Re(null,H),style:{fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px"},children:n},n))],f=[...Object.values(t).flat().map(n=>a(ue,{align:n.align||"left",title:typeof n.text=="string"?n.text:void 0,...n.headerProps,onContextMenu:i=>Re(n,i),style:{width:n.width,minWidth:n.width,...n.style,fontWeight:"bold",position:"sticky",top:0,zIndex:2,padding:"16px",...fe(n,!0),...n.headerProps?.style},children:n.sortable&&R?a("div",{style:{display:"flex",alignItems:"center",justifyContent:n.align==="center"?"center":n.align==="right"?"flex-end":"flex-start",position:"relative",width:"100%"},children:W(D,{sx:{position:"relative",cursor:"default","&:hover .MuiTableSortLabel-root":{opacity:"1 !important","& .MuiSvgIcon-root":{color:"#000",opacity:"1 !important"}}},onClick:()=>ze(String(n.id)),children:[le(n),a(ht,{active:x===n.id,direction:x===n.id?w:"desc",sx:{position:"absolute",left:"100%",top:"50%",transform:"translateY(-50%)",marginLeft:"4px",minWidth:"auto",width:"16px",height:"16px",cursor:"default",opacity:x===n.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)"}}})]})}):le(n)},String(n.id)))];return W(De,{children:[a(Le,{children:d}),a(Le,{children:f})]})},[l,x,w,ze,R,ae,fe,Re,le]),Fe=O((t,e)=>{let r=y?performance.now():0;if(!e){if(y){h.current.rowContentCalls+=1;let i=performance.now()-r;h.current.rowContentMs+=i,h.current.rowContentMaxMs=Math.max(h.current.rowContentMaxMs,i)}return null}let d=Ye?Ye(e,t):null;if(d!=null)return a(ue,{colSpan:l.length,"data-vdt-pad":"",sx:[{padding:b?"0 14px":"8px 16px"},...Array.isArray(ye)?ye:ye?[ye]:[]],children:d});let f=0,n=l.map((i,H)=>{if(f>0)return f-=1,null;let z=i.colSpan?Math.max(1,Math.min(i.colSpan(e,t),l.length-H)):1;f=z-1;let A=y?performance.now():0,ee=i.render?i.render(e,t):String(e[i.id]||"");if(y){let V=performance.now()-A;h.current.cellRenderCalls+=1,h.current.cellRenderMs+=V,h.current.cellRenderMaxMs=Math.max(h.current.cellRenderMaxMs,V)}let he=Be.has(String(i.id)),C=i.cellPadding!==void 0,F=i.rowSpan?i.rowSpan(e,t):1;if(F<=0)return null;let se=i.onCellClick;return a(ue,{align:i.align||"left",rowSpan:F>1?F:void 0,colSpan:z>1?z:void 0,"data-vdt-pad":C?"":void 0,"data-vdt-pinned":he?"":void 0,"data-vdt-cell-click":se?"":void 0,onClick:se?V=>{let ge=V.clientX-ie.current.x,de=V.clientY-ie.current.y;V.stopPropagation(),!(Math.sqrt(ge*ge+de*de)>gt)&&se(e,t,V)}:void 0,style:{...z>1?{}:{width:i.width,minWidth:i.width??i.minWidth},...i.primary?{fontSize:15}:{},...i.style,...i.cellStyle?i.cellStyle(e,t):{},padding:C?i.cellPadding:"8px 16px",...fe(i,!1)},children:ee},String(i.id))});if(y){h.current.rowContentCalls+=1;let i=performance.now()-r;h.current.rowContentMs+=i,h.current.rowContentMaxMs=Math.max(h.current.rowContentMaxMs,i)}return a(De,{children:n})},[l,y,Ye,ye,b,Be,fe]),Dt=O(()=>{let t=Lt();if(!Ce||Ce.length===0)return t;let e=Tt.current;return W(De,{children:[t,a("tr",{"data-vdt-pinned-area":"",children:a("td",{colSpan:l.length,style:{padding:0,border:0},children:a(D,{"data-vdt-inner-scroll":"",sx:[{maxHeight:Ke,overflowY:Ke?"auto":"visible",overflowX:"hidden",scrollbarWidth:"thin",borderBottom:`1px solid ${b?m.borderStrong:"rgba(224, 224, 224, 1)"}`,"& tbody tr:last-of-type > td":{borderBottom:"none"}},...Array.isArray(Me)?Me:Me?[Me]:[]],children:W("table",{style:{width:"100%",tableLayout:Pe,borderCollapse:"separate",borderSpacing:0},children:[a("colgroup",{children:l.map(r=>a("col",{style:{width:r.width,minWidth:r.width??r.minWidth}},String(r.id)))}),a(Wt,{children:Ce.map((r,d)=>e?a(e,{item:r,"data-index":d,"data-vdt-pinned-row":"",children:Fe(d,r)},p?String(p(r,d)):`p${d}`):null)})]})})})})]})},[Lt,Ce,Ke,Me,l,Fe,Pe,p,b,m]),K=Xe??l.some(t=>typeof t.footer=="function"),It=O(()=>{if(!K)return null;let t=[];for(let e=0;e<l.length;e+=1){let r=l[e],d=r.footerColSpan&&r.footerColSpan>1?Math.min(r.footerColSpan,l.length-e):1;t.push(a(ue,{align:r.align||"left",colSpan:d>1?d:void 0,style:{...d>1?{}:{width:r.width,minWidth:r.width},...r.style,fontWeight:"bold",padding:b?"0 14px":"16px"},children:r.footer?r.footer(o):null},String(r.id))),e+=d-1}return a(Le,{children:t})},[K,l,o,b]),lt=ce(()=>({Scroller:Mt,Table:t=>a(zn,{...t,sx:{borderCollapse:"separate",tableLayout:Pe,...ot?{minWidth:ot}:{},marginRight:pe?"16px":0,...K?{height:"100%"}:{}}}),TableHead:$e((t,e)=>a(Vn,{...t,ref:e,sx:{userSelect:"none","& > tr":{height:ae,"& > th":{padding:"16px",position:"sticky",top:0,zIndex:2,fontWeight:"bold"}}}})),TableRow:t=>{let{item:e,selected:r,"aria-selected":d,className:f,...n}=t,i=n["data-index"]??0,H=i%2===1,z=e&&we.current?we.current(e,i):i,A=!Ne&&s!==null&&s!==void 0&&z===s,ee=A&&Y?typeof Y=="function"?Y(e,i):Y:void 0,he=String(f??"").split(/\s+/).filter(C=>C!=="Mui-selected"&&C!=="Mui-focusVisible").join(" ");return a(Le,{...n,"data-row-id":z!=null?String(z):void 0,className:he||void 0,selected:A,onMouseDown:C=>{Se.current=!1,ie.current={x:C.clientX,y:C.clientY}},onContextMenu:C=>{e&&rt.current&&rt.current(e,i,C)},onClick:C=>{let F=C.clientX-ie.current.x,se=C.clientY-ie.current.y;if(Math.sqrt(F*F+se*se)>gt||Se.current){C.preventDefault(),C.stopPropagation(),Se.current=!1;return}e&&nt.current&&nt.current(e,i),Se.current=!1},sx:[{userSelect:"none",...je?{"& > td":{height:ve}}:{height:ve,maxHeight:ve},boxSizing:"border-box",backgroundColor:H&&Ze?Ze:"transparent","& td:not([data-vdt-pad])":{padding:"8px 16px"},"& td":{boxSizing:"border-box",borderBottom:J?"1px solid rgba(224, 224, 224, 1)":"none"},"& th":{padding:"8px 16px",borderBottom:"none"},"&:hover":_e&&!A?{backgroundColor:C=>{let F=C.palette.mode==="dark",V=Ge??"#000000",ge=Ct??.06;if(!Ge)return F?`rgba(255, 255, 255, ${ge})`:`rgba(0, 0, 0, ${ge})`;let de=V.replace("#","").trim();if(de.length!==6)return V;let Cn=parseInt(de.substring(0,2),16),Mn=parseInt(de.substring(2,4),16),vn=parseInt(de.substring(4,6),16);return`rgba(${Cn}, ${Mn}, ${vn}, ${ge})`}}:void 0,cursor:_e?"pointer":void 0},ee]})},TableBody:$e((t,e)=>{let{children:r,...d}=t;return W(Wt,{...d,ref:e,sx:K?{height:"100%"}:void 0,children:[r,K&&a("tr",{"aria-hidden":!0,style:{height:"100%"},children:a("td",{colSpan:l.length,style:{padding:0,border:0}})})]})}),TableFoot:$e((t,e)=>a(Wn,{...t,ref:e,sx:[{"& tr":{height:me??X,maxHeight:me??X,boxSizing:"border-box"},"& td":{height:me??X,boxSizing:"border-box",backgroundColor:r=>r.palette.mode==="dark"?"#1e1e1e":"#ffffff",padding:"0 16px",color:"inherit",fontSize:"0.875rem",border:"none",boxShadow:`inset 0 1px 0 0 ${b?m.borderStrong:"#000000"}`}},...Array.isArray(xe)?xe:xe?[xe]:[]]}))}),[_e,Ne?null:s,Y,X,Ze,J,ae,Ge,Ct,Mt,me,xe,K,b,m,l,Pe,pe,je,ot]);Tt.current=lt.TableRow;let fn=lt,He=lt,hn=He.Table,gn=He.TableHead,bn=He.TableBody,mn=He.TableRow,xn=He.TableFoot,_=Te?l.find(t=>String(t.id)===Te.colId):void 0,yn=()=>Rt(null),Pt=null;if(Te&&_){let t=String(_.id),e=!!((_.sortMenu??_.sortable)&&R),r=Xt(_),d=x===t?w:void 0;Pt=a(ft,{open:!0,anchorPosition:{left:Te.x,top:Te.y},onClose:yn,sort:e?{active:d??null,clearable:!!P,onChange:f=>{f?R?.(t,f):P?.()}}:void 0,filter:r?{options:_.filterOptions??[],value:_.filterValues??[],onChange:f=>_.onFilterChange?.(f),multiple:_.filterMultiple!==!1,emptyLabel:_.filterEmptyLabel,searchable:_.filterSearchable}:void 0})}let At=W(D,{sx:{position:"relative",height:B?"auto":"100%",width:"100%","& .MuiTableHead-root":{backgroundColor:t=>b?`${m.bg} !important`:t.palette.mode==="dark"?"#1e1e1e !important":"#ffffff !important"},...on??{},"& tbody td[data-vdt-pinned]":{backgroundColor:b?m.bg:Ue.palette.background.paper},"& tbody td[data-vdt-cell-click]":{cursor:"pointer"},"& tbody td[data-vdt-cell-click]:hover":{backgroundColor:b?m.hoverBg:Ue.palette.mode==="dark"?"rgba(255, 255, 255, 0.06)":"rgba(0, 0, 0, 0.04)"},...b&&_e?{"& tbody tr:hover td[data-vdt-pinned]":{backgroundColor:m.hoverBg}}:{},...b?{...pe?{border:`1px solid ${m.borderStrong}`,borderRadius:"4px"}:{"& table":{backgroundColor:m.bg}},overflow:"hidden","& thead tr th > *":{verticalAlign:"middle"},"& thead > tr > th":{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},"& thead > tr > th > *":{maxWidth:"100%"},"& thead tr th":{height:ae,boxSizing:"border-box",padding:"0 14px !important",fontSize:13,fontWeight:"500 !important",color:m.headerColor,backgroundColor:`${m.bg} !important`,borderTop:!pe&&Kt?`1px solid ${m.borderStrong}`:"none",borderBottom:`1px solid ${m.borderStrong}`,borderRight:`1px solid ${m.border}`,"&:last-of-type":{borderRight:"none"}},"& tbody tr td:not([data-vdt-pad])":{padding:"0 14px !important"},"& tbody tr td":{fontSize:14,borderBottom:`1px solid ${m.border}`},...o.length>0&&(B||cn||K)?{[`& tbody tr[data-index="${o.length-1}"]:not([data-vdt-pinned-row]) td`]:{borderBottom:"none"}}:{}}:{}},children:[B?a(D,{sx:{overflowX:"auto",width:"100%"},children:W(hn,{children:[a(gn,{children:Dt()}),a(bn,{children:o.map((t,e)=>a(mn,{item:t,"data-index":e,children:Fe(e,t)},p?String(p(t,e)):e))}),K?a(xn,{children:It()}):null]})}):a(Kn,{ref:et,data:o,totalCount:L?o.length+1:o.length,defaultItemHeight:ve,fixedItemHeight:je?void 0:ve,fixedHeaderContent:Dt,fixedFooterContent:K?It:void 0,itemContent:Fe,...jt&&p?{computeItemKey:(t,e)=>e?p(e,t):`vdt-${t}`}:{},endReached:pn,scrollerRef:t=>{tt.current=t instanceof HTMLElement?t:null,Oe()},totalListHeightChanged:Oe,style:{height:"100%"},increaseViewportBy:{top:Jt,bottom:Qt},overscan:nn,followOutput:!1,components:fn},ln),o.length===0&&!c&&!yt&&b&&typeof Q=="string"&&a(D,{sx:{position:B?"static":"absolute",top:ae,left:0,right:0,py:6,textAlign:"center",fontSize:14,color:m.emptyColor,pointerEvents:"none"},children:Q}),o.length===0&&!c&&!yt&&!(b&&typeof Q=="string")&&a(D,{sx:{position:"absolute",top:0,left:0,right:0,bottom:0,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,pointerEvents:"none","& > *":{pointerEvents:"auto"}},children:typeof Q=="string"?W(De,{children:[a(D,{sx:{width:48,height:48,display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"50%",backgroundColor:"#f5f5f5",color:"#999"},children:"\u{1F4C4}"}),a(Xn,{variant:"body1",sx:{color:"text.secondary"},children:Q})]}):Q}),Pt,dn&&a(De,{children:Ie?a(Ie,{visible:c,onComplete:wt}):a(Bt,{visible:c,onComplete:wt,size:40,indicator:a(zt,{}),sx:{top:`${l.some(t=>t.group)?ae*2:ae}px`,bottom:`${K?me??X:0}px`},background:{show:o.length===0,opacity:.8}})})]}),Nt=b&&pe?{paddingRight:Ae,paddingTop:$t,paddingBottom:$t}:{};return re?a($n,{className:"grow",elevation:1,sx:{padding:0,paddingLeft:Ae,...Nt,boxSizing:"border-box",height:B?"auto":"100%",minHeight:0,flex:B?"none":1,display:"flex",flexDirection:"column"},children:At}):a(D,{className:"grow",style:{padding:0,paddingLeft:Ae,...Nt,boxSizing:"border-box",height:B?"auto":"100%",minHeight:0,flex:B?"none":1,display:"flex",flexDirection:"column"},children:At})}var Jn=_n(Zn);export{ct as HEADER_MENU_FONT_SIZE,N as HEADER_MENU_ICON_PATHS,ut as HEADER_MENU_ICON_SIZE,pt as HEADER_MENU_ITEM_HEIGHT,Vt as HEADER_MENU_ITEM_SX,ft as HeaderMenu,We as HeaderMenuDivider,te as HeaderMenuIcon,G as HeaderMenuItem,Jn as VirtualDataTable,Bn as headerMenuAnchor};
|
|
5
5
|
/**
|
|
6
6
|
* Virtual Data Table - A high-performance virtual data table component for React
|
|
7
7
|
*
|