@sheinx/base 3.0.0-alpha.9 → 3.0.0-rc.10

package/esm/table/table.js

@@ -1,37 +1,29 @@
-"use strict";
-
-require("core-js/modules/es.object.get-own-property-descriptors.js");
-require("core-js/modules/es.array.iterator.js");
-require("core-js/modules/es.weak-map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-require("core-js/modules/es.array.filter.js");
-require("core-js/modules/web.dom-collections.for-each.js");
-var _react = _interopRequireWildcard(require("react"));
-var _scroll = _interopRequireDefault(require("../virtual-scroll/scroll"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _spin = _interopRequireDefault(require("../spin"));
-var _pagination = _interopRequireDefault(require("../pagination"));
-var _empty = _interopRequireDefault(require("../empty"));
-var _hooks = require("@sheinx/hooks");
-var _useTableSelect = _interopRequireDefault(require("./use-table-select"));
-var _colgroup = _interopRequireDefault(require("./colgroup"));
-var _thead = _interopRequireDefault(require("./thead"));
-var _tbody = _interopRequireDefault(require("./tbody"));
-var _tfoot = _interopRequireDefault(require("./tfoot"));
-var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["data"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+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); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useEffect, useMemo, useRef } from 'react';
+import Scroll from "../virtual-scroll/scroll";
+import classNames from 'classnames';
+import Spin from "../spin";
+import Pagination from "../pagination";
+import AbsoluteContext from "../absolute-list/absolute-context";
+import Empty from "../empty";
+import Sticky from "../sticky";
+import { useTableLayout, useTableColumns, useTableSort, useTableTree, usePersistFn, useListSelect, useInputAble, useTableVirtual, usePaginationList, useLatestObj } from '@sheinx/hooks';
+import useTableSelect from "./use-table-select";
+import Colgroup from "./colgroup";
+import Thead from "./thead";
+import Tbody from "./tbody";
+import Tfoot from "./tfoot";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 var emptyArr = [];
 var virtualScrollerStyle = {
   flex: 1,
@@ -46,13 +38,14 @@ var scrollWrapperStyle = {
   minWidth: 0,
   display: 'flex'
 };
-var _default = function _default(props) {
+export default (function (props) {
   var _props$jssStyle, _props$jssStyle$table, _props$data, _columns$find;
-  var tableClasses = props === null || props === void 0 ? void 0 : (_props$jssStyle = props.jssStyle) === null || _props$jssStyle === void 0 ? void 0 : (_props$jssStyle$table = _props$jssStyle.table) === null || _props$jssStyle$table === void 0 ? void 0 : _props$jssStyle$table.call(_props$jssStyle);
-  var tbodyRef = (0, _react.useRef)(null);
-  var theadRef = (0, _react.useRef)(null);
-  var tfootRef = (0, _react.useRef)(null);
-  var scrollRef = (0, _react.useRef)(null);
+  var tableClasses = props === null || props === void 0 || (_props$jssStyle = props.jssStyle) === null || _props$jssStyle === void 0 || (_props$jssStyle$table = _props$jssStyle.table) === null || _props$jssStyle$table === void 0 ? void 0 : _props$jssStyle$table.call(_props$jssStyle);
+  var tbodyRef = useRef(null);
+  var theadRef = useRef(null);
+  var tfootRef = useRef(null);
+  var scrollRef = useRef(null);
+  var tableRef = useRef(null);
   var virtual = ((_props$data = props.data) === null || _props$data === void 0 ? void 0 : _props$data.length) && props.rowsInView !== 0 && (!!props.virtual || props.fixed === 'both' || props.fixed === 'y' || props.fixed === 'auto');
   var _props$verticalAlign = props.verticalAlign,
     verticalAlign = _props$verticalAlign === void 0 ? 'top' : _props$verticalAlign,
@@ -60,52 +53,23 @@ var _default = function _default(props) {
     size = _props$size === void 0 ? 'default' : _props$size,
     _props$pagination = props.pagination,
     pagination = _props$pagination === void 0 ? {} : _props$pagination;
-  var selection = (0, _useTableSelect.default)({
+  var selection = useTableSelect({
     cellSelectable: props.cellSelectable
   });
-  var inputableData = (0, _hooks.useInputAble)({
+  var inputableData = useInputAble({
     value: props.value,
     defaultValue: undefined,
     onChange: props.onRowSelect,
     control: 'value' in props,
     beforeChange: undefined
   });
-  var getSelectData = function getSelectData() {
-    var checkboxColumn = (props.columns || emptyArr).find(function (item) {
-      return item.type === 'checkbox';
-    });
-    var selectData = props.data || emptyArr;
-    if (checkboxColumn) {
-      if (typeof checkboxColumn.filterAll === 'function') {
-        selectData = checkboxColumn.filterAll(selectData);
-      } else if (typeof checkboxColumn.rowSpan === 'function') {
-        selectData = selectData.filter(function (item, index) {
-          if (index > 0) {
-            var before = selectData[index - 1];
-            return !checkboxColumn.rowSpan(before, item);
-          }
-          return true;
-        });
-      }
-    }
-    return selectData;
-  };
-  var datum = (0, _hooks.useListSelect)({
-    data: getSelectData(),
-    value: inputableData.value,
-    multiple: !props.radio,
-    prediction: props.prediction,
-    format: props.format,
-    onChange: inputableData.onChange,
-    disabled: props.disabled
-  });
-  var _useTableColumns = (0, _hooks.useTableColumns)({
+  var _useTableColumns = useTableColumns({
       columns: props.columns,
       showCheckbox: typeof props.onRowSelect === 'function'
     }),
     columns = _useTableColumns.columns,
     expandHideCol = _useTableColumns.expandHideCol;
-  var _useTableLayout = (0, _hooks.useTableLayout)({
+  var _useTableLayout = useTableLayout({
       theadRef: theadRef,
       tbodyRef: tbodyRef,
       scrollRef: scrollRef,
@@ -126,8 +90,9 @@ var _default = function _default(props) {
     shouldLastColAuto = _useTableLayout.shouldLastColAuto,
     maxScrollLeft = _useTableLayout.maxScrollLeft,
     scrollBarWidth = _useTableLayout.scrollBarWidth,
-    scrollWidth = _useTableLayout.scrollWidth;
-  var _useTableSort = (0, _hooks.useTableSort)({
+    scrollWidth = _useTableLayout.scrollWidth,
+    resizeFlag = _useTableLayout.resizeFlag;
+  var _useTableSort = useTableSort({
       data: props.data,
       sorter: props.sorter,
       onSortCancel: props.onSortCancel,
@@ -136,34 +101,70 @@ var _default = function _default(props) {
     sortedData = _useTableSort.sortedData,
     sortInfo = _useTableSort.sortInfo,
     onSorterChange = _useTableSort.onSorterChange;
-  var _usePaginationList = (0, _hooks.usePaginationList)({
+  var _usePaginationList = usePaginationList({
       data: sortedData,
       shouldPage: !!props.pagination,
-      current: pagination.current,
-      defaultCurrent: pagination.defaultCurrent,
-      pageSize: pagination.pageSize,
-      onChange: pagination.onChange,
-      loading: !!props.loading
+      current: pagination === null || pagination === void 0 ? void 0 : pagination.current,
+      defaultCurrent: pagination === null || pagination === void 0 ? void 0 : pagination.defaultCurrent,
+      pageSize: pagination === null || pagination === void 0 ? void 0 : pagination.pageSize,
+      onChange: pagination === null || pagination === void 0 ? void 0 : pagination.onChange,
+      loading: !!props.loading,
+      total: pagination === null || pagination === void 0 ? void 0 : pagination.total
     }),
     pagedData = _usePaginationList.data,
-    paginationInfo = (0, _objectWithoutProperties2.default)(_usePaginationList, _excluded);
+    paginationInfo = _objectWithoutProperties(_usePaginationList, _excluded);
   var treeColumnsName = (_columns$find = columns.find(function (item) {
     return item.treeColumnsName;
   })) === null || _columns$find === void 0 ? void 0 : _columns$find.treeColumnsName;
-  var _useTableTree = (0, _hooks.useTableTree)({
+  var _useTableTree = useTableTree({
       data: pagedData,
       treeColumnsName: treeColumnsName,
       treeExpandKeys: props.treeExpandKeys,
       defaultTreeExpandKeys: props.defaultTreeExpandKeys,
       keygen: props.keygen,
-      onTreeExpand: props.onTreeExpand,
-      treeCheckAll: props.treeCheckAll
+      onTreeExpand: props.onTreeExpand
     }),
     treeFunc = _useTableTree.func,
     treeData = _useTableTree.data,
     isEmptyTree = _useTableTree.isEmptyTree,
     treeExpandLevel = _useTableTree.treeExpandLevel;
-  var virtualInfo = (0, _hooks.useTableVirtual)({
+  var getSelectData = function getSelectData() {
+    // 全选需要过滤掉合并的行
+    var checkboxColumn = (props.columns || emptyArr).find(function (item) {
+      return item.type === 'checkbox';
+    });
+    var selectData = pagedData || emptyArr;
+    if (treeColumnsName && !props.treeCheckAll) {
+      selectData = treeData;
+    }
+    if (checkboxColumn) {
+      if (typeof checkboxColumn.filterAll === 'function') {
+        selectData = checkboxColumn.filterAll(selectData);
+      } else if (typeof checkboxColumn.rowSpan === 'function') {
+        selectData = selectData.filter(function (item, index) {
+          if (index > 0) {
+            var before = selectData[index - 1];
+            return !checkboxColumn.rowSpan(before, item);
+          }
+          return true;
+        });
+      }
+    }
+    return selectData;
+  };
+  var selectData = useMemo(function () {
+    return getSelectData();
+  }, [pagedData, treeData]);
+  var datum = useListSelect({
+    data: selectData,
+    value: inputableData.value,
+    multiple: !props.radio,
+    prediction: props.prediction,
+    format: props.format,
+    onChange: inputableData.onChange,
+    disabled: props.disabled
+  });
+  var virtualInfo = useTableVirtual({
     data: virtual ? treeData : emptyArr,
     rowsInView: props.rowsInView || 20,
     rowHeight: props.rowHeight || 40,
@@ -173,7 +174,7 @@ var _default = function _default(props) {
   });
 
   // simple table sync left to head and foot
-  var setLeft = (0, _hooks.usePersistFn)(function (left) {
+  var setLeft = usePersistFn(function (left) {
     var thead = theadRef === null || theadRef === void 0 ? void 0 : theadRef.current;
     var tfoot = tfootRef === null || tfootRef === void 0 ? void 0 : tfootRef.current;
     [thead, tfoot].forEach(function (el) {
@@ -189,7 +190,7 @@ var _default = function _default(props) {
   });
 
   // handle head and  foot scroll
-  var handleHeaderWheel = (0, _hooks.usePersistFn)(function (e) {
+  var handleHeaderWheel = usePersistFn(function (e) {
     e.preventDefault();
     var scrollEl = scrollRef.current;
     if (!scrollEl) return;
@@ -198,7 +199,7 @@ var _default = function _default(props) {
     if (scrollLeft === scrollEl.scrollLeft) return;
     scrollEl.scrollLeft = Math.min(Math.max(scrollLeft, 0), max);
   });
-  var handleBodyScroll = (0, _hooks.usePersistFn)(function (e) {
+  var handleBodyScroll = usePersistFn(function (e) {
     var target = e.currentTarget;
     if (!target) return;
     setLeft(target.scrollLeft);
@@ -210,7 +211,7 @@ var _default = function _default(props) {
       props.onScroll(x, y, target.scrollLeft);
     }
   });
-  var handleVirtualScroll = (0, _hooks.usePersistFn)(function (info) {
+  var handleVirtualScroll = usePersistFn(function (info) {
     virtualInfo.handleScroll(info);
     layoutFunc.checkFloat();
     if (props.onScroll && typeof props.onScroll === 'function') {
@@ -220,16 +221,16 @@ var _default = function _default(props) {
   var renderEmpty = function renderEmpty() {
     var _props$data2;
     if ((_props$data2 = props.data) !== null && _props$data2 !== void 0 && _props$data2.length) return null;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    return /*#__PURE__*/_jsx("div", {
       className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.emptyWrapper,
-      children: props.empty || /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.default, {
+      children: props.empty || /*#__PURE__*/_jsx(Empty, {
         jssStyle: props.jssStyle
       })
     });
   };
   var renderTable = function renderTable() {
-    var _props$data3;
-    var Group = /*#__PURE__*/(0, _jsxRuntime.jsx)(_colgroup.default, {
+    var _props$data3, _sticky$top;
+    var Group = /*#__PURE__*/_jsx(Colgroup, {
       colgroup: colgroup,
       columns: columns,
       shouldLastColAuto: !!shouldLastColAuto
@@ -257,13 +258,15 @@ var _default = function _default(props) {
       radio: props.radio,
       onRowClick: props.onRowClick,
       rowEvents: props.rowEvents,
-      bodyScrollWidth: scrollWidth
+      bodyScrollWidth: scrollWidth,
+      resizeFlag: resizeFlag,
+      treeCheckAll: props.treeCheckAll
     };
     var headCommonProps = {
       disabled: props.disabled,
       jssStyle: props.jssStyle,
       columns: columns,
-      data: pagedData,
+      data: treeData,
       colgroup: colgroup,
       sortInfo: sortInfo,
       onSorterChange: onSorterChange,
@@ -275,7 +278,8 @@ var _default = function _default(props) {
       datum: datum,
       renderSorter: props.renderSorter,
       radio: props.radio,
-      treeColumnsName: treeColumnsName
+      treeColumnsName: treeColumnsName,
+      treeCheckAll: props.treeCheckAll
     };
     var footCommonProps = {
       summary: props.summary,
@@ -283,37 +287,37 @@ var _default = function _default(props) {
       jssStyle: props.jssStyle,
       colgroup: colgroup
     };
-    var headWrapperClass = (0, _classnames.default)(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.headWrapper, isScrollY && scrollBarWidth && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.scrollY));
-    var footWrapperClass = (0, _classnames.default)(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.footWrapper, isScrollY && scrollBarWidth && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.scrollY));
+    var headWrapperClass = classNames(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.headWrapper, isScrollY && scrollBarWidth && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.scrollY));
+    var footWrapperClass = classNames(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.footWrapper, isScrollY && scrollBarWidth && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.scrollY));
     if (virtual) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [!props.hideHeader && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      return /*#__PURE__*/_jsxs(_Fragment, {
+        children: [!props.hideHeader && /*#__PURE__*/_jsx("div", {
           className: headWrapperClass,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
+          children: /*#__PURE__*/_jsxs("table", {
             style: {
               width: width,
               transform: "translate3d(-".concat(virtualInfo.innerLeft, "px, 0, 0)")
             },
             ref: theadRef,
-            children: [Group, /*#__PURE__*/(0, _jsxRuntime.jsx)(_thead.default, _objectSpread(_objectSpread({}, headCommonProps), {}, {
+            children: [Group, /*#__PURE__*/_jsx(Thead, _objectSpread(_objectSpread({}, headCommonProps), {}, {
               fixLeftNum: virtualInfo.innerLeft,
               fixRightNum: maxScrollLeft - virtualInfo.innerLeft
             }))]
           })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_scroll.default, {
+        }), /*#__PURE__*/_jsx(Scroll, {
           style: scrollWrapperStyle,
           scrollerStyle: virtualScrollerStyle,
           wrapperRef: scrollRef,
           scrollWidth: width || 1,
           scrollHeight: virtualInfo.scrollHeight,
           onScroll: handleVirtualScroll,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
+          children: /*#__PURE__*/_jsxs("table", {
             style: {
               width: width,
               transform: virtualInfo.getTranslate()
             },
             ref: tbodyRef,
-            children: [Group, /*#__PURE__*/(0, _jsxRuntime.jsx)(_tbody.default, _objectSpread(_objectSpread({}, bodyCommonProps), {}, {
+            children: [Group, /*#__PURE__*/_jsx(Tbody, _objectSpread(_objectSpread({}, bodyCommonProps), {}, {
               currentIndex: virtualInfo.startIndex,
               data: virtualInfo.data,
               setRowHeight: virtualInfo.setRowHeight,
@@ -321,15 +325,15 @@ var _default = function _default(props) {
               fixRightNum: maxScrollLeft - virtualInfo.innerLeft
             }))]
           })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        }), /*#__PURE__*/_jsx("div", {
           className: footWrapperClass,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
+          children: /*#__PURE__*/_jsxs("table", {
             style: {
               width: width,
               transform: "translate3d(-".concat(virtualInfo.innerLeft, "px, 0, 0)")
             },
             ref: tfootRef,
-            children: [Group, /*#__PURE__*/(0, _jsxRuntime.jsx)(_tfoot.default, _objectSpread(_objectSpread({}, footCommonProps), {}, {
+            children: [Group, /*#__PURE__*/_jsx(Tfoot, _objectSpread(_objectSpread({}, footCommonProps), {}, {
               fixLeftNum: virtualInfo.innerLeft,
               fixRightNum: maxScrollLeft - virtualInfo.innerLeft
             }))]
@@ -337,85 +341,86 @@ var _default = function _default(props) {
         })]
       });
     }
-    if (!isScrollY && !props.sticky && (_props$data3 = props.data) !== null && _props$data3 !== void 0 && _props$data3.length) return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    if (!isScrollY && !props.sticky && (_props$data3 = props.data) !== null && _props$data3 !== void 0 && _props$data3.length) return /*#__PURE__*/_jsx("div", {
       ref: scrollRef,
       className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.bodyWrapper,
       onScroll: handleBodyScroll,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
+      children: /*#__PURE__*/_jsxs("table", {
         style: {
           width: width
         },
         ref: tbodyRef,
-        children: [Group, !props.hideHeader && /*#__PURE__*/(0, _jsxRuntime.jsx)(_thead.default, _objectSpread({}, headCommonProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tbody.default, _objectSpread({}, bodyCommonProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tfoot.default, _objectSpread({}, footCommonProps))]
+        children: [Group, !props.hideHeader && /*#__PURE__*/_jsx(Thead, _objectSpread({}, headCommonProps)), /*#__PURE__*/_jsx(Tbody, _objectSpread({}, bodyCommonProps)), /*#__PURE__*/_jsx(Tfoot, _objectSpread({}, footCommonProps))]
       })
     });
-    var sticky = props.sticky === true ? {
+    var Wrapper = props.sticky ? Sticky : React.Fragment;
+    var sticky = _typeof(props.sticky) === 'object' ? props.sticky : {
       top: 0
-    } : props.sticky || {
-      top: undefined
     };
-    var top = sticky.top;
-    var stickyStyle = top !== undefined ? {
-      top: top,
-      position: 'sticky'
-    } : undefined;
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [!props.hideHeader && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: headWrapperClass,
-        style: stickyStyle,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
-          style: {
-            width: width
-          },
-          ref: theadRef,
-          children: [Group, /*#__PURE__*/(0, _jsxRuntime.jsx)(_thead.default, _objectSpread({}, headCommonProps))]
+    var stickyProps = {
+      // @ts-ignore
+      target: sticky === null || sticky === void 0 ? void 0 : sticky.target,
+      top: (_sticky$top = sticky === null || sticky === void 0 ? void 0 : sticky.top) !== null && _sticky$top !== void 0 ? _sticky$top : 0,
+      css: sticky === null || sticky === void 0 ? void 0 : sticky.css,
+      parent: tableRef === null || tableRef === void 0 ? void 0 : tableRef.current
+    };
+    return /*#__PURE__*/_jsxs(_Fragment, {
+      children: [!props.hideHeader && /*#__PURE__*/_jsx(Wrapper, _objectSpread(_objectSpread({}, props.sticky ? stickyProps : {}), {}, {
+        children: /*#__PURE__*/_jsx("div", {
+          className: headWrapperClass,
+          children: /*#__PURE__*/_jsxs("table", {
+            style: {
+              width: width
+            },
+            ref: theadRef,
+            children: [Group, /*#__PURE__*/_jsx(Thead, _objectSpread({}, headCommonProps))]
+          })
         })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      })), /*#__PURE__*/_jsxs("div", {
         ref: scrollRef,
         className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.bodyWrapper,
         onScroll: handleBodyScroll,
         style: {
           height: '100%'
         },
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
+        children: [/*#__PURE__*/_jsxs("table", {
           style: {
             width: width
           },
           ref: tbodyRef,
-          children: [Group, /*#__PURE__*/(0, _jsxRuntime.jsx)(_tbody.default, _objectSpread({}, bodyCommonProps))]
+          children: [Group, /*#__PURE__*/_jsx(Tbody, _objectSpread({}, bodyCommonProps))]
         }), renderEmpty()]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: footWrapperClass,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
+        children: /*#__PURE__*/_jsxs("table", {
           style: {
             width: width
           },
           ref: tfootRef,
-          children: [Group, /*#__PURE__*/(0, _jsxRuntime.jsx)(_tfoot.default, _objectSpread({}, footCommonProps))]
+          children: [Group, /*#__PURE__*/_jsx(Tfoot, _objectSpread({}, footCommonProps))]
         })
       })]
     });
   };
   var renderLoading = function renderLoading() {
     if (!props.loading) return null;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames.default)(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.loading),
-      children: props.loading === true ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_spin.default, {
+    return /*#__PURE__*/_jsx("div", {
+      className: classNames(tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.loading),
+      children: props.loading === true ? /*#__PURE__*/_jsx(Spin, {
         jssStyle: props.jssStyle,
-        size: 24,
-        name: "ring"
-      }) : null
+        size: 24
+      }) : props.loading
     });
   };
   var renderPagination = function renderPagination() {
     if (!props.pagination) return null;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_pagination.default, _objectSpread(_objectSpread({
+    return /*#__PURE__*/_jsx(Pagination, _objectSpread(_objectSpread({
       className: tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.pagination,
       jssStyle: props.jssStyle,
       align: "right"
     }, pagination), paginationInfo));
   };
-  (0, _react.useEffect)(function () {
+  useEffect(function () {
     // 绑定 wheel 事件
     if (theadRef.current && theadRef.current.parentElement) {
       theadRef.current.parentElement.addEventListener('wheel', handleHeaderWheel, {
@@ -436,36 +441,39 @@ var _default = function _default(props) {
       }
     };
   }, [theadRef.current, isScrollY]);
-  var tableFunc = (0, _hooks.useLatestObj)({
+  var tableFunc = useLatestObj({
     scrollToIndex: virtualInfo.scrollToIndex
   });
-  (0, _react.useEffect)(function () {
+  useEffect(function () {
     if (props.tableRef) {
       props.tableRef(tableFunc);
     }
   }, []);
-  var tableWrapperClass = (0, _classnames.default)(props.className, tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.wrapper, props.bordered && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.bordered), verticalAlign === 'top' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.verticalAlignTop), verticalAlign === 'middle' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.verticalAlignMiddle), size === 'small' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.small), size === 'large' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.large), size === 'default' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.default));
-  if (!props.columns || columns.length === 0) return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: (0, _classnames.default)(tableWrapperClass, tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.simple, props.striped && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.striped)),
+  var tableWrapperClass = classNames(props.className, tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.wrapper, props.bordered && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.bordered), verticalAlign === 'top' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.verticalAlignTop), verticalAlign === 'middle' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.verticalAlignMiddle), size === 'small' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.small), size === 'large' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.large), size === 'default' && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.default));
+  if (!props.columns || columns.length === 0) return /*#__PURE__*/_jsx("div", {
+    className: classNames(tableWrapperClass, tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.simple, props.striped && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.striped)),
     style: _objectSpread({
       height: props.height || '100%'
     }, props.style),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("table", {
+    children: /*#__PURE__*/_jsx("table", {
       style: {
         width: width
       },
       children: props.children
     })
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({
-      className: (0, _classnames.default)(tableWrapperClass, floatLeft && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.floatLeft), floatRight && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.floatRight), props.sticky && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.sticky)),
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+      className: classNames(tableWrapperClass, floatLeft && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.floatLeft), floatRight && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.floatRight), props.sticky && (tableClasses === null || tableClasses === void 0 ? void 0 : tableClasses.sticky)),
       style: _objectSpread({
         height: props.height
       }, props.style)
     }, selection.getTableProps()), {}, {
-      children: [renderTable(), renderLoading(), props.children]
+      ref: tableRef,
+      children: /*#__PURE__*/_jsxs(AbsoluteContext.Provider, {
+        value: true,
+        children: [renderTable(), renderLoading(), props.children]
+      })
     })), renderPagination()]
   });
-};
-exports.default = _default;
+});

package/esm/table/table.type.d.ts

@@ -10,8 +10,8 @@ import { PaginationClasses } from '../pagination/pagination.type';
 import { ButtonClasses } from '../button/button.type';
 import { InputClasses } from '../input/input.type';
 import { EmptyClasses } from '../empty/empty.type';
-export declare type ListDatum = ReturnType<typeof useListSelect<any, any>>;
-export declare type UseTreeResult = ReturnType<typeof useTableTree>;
+export type ListDatum = ReturnType<typeof useListSelect<any, any>>;
+export type UseTreeResult = ReturnType<typeof useTableTree>;
 export interface TableClasses {
     wrapper: string;
     small: string;
@@ -278,11 +278,13 @@ export interface TableProps<DataItem, Value> extends Pick<CommonType, 'className
      */
     summary?: SummaryItem[][] | SummaryItem[];
     /**
-     * @en sticky header, When it is true, the distance from the top is 0. When it is an object, the attribute value reference [Sticky component](/components/Sticky)
-     * @cn 表头是否附着顶部，为 true 时距离顶部为0，为对象时属性值参考 [Sticky](/components/Sticky) 组件
+     * @en sticky header, When it is true, the distance from the top is 0
+     * @cn 表头是否附着顶部，为 true 时距离顶部为0
+     *
      */
     sticky?: boolean | {
-        top: number;
+        top?: number;
+        css?: boolean;
     };
     /**
      * @en Table instance (please use with caution: only fixed Table)
@@ -314,10 +316,10 @@ export interface Sorter {
     rule: string | ((sorter: SorterInfo[]) => void);
     weight: number;
 }
-export declare type ColumnOrder = 'asc' | 'desc';
-export declare type ColumnFix = 'left' | 'right';
-export declare type TableFix = 'x' | 'y' | 'both';
-export declare type ColumnType = 'expand' | 'row-expand' | 'checkbox';
+export type ColumnOrder = 'asc' | 'desc';
+export type ColumnFix = 'left' | 'right';
+export type TableFix = 'x' | 'y' | 'both';
+export type ColumnType = 'expand' | 'row-expand' | 'checkbox';
 export interface RenderSorterParam {
     status?: 'asc' | 'desc' | null;
     triggerAsc: () => void;
@@ -331,5 +333,5 @@ export interface SummaryItem {
 /**
  * @title TableColumn
  */
-export declare type ColumnItem<DataItem> = TableColumnItem<DataItem>;
+export type ColumnItem<DataItem> = TableColumnItem<DataItem>;
 //# sourceMappingURL=table.type.d.ts.map