linkmore-design 1.1.11 → 1.1.13-alpha.0

package/lib/LmEditTable/sortableItem.js

@@ -1,18 +1,20 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _sortable = require("@dnd-kit/sortable");
 
 var _utilities = require("@dnd-kit/utilities");
 
+var _virtual = require("./virtual");
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -30,7 +32,8 @@ var SortableItem = function SortableItem(props) {
   var key = props['data-row-key'],
       children = props.children,
       className = props.className,
-      resetField = __rest(props, ['data-row-key', "children", "className"]);
+      virtual = props.virtual,
+      resetField = __rest(props, ['data-row-key', "children", "className", "virtual"]);
 
   var _useSortable = (0, _sortable.useSortable)({
     id: key
@@ -44,12 +47,22 @@ var SortableItem = function SortableItem(props) {
     transform: _utilities.CSS.Transform.toString(transform),
     transition: transition
   };
-  return /*#__PURE__*/_react.default.createElement("tr", Object.assign({}, resetField, {
+
+  if (!virtual) {
+    return /*#__PURE__*/_react.default.createElement("tr", Object.assign({}, resetField, {
+      ref: setNodeRef,
+      key: key,
+      style: style
+    }, attributes), children);
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_virtual.VirtualRow, Object.assign({}, resetField, {
     ref: setNodeRef,
     key: key,
     style: style
   }, attributes), children);
 };
 
-var _default = SortableItem;
+var _default = /*#__PURE__*/(0, _react.memo)(SortableItem);
+
 exports.default = _default;

package/lib/LmEditTable/style/index.css

@@ -549,6 +549,9 @@ p {
   letter-spacing: 0px;
   color: var(--color-85);
 }
+.lm_editTable_warpper .lm_custom_cell_td {
+  position: relative;
+}
 .lm_editTable_warpper .lm_custom_cell_td .ant-form-item-control-input-content {
   display: flex;
   flex-direction: row;
@@ -560,6 +563,32 @@ p {
 .lm_editTable_warpper .lm_custom_cell_td .ant-table-row-expand-icon {
   margin-top: 6px;
 }
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp {
+  font-size: 8px;
+  position: absolute;
+  left: calc(50% - 10px);
+  z-index: 100;
+  width: 20px;
+  height: 10px;
+  background-color: var(--color-6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #D8D8D8;
+}
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp:hover {
+  cursor: pointer;
+  background-color: var(--primary-color);
+  color: #fff;
+}
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_up {
+  top: -4px;
+  left: calc(50% - 10px);
+}
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_down {
+  bottom: -6px;
+  left: calc(50% - 10px);
+}
 .lm_editTable_warpper .lm_editTable_cell_edit {
   height: 40px;
   padding: 8px 8px !important;
@@ -609,3 +638,21 @@ p {
   color: var(--color-85);
   margin-left: 0 !important;
 }
+.lm_table_append_add_popover .ant-popover-inner-content {
+  padding: 0px;
+}
+.lm_table_append_add_popover .ant-popover-inner-content ul {
+  margin: 0;
+}
+.lm_table_append_add_popover .ant-popover-inner-content ul li {
+  font-size: 12px;
+  padding: 4px 8px;
+  height: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.lm_table_append_add_popover .ant-popover-inner-content ul li:hover {
+  background-color: var(--color-15);
+}

package/lib/LmEditTable/style/variables.css

@@ -37,6 +37,9 @@
   letter-spacing: 0px;
   color: var(--color-85);
 }
+.lm_editTable_warpper .lm_custom_cell_td {
+  position: relative;
+}
 .lm_editTable_warpper .lm_custom_cell_td .ant-form-item-control-input-content {
   display: flex;
   flex-direction: row;
@@ -48,6 +51,32 @@
 .lm_editTable_warpper .lm_custom_cell_td .ant-table-row-expand-icon {
   margin-top: 6px;
 }
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp {
+  font-size: 8px;
+  position: absolute;
+  left: calc(50% - 10px);
+  z-index: 100;
+  width: 20px;
+  height: 10px;
+  background-color: var(--color-6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #D8D8D8;
+}
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_warp:hover {
+  cursor: pointer;
+  background-color: var(--primary-color);
+  color: #fff;
+}
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_up {
+  top: -4px;
+  left: calc(50% - 10px);
+}
+.lm_editTable_warpper .lm_custom_cell_td .quick_copy_down {
+  bottom: -6px;
+  left: calc(50% - 10px);
+}
 .lm_editTable_warpper .lm_editTable_cell_edit {
   height: 40px;
   padding: 8px 8px !important;
@@ -97,3 +126,21 @@
   color: var(--color-85);
   margin-left: 0 !important;
 }
+.lm_table_append_add_popover .ant-popover-inner-content {
+  padding: 0px;
+}
+.lm_table_append_add_popover .ant-popover-inner-content ul {
+  margin: 0;
+}
+.lm_table_append_add_popover .ant-popover-inner-content ul li {
+  font-size: 12px;
+  padding: 4px 8px;
+  height: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.lm_table_append_add_popover .ant-popover-inner-content ul li:hover {
+  background-color: var(--color-15);
+}

package/lib/LmEditTable/util.d.ts

@@ -2,6 +2,8 @@ export declare function isObjEmpty(obj: Record<string, any>): boolean;
 export declare function deepDataSourcePreKeys(dataSource: any[], rowKey: string): any;
 export declare function isExpandRow(children: any): boolean;
 export declare function checkRowKeyByDataSource(dataSource: any, rowKey: any): any;
+export declare function getExpandStatus(children: any): any;
+export declare function checkMemoShouldUploadSpecialFun(prev: any, next: any): any;
 declare const _default: {
     isObjEmpty: typeof isObjEmpty;
 };

package/lib/LmEditTable/util.js

@@ -5,9 +5,11 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.checkMemoShouldUploadSpecialFun = checkMemoShouldUploadSpecialFun;
 exports.checkRowKeyByDataSource = checkRowKeyByDataSource;
 exports.deepDataSourcePreKeys = deepDataSourcePreKeys;
 exports.default = void 0;
+exports.getExpandStatus = getExpandStatus;
 exports.isExpandRow = isExpandRow;
 exports.isObjEmpty = isObjEmpty;
 
@@ -75,6 +77,44 @@ function checkRowKeyByDataSource(dataSource, rowKey) {
   return res;
 }
 
+function getExpandStatus(children) {
+  var _a, _b, _c, _d, _e;
+
+  return isExpandRow(children) ? (_e = (_d = (_c = (_b = (_a = children === null || children === void 0 ? void 0 : children[0]) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.children) === null || _c === void 0 ? void 0 : _c[1]) === null || _d === void 0 ? void 0 : _d.props) === null || _e === void 0 ? void 0 : _e['aria-label'] : '';
+}
+
+function checkMemoShouldUploadSpecialFun(prev, next) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+
+  var checkExpandStatus = getExpandStatus(prev.children) === getExpandStatus(next.children);
+
+  if (!checkExpandStatus) {
+    return false;
+  }
+
+  var prevCol = prev === null || prev === void 0 ? void 0 : prev.col;
+  var nextCol = next === null || next === void 0 ? void 0 : next.col;
+
+  if (((_a = prevCol === null || prevCol === void 0 ? void 0 : prevCol.componentProps) === null || _a === void 0 ? void 0 : _a.optionOnly) || ((_b = nextCol === null || nextCol === void 0 ? void 0 : nextCol.componentProps) === null || _b === void 0 ? void 0 : _b.optionOnly)) {
+    return (0, _lodash.isEqual)((_c = prevCol === null || prevCol === void 0 ? void 0 : prevCol.componentProps) === null || _c === void 0 ? void 0 : _c.options, (_d = nextCol === null || nextCol === void 0 ? void 0 : nextCol.componentProps) === null || _d === void 0 ? void 0 : _d.options);
+  }
+  /** 如果启用了快速复制功能，需要实时判断rowIndex与getLength */
+
+
+  if (((_e = prevCol === null || prevCol === void 0 ? void 0 : prevCol.componentProps) === null || _e === void 0 ? void 0 : _e.quickcopy) || ((_f = nextCol === null || nextCol === void 0 ? void 0 : nextCol.componentProps) === null || _f === void 0 ? void 0 : _f.quickcopy)) {
+    var pickProps = ['record', 'colIndex', 'rowIndex', 'getLength'];
+    var p = (0, _lodash.pick)(prev, pickProps);
+    var n = (0, _lodash.pick)(next, pickProps);
+    return (0, _lodash.isEqual)(p, n);
+  }
+
+  if (next.className.indexOf('ant-table-selection-column') > -1) {
+    return (0, _lodash.isEqual)((_h = (_g = prev.children) === null || _g === void 0 ? void 0 : _g[1]) === null || _h === void 0 ? void 0 : _h.props, (_k = (_j = next.children) === null || _j === void 0 ? void 0 : _j[1]) === null || _k === void 0 ? void 0 : _k.props);
+  }
+
+  return true;
+}
+
 var _default = {
   isObjEmpty: isObjEmpty
 };

package/lib/LmEditTable/virtual/VirtualRow.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface rowProps {
+    children?: any;
+}
+declare const VirtualRow: React.NamedExoticComponent<rowProps>;
+export default VirtualRow;

package/lib/LmEditTable/virtual/VirtualRow.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("./context");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var VirtualRow = /*#__PURE__*/_react.default.memo(function (_a, ref) {
+  var children = _a.children,
+      resetProps = __rest(_a, ["children"]);
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch;
+
+  var rowHeight = state.rowHeight,
+      totalLen = state.totalLen;
+  var trRef = (0, _react.useRef)(null); // 列长度
+
+  var columnsLen = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = children === null || children === void 0 ? void 0 : children.length) !== null && _a !== void 0 ? _a : 0;
+  }, [children]);
+  (0, _react.useEffect)(function () {
+    if (state.columnsLen !== columnsLen) {
+      dispatch({
+        type: 'changeColumnsLen',
+        columnsLen: columnsLen !== null && columnsLen !== void 0 ? columnsLen : 0
+      });
+    }
+  }, [columnsLen, dispatch, state.columnsLen]);
+  (0, _react.useEffect)(function () {
+    var initHeight = function initHeight(tempRef) {
+      var _a, _b, _c;
+
+      if (((_a = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) && !rowHeight && totalLen) {
+        var tempRowHeight = (_c = (_b = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) !== null && _c !== void 0 ? _c : 0;
+        dispatch({
+          type: 'initHeight',
+          rowHeight: tempRowHeight
+        });
+      }
+    };
+
+    initHeight(Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef);
+  }, [trRef, dispatch, rowHeight, totalLen, ref]);
+  return /*#__PURE__*/_react.default.createElement("tr", Object.assign({}, resetProps, {
+    ref: Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef
+  }), children);
+});
+
+var _default = VirtualRow;
+exports.default = _default;

package/lib/LmEditTable/virtual/VirtualRowBack.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface rowProps {
+    children?: any;
+}
+declare const VirtualRow: React.NamedExoticComponent<rowProps>;
+export default VirtualRow;

package/lib/LmEditTable/virtual/VirtualRowBack.js

@@ -0,0 +1,115 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("./context");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var VirtualRow = /*#__PURE__*/_react.default.memo(function (_a, ref) {
+  var children = _a.children,
+      resetProps = __rest(_a, ["children"]);
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch,
+      instance = _useStore.instance;
+
+  var rowHeight = state.rowHeight,
+      totalLen = state.totalLen;
+  var virtualItems = instance.columnVirtual.virtualItems;
+  var trRef = (0, _react.useRef)(null); // 列长度
+
+  var columnsLen = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = children === null || children === void 0 ? void 0 : children.length) !== null && _a !== void 0 ? _a : 0;
+  }, [children]);
+  (0, _react.useEffect)(function () {
+    if (state.columnsLen !== columnsLen) {
+      dispatch({
+        type: 'changeColumnsLen',
+        columnsLen: columnsLen !== null && columnsLen !== void 0 ? columnsLen : 0
+      });
+    }
+  }, [columnsLen, dispatch, state.columnsLen]);
+  (0, _react.useEffect)(function () {
+    var initHeight = function initHeight(tempRef) {
+      var _a, _b, _c;
+
+      if (((_a = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) && !rowHeight && totalLen) {
+        var tempRowHeight = (_c = (_b = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) !== null && _c !== void 0 ? _c : 0;
+        dispatch({
+          type: 'initHeight',
+          rowHeight: tempRowHeight
+        });
+      }
+    };
+
+    initHeight(Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef);
+  }, [trRef, dispatch, rowHeight, totalLen, ref]); // return {fixedLeft: [], fixedRight: [], columns: []}
+
+  var fixedColumns = (0, _react.useMemo)(function () {
+    return children === null || children === void 0 ? void 0 : children.reduce(function (pre, cur) {
+      var _a, _b;
+
+      if (typeof ((_a = cur.props) === null || _a === void 0 ? void 0 : _a.fixLeft) === 'number') {
+        pre.fixedLeft.push(cur);
+        return pre;
+      }
+
+      if (typeof ((_b = cur.props) === null || _b === void 0 ? void 0 : _b.fixRight) === 'number') {
+        pre.fixedRight.push(cur);
+        return pre;
+      }
+
+      pre.columns.push(cur);
+      return pre;
+    }, {
+      fixedLeft: [],
+      fixedRight: [],
+      columns: []
+    });
+  }, [children]); // 截取非固定列
+
+  var resetVirtualItems = (0, _react.useMemo)(function () {
+    var fixedLeft = fixedColumns.fixedLeft,
+        columns = fixedColumns.columns;
+    return virtualItems.slice(fixedLeft.length, fixedLeft.length + columns.length);
+  }, [fixedColumns, virtualItems]); // 横向单元格合并
+
+  var colSpan = (0, _react.useMemo)(function () {
+    var _a;
+
+    var startIndex = ((_a = resetVirtualItems === null || resetVirtualItems === void 0 ? void 0 : resetVirtualItems[0]) === null || _a === void 0 ? void 0 : _a.index) || 0;
+    return startIndex ? startIndex - fixedColumns.fixedLeft.length : startIndex;
+  }, [fixedColumns, resetVirtualItems]);
+  return /*#__PURE__*/_react.default.createElement("tr", Object.assign({}, resetProps, {
+    ref: Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef
+  }), fixedColumns.fixedLeft, !!colSpan && /*#__PURE__*/_react.default.createElement("td", {
+    colSpan: colSpan
+  }), resetVirtualItems.map(function (virtualCol) {
+    return children[virtualCol.index];
+  }), fixedColumns.fixedRight);
+});
+
+var _default = VirtualRow;
+exports.default = _default;

package/lib/LmEditTable/virtual/VirtualTable.d.ts

@@ -0,0 +1,3 @@
+import React, { PropsWithChildren } from 'react';
+declare const VirtualTable: React.MemoExoticComponent<(tableProps: PropsWithChildren<any>) => JSX.Element>;
+export default VirtualTable;

package/lib/LmEditTable/virtual/VirtualTable.js

@@ -0,0 +1,71 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactVirtual = require("react-virtual");
+
+var _context = require("./context");
+
+var VirtualTable = /*#__PURE__*/_react.default.memo(function (tableProps) {
+  var _a, _b, _c, _d;
+
+  var bodyRef = (0, _react.useRef)(null);
+
+  var _useRealive = (0, _context.useRealive)(),
+      _useRealive2 = (0, _slicedToArray2.default)(_useRealive, 2),
+      state = _useRealive2[0],
+      dispatch = _useRealive2[1]; // { totalSize, virtualItems }
+
+
+  var rowVirtual = (0, _reactVirtual.useVirtual)({
+    size: state.totalLen,
+    // 绑定父节点
+    parentRef: {
+      current: (_a = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.current) === null || _a === void 0 ? void 0 : _a.parentNode
+    },
+    estimateSize: _react.default.useCallback(function () {
+      return state.rowHeight;
+    }, [state.rowHeight]),
+    overscan: 5
+  });
+  var columnVirtual = (0, _reactVirtual.useVirtual)({
+    horizontal: true,
+    size: state.columnsLen,
+    parentRef: {
+      current: (_b = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.current) === null || _b === void 0 ? void 0 : _b.parentNode
+    },
+    estimateSize: _react.default.useCallback(function (i) {
+      var _a, _b;
+
+      return (_b = (_a = tableProps === null || tableProps === void 0 ? void 0 : tableProps.children[0]) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.colWidths[i];
+    }, [(_d = (_c = tableProps.children[0]) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.colWidths]),
+    overscan: 5
+  });
+  var instance = {
+    rowVirtual: rowVirtual,
+    columnVirtual: columnVirtual
+  };
+  return /*#__PURE__*/_react.default.createElement(_context.TableContext.Provider, {
+    value: {
+      state: state,
+      dispatch: dispatch,
+      instance: instance
+    }
+  }, /*#__PURE__*/_react.default.createElement("table", Object.assign({
+    ref: bodyRef
+  }, tableProps)));
+});
+
+var _default = VirtualTable;
+exports.default = _default;

package/lib/LmEditTable/virtual/VirtualWrapper.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const VirtualWrapper: React.MemoExoticComponent<(wrapperProps: React.PropsWithChildren<any>) => JSX.Element>;
+export default VirtualWrapper;

package/lib/LmEditTable/virtual/VirtualWrapper.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("./context");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var VirtualWrapper = /*#__PURE__*/_react.default.memo(function (wrapperProps) {
+  var _a, _b;
+
+  var children = wrapperProps.children,
+      resetProps = __rest(wrapperProps, ["children"]);
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch,
+      instance = _useStore.instance;
+
+  var _instance$rowVirtual = instance.rowVirtual,
+      virtualItems = _instance$rowVirtual.virtualItems,
+      totalSize = _instance$rowVirtual.totalSize;
+  var contents = (0, _react.useMemo)(function () {
+    return children[1];
+  }, [children]);
+  var contentsLen = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = contents === null || contents === void 0 ? void 0 : contents.length) !== null && _a !== void 0 ? _a : 0;
+  }, [contents]);
+  (0, _react.useEffect)(function () {
+    if (state.totalLen !== contentsLen) {
+      dispatch({
+        type: 'changeTotalLen',
+        totalLen: contentsLen !== null && contentsLen !== void 0 ? contentsLen : 0
+      });
+    }
+  }, [contentsLen, dispatch, state.totalLen]);
+  var paddingTop = virtualItems.length > 0 ? ((_a = virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems[0]) === null || _a === void 0 ? void 0 : _a.start) || 0 : 0;
+  var paddingBottom = virtualItems.length > 0 ? totalSize - (((_b = virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems[virtualItems.length - 1]) === null || _b === void 0 ? void 0 : _b.end) || 0) : 0;
+  return /*#__PURE__*/_react.default.createElement("tbody", Object.assign({}, resetProps), paddingTop > 0 && /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", {
+    style: {
+      height: "".concat(paddingTop, "px")
+    }
+  })), children[0], virtualItems.map(function (virtualRow) {
+    return contents[virtualRow.index];
+  }), paddingBottom > 0 && /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", {
+    style: {
+      height: "".concat(paddingBottom, "px")
+    }
+  })));
+});
+
+var _default = VirtualWrapper;
+exports.default = _default;

package/lib/LmEditTable/virtual/context.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+declare const TableContext: import("react").Context<{
+    state: any;
+    dispatch: any;
+    instance: any;
+}>;
+declare const useStore: () => {
+    state: any;
+    dispatch: any;
+    instance: any;
+};
+declare const useRealive: () => [any, import("react").Dispatch<any>];
+export { TableContext, useStore, useRealive };