@arim-aisdc/public-components 2.3.49 → 2.3.50

package/dist/components/TableMax/TableHeader/index.js

@@ -1,91 +1,4 @@
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-// import { Column, flexRender } from '@tanstack/react-table';
-// import { useDrag, useDrop } from 'ahooks';
-
-// import { Filter } from '../components/ColumnFilter';
-
-import Cell from "./Cell";
-import "./index.less";
-import { getPinningStyle } from "./utils";
-import { useWhyDidYouUpdate } from 'ahooks';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var TableHeader = function TableHeader(_ref) {
-  var _headerGroups;
-  var tableContentRef = _ref.tableContentRef,
-    table = _ref.table,
-    canFilter = _ref.canFilter,
-    enableFilters = _ref.enableFilters,
-    canSorting = _ref.canSorting,
-    hasGroup = _ref.hasGroup,
-    getHeaderCellProps = _ref.getHeaderCellProps,
-    columnResizeMode = _ref.columnResizeMode,
-    disableColumnDrag = _ref.disableColumnDrag,
-    rowHeight = _ref.rowHeight,
-    headerRowNum = _ref.headerRowNum,
-    manualFiltering = _ref.manualFiltering,
-    getDynamicFilterOptionsFn = _ref.getDynamicFilterOptionsFn;
-  var headerGroups = table.getHeaderGroups();
-  var headers = (headerGroups === null || headerGroups === void 0 || (_headerGroups = headerGroups[headerGroups.length - 1]) === null || _headerGroups === void 0 ? void 0 : _headerGroups.headers) || [];
-  useWhyDidYouUpdate('useWhyDidYouUpdate', {
-    tableContentRef: tableContentRef,
-    table: table,
-    canFilter: canFilter,
-    enableFilters: enableFilters,
-    canSorting: canSorting,
-    hasGroup: hasGroup,
-    getHeaderCellProps: getHeaderCellProps,
-    columnResizeMode: columnResizeMode,
-    disableColumnDrag: disableColumnDrag,
-    rowHeight: rowHeight,
-    headerRowNum: headerRowNum,
-    manualFiltering: manualFiltering
-  });
-  return /*#__PURE__*/_jsxs("table", {
-    children: [/*#__PURE__*/_jsx("colgroup", {
-      children: headers.map(function (header) {
-        var _header$column;
-        var size = (header === null || header === void 0 || (_header$column = header.column) === null || _header$column === void 0 ? void 0 : _header$column.getSize()) || 120;
-        return /*#__PURE__*/_jsx("col", {
-          width: size
-        }, header.id);
-      })
-    }), /*#__PURE__*/_jsx("thead", {
-      children: headerGroups === null || headerGroups === void 0 ? void 0 : headerGroups.map(function (headerGroup) {
-        return /*#__PURE__*/_jsx("tr", {
-          className: "table-thead-tr cus-table-thead-tr",
-          style: {
-            height: hasGroup && headerGroup.depth === 0 ? "".concat(rowHeight, "px") : 'auto',
-            width: '100%'
-          },
-          children: headerGroup.headers.map(function (header) {
-            return /*#__PURE__*/_jsx("th", {
-              colSpan: header.colSpan,
-              style: _objectSpread({}, getPinningStyle(header, table, true)),
-              children: header.isPlaceholder || header.id === 'placeholder-column' ? null : /*#__PURE__*/_jsx(Cell, {
-                tableContentRef: tableContentRef,
-                header: header,
-                table: table,
-                hasGroup: hasGroup,
-                canSorting: canSorting,
-                getHeaderCellProps: getHeaderCellProps,
-                columnResizeMode: columnResizeMode,
-                disableColumnDrag: disableColumnDrag,
-                headerRowNum: headerRowNum,
-                canFilter: canFilter,
-                manualFiltering: manualFiltering,
-                getDynamicFilterOptionsFn: getDynamicFilterOptionsFn
-              }, header.id)
-            }, header.id);
-          })
-        }, headerGroup.id);
-      })
-    })]
-  });
-};
+import { TableHeader } from "./TableHeader";
+export { VirtualTableHeader } from "./VirtualTableHeader";
+export { OriginalTableHeader } from "./OriginalTableHeader";
 export default TableHeader;

package/dist/components/TableMax/TableHeader/utils.d.ts

@@ -1 +1,2 @@
 export declare const getPinningStyle: any;
+export declare const findHeaderByColumn: (headerGroup: any, column: any) => any;

package/dist/components/TableMax/TableHeader/utils.js

@@ -2,10 +2,10 @@ var getOffsetLeft = function getOffsetLeft(list, column, visibleColumnSizesMap)
   var x = 0;
   for (var i = 0; i < list.length; i++) {
     var curr = list[i];
-    if (curr === column.id) {
+    if (curr.id === column.id) {
       return x;
     }
-    x += visibleColumnSizesMap[curr] || 0;
+    x += visibleColumnSizesMap[curr.id] || 0;
   }
   return x;
 };
@@ -14,10 +14,10 @@ var getOffsetRight = function getOffsetRight(list, column, visibleColumnSizesMap
   // console.log(list, 'list')
   for (var i = list.length - 1; i > 0; i--) {
     var curr = list[i];
-    if (curr === column.id) {
+    if (curr.id === column.id) {
       return x;
     }
-    x += visibleColumnSizesMap[curr] || 120;
+    x += visibleColumnSizesMap[curr.id] || 120;
   }
   return x;
 };
@@ -30,7 +30,9 @@ export var getPinningStyle = function getPinningStyle(header, table, isHeader) {
       size: item.getSize()
     };
   });
-  var columnPinning = table.getState().columnPinning;
+  // const columnPinning = table.getState().columnPinning;
+  var leftPinnedColumns = table.getLeftVisibleLeafColumns();
+  var rightPinnedColumns = table.getRightVisibleLeafColumns();
   var visibleColumnSizesMap = {};
   visibleColumnSizes.forEach(function (item) {
     visibleColumnSizesMap[item === null || item === void 0 ? void 0 : item.id] = item.size;
@@ -39,11 +41,11 @@ export var getPinningStyle = function getPinningStyle(header, table, isHeader) {
     case 'left':
       {
         var offsetLeft = 0;
-        offsetLeft += getOffsetLeft(columnPinning.left, column, visibleColumnSizesMap);
+        offsetLeft += getOffsetLeft(leftPinnedColumns, column, visibleColumnSizesMap);
         return {
           position: 'sticky',
           left: offsetLeft,
-          zIndex: 100,
+          zIndex: 150,
           transform: 'translateZ(0)',
           backfaceVisibility: 'hidden' /* 修复渲染抖动 */
 
@@ -53,12 +55,12 @@ export var getPinningStyle = function getPinningStyle(header, table, isHeader) {
     case 'right':
       {
         var offsetRight = 0;
-        offsetRight += getOffsetRight(columnPinning.right, column, visibleColumnSizesMap);
+        offsetRight += getOffsetRight(rightPinnedColumns, column, visibleColumnSizesMap);
         // console.log(offsetRight, 'offsetRight')
         return {
           position: 'sticky',
-          right: offsetRight - 0.5,
-          zIndex: 100,
+          right: offsetRight,
+          zIndex: 150,
           backfaceVisibility: 'hidden',
           /* 修复渲染抖动 */
           transform: 'translateZ(0)'
@@ -70,4 +72,9 @@ export var getPinningStyle = function getPinningStyle(header, table, isHeader) {
         // width: column.getSize(),
       };
   }
+};
+export var findHeaderByColumn = function findHeaderByColumn(headerGroup, column) {
+  return headerGroup.headers.find(function (h) {
+    return h.column.id === column.id;
+  });
 };

package/dist/components/TableMax/TableMax.js

@@ -40,6 +40,7 @@ import "./tableMax.less";
 import { downloadExcel, getFormatFilters, getFormatFiltersV2, getFormatSorting, operationColumnNoTooltips } from "./utils";
 import { useTableScrollShadow } from "./hooks/useTableScrollShadow";
 import { ExportTableData } from "./components/Export";
+import { VirtualScrollProvider } from "./contexts";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var ColumnType = /*#__PURE__*/function (ColumnType) {
@@ -53,6 +54,7 @@ export var CACHE_MAX_AGE = 1 * 60 * 60 * 1000;
 var getCurrentRouterName = function getCurrentRouterName() {
   return window.location.pathname.slice(1);
 };
+var compactModeRowHeight = 30;
 
 /**将空默认值提升为组件外部的常量，避免引发不必要的渲染 */
 var defaultData = [];
@@ -149,7 +151,7 @@ var TableMax = function TableMax(_ref) {
     getCellProps = _ref.getCellProps,
     getHeaderCellProps = _ref.getHeaderCellProps,
     _ref$rowHeight = _ref.rowHeight,
-    rowHeight = _ref$rowHeight === void 0 ? 42 : _ref$rowHeight,
+    propsRowHeight = _ref$rowHeight === void 0 ? 42 : _ref$rowHeight,
     _ref$defaultColumnFil = _ref.defaultColumnFilters,
     defaultColumnFilters = _ref$defaultColumnFil === void 0 ? initColumnFilters : _ref$defaultColumnFil,
     getColumnFiltersData = _ref.getColumnFiltersData,
@@ -200,7 +202,11 @@ var TableMax = function TableMax(_ref) {
     pageSizeOptions = _ref.pageSizeOptions,
     openMemo = _ref.openMemo,
     getDynamicFilterOptionsFn = _ref.getDynamicFilterOptionsFn,
-    exportConfig = _ref.exportConfig;
+    exportConfig = _ref.exportConfig,
+    _ref$openVirtualColum = _ref.openVirtualColumns,
+    openVirtualColumns = _ref$openVirtualColum === void 0 ? false : _ref$openVirtualColum,
+    _ref$openVirtualRows = _ref.openVirtualRows,
+    openVirtualRows = _ref$openVirtualRows === void 0 ? true : _ref$openVirtualRows;
   var tableMaxRef = useRef(null);
   // 表格元素
   var tableContentRef = useRef(null);
@@ -243,60 +249,64 @@ var TableMax = function TableMax(_ref) {
   /**表格配置信息缓存 */
   var currentUserId = userId || ((_JSON$parse = JSON.parse(localStorage.getItem('poi-permission') || '{}')) === null || _JSON$parse === void 0 || (_JSON$parse = _JSON$parse.currentUser) === null || _JSON$parse === void 0 ? void 0 : _JSON$parse.id);
   var tableKey = "".concat(tableKeyPrefixCls, "-").concat(getCurrentRouterName(), "-").concat(tableId, "-").concat(currentUserId);
+  var _useState = useState(propsRowHeight),
+    _useState2 = _slicedToArray(_useState, 2),
+    rowHeight = _useState2[0],
+    setRowHeight = _useState2[1];
 
   /**表格数据 */
   var initColumnOrder = columns === null || columns === void 0 ? void 0 : columns.map(function (column) {
     return column.id;
   });
-  var _useState = useState(function () {
+  var _useState3 = useState(function () {
       return datas;
     }),
-    _useState2 = _slicedToArray(_useState, 2),
-    tableDatas = _useState2[0],
-    setTableDatas = _useState2[1];
-  // 下载按钮的loading
-  var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
-    downLoading = _useState4[0],
-    setDownLoading = _useState4[1];
-  /**表格列 */
-  var _useState5 = useState(columns),
+    tableDatas = _useState4[0],
+    setTableDatas = _useState4[1];
+  // 下载按钮的loading
+  var _useState5 = useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
-    tableColumns = _useState6[0],
-    setTableColumns = _useState6[1];
-  /**列显隐 */
-  var _useState7 = useState(),
+    downLoading = _useState6[0],
+    setDownLoading = _useState6[1];
+  /**表格列 */
+  var _useState7 = useState(columns),
     _useState8 = _slicedToArray(_useState7, 2),
-    columnVisibility = _useState8[0],
-    setColumnVisibility = _useState8[1];
-  /**列拖动顺序 */
+    tableColumns = _useState8[0],
+    setTableColumns = _useState8[1];
+  /**列显隐 */
   var _useState9 = useState(),
     _useState10 = _slicedToArray(_useState9, 2),
-    columnOrder = _useState10[0],
-    setColumnOrder = _useState10[1];
-  /**列排序 */
-  var _useState11 = useState([]),
+    columnVisibility = _useState10[0],
+    setColumnVisibility = _useState10[1];
+  /**列拖动顺序 */
+  var _useState11 = useState(),
     _useState12 = _slicedToArray(_useState11, 2),
-    sorting = _useState12[0],
-    setSorting = _useState12[1];
-  /**行选中 */
-  var _useState13 = useState(defaultSelectedRowId),
+    columnOrder = _useState12[0],
+    setColumnOrder = _useState12[1];
+  /**列排序 */
+  var _useState13 = useState([]),
     _useState14 = _slicedToArray(_useState13, 2),
-    rowSelectedId = _useState14[0],
-    setRowSelectedId = _useState14[1];
+    sorting = _useState14[0],
+    setSorting = _useState14[1];
+  /**行选中 */
+  var _useState15 = useState(defaultSelectedRowId),
+    _useState16 = _slicedToArray(_useState15, 2),
+    rowSelectedId = _useState16[0],
+    setRowSelectedId = _useState16[1];
   /**行勾选 */
-  var _useState15 = useState(defaultSelectedRowIds.reduce(function (accumulator, currentValue) {
+  var _useState17 = useState(defaultSelectedRowIds.reduce(function (accumulator, currentValue) {
       accumulator[currentValue] = true;
       return accumulator;
     }, {})),
-    _useState16 = _slicedToArray(_useState15, 2),
-    rowSelection = _useState16[0],
-    setRowSelection = _useState16[1];
-  // 高亮行的id：多选场景并且点击行不勾选时，高亮点击的行
-  var _useState17 = useState(defaultHighLightRowId),
     _useState18 = _slicedToArray(_useState17, 2),
-    rowHighLightId = _useState18[0],
-    setRowHighLightId = _useState18[1];
+    rowSelection = _useState18[0],
+    setRowSelection = _useState18[1];
+  // 高亮行的id：多选场景并且点击行不勾选时，高亮点击的行
+  var _useState19 = useState(defaultHighLightRowId),
+    _useState20 = _slicedToArray(_useState19, 2),
+    rowHighLightId = _useState20[0],
+    setRowHighLightId = _useState20[1];
   useEffect(function () {
     setRowHighLightId(defaultHighLightRowId);
   }, [defaultHighLightRowId]);
@@ -314,10 +324,10 @@ var TableMax = function TableMax(_ref) {
       right: columnPinningConfig.right || []
     };
   }, [JSON.stringify(columnPinningConfig)]);
-  var _useState19 = useState(initColumnPinning),
-    _useState20 = _slicedToArray(_useState19, 2),
-    columnPinning = _useState20[0],
-    setColumnPinning = _useState20[1];
+  var _useState21 = useState(initColumnPinning),
+    _useState22 = _slicedToArray(_useState21, 2),
+    columnPinning = _useState22[0],
+    setColumnPinning = _useState22[1];
   var _useColumnWidth = useColumnWidth({
       tableContentRef: tableContentRef,
       tableId: tableId,
@@ -333,14 +343,14 @@ var TableMax = function TableMax(_ref) {
     handleVisibleConfigChange = _useColumnWidth.handleVisibleConfigChange;
 
   /**列筛选 */
-  var _useState21 = useState(defaultColumnFilters),
-    _useState22 = _slicedToArray(_useState21, 2),
-    columnFilters = _useState22[0],
-    setColumnFilters = _useState22[1];
-  var _useState23 = useState(''),
+  var _useState23 = useState(defaultColumnFilters),
     _useState24 = _slicedToArray(_useState23, 2),
-    globalFilter = _useState24[0],
-    setGlobalFilter = _useState24[1];
+    columnFilters = _useState24[0],
+    setColumnFilters = _useState24[1];
+  var _useState25 = useState(''),
+    _useState26 = _slicedToArray(_useState25, 2),
+    globalFilter = _useState26[0],
+    setGlobalFilter = _useState26[1];
   /**分页 */
   var pagination = useMemo(function () {
     return typeof skipCount === 'number' && pageSize ? {
@@ -349,37 +359,37 @@ var TableMax = function TableMax(_ref) {
     } : undefined;
   }, [skipCount, pageSize]);
   /**是否有分组 */
-  var _useState25 = useState(false),
-    _useState26 = _slicedToArray(_useState25, 2),
-    hasGroup = _useState26[0],
-    setHasGroup = _useState26[1];
-
-  /**是否正在多行拖拽 */
   var _useState27 = useState(false),
     _useState28 = _slicedToArray(_useState27, 2),
-    selectedRowDragging = _useState28[0],
-    setSelectedRowDragging = _useState28[1];
+    hasGroup = _useState28[0],
+    setHasGroup = _useState28[1];
 
-  /**显示筛选开关状态 */
-  var _useState29 = useState(defaultEnableFilters),
+  /**是否正在多行拖拽 */
+  var _useState29 = useState(false),
     _useState30 = _slicedToArray(_useState29, 2),
-    enableFilters = _useState30[0],
-    setEnableFilters = _useState30[1];
+    selectedRowDragging = _useState30[0],
+    setSelectedRowDragging = _useState30[1];
 
-  /**表头最多显示几行文字 */
-  var _useState31 = useState(defaultHeaderRowNum),
+  /**显示筛选开关状态 */
+  var _useState31 = useState(defaultEnableFilters),
     _useState32 = _slicedToArray(_useState31, 2),
-    headerRowNum = _useState32[0],
-    setheaderRowNum = _useState32[1];
+    enableFilters = _useState32[0],
+    setEnableFilters = _useState32[1];
+
+  /**表头最多显示几行文字 */
+  var _useState33 = useState(defaultHeaderRowNum),
+    _useState34 = _slicedToArray(_useState33, 2),
+    headerRowNum = _useState34[0],
+    setheaderRowNum = _useState34[1];
   var _Form$useForm = Form.useForm(),
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     form = _Form$useForm2[0];
 
   /**正在编辑的行id*/
-  var _useState33 = useState(''),
-    _useState34 = _slicedToArray(_useState33, 2),
-    editingRowId = _useState34[0],
-    setEditingRowId = _useState34[1];
+  var _useState35 = useState(''),
+    _useState36 = _slicedToArray(_useState35, 2),
+    editingRowId = _useState36[0],
+    setEditingRowId = _useState36[1];
   var _React$useState = React.useState({}),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     expanded = _React$useState2[0],
@@ -387,10 +397,10 @@ var TableMax = function TableMax(_ref) {
 
   // 固定列是否显示阴影
   var scrollRafId = useRef(null);
-  var _useState35 = useState(defaultCompactMode),
-    _useState36 = _slicedToArray(_useState35, 2),
-    compactMode = _useState36[0],
-    setCompactMode = _useState36[1];
+  var _useState37 = useState(defaultCompactMode),
+    _useState38 = _slicedToArray(_useState37, 2),
+    compactMode = _useState38[0],
+    setCompactMode = _useState38[1];
   var onColumnVisibilityChange = function onColumnVisibilityChange(data) {
     if (typeof data === 'function') {
       var _Object$values, _Object$keys;
@@ -718,7 +728,7 @@ var TableMax = function TableMax(_ref) {
 
   var _rowSelectionChange = useCallback(debounce(function (rowOriginal, row) {
     if (rowSelectionChange) {
-      console.log(rowOriginal, row, 'rowSelectionChange1');
+      // console.log(rowOriginal, row, 'rowSelectionChange1')
       rowSelectionChange(rowOriginal, row);
     }
   }, 100), [rowSelectionChange]);
@@ -1044,7 +1054,8 @@ var TableMax = function TableMax(_ref) {
     disableColumnDrag: disableColumnDrag,
     compactMode: compactMode,
     manualFiltering: manualFiltering,
-    getDynamicFilterOptionsFn: getDynamicFilterOptionsFn
+    getDynamicFilterOptionsFn: getDynamicFilterOptionsFn,
+    tableHeaderRef: tableHeaderRef
   };
   var tableBodyProps = {
     tableContentRef: tableContentRef,
@@ -1104,6 +1115,21 @@ var TableMax = function TableMax(_ref) {
   var changeCompactMode = function changeCompactMode() {
     setCompactMode(!compactMode);
   };
+  useUpdateEffect(function () {
+    setRowHeight(compactMode ? compactModeRowHeight : propsRowHeight);
+  }, [propsRowHeight, compactMode]);
+  var virtualConfig = useMemo(function () {
+    return {
+      openVirtualColumns: openVirtualColumns,
+      openVirtualRows: openVirtualRows,
+      rowHeight: rowHeight,
+      columnOverscan: 3,
+      rowOverscan: 10
+    };
+  }, [openVirtualColumns, openVirtualRows, rowHeight]);
+
+  // const components = useTableComponents();
+
   return /*#__PURE__*/_jsx(Form, {
     form: form,
     component: false,
@@ -1268,42 +1294,48 @@ var TableMax = function TableMax(_ref) {
             setColumnVisibility: setColumnVisibility
           })]
         })]
-      }), /*#__PURE__*/_jsx("div", {
-        className: "table-max-content cus-table-max-content ".concat(compactMode ? 'table-max-content-compact' : null),
-        children: /*#__PURE__*/_jsxs("div", {
-          className: "table-center",
-          ref: tableContentRef
-          // style={{ maxHeight: !autoHeight ? defaultScrollY : 'fit-content' }}
-          ,
-          children: [/*#__PURE__*/_jsxs("div", {
-            className: "table-header-wrapper",
-            children: [/*#__PURE__*/_jsx("div", {
-              ref: tableHeaderRef,
-              className: "table-header",
-              children: /*#__PURE__*/_jsx(TableHeader, _objectSpread({}, tableHeaderProps))
+      }), /*#__PURE__*/_jsx(VirtualScrollProvider, {
+        config: virtualConfig,
+        table: table,
+        tableHeaderRef: tableHeaderRef,
+        tableBodyRef: tableBodyRef,
+        children: /*#__PURE__*/_jsx("div", {
+          className: "table-max-content cus-table-max-content ".concat(compactMode ? 'table-max-content-compact' : null),
+          children: /*#__PURE__*/_jsxs("div", {
+            className: "table-center",
+            ref: tableContentRef
+            // style={{ maxHeight: !autoHeight ? defaultScrollY : 'fit-content' }}
+            ,
+            children: [/*#__PURE__*/_jsxs("div", {
+              className: "table-header-wrapper",
+              children: [/*#__PURE__*/_jsx("div", {
+                ref: tableHeaderRef,
+                className: "table-header",
+                children: /*#__PURE__*/_jsx(TableHeader, _objectSpread({}, tableHeaderProps))
+              }), /*#__PURE__*/_jsx("div", {
+                className: "table-header-scroll"
+              })]
             }), /*#__PURE__*/_jsx("div", {
-              className: "table-header-scroll"
+              ref: tableBodyRef,
+              className: "table-body"
+              // onScroll={scrollHandler}
+              ,
+              style: {
+                width: "100%"
+              },
+              onMouseEnter: function onMouseEnter() {
+                var _tableBodyRef$current;
+                // 给当前元素添加hover类
+                (_tableBodyRef$current = tableBodyRef.current) === null || _tableBodyRef$current === void 0 || _tableBodyRef$current.classList.add('hover-active');
+              },
+              onMouseLeave: function onMouseLeave() {
+                var _tableBodyRef$current2;
+                // 移除当前元素的hover类
+                (_tableBodyRef$current2 = tableBodyRef.current) === null || _tableBodyRef$current2 === void 0 || _tableBodyRef$current2.classList.remove('hover-active');
+              },
+              children: /*#__PURE__*/_jsx(TableBody, _objectSpread({}, tableBodyProps))
             })]
-          }), /*#__PURE__*/_jsx("div", {
-            ref: tableBodyRef,
-            className: "table-body"
-            // onScroll={scrollHandler}
-            ,
-            style: {
-              width: "100%"
-            },
-            onMouseEnter: function onMouseEnter() {
-              var _tableBodyRef$current;
-              // 给当前元素添加hover类
-              (_tableBodyRef$current = tableBodyRef.current) === null || _tableBodyRef$current === void 0 || _tableBodyRef$current.classList.add('hover-active');
-            },
-            onMouseLeave: function onMouseLeave() {
-              var _tableBodyRef$current2;
-              // 移除当前元素的hover类
-              (_tableBodyRef$current2 = tableBodyRef.current) === null || _tableBodyRef$current2 === void 0 || _tableBodyRef$current2.classList.remove('hover-active');
-            },
-            children: /*#__PURE__*/_jsx(TableBody, _objectSpread({}, tableBodyProps))
-          })]
+          })
         })
       }), pagination && /*#__PURE__*/_jsx("div", {
         className: "table-max-footer",

package/dist/components/TableMax/components/ColumnEdit/index.d.ts

@@ -29,6 +29,7 @@ interface EditableCellProps extends React.HTMLAttributes<HTMLElement> {
     getEditOptionsFn: IGetOptionType;
     editComDisabled?: boolean;
     onEditValueChange?: (field: string, value: any, extra?: any) => void;
+    width?: number;
 }
 export declare const EditableCell: React.FC<EditableCellProps>;
 export {};

package/dist/components/TableMax/components/ColumnEdit/index.js

@@ -31,7 +31,8 @@ export var EditableCell = function EditableCell(_ref) {
     getEditOptionsFn = _ref.getEditOptionsFn,
     _ref$editComDisabled = _ref.editComDisabled,
     editComDisabled = _ref$editComDisabled === void 0 ? false : _ref$editComDisabled,
-    onEditValueChange = _ref.onEditValueChange;
+    onEditValueChange = _ref.onEditValueChange,
+    width = _ref.width;
   var getEditComponent = function getEditComponent(dataIndex) {
     switch (editComType) {
       case InputType.InputNumber:
@@ -92,6 +93,9 @@ export var EditableCell = function EditableCell(_ref) {
   };
   return /*#__PURE__*/_jsx("div", {
     className: "table-max-cell-wrapper",
+    style: {
+      width: "".concat(width, "px")
+    },
     children: editing ? /*#__PURE__*/_jsx(Form.Item, {
       name: dataIndex,
       style: {

package/dist/components/TableMax/contexts/VirtualScroll/VirtualScrollContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { VirtualScrollContextType } from './types';
+export declare const VirtualScrollContext: React.Context<VirtualScrollContextType>;

package/dist/components/TableMax/contexts/VirtualScroll/VirtualScrollContext.js

@@ -0,0 +1,2 @@
+import React from 'react';
+export var VirtualScrollContext = /*#__PURE__*/React.createContext(undefined);

package/dist/components/TableMax/contexts/VirtualScroll/VirtualScrollProvider.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { VirtualScrollProviderProps } from './types';
+export declare const VirtualScrollProvider: React.FC<VirtualScrollProviderProps>;

package/dist/components/TableMax/contexts/VirtualScroll/VirtualScrollProvider.js

@@ -0,0 +1,26 @@
+// contexts/VirtualScrollProvider.tsx
+import React from 'react';
+import { VirtualScrollContext } from "./VirtualScrollContext";
+import { useVirtualCalculations } from "../../hooks/useVirtualCalculations";
+import { jsx as _jsx } from "react/jsx-runtime";
+export var VirtualScrollProvider = function VirtualScrollProvider(_ref) {
+  var children = _ref.children,
+    table = _ref.table,
+    config = _ref.config,
+    tableHeaderRef = _ref.tableHeaderRef,
+    tableBodyRef = _ref.tableBodyRef;
+  var _useVirtualCalculatio = useVirtualCalculations(table, config, tableHeaderRef, tableBodyRef),
+    state = _useVirtualCalculatio.state,
+    isVirtualEnabled = _useVirtualCalculatio.isVirtualEnabled;
+  var contextValue = React.useMemo(function () {
+    return {
+      config: config,
+      state: state,
+      isVirtualEnabled: isVirtualEnabled
+    };
+  }, [config, state, isVirtualEnabled]);
+  return /*#__PURE__*/_jsx(VirtualScrollContext.Provider, {
+    value: contextValue,
+    children: children
+  });
+};

package/dist/components/TableMax/contexts/VirtualScroll/index.d.ts

@@ -0,0 +1,3 @@
+export * from './VirtualScrollContext';
+export * from './VirtualScrollProvider';
+export * from './types';

package/dist/components/TableMax/contexts/VirtualScroll/index.js

@@ -0,0 +1,4 @@
+export * from "./VirtualScrollContext";
+export * from "./VirtualScrollProvider";
+export * from "./types";
+;

package/dist/components/TableMax/contexts/VirtualScroll/types.d.ts

@@ -0,0 +1,33 @@
+/// <reference types="react" />
+import { Table } from '@tanstack/react-table';
+import { Virtualizer } from '@tanstack/react-virtual';
+export interface VirtualScrollConfig {
+    openVirtualColumns?: boolean;
+    openVirtualRows?: boolean;
+    rowHeight?: number;
+    columnOverscan?: number;
+    rowOverscan?: number;
+}
+export interface VirtualScrollState {
+    columnVirtualizer: Virtualizer<HTMLDivElement, Element> | null;
+    virtualColumns: any[];
+    virtualPaddingLeft: number;
+    virtualPaddingRight: number;
+    rowVirtualizer: Virtualizer<HTMLDivElement, Element> | null;
+    virtualRows: any[];
+    leftPinnedColumns: any[];
+    rightPinnedColumns: any[];
+    scrollableColumns: any[];
+}
+export interface VirtualScrollContextType {
+    config: VirtualScrollConfig;
+    state: VirtualScrollState;
+    isVirtualEnabled: boolean;
+}
+export interface VirtualScrollProviderProps {
+    children: React.ReactNode;
+    table: Table<any>;
+    config: VirtualScrollConfig;
+    tableHeaderRef: React.RefObject<HTMLDivElement>;
+    tableBodyRef: React.RefObject<HTMLDivElement>;
+}

package/dist/components/TableMax/contexts/VirtualScroll/types.js

@@ -0,0 +1 @@
+export {};