@are-visual/virtual-table 0.0.1

package/index.esm.js

@@ -0,0 +1,1771 @@
+import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { useRef, createContext, useContext, useMemo, memo, useState, useLayoutEffect, useCallback, useEffect, Fragment, createElement, forwardRef } from 'react';
+
+function _extends() {
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, _extends.apply(null, arguments);
+}
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (e.includes(n)) continue;
+    t[n] = r[n];
+  }
+  return t;
+}
+
+function shallowEqualObjects(objA, objB) {
+  if (objA === objB) {
+    return true;
+  }
+  if (!objA || !objB) {
+    return false;
+  }
+  var aKeys = Object.keys(objA);
+  var bKeys = Object.keys(objB);
+  var len = aKeys.length;
+  if (bKeys.length !== len) {
+    return false;
+  }
+  for (var i = 0; i < len; i += 1) {
+    var key = aKeys[i];
+    if (objA[key] !== objB[key] || !Object.prototype.hasOwnProperty.call(objB, key)) {
+      return false;
+    }
+  }
+  return true;
+}
+function shallowEqualArrays(arrA, arrB) {
+  if (arrA === arrB) {
+    return true;
+  }
+  if (!arrA || !arrB) {
+    return false;
+  }
+  var len = arrA.length;
+  if (arrB.length !== len) {
+    return false;
+  }
+  for (var i = 0; i < len; i += 1) {
+    if (arrA[i] !== arrB[i]) {
+      return false;
+    }
+  }
+  return true;
+}
+function isShallowEqual(value, oldValue) {
+  if (Object.is(value, oldValue)) {
+    return true;
+  }
+  if (Array.isArray(value) && Array.isArray(oldValue)) {
+    if (shallowEqualArrays(value, oldValue)) {
+      return true;
+    }
+    if (value.length === oldValue.length) {
+      var hasObject = value.findIndex(function (x) {
+        return typeof x === 'object' && x != null;
+      }) > -1;
+      if (hasObject) {
+        return value.every(function (state, index) {
+          if (Array.isArray(state)) {
+            return shallowEqualArrays(state, oldValue[index]);
+          }
+          if (typeof state === 'object' && state != null) {
+            return shallowEqualObjects(state, oldValue[index]);
+          }
+          return Object.is(state, oldValue[index]);
+        });
+      }
+    }
+    return false;
+  }
+  if (value instanceof Map && oldValue instanceof Map) {
+    var keys = [].concat(value.keys());
+    var oldKeys = [].concat(oldValue.keys());
+    if (shallowEqualArrays(keys, oldKeys)) {
+      var values = [].concat(value.values());
+      var oldValues = [].concat(oldValue.values());
+      if (isShallowEqual(values, oldValues)) {
+        return true;
+      }
+    }
+    return false;
+  }
+  if (typeof value === 'object' && value != null) {
+    return shallowEqualObjects(value, oldValue);
+  }
+  return false;
+}
+
+/* eslint-disable react-compiler/react-compiler */
+/**
+ * 缓存数据（浅比较，如果是数组则对第一层进行浅比较）
+ */
+function useShallowMemo(pickData) {
+  var nextState = pickData();
+  var value = useRef(nextState);
+  if (!isShallowEqual(nextState, value.current)) {
+    value.current = nextState;
+  }
+  return value.current;
+}
+
+function getKey(column) {
+  return 'key' in column ? column.key : column.dataIndex;
+}
+
+function isValidFixedLeft(fixed) {
+  return fixed === 'left';
+}
+function isValidFixedRight(fixed) {
+  return fixed === 'right';
+}
+function isValidFixed(fixed) {
+  return isValidFixedLeft(fixed) || isValidFixedRight(fixed);
+}
+
+var ColumnSizes = /*#__PURE__*/createContext(null);
+if (process.env.NODE_ENV === 'development') {
+  ColumnSizes.displayName = 'VirtualTable.ColumnSizes';
+}
+function useColumnSizes() {
+  var context = useContext(ColumnSizes);
+  if (context == null) {
+    throw new Error('useColumnSizes provider not found');
+  }
+  return context;
+}
+
+var Sticky = /*#__PURE__*/createContext(null);
+if (process.env.NODE_ENV === 'development') {
+  Sticky.displayName = 'VirtualTable.Sticky';
+}
+function StickyContext(props) {
+  var columns = props.columns,
+    children = props.children;
+  var _useColumnSizes = useColumnSizes(),
+    widthList = _useColumnSizes.widthList;
+  var columnsFixedRecord = useMemo(function () {
+    return columns.map(function (column) {
+      var key = getKey(column);
+      return {
+        key: key,
+        fixed: column.fixed
+      };
+    });
+  }, [columns]);
+  var stickySizes = useMemo(function () {
+    var left = 0;
+    var leftOffset = columnsFixedRecord.reduce(function (res, item, index) {
+      var fixed = item.fixed,
+        key = item.key;
+      if (isValidFixedLeft(fixed)) {
+        var _widthList$get;
+        res[index] = left;
+        // eslint-disable-next-line react-compiler/react-compiler
+        left += (_widthList$get = widthList.get(key)) != null ? _widthList$get : 0;
+      }
+      return res;
+    }, []);
+    var right = 0;
+    var rightOffset = columnsFixedRecord.reduceRight(function (res, item, index) {
+      var fixed = item.fixed,
+        key = item.key;
+      if (isValidFixedRight(fixed)) {
+        var _widthList$get2;
+        res[index] = right;
+        right += (_widthList$get2 = widthList.get(key)) != null ? _widthList$get2 : 0;
+      }
+      return res;
+    }, []);
+    return columnsFixedRecord.reduce(function (result, item, index) {
+      var key = item.key,
+        fixed = item.fixed;
+      if (isValidFixedLeft(fixed)) {
+        result.set(key, leftOffset[index]);
+        return result;
+      }
+      if (isValidFixedRight(fixed)) {
+        result.set(key, rightOffset[index]);
+        return result;
+      }
+      return result;
+    }, new Map());
+  }, [columnsFixedRecord, widthList]);
+  var shallowMemoFixedRecord = useShallowMemo(function () {
+    return columnsFixedRecord;
+  });
+  var shallowMemoStickySizes = useShallowMemo(function () {
+    return stickySizes;
+  });
+  var stickyState = useMemo(function () {
+    return {
+      size: shallowMemoStickySizes,
+      fixed: shallowMemoFixedRecord
+    };
+  }, [shallowMemoFixedRecord, shallowMemoStickySizes]);
+  return jsx(Sticky.Provider, {
+    value: stickyState,
+    children: children
+  });
+}
+function useTableSticky() {
+  var context = useContext(Sticky);
+  if (context == null) {
+    throw new Error('useTableSticky provider not found');
+  }
+  return context;
+}
+
+function pipelineRender(node, render, options) {
+  if (typeof render === 'function') {
+    // @ts-expect-error: There is no way to declare the type correctly, but it works at runtime.
+    return render(node, options);
+  }
+  return node;
+}
+
+var _excluded$3 = ["className", "style", "column", "rowData", "rowIndex", "renderCell"],
+  _excluded2$1 = ["className", "style", "colSpan", "rowSpan"];
+function getTableCellContent(index, data, column) {
+  var _render;
+  var render = column.render;
+  var rowData = data;
+  if ('dataIndex' in column) {
+    var dataIndex = column.dataIndex;
+    if (typeof render !== 'function') {
+      return rowData[dataIndex];
+    }
+    return render(rowData[dataIndex], data, index);
+  }
+  return (_render = render == null ? undefined : render(data, data, index)) != null ? _render : null;
+}
+function Cell(props) {
+  var _onCell;
+  var className = props.className,
+    style = props.style,
+    column = props.column,
+    rowData = props.rowData,
+    rowIndex = props.rowIndex,
+    renderCell = props.renderCell,
+    restProps = _objectWithoutPropertiesLoose(props, _excluded$3);
+  var align = column.align,
+    fixed = column.fixed,
+    onCell = column.onCell;
+  var key = getKey(column);
+  var _useTableSticky = useTableSticky(),
+    stickySizes = _useTableSticky.size;
+  var _ref = (_onCell = onCell == null ? undefined : onCell(rowData, rowIndex)) != null ? _onCell : {},
+    extraClassName = _ref.className,
+    extraStyle = _ref.style,
+    colSpan = _ref.colSpan,
+    rowSpan = _ref.rowSpan,
+    extraProps = _objectWithoutPropertiesLoose(_ref, _excluded2$1);
+  if (colSpan === 0 || rowSpan === 0) {
+    return null;
+  }
+  return pipelineRender(jsx("td", _extends({}, restProps, extraProps, {
+    colSpan: colSpan,
+    rowSpan: rowSpan,
+    className: clsx('virtual-table-cell', align != null && "virtual-table-align-" + align, isValidFixed(fixed) && 'virtual-table-sticky-cell', className, column.className, extraClassName),
+    style: _extends({}, style, extraStyle, {
+      left: isValidFixedLeft(fixed) ? stickySizes.get(key) : undefined,
+      right: isValidFixedRight(fixed) ? stickySizes.get(key) : undefined
+    }),
+    children: getTableCellContent(rowIndex, rowData, column)
+  })), renderCell, {
+    column: column
+  });
+}
+var Cell$1 = /*#__PURE__*/memo(Cell);
+
+var Colgroup = function Colgroup(props) {
+  var columns = props.columns,
+    colRef = props.colRef;
+  return jsx("colgroup", {
+    children: columns.map(function (item, index) {
+      var key = item.key;
+      if (item.type === 'blank') {
+        return jsx("col", {
+          style: {
+            width: item.width
+          }
+        }, key);
+      }
+      var column = item.column;
+      return jsx("col", {
+        ref: typeof colRef === 'function' ? function (instance) {
+          colRef(instance, column, index);
+        } : colRef,
+        style: {
+          width: column.width,
+          minWidth: column.minWidth
+        }
+      }, key);
+    })
+  });
+};
+
+var overflowStylePatterns = /auto|scroll|overlay|hidden/;
+function isElement(node) {
+  if (!(node instanceof Node)) {
+    return false;
+  }
+  var ELEMENT_NODE_TYPE = 1;
+  return node.nodeType === ELEMENT_NODE_TYPE;
+}
+function getScrollParent(el, root) {
+  var _el$ownerDocument$def;
+  if (root === undefined) {
+    root = window;
+  }
+  var node = el;
+  while (node !== root && isElement(node)) {
+    if (node === document.body) {
+      return root;
+    }
+    var _window$getComputedSt = window.getComputedStyle(node),
+      overflow = _window$getComputedSt.overflow,
+      overflowY = _window$getComputedSt.overflowY,
+      overflowX = _window$getComputedSt.overflowX;
+    if (overflowStylePatterns.test(overflow + overflowY + overflowX)) {
+      return node;
+    }
+    node = node.parentNode;
+  }
+  return (_el$ownerDocument$def = el.ownerDocument.defaultView) != null ? _el$ownerDocument$def : window;
+}
+function isWindow(arg) {
+  return Object.prototype.toString.call(arg) === '[object Window]';
+}
+function isDocument(arg) {
+  return Object.prototype.toString.call(arg) === '[object HTMLDocument]';
+}
+function isRoot(arg) {
+  return Object.prototype.toString.call(arg) === '[object HTMLHtmlElement]';
+}
+function getScrollElement(el) {
+  if (isDocument(el)) {
+    return el.scrollingElement;
+  }
+  if (isElement(el)) {
+    return el;
+  }
+  return document.scrollingElement;
+}
+
+function useCalcSize(options) {
+  var getScroller = options.getScroller,
+    root = options.root;
+  var _useState = useState(0),
+    scrollContainerWidth = _useState[0],
+    setScrollContainerWidth = _useState[1];
+  var _useState2 = useState(0),
+    scrollContainerHeight = _useState2[0],
+    setScrollContainerHeight = _useState2[1];
+  var _useState3 = useState(0),
+    tableWidth = _useState3[0],
+    setTableWidth = _useState3[1];
+  var _useState4 = useState(0),
+    tableHeight = _useState4[0],
+    setTableHeight = _useState4[1];
+  var scrollerContainerRef = useRef(null);
+  useLayoutEffect(function () {
+    var scrollerContainer = getScroller();
+    if (scrollerContainer == null) return;
+    var scroller;
+    if (isWindow(scrollerContainer)) {
+      scroller = document.scrollingElement;
+    } else {
+      scroller = scrollerContainer;
+    }
+    scrollerContainerRef.current = scroller;
+    var observer = new ResizeObserver(function (entries) {
+      var _entries$0$contentRec = entries[0].contentRect,
+        width = _entries$0$contentRec.width,
+        height = _entries$0$contentRec.height;
+      setScrollContainerWidth(width);
+      setScrollContainerHeight(height);
+    });
+    observer.observe(scroller);
+    return function () {
+      observer.disconnect();
+    };
+  }, [getScroller]);
+  useLayoutEffect(function () {
+    var node = root.current;
+    if (node == null) return;
+    var observer = new ResizeObserver(function (entries) {
+      var _entries$0$contentRec2 = entries[0].contentRect,
+        width = _entries$0$contentRec2.width,
+        height = _entries$0$contentRec2.height;
+      setTableWidth(width);
+      setTableHeight(height);
+    });
+    observer.observe(node);
+    return function () {
+      observer.disconnect();
+    };
+  }, [root]);
+  return {
+    scrollContainerWidth: scrollContainerWidth,
+    scrollContainerHeight: scrollContainerHeight,
+    tableWidth: tableWidth,
+    tableHeight: tableHeight
+  };
+}
+
+var ContainerSize = /*#__PURE__*/createContext(null);
+function ContainerSizeContext(props) {
+  var getScroller = props.getScroller,
+    root = props.root,
+    children = props.children;
+  var _useCalcSize = useCalcSize({
+      getScroller: getScroller,
+      root: root
+    }),
+    scrollContainerHeight = _useCalcSize.scrollContainerHeight,
+    scrollContainerWidth = _useCalcSize.scrollContainerWidth,
+    tableHeight = _useCalcSize.tableHeight,
+    tableWidth = _useCalcSize.tableWidth;
+  var state = useMemo(function () {
+    return {
+      scrollContainerWidth: scrollContainerWidth,
+      scrollContainerHeight: scrollContainerHeight,
+      tableWidth: tableWidth,
+      tableHeight: tableHeight
+    };
+  }, [scrollContainerWidth, scrollContainerHeight, tableWidth, tableHeight]);
+  return jsx(ContainerSize.Provider, {
+    value: state,
+    children: children
+  });
+}
+function useContainerSize() {
+  var context = useContext(ContainerSize);
+  if (context == null) {
+    throw new Error('useContainerSize provider not found');
+  }
+  return context;
+}
+
+var HorizontalScroll = /*#__PURE__*/createContext(null);
+if (process.env.NODE_ENV === 'development') {
+  HorizontalScroll.displayName = 'VirtualTable.HorizontalScroll';
+}
+function HorizontalScrollContext(props) {
+  var children = props.children;
+  var listenerMap = useRef(new Map());
+  var context = useMemo(function () {
+    return {
+      listen: function listen(key, listener) {
+        listenerMap.current.set(key, listener);
+        return function () {
+          listenerMap.current["delete"](key);
+        };
+      },
+      notify: function notify(key, scrollLeft, node) {
+        var rAF = window.requestAnimationFrame;
+        if (rAF == null) {
+          rAF = function rAF(fn) {
+            fn();
+          };
+        }
+        rAF(function () {
+          listenerMap.current.forEach(function (listener, itemKey) {
+            if (itemKey !== key) {
+              listener(scrollLeft, node);
+            }
+          });
+        });
+      }
+    };
+  }, []);
+  return jsx(HorizontalScroll.Provider, {
+    value: context,
+    children: children
+  });
+}
+function useHorizontalScrollContext() {
+  var context = useContext(HorizontalScroll);
+  if (context == null) {
+    throw new Error('useHorizontalScrollContext provider not found');
+  }
+  return context;
+}
+
+var TableRowManager = /*#__PURE__*/createContext(null);
+if (process.env.NODE_ENV === 'development') {
+  TableRowManager.displayName = 'VirtualTable.RowManager';
+}
+function useTableRowManager() {
+  var context = useContext(TableRowManager);
+  if (context == null) {
+    throw new Error('useTableRowManager provider not found');
+  }
+  return context;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+function useStableFn(callback) {
+  var fn = useRef(null);
+  useLayoutEffect(function () {
+    fn.current = callback;
+  }, [callback]);
+  var stableFn = useCallback(function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    return fn.current == null ? undefined : fn.current.apply(fn, args);
+  }, []);
+  return stableFn;
+}
+
+/**
+ * 创建中间件，内部会浅比较 options，只有 options 改变才会返回新的函数。
+ */
+function createMiddleware(hook) {
+  var cache = {
+    current: null,
+    options: null
+  };
+  return function () {
+    for (var _len = arguments.length, options = new Array(_len), _key = 0; _key < _len; _key++) {
+      options[_key] = arguments[_key];
+    }
+    var useMiddleware = function useMiddleware(ctx) {
+      return hook.apply(undefined, [ctx].concat(options));
+    };
+    if (isShallowEqual(options, cache.options)) {
+      var _cache$current;
+      return (_cache$current = cache.current) != null ? _cache$current : useMiddleware;
+    }
+    cache.options = options;
+    cache.current = useMiddleware;
+    return useMiddleware;
+  };
+}
+
+var _excluded$2 = ["render", "renderRoot", "renderContent", "renderHeaderWrapper", "renderHeaderRoot", "renderHeader", "renderHeaderRow", "renderHeaderCell", "renderBodyWrapper", "renderBodyRoot", "renderBody", "renderRow", "renderCell", "rowClassName", "onRow"];
+function shakeUnsafeHooks(hooks) {
+  if (Array.isArray(hooks)) {
+    return hooks.filter(function (x) {
+      return x != null && (typeof x === 'function' || typeof x.hook === 'function');
+    }).map(function (hook) {
+      if (typeof hook === 'function') {
+        return {
+          priority: 100,
+          hook: hook
+        };
+      }
+      return hook;
+    });
+  }
+  return [];
+}
+var TablePipeline = /*#__PURE__*/function () {
+  function TablePipeline() {
+    Object.defineProperty(this, "hooks", {
+      enumerable: true,
+      configurable: true,
+      writable: true,
+      value: []
+    });
+    this.use = this.use.bind(this);
+  }
+  var _proto = TablePipeline.prototype;
+  _proto.setHooks = function setHooks(value) {
+    this.hooks = value;
+  };
+  _proto.use = function use(options) {
+    if (this.hooks.length === 0) {
+      return options;
+    }
+    var context = {
+      current: options
+    };
+    var renderFunctionMap = {
+      render: [],
+      renderRoot: [],
+      renderContent: [],
+      renderHeaderWrapper: [],
+      renderHeaderRoot: [],
+      renderHeader: [],
+      renderHeaderRow: [],
+      renderHeaderCell: [],
+      renderBodyWrapper: [],
+      renderBodyRoot: [],
+      renderBody: [],
+      renderRow: [],
+      renderCell: []
+    };
+    var rowClassNameFunctions = [];
+    var onRowFunctions = [];
+    var hooks = this.hooks.slice();
+    hooks.sort(function (a, b) {
+      return a.priority - b.priority;
+    });
+    hooks.map(function (x) {
+      return x.hook;
+    }).forEach(function (hook) {
+      var nextCtx = hook(context.current);
+      nextCtx.render;
+        nextCtx.renderRoot;
+        nextCtx.renderContent;
+        nextCtx.renderHeaderWrapper;
+        nextCtx.renderHeaderRoot;
+        nextCtx.renderHeader;
+        nextCtx.renderHeaderRow;
+        nextCtx.renderHeaderCell;
+        nextCtx.renderBodyWrapper;
+        nextCtx.renderBodyRoot;
+        nextCtx.renderBody;
+        nextCtx.renderRow;
+        nextCtx.renderCell;
+        var rowClassName = nextCtx.rowClassName,
+        onRow = nextCtx.onRow,
+        rest = _objectWithoutPropertiesLoose(nextCtx, _excluded$2);
+      Object.entries(renderFunctionMap).forEach(function (_ref) {
+        var key = _ref[0],
+          value = _ref[1];
+        var target = nextCtx[key];
+        if (typeof target === 'function') {
+          // @ts-expect-error: There is no way to declare the type correctly, but it works at runtime.
+          value.push(target);
+        }
+      });
+      if (typeof rowClassName === 'function') {
+        rowClassNameFunctions.push(rowClassName);
+      }
+      if (typeof onRow === 'function') {
+        onRowFunctions.push(onRow);
+      }
+      context.current = rest;
+    });
+    Object.entries(renderFunctionMap).forEach(function (_ref2) {
+      var key = _ref2[0],
+        renders = _ref2[1];
+      if (renders.length > 0) {
+        context.current[key] = function (children, args) {
+          // reduce 把 [render1, render2] 转为 render1(render2(children))
+          return renders.reduce(function (node, render) {
+            // @ts-expect-error: There is no way to declare the type correctly, but it works at runtime.
+            return render(node, args);
+          }, children);
+        };
+      }
+    });
+    if (rowClassNameFunctions.length > 0) {
+      context.current.rowClassName = function (record, index) {
+        return clsx.apply(undefined, rowClassNameFunctions.map(function (fn) {
+          return fn(record, index);
+        }));
+      };
+    }
+    if (onRowFunctions.length > 0) {
+      context.current.onRow = function (record, index) {
+        return onRowFunctions.reduce(function (result, item) {
+          return _extends({}, result, item(record, index));
+        }, {});
+      };
+    }
+    return context.current;
+  };
+  return TablePipeline;
+}();
+Object.defineProperty(TablePipeline, "defaultPipeline", {
+  enumerable: true,
+  configurable: true,
+  writable: true,
+  value: new TablePipeline()
+});
+
+function useTablePipeline(options) {
+  var use = options.use,
+    extraPipeline = options.pipeline;
+  var cached = useMemo(function () {
+    return {
+      current: new TablePipeline()
+    };
+  }, []);
+  if (use != null) {
+    var _extraPipeline$hooks;
+    var nextHooks = shakeUnsafeHooks([].concat(use, (_extraPipeline$hooks = extraPipeline == null ? undefined : extraPipeline.hooks) != null ? _extraPipeline$hooks : []));
+    if (!shallowEqualArrays(cached.current.hooks, nextHooks)) {
+      var pipeline = new TablePipeline();
+      pipeline.setHooks(nextHooks);
+      cached.current = pipeline;
+      return pipeline;
+    }
+  }
+  return cached.current;
+}
+
+function findLastIndex(arr, predicate) {
+  var result = -1;
+  for (var i = 0; i < arr.length; i += 1) {
+    if (predicate(arr[i], i)) {
+      result = i;
+    }
+  }
+  return result;
+}
+
+var _excluded$1 = ["className", "rowIndex", "rowData", "columns", "onRow", "renderRow", "renderCell"],
+  _excluded2 = ["className"];
+function Row(props) {
+  var _onRow;
+  var className = props.className,
+    rowIndex = props.rowIndex,
+    rowData = props.rowData,
+    columnDescriptor = props.columns,
+    onRow = props.onRow,
+    renderRow = props.renderRow,
+    renderCell = props.renderCell,
+    rest = _objectWithoutPropertiesLoose(props, _excluded$1);
+  var _useTableRowManager = useTableRowManager(),
+    updateRowHeight = _useTableRowManager.updateRowHeight;
+  var columns = columnDescriptor.columns,
+    descriptor = columnDescriptor.descriptor;
+  var lastFixedLeftColumnIndex = findLastIndex(descriptor, function (x) {
+    if (x.type === 'blank') {
+      return false;
+    }
+    return isValidFixedLeft(x.column.fixed);
+  });
+  var firstFixedRightColumnIndex = descriptor.findIndex(function (x) {
+    if (x.type === 'blank') {
+      return false;
+    }
+    return isValidFixedRight(x.column.fixed);
+  });
+  var _ref = (_onRow = onRow == null ? undefined : onRow(rowData, rowIndex)) != null ? _onRow : {},
+    extraClassName = _ref.className,
+    extraProps = _objectWithoutPropertiesLoose(_ref, _excluded2);
+  return pipelineRender(jsx("tr", _extends({}, rest, extraProps, {
+    className: clsx('virtual-table-row', className, extraClassName),
+    ref: function ref(node) {
+      if (node == null) return;
+      // 小心陷阱：当 table 父元素为 display: none 时，依然会触发 updateRowHeight 函数，并设置高度为 0
+      updateRowHeight(rowIndex, node.offsetHeight);
+    },
+    children: descriptor.map(function (item, index) {
+      var key = item.key;
+      if (item.type === 'blank') {
+        return jsx("td", {}, key);
+      }
+      var column = item.column;
+      return jsx(Cell$1, {
+        className: clsx(lastFixedLeftColumnIndex === index && 'virtual-table-cell-fix-left-last', firstFixedRightColumnIndex === index && 'virtual-table-cell-fix-right-first'),
+        column: column,
+        rowIndex: rowIndex,
+        rowData: rowData,
+        renderCell: renderCell
+      }, key);
+    })
+  })), renderRow, {
+    columns: columns,
+    rowIndex: rowIndex,
+    rowData: rowData,
+    columnDescriptor: descriptor
+  });
+}
+var Row$1 = /*#__PURE__*/memo(Row);
+
+function assignRef(ref, value) {
+  if (typeof ref === 'function') {
+    ref(value);
+  } else if (typeof ref === 'object' && ref !== null && 'current' in ref) {
+    ref.current = value;
+  }
+}
+function mergeRefs() {
+  for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
+    refs[_key] = arguments[_key];
+  }
+  return function (node) {
+    refs.forEach(function (ref) {
+      return assignRef(ref, node);
+    });
+  };
+}
+function useMergedRef() {
+  for (var _len2 = arguments.length, refs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+    refs[_key2] = arguments[_key2];
+  }
+  // eslint-disable-next-line react-compiler/react-compiler
+  return useCallback(mergeRefs.apply(undefined, refs), refs);
+}
+
+function TableBody(props) {
+  var bodyWrapperRef = props.bodyWrapperRef,
+    bodyRootRef = props.bodyRootRef,
+    bodyRef = props.bodyRef,
+    className = props.className,
+    style = props.style,
+    dataSource = props.dataSource,
+    columnDescriptor = props.columns,
+    rowKey = props.rowKey,
+    startIndex = props.startIndex,
+    rowClassName = props.rowClassName,
+    onRow = props.onRow,
+    renderBodyWrapper = props.renderBodyWrapper,
+    renderBodyRoot = props.renderBodyRoot,
+    renderBody = props.renderBody,
+    renderRow = props.renderRow,
+    renderCell = props.renderCell;
+  var columns = columnDescriptor.columns,
+    descriptor = columnDescriptor.descriptor;
+  var _useHorizontalScrollC = useHorizontalScrollContext(),
+    listen = _useHorizontalScrollC.listen,
+    notify = _useHorizontalScrollC.notify;
+  var _useColumnSizes = useColumnSizes(),
+    widthList = _useColumnSizes.widthList,
+    setWidthList = _useColumnSizes.setWidthList;
+  var columnWidthsRef = useRef(new Map());
+  useLayoutEffect(function () {
+    var snap = widthList;
+    if (!isShallowEqual(snap, columnWidthsRef.current)) {
+      setWidthList(new Map(columnWidthsRef.current));
+    }
+  });
+  var bodyNode = pipelineRender(jsx("tbody", {
+    ref: bodyRef,
+    children: dataSource.map(function (e, rowIndex) {
+      var _rowKey = e[rowKey];
+      return jsx(Row$1, {
+        className: clsx(rowClassName == null ? undefined : rowClassName(e, rowIndex)),
+        rowIndex: rowIndex + startIndex,
+        rowData: e,
+        columns: columnDescriptor,
+        onRow: onRow,
+        renderRow: renderRow,
+        renderCell: renderCell
+      }, _rowKey);
+    })
+  }), renderBody, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+  var tableNode = pipelineRender(jsxs("table", {
+    className: clsx(className, 'virtual-table-body'),
+    style: style,
+    ref: bodyRootRef,
+    children: [jsx(Colgroup, {
+      columns: descriptor,
+      colRef: function colRef(node, column) {
+        if (node == null) return;
+        var key = getKey(column);
+        columnWidthsRef.current.set(key, node.offsetWidth);
+      }
+    }), bodyNode]
+  }), renderBodyRoot, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+  var wrapperRef = useRef(null);
+  useEffect(function () {
+    var node = wrapperRef.current;
+    if (node == null) return;
+    var key = 'virtual-table-body';
+    var onScroll = function onScroll() {
+      var nextScrollLeft = node.scrollLeft;
+      notify(key, nextScrollLeft, node);
+    };
+    var dispose = listen(key, function (scrollLeft) {
+      node.scrollLeft = scrollLeft;
+    });
+    node.addEventListener('scroll', onScroll);
+    return function () {
+      node.removeEventListener('scroll', onScroll);
+      dispose();
+    };
+  }, [listen, notify]);
+  var mergedRef = useMergedRef(wrapperRef, bodyWrapperRef);
+  return pipelineRender(jsx("div", {
+    ref: mergedRef,
+    className: "virtual-table-body-wrapper",
+    children: tableNode
+  }), renderBodyWrapper, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+}
+
+var _excluded = ["className", "style"];
+var TableHeader = function TableHeader(props) {
+  var className = props.className,
+    style = props.style,
+    wrapperRef = props.wrapperRef,
+    columnDescriptor = props.columns,
+    stickyHeader = props.stickyHeader,
+    renderHeaderWrapper = props.renderHeaderWrapper,
+    renderHeaderRoot = props.renderHeaderRoot,
+    renderHeader = props.renderHeader,
+    renderHeaderRow = props.renderHeaderRow,
+    renderHeaderCell = props.renderHeaderCell;
+  var columns = columnDescriptor.columns,
+    descriptor = columnDescriptor.descriptor;
+  var _useColumnSizes = useColumnSizes(),
+    widthList = _useColumnSizes.widthList;
+  var _useTableSticky = useTableSticky(),
+    stickySizes = _useTableSticky.size;
+  var lastFixedLeftColumnIndex = findLastIndex(descriptor, function (x) {
+    if (x.type === 'blank') {
+      return false;
+    }
+    return isValidFixedLeft(x.column.fixed);
+  });
+  var firstFixedRightColumnIndex = descriptor.findIndex(function (x) {
+    if (x.type === 'blank') {
+      return false;
+    }
+    return isValidFixedRight(x.column.fixed);
+  });
+  var _useHorizontalScrollC = useHorizontalScrollContext(),
+    listen = _useHorizontalScrollC.listen,
+    notify = _useHorizontalScrollC.notify;
+  var headerWrapperRef = useRef(null);
+  useEffect(function () {
+    var node = headerWrapperRef.current;
+    if (node == null) return;
+    var key = 'virtual-table-header';
+    var onScroll = function onScroll() {
+      var nextScrollLeft = node.scrollLeft;
+      notify(key, nextScrollLeft, node);
+    };
+    var dispose = listen(key, function (scrollLeft) {
+      node.scrollLeft = scrollLeft;
+    });
+    node.addEventListener('scroll', onScroll);
+    return function () {
+      node.removeEventListener('scroll', onScroll);
+      dispose();
+    };
+  }, [listen, notify]);
+  var row = pipelineRender(jsx("tr", {
+    children: descriptor.map(function (item, index) {
+      var _column$onHeaderCell;
+      var key = item.key;
+      if (item.type === 'blank') {
+        return jsx("th", {}, key);
+      }
+      var column = item.column;
+      if (column.colSpan === 0) {
+        return null;
+      }
+      var _ref = (_column$onHeaderCell = column.onHeaderCell == null ? undefined : column.onHeaderCell(column, index)) != null ? _column$onHeaderCell : {},
+        thClassName = _ref.className,
+        thStyle = _ref.style,
+        rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+      return jsx(Fragment, {
+        children: pipelineRender(/*#__PURE__*/createElement('th', _extends({
+          scope: 'col'
+        }, rest, {
+          colSpan: column.colSpan,
+          className: clsx('virtual-table-header-cell', column.align != null && "virtual-table-align-" + column.align, isValidFixed(column.fixed) && 'virtual-table-sticky-cell', lastFixedLeftColumnIndex === index && 'virtual-table-cell-fix-left-last', firstFixedRightColumnIndex === index && 'virtual-table-cell-fix-right-first', column.className, thClassName),
+          style: _extends({}, thStyle, {
+            left: isValidFixedLeft(column.fixed) ? stickySizes.get(key) : undefined,
+            right: isValidFixedRight(column.fixed) ? stickySizes.get(key) : undefined
+          })
+        }), column.title), renderHeaderCell, {
+          column: column,
+          columns: columns,
+          columnWidths: widthList,
+          columnDescriptor: descriptor
+        })
+      }, key);
+    })
+  }), renderHeaderRow, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+  var theadNode = pipelineRender(jsx("thead", {
+    className: "virtual-table-thead",
+    children: row
+  }), renderHeader, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+  var tableNode = pipelineRender(jsxs("table", {
+    style: style,
+    children: [jsx(Colgroup, {
+      columns: descriptor
+    }), theadNode]
+  }), renderHeaderRoot, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+  var mergedRef = useMergedRef(wrapperRef, headerWrapperRef);
+  return pipelineRender(jsx("div", {
+    ref: mergedRef,
+    className: clsx('virtual-table-header', className, {
+      'virtual-table-header-sticky': stickyHeader
+    }),
+    style: {
+      top: Number.isFinite(stickyHeader) ? stickyHeader : undefined
+    },
+    children: tableNode
+  }), renderHeaderWrapper, {
+    columns: columns,
+    columnDescriptor: descriptor
+  });
+};
+
+function onResize(target, callback) {
+  if (isWindow(target)) {
+    var listener = function listener() {
+      callback({
+        width: window.innerWidth,
+        height: window.innerHeight
+      });
+    };
+    listener();
+    window.addEventListener('resize', listener);
+    return function () {
+      window.removeEventListener('resize', listener);
+    };
+  } else {
+    var observer = new ResizeObserver(function (entries) {
+      var rect = entries[0].contentRect;
+      callback({
+        width: rect.width,
+        height: rect.height
+      });
+    });
+    observer.observe(target);
+    return function () {
+      observer.disconnect();
+    };
+  }
+}
+
+function anchorQuery$1(rects, scrollLeft) {
+  var left = 0;
+  var right = rects.length - 1;
+  var index = -1;
+  while (left <= right) {
+    var mid = Math.floor((left + right) / 2);
+    if (rects[mid].right > scrollLeft) {
+      index = mid;
+      right = mid - 1;
+    } else {
+      left = mid + 1;
+    }
+  }
+  if (index === -1) {
+    return undefined;
+  }
+  return rects[index];
+}
+function findFirstFixedRightIndex(columns) {
+  var index = -1;
+  for (var i = columns.length - 1; i >= 0; i--) {
+    var column = columns[i];
+    if (isValidFixedRight(column.fixed)) {
+      index = i;
+    } else {
+      break;
+    }
+  }
+  return index;
+}
+function findLastFixedLeftIndex(columns) {
+  return findLastIndex(columns, function (x) {
+    return isValidFixedLeft(x.fixed);
+  });
+}
+function useColumnVirtualize(options) {
+  var estimateSize = options.estimateSize,
+    overscan = options.overscan,
+    rawColumns = options.columns,
+    bodyWrapper = options.bodyWrapper,
+    columnWidths = options.columnWidths,
+    _options$disabled = options.disabled,
+    disabled = _options$disabled === undefined ? false : _options$disabled;
+  var lastFixedLeftIndex = findLastFixedLeftIndex(rawColumns);
+  var firstFixedRightIndex = findFirstFixedRightIndex(rawColumns);
+  var leftKey = lastFixedLeftIndex > -1 ? getKey(rawColumns[lastFixedLeftIndex]) : null;
+  var rightKey = firstFixedRightIndex > -1 ? getKey(rawColumns[firstFixedRightIndex]) : null;
+  var _useState = useState(0),
+    startIndex = _useState[0],
+    setStartIndex = _useState[1];
+  var _useState2 = useState(0),
+    endIndex = _useState2[0],
+    setEndIndex = _useState2[1];
+  var rects = useMemo(function () {
+    if (disabled) {
+      return [];
+    }
+    var left = 0;
+    return rawColumns.map(function (column, index) {
+      var _columnWidths$get;
+      var key = getKey(column);
+      var width = (_columnWidths$get = columnWidths.get(key)) != null ? _columnWidths$get : estimateSize;
+      var right = left + width;
+      var rect = {
+        index: index,
+        width: width,
+        left: left,
+        right: right
+      };
+      left = right;
+      return rect;
+    });
+  }, [rawColumns, columnWidths, estimateSize, disabled]);
+  // 锚点元素
+  var anchorRef = useRef({
+    index: 0,
+    width: estimateSize,
+    left: 0,
+    right: estimateSize
+  });
+  var findAnchorRef = useStableFn(function (scrollLeft) {
+    return anchorQuery$1(rects, scrollLeft);
+  });
+  var updateBoundary = useStableFn(function (scrollLeft, count) {
+    var anchor = findAnchorRef(scrollLeft);
+    if (anchor != null) {
+      anchorRef.current = anchor;
+      setStartIndex(Math.max(0, anchor.index - overscan));
+      setEndIndex(anchor.index + count + overscan);
+    }
+  });
+  // 用来判断滚动方向
+  var scrollLeftRef = useRef(0);
+  useEffect(function () {
+    if (disabled) return;
+    var scrollContainer = bodyWrapper.current;
+    if (scrollContainer == null) return;
+    var containerWidth = scrollContainer.offsetWidth;
+    var count = Math.ceil(containerWidth / estimateSize);
+    var onScroll = function onScroll() {
+      var scrollLeft = scrollContainer.scrollLeft;
+      // 滚动条向右移动(界面向左运动)
+      var isScrollRight = scrollLeft > scrollLeftRef.current;
+      if (isScrollRight) {
+        if (scrollLeft > anchorRef.current.right) {
+          updateBoundary(scrollLeft, count);
+        }
+      } else {
+        if (scrollLeft < anchorRef.current.left) {
+          updateBoundary(scrollLeft, count);
+        }
+      }
+      scrollLeftRef.current = scrollLeft;
+    };
+    scrollContainer.addEventListener('scroll', onScroll);
+    var prevWidth = 0;
+    var stop = onResize(scrollContainer, function (_ref) {
+      var width = _ref.width;
+      if (width === prevWidth || width === 0) {
+        return;
+      }
+      prevWidth = width;
+      var scrollLeft = scrollContainer.scrollLeft;
+      count = Math.ceil(width / estimateSize);
+      updateBoundary(scrollLeft, count);
+    });
+    return function () {
+      scrollContainer.removeEventListener('scroll', onScroll);
+      stop();
+    };
+  }, [bodyWrapper, estimateSize, updateBoundary, overscan, findAnchorRef, disabled]);
+  var sum = function sum(startIndex, endIndex) {
+    return rects.slice(startIndex, endIndex).reduce(function (a, b) {
+      return a + b.width;
+    }, 0);
+  };
+  var fixedLeftWidth = lastFixedLeftIndex > -1 ? sum(0, lastFixedLeftIndex + 1) : 0;
+  var fixedRightWidth = firstFixedRightIndex > -1 ? sum(firstFixedRightIndex) : 0;
+  // 设置 column.fixed 时，对应列将不会虚拟化，所以 blank 需要去除这些列的宽度
+  var leftBlank = Math.max(0, sum(0, startIndex) - fixedLeftWidth);
+  var rightBlank = Math.max(0, sum(endIndex) - fixedRightWidth);
+  var columnSlice = useMemo(function () {
+    if (disabled) {
+      return rawColumns;
+    }
+    var result = [].concat(rawColumns.slice(0, lastFixedLeftIndex + 1), rawColumns.slice(startIndex, endIndex), rawColumns.slice(firstFixedRightIndex));
+    var unionKey = new Set();
+    return result.filter(function (column) {
+      var key = getKey(column);
+      if (unionKey.has(key)) {
+        return false;
+      }
+      unionKey.add(key);
+      return true;
+    });
+  }, [disabled, rawColumns, startIndex, endIndex, lastFixedLeftIndex, firstFixedRightIndex]);
+  var descriptor = useMemo(function () {
+    return columnSlice.reduce(function (result, column) {
+      var key = getKey(column);
+      if (key === leftKey) {
+        result.push({
+          key: key,
+          type: 'normal',
+          column: column
+        });
+        result.push({
+          key: '_blank_left',
+          type: 'blank',
+          width: leftBlank
+        });
+      } else if (key === rightKey) {
+        result.push({
+          key: '_blank_right',
+          type: 'blank',
+          width: rightBlank
+        });
+        result.push({
+          key: key,
+          type: 'normal',
+          column: column
+        });
+      } else {
+        result.push({
+          key: key,
+          type: 'normal',
+          column: column
+        });
+      }
+      return result;
+    }, []);
+  }, [columnSlice, leftKey, rightKey, leftBlank, rightBlank]);
+  var columns = useMemo(function () {
+    return {
+      columns: columnSlice,
+      descriptor: descriptor
+    };
+  }, [columnSlice, descriptor]);
+  return {
+    columns: columns,
+    columnSlice: columnSlice,
+    lastFixedLeftIndex: lastFixedLeftIndex,
+    firstFixedRightIndex: firstFixedRightIndex
+  };
+}
+
+function useRowRectManager(options) {
+  var itemCount = options.itemCount,
+    estimateSize = options.estimateSize,
+    onChange = options.onChange;
+  var rowHeightList = useRef([]);
+  var calc = function calc() {
+    for (var i = 0; i < itemCount; i += 1) {
+      var target = rowHeightList.current[i];
+      if (target == null) {
+        rowHeightList.current[i] = estimateSize;
+      }
+    }
+    rowHeightList.current = rowHeightList.current.slice(0, itemCount);
+  };
+  // eslint-disable-next-line react-compiler/react-compiler
+  calc();
+  // const initialCount = useRef(itemCount)
+  // const [, forceUpdate] = useReducer((x) => !x, false)
+  // useLayoutEffect(() => {
+  //   for (let i = 0; i < itemCount; i += 1) {
+  //     const target = rowHeightList.current[i]
+  //     if (target == null) {
+  //       rowHeightList.current[i] = estimatedRowHeight
+  //     }
+  //   }
+  //   // 数据量骤减时如果 row 数量不匹配则会导致容器高度错误
+  //   rowHeightList.current = rowHeightList.current.slice(0, itemCount)
+  //   // 这里的 useLayoutEffect 是为了在第一次渲染时，根据数据条数预先填充 row 的高度，这样内容足够高，容器才能滚动
+  //   // 但是 dataSource 一般是异步获取的，第一次渲染时，length 是空的，所以无法进行填充，这样可能导致容器不能滚动
+  //   // 所以 dataSource 有数据后，再填充一次，但是因为 useLayoutEffect 是渲染结束后才调用的，此时填充数据还是导致容器不能滚动，
+  //   // 所以，只在第一次 dataSource 不为空时强制触发一次更新
+  //   // 可能正因为这一次强制渲染，所以 VirtualTable 内部很多组件可能多次渲染。尝试优化为 calc 函数
+  //   if (initialCount.current === 0 && itemCount > 0) {
+  //     initialCount.current = itemCount
+  //     forceUpdate()
+  //   }
+  // }, [itemCount, estimatedRowHeight])
+  var rectList = useRef([]);
+  var updateRectList = function updateRectList() {
+    var result = [];
+    var top = 0;
+    rowHeightList.current.forEach(function (item, index) {
+      if (index !== 0) {
+        top += item;
+      }
+      result.push({
+        index: index,
+        height: item,
+        top: top,
+        bottom: top + item
+      });
+    });
+    rectList.current = result;
+  };
+  // DOM 渲染结束后，进行高度测量，再修改 rowHeightList
+  // 小心陷阱：当 table 父元素为 display: none 时，依然会触发 updateRowHeight 函数，并设置高度为 0
+  var updateRowHeight = useStableFn(function (index, height) {
+    rowHeightList.current[index] = height;
+    updateRectList();
+    onChange == null || onChange(index, height, rectList.current);
+  });
+  var sum = function sum(startIndex, endIndex) {
+    return rowHeightList.current.slice(startIndex, endIndex).reduce(function (a, b) {
+      return a + b;
+    }, 0);
+  };
+  return {
+    rowHeightList: rowHeightList,
+    updateRowHeight: updateRowHeight,
+    sum: sum,
+    rects: useCallback(function () {
+      return rectList.current;
+    }, [])
+  };
+}
+
+function anchorQuery(rects, scrollTop) {
+  var left = 0;
+  var right = rects.length - 1;
+  var index = -1;
+  while (left <= right) {
+    var mid = Math.floor((left + right) / 2);
+    if (rects[mid].bottom > scrollTop) {
+      index = mid;
+      right = mid - 1;
+    } else {
+      left = mid + 1;
+    }
+  }
+  if (index === -1) {
+    return undefined;
+  }
+  return rects[index];
+}
+function useRowVirtualize(options) {
+  var getOffsetTop = options.getOffsetTop,
+    rawData = options.dataSource,
+    getScroller = options.getScroller,
+    estimateSize = options.estimateSize,
+    overscan = options.overscan;
+  var _useState = useState(0),
+    startIndex = _useState[0],
+    setStartIndex = _useState[1];
+  var _useState2 = useState(0),
+    endIndex = _useState2[0],
+    setEndIndex = _useState2[1];
+  // 锚点元素，当前虚拟列表中，最接近滚动容器顶部的元素
+  var anchorRef = useRef({
+    index: 0,
+    height: estimateSize,
+    top: 0,
+    bottom: estimateSize
+  });
+  var _useRowRectManager = useRowRectManager({
+      itemCount: rawData.length,
+      estimateSize: estimateSize,
+      onChange: function onChange(index, _height, rowRects) {
+        if (anchorRef.current.index === index) {
+          anchorRef.current = rowRects[index];
+        }
+      }
+    }),
+    rowHeightList = _useRowRectManager.rowHeightList,
+    rects = _useRowRectManager.rects,
+    updateRowHeight = _useRowRectManager.updateRowHeight,
+    sum = _useRowRectManager.sum;
+  // 用来判断滚动方向
+  var scrollTopRef = useRef(0);
+  var initial = useRef(false);
+  useEffect(function () {
+    var container = getScroller();
+    if (container == null) return;
+    var count = 0;
+    var getScrollTop = function getScrollTop() {
+      var offsetTop = getOffsetTop();
+      var result = 0;
+      if (isWindow(container) || isRoot(container)) {
+        result = window.scrollY;
+      } else {
+        var element = getScrollElement(container);
+        result = element.scrollTop;
+      }
+      return Math.max(result - offsetTop, 0);
+    };
+    var calcCount = function calcCount(scrollerContainerHeight) {
+      var prevCount = count;
+      count = Math.ceil(scrollerContainerHeight / estimateSize);
+      return {
+        prevCount: prevCount
+      };
+    };
+    var updateBoundary = function updateBoundary(scrollTop) {
+      var anchor = anchorQuery(rects(), scrollTop);
+      if (anchor != null) {
+        anchorRef.current = anchor;
+        setStartIndex(Math.max(0, anchor.index - overscan));
+        setEndIndex(anchor.index + count + overscan);
+      }
+    };
+    var onScroll = function onScroll(e) {
+      var offsetTop = getOffsetTop();
+      var scrollElement = getScrollElement(e.target);
+      var scrollTop = Math.max(0, scrollElement.scrollTop - offsetTop);
+      // 是否为向下滚动
+      var isScrollDown = scrollTop > scrollTopRef.current;
+      if (isScrollDown) {
+        // 如果滚动距离比较小，没有超出锚点元素的边界，就不需要计算 startIndex、endIndex 了
+        if (scrollTop > anchorRef.current.bottom) {
+          updateBoundary(scrollTop);
+        }
+      } else {
+        if (scrollTop < anchorRef.current.top) {
+          updateBoundary(scrollTop);
+        }
+      }
+      scrollTopRef.current = scrollTop;
+    };
+    var prevHeight = 0;
+    var stopListen = onResize(container, function (rect) {
+      // 处理父元素 display:none 容器高度丢失，导致显示 row 不准确
+      if (rect.height === prevHeight || rect.height === 0) {
+        return;
+      }
+      prevHeight = rect.height;
+      calcCount(rect.height);
+      var scrollTop = getScrollTop();
+      if (!initial.current) {
+        initial.current = true;
+        var nextStartIndex = 0;
+        // 判断一下当前滚动位置，计算 startIndex（场景：SPA 页面切换且渲染非异步数据）
+        if (scrollTop >= estimateSize) {
+          nextStartIndex = Math.max(Math.floor(scrollTop / estimateSize) - 1 - overscan, 0);
+        }
+        var nextEndIndex = nextStartIndex + count + overscan;
+        setStartIndex(nextStartIndex);
+        setEndIndex(nextEndIndex);
+      } else {
+        updateBoundary(scrollTop);
+      }
+    });
+    container.addEventListener('scroll', onScroll);
+    return function () {
+      stopListen();
+      container.removeEventListener('scroll', onScroll);
+    };
+  }, [estimateSize, getOffsetTop, getScroller, overscan, rects]);
+  // TODO: React Compiler 测试 topBlank 和 bottomBlank
+  var topBlank = sum(0, startIndex);
+  var bottomBlank = sum(endIndex);
+  var dataSlice = useMemo(function () {
+    return rawData.slice(startIndex, endIndex);
+  }, [rawData, startIndex, endIndex]);
+  return {
+    startIndex: startIndex,
+    endIndex: endIndex,
+    rowHeightList: rowHeightList,
+    updateRowHeight: updateRowHeight,
+    topBlank: topBlank,
+    bottomBlank: bottomBlank,
+    dataSlice: dataSlice
+  };
+}
+
+function TableRoot(props, ref) {
+  var className = props.className,
+    style = props.style,
+    children = props.children,
+    hasFixedLeftColumn = props.hasFixedLeftColumn,
+    hasFixedRightColumn = props.hasFixedRightColumn,
+    renderRoot = props.renderRoot,
+    bodyScrollContainer = props.bodyScrollContainer;
+  var rootNode = useRef(null);
+  var _useState = useState(false),
+    hasFixedLeft = _useState[0],
+    setHasFixedLeft = _useState[1];
+  var _useState2 = useState(false),
+    hasFixedRight = _useState2[0],
+    setHasFixedRight = _useState2[1];
+  var _useHorizontalScrollC = useHorizontalScrollContext(),
+    listen = _useHorizontalScrollC.listen;
+  useEffect(function () {
+    if (!hasFixedLeftColumn && !hasFixedRightColumn) {
+      return;
+    }
+    var onCheckHasFixedEdge = function onCheckHasFixedEdge(node) {
+      var scrollLeft = node.scrollLeft,
+        clientWidth = node.clientWidth,
+        scrollWidth = node.scrollWidth;
+      if (hasFixedLeftColumn) {
+        setHasFixedLeft(scrollLeft !== 0);
+      }
+      if (hasFixedRightColumn) {
+        setHasFixedRight(!(scrollLeft + clientWidth >= scrollWidth));
+      }
+    };
+    var node = bodyScrollContainer.current;
+    if (node != null) {
+      onCheckHasFixedEdge(node);
+    }
+    return listen('__root', function (_scrollLeft, node) {
+      onCheckHasFixedEdge(node);
+    });
+  }, [bodyScrollContainer, hasFixedLeftColumn, hasFixedRightColumn, listen]);
+  var mergedRef = useMergedRef(ref, rootNode);
+  return pipelineRender(jsx("div", {
+    ref: mergedRef,
+    className: clsx('virtual-table', hasFixedLeft && 'virtual-table-has-fix-left', hasFixedRight && 'virtual-table-has-fix-right', className),
+    style: style,
+    children: children
+  }), renderRoot, {});
+}
+var TableRoot$1 = /*#__PURE__*/forwardRef(TableRoot);
+
+function VirtualTableCore(props, ref) {
+  var bodyRootRef = props.bodyRootRef,
+    className = props.className,
+    style = props.style,
+    tableBodyClassName = props.tableBodyClassName,
+    tableBodyStyle = props.tableBodyStyle,
+    rawColumns = props.columns,
+    rawData = props.dataSource,
+    _props$rowKey = props.rowKey,
+    rawRowKey = _props$rowKey === undefined ? 'key' : _props$rowKey,
+    _props$estimatedRowHe = props.estimatedRowHeight,
+    estimatedRowHeight = _props$estimatedRowHe === undefined ? 46 : _props$estimatedRowHe,
+    estimatedColumnWidth = props.estimatedColumnWidth,
+    _props$overscanRows = props.overscanRows,
+    overscanRows = _props$overscanRows === undefined ? 5 : _props$overscanRows,
+    _props$overscanColumn = props.overscanColumns,
+    overscanColumns = _props$overscanColumn === undefined ? 3 : _props$overscanColumn,
+    stickyHeader = props.stickyHeader,
+    _props$pipeline = props.pipeline,
+    pipeline = _props$pipeline === undefined ? TablePipeline.defaultPipeline : _props$pipeline,
+    rawRowClassName = props.rowClassName,
+    onRow = props.onRow,
+    getOffsetTopImpl = props.getOffsetTop,
+    _props$virtualHeader = props.virtualHeader,
+    virtualHeader = _props$virtualHeader === undefined ? false : _props$virtualHeader;
+  var rootNode = useRef(null);
+  var headerWrapperRef = useRef(null);
+  var bodyWrapperRef = useRef(null);
+  var bodyRoot = useRef(null);
+  var mergedBodyRootRef = useMergedRef(bodyRoot, bodyRootRef);
+  var bodyRef = useRef(null);
+  var getScroller = useCallback(function () {
+    var root = rootNode.current;
+    if (root == null) return;
+    return getScrollParent(root);
+  }, []);
+  var getOffsetTop = useCallback(function () {
+    var _rootNode$current$off, _rootNode$current2;
+    if (typeof getOffsetTopImpl === 'function') {
+      return getOffsetTopImpl();
+    }
+    var scrollContainer = getScroller();
+    if (scrollContainer === rootNode.current) {
+      return 0;
+    }
+    if (isWindow(scrollContainer) || isRoot(scrollContainer)) {
+      var _rootNode$current$get, _rootNode$current;
+      var top = (_rootNode$current$get = (_rootNode$current = rootNode.current) == null ? undefined : _rootNode$current.getBoundingClientRect().top) != null ? _rootNode$current$get : 0;
+      return window.scrollY + top;
+    }
+    return (_rootNode$current$off = (_rootNode$current2 = rootNode.current) == null ? undefined : _rootNode$current2.offsetTop) != null ? _rootNode$current$off : 0;
+  }, [getOffsetTopImpl, getScroller]);
+  var _pipeline$use = pipeline.use({
+      dataSource: rawData,
+      rowKey: rawRowKey,
+      columns: rawColumns,
+      estimatedRowHeight: estimatedRowHeight,
+      headerWrapperRef: headerWrapperRef,
+      bodyWrapperRef: bodyWrapperRef,
+      bodyRootRef: bodyRoot,
+      bodyRef: bodyRef,
+      rootRef: rootNode,
+      getOffsetTop: getOffsetTop,
+      getScroller: getScroller
+    }),
+    dataSource = _pipeline$use.dataSource,
+    pipelineColumns = _pipeline$use.columns,
+    rowKey = _pipeline$use.rowKey,
+    rowClassName = _pipeline$use.rowClassName,
+    render = _pipeline$use.render,
+    renderRoot = _pipeline$use.renderRoot,
+    renderContent = _pipeline$use.renderContent,
+    renderHeaderWrapper = _pipeline$use.renderHeaderWrapper,
+    renderHeaderRoot = _pipeline$use.renderHeaderRoot,
+    renderHeader = _pipeline$use.renderHeader,
+    renderHeaderRow = _pipeline$use.renderHeaderRow,
+    renderHeaderCell = _pipeline$use.renderHeaderCell,
+    renderBodyWrapper = _pipeline$use.renderBodyWrapper,
+    renderBodyRoot = _pipeline$use.renderBodyRoot,
+    renderBody = _pipeline$use.renderBody,
+    renderRow = _pipeline$use.renderRow,
+    renderCell = _pipeline$use.renderCell,
+    onPipelineRow = _pipeline$use.onRow;
+  var _useState = useState(function () {
+      return new Map();
+    }),
+    columnWidths = _useState[0],
+    setColumnWidths = _useState[1];
+  var columnWidthsRef = useRef(columnWidths);
+  var updateColumnWidths = function updateColumnWidths(value) {
+    columnWidthsRef.current = value;
+    setColumnWidths(value);
+  };
+  var tableColumnsContext = useMemo(function () {
+    return {
+      widthList: columnWidths,
+      setWidthList: updateColumnWidths
+    };
+  }, [columnWidths]);
+  var _useRowVirtualize = useRowVirtualize({
+      getOffsetTop: getOffsetTop,
+      dataSource: dataSource,
+      getScroller: getScroller,
+      estimateSize: estimatedRowHeight,
+      overscan: overscanRows
+    }),
+    startIndex = _useRowVirtualize.startIndex,
+    dataSlice = _useRowVirtualize.dataSlice,
+    updateRowHeight = _useRowVirtualize.updateRowHeight,
+    rowHeightList = _useRowVirtualize.rowHeightList,
+    topBlank = _useRowVirtualize.topBlank,
+    bottomBlank = _useRowVirtualize.bottomBlank;
+  var _useColumnVirtualize = useColumnVirtualize({
+      estimateSize: estimatedColumnWidth != null ? estimatedColumnWidth : 100,
+      overscan: overscanColumns,
+      columns: pipelineColumns,
+      bodyWrapper: bodyWrapperRef,
+      columnWidths: columnWidths,
+      disabled: estimatedColumnWidth == null
+    }),
+    columns = _useColumnVirtualize.columns;
+  if (process.env.NODE_ENV === 'development') {
+    pipelineColumns.forEach(function (column) {
+      if (column.width == null && column.minWidth == null) {
+        console.warn('Missing `width` in column', column);
+      }
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+      if (getKey(column) == null) {
+        console.error('Missing `dataIndex` or `key` in column', column);
+      }
+    });
+  }
+  var onRowClassName = useCallback(function (record, index) {
+    return clsx(rawRowClassName == null ? undefined : rawRowClassName(record, index), rowClassName == null ? undefined : rowClassName(record, index));
+  }, [rawRowClassName, rowClassName]);
+  var onRowProps = useCallback(function (record, index) {
+    return _extends({}, onRow == null ? undefined : onRow(record, index), onPipelineRow == null ? undefined : onPipelineRow(record, index));
+  }, [onPipelineRow, onRow]);
+  var hasFixedLeftColumn = pipelineColumns.some(function (x) {
+    return isValidFixedLeft(x.fixed);
+  });
+  var hasFixedRightColumn = pipelineColumns.some(function (x) {
+    return isValidFixedRight(x.fixed);
+  });
+  var rowManager = useMemo(function () {
+    return {
+      getRowHeightList: function getRowHeightList() {
+        return rowHeightList.current;
+      },
+      updateRowHeight: updateRowHeight
+    };
+  }, [rowHeightList, updateRowHeight]);
+  var fullHeaderColumns = useMemo(function () {
+    return {
+      columns: pipelineColumns,
+      descriptor: pipelineColumns.map(function (column) {
+        var key = getKey(column);
+        return {
+          key: key,
+          type: 'normal',
+          column: column
+        };
+      })
+    };
+  }, [pipelineColumns]);
+  var headerColumns = useMemo(function () {
+    if (virtualHeader) {
+      return columns;
+    }
+    return fullHeaderColumns;
+  }, [virtualHeader, fullHeaderColumns, columns]);
+  var contentNode = pipelineRender(jsxs(Fragment$1, {
+    children: [jsx(TableHeader, {
+      wrapperRef: headerWrapperRef,
+      columns: headerColumns,
+      stickyHeader: stickyHeader,
+      renderHeaderWrapper: renderHeaderWrapper,
+      renderHeaderRoot: renderHeaderRoot,
+      renderHeader: renderHeader,
+      renderHeaderRow: renderHeaderRow,
+      renderHeaderCell: renderHeaderCell
+    }), jsx(TableBody, {
+      bodyWrapperRef: bodyWrapperRef,
+      bodyRootRef: mergedBodyRootRef,
+      bodyRef: bodyRef,
+      className: tableBodyClassName,
+      style: _extends({}, tableBodyStyle, {
+        paddingBottom: bottomBlank,
+        paddingTop: topBlank
+      }),
+      columns: columns,
+      rowKey: rowKey,
+      dataSource: dataSlice,
+      startIndex: startIndex,
+      rowClassName: onRowClassName,
+      onRow: onRowProps,
+      renderBodyWrapper: renderBodyWrapper,
+      renderBodyRoot: renderBodyRoot,
+      renderBody: renderBody,
+      renderRow: renderRow,
+      renderCell: renderCell
+    })]
+  }), renderContent, {
+    columns: columns.columns,
+    columnDescriptor: columns.descriptor
+  });
+  var rootMergedRef = useMergedRef(rootNode, ref);
+  var table = pipelineRender(jsx(TableRoot$1, {
+    ref: rootMergedRef,
+    className: className,
+    style: style,
+    hasFixedLeftColumn: hasFixedLeftColumn,
+    hasFixedRightColumn: hasFixedRightColumn,
+    renderRoot: renderRoot,
+    bodyScrollContainer: bodyWrapperRef,
+    children: contentNode
+  }), render, {
+    columns: columns.columns,
+    columnDescriptor: columns.descriptor
+  });
+  return jsx(TableRowManager.Provider, {
+    value: rowManager,
+    children: jsx(ColumnSizes.Provider, {
+      value: tableColumnsContext,
+      children: jsx(StickyContext, {
+        columns: pipelineColumns,
+        children: jsx(ContainerSizeContext, {
+          getScroller: getScroller,
+          root: rootNode,
+          children: jsx(HorizontalScrollContext, {
+            children: table
+          })
+        })
+      })
+    })
+  });
+}
+if (process.env.NODE_ENV === 'development') {
+  VirtualTableCore.displayName = 'VirtualTable.Core';
+}
+var table = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(VirtualTableCore));
+
+export { Colgroup, table as VirtualTable, Cell$1 as VirtualTableCell, Row$1 as VirtualTableRow, createMiddleware, findLastIndex, getKey, isValidFixed, isValidFixedLeft, isValidFixedRight, mergeRefs, onResize, useColumnSizes, useContainerSize, useHorizontalScrollContext, useMergedRef, useShallowMemo, useStableFn, useTablePipeline, useTableRowManager, useTableSticky };
+//# sourceMappingURL=index.esm.js.map