@hi-ui/table 4.1.0-beta.2 → 4.1.0-beta.4

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @hi-ui/table
 
+## 4.1.0-beta.4
+
+### Minor Changes
+
+- 0bed8c060: feat: data 增加 disabled 配置,用于是否禁用列设置操作
+
+### Patch Changes
+
+- 32a738272: fix: 数据排序样式不对
+
+## 4.1.0-beta.3
+
+### Patch Changes
+
+- 优化大数据表格
+
 ## 4.1.0-beta.2
 
 ### Patch Changes

package/lib/cjs/Table.js

@@ -100,6 +100,7 @@ var Table = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       onHiddenColKeysChange = _a.onHiddenColKeysChange,
       sortedColKeysPropBeforeVerify = _a.sortedColKeys,
       onSortedColKeysChange = _a.onSortedColKeysChange,
+      checkDisabledColKeys = _a.checkDisabledColKeys,
       onSetColKeysChange = _a.onSetColKeysChange,
       rowSelection = _a.rowSelection,
       _a$fieldKey = _a.fieldKey,
@@ -108,7 +109,7 @@ var Table = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       _a$data = _a.data,
       data = _a$data === void 0 ? DEFAULT_DATA : _a$data,
       virtual = _a.virtual,
-      rest = tslib.__rest(_a, ["prefixCls", "standard", "loading", "dataSource", "pagination", "uniqueId", "columns", "hiddenColKeys", "onHiddenColKeysChange", "sortedColKeys", "onSortedColKeysChange", "onSetColKeysChange", "rowSelection", "fieldKey", "extra", "data", "virtual"]);
+      rest = tslib.__rest(_a, ["prefixCls", "standard", "loading", "dataSource", "pagination", "uniqueId", "columns", "hiddenColKeys", "onHiddenColKeysChange", "sortedColKeys", "onSortedColKeysChange", "checkDisabledColKeys", "onSetColKeysChange", "rowSelection", "fieldKey", "extra", "data", "virtual"]);
 
   var tableProps = reactUtils.withDefaultProps(rest, standard ? STANDARD_PRESET : undefined);
 
@@ -333,6 +334,7 @@ var Table = /*#__PURE__*/React.forwardRef(function (_a, ref) {
         setHiddenColKeys: setHiddenColKeys,
         cacheHiddenColKeys: cacheHiddenColKeys,
         setCacheHiddenColKeys: setCacheHiddenColKeys,
+        checkDisabledColKeys: checkDisabledColKeys,
         onSetColKeysChange: onSetColKeysChange
       }) : null,
       footer: dataSource || !hiddenPagination ? /*#__PURE__*/React__default["default"].createElement(Pagination__default["default"], Object.assign({

package/lib/cjs/TableBody.js

@@ -57,7 +57,7 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _useTableContext = context.useTableContext(),
       columns = _useTableContext.columns,
       leafColumns = _useTableContext.leafColumns,
-      measureRowElementRef = _useTableContext.measureRowElementRef,
+      setMeasureRowElement = _useTableContext.setMeasureRowElement,
       isExpandTreeRows = _useTableContext.isExpandTreeRows,
       transitionData = _useTableContext.transitionData,
       getColgroupProps = _useTableContext.getColgroupProps,
@@ -122,7 +122,9 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         overflowX: canScroll ? 'scroll' : undefined
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", {
-      ref: measureRowElementRef,
+      ref: function ref(domElement) {
+        setMeasureRowElement(domElement);
+      },
       style: {
         height: 1,
         background: 'transparent'
@@ -187,7 +189,11 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }, getColgroupProps(col, idx)));
   })), /*#__PURE__*/React__default["default"].createElement("tbody", null, typeAssertion.isArrayNonEmpty(transitionData) ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, transitionData.map(function (row, index) {
     return /*#__PURE__*/React__default["default"].createElement(TableRow.TableRow, Object.assign({
-      ref: index === 0 ? measureRowElementRef : null,
+      ref: function ref(dom) {
+        if (index === 0) {
+          setMeasureRowElement(dom);
+        }
+      },
       // key={depth + index}
       key: row.id,
       // @ts-ignore

package/lib/cjs/TableSettingMenu.js

@@ -72,7 +72,9 @@ var TableSettingMenu = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       setHiddenColKeys = _ref.setHiddenColKeys,
       cacheHiddenColKeys = _ref.cacheHiddenColKeys,
       setCacheHiddenColKeys = _ref.setCacheHiddenColKeys,
-      onSetColKeysChange = _ref.onSetColKeysChange;
+      onSetColKeysChange = _ref.onSetColKeysChange,
+      _ref$checkDisabledCol = _ref.checkDisabledColKeys,
+      checkDisabledColKeys = _ref$checkDisabledCol === void 0 ? [] : _ref$checkDisabledCol;
   var i18n = core.useLocaleContext();
   var dropProps = useDragSorter.useDrop({
     draggable: true,
@@ -168,7 +170,8 @@ var TableSettingMenu = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       index: index,
       dropProps: dropProps,
       cacheHiddenColKeys: cacheHiddenColKeys,
-      setCacheHiddenColKeys: setCacheHiddenColKeys
+      setCacheHiddenColKeys: setCacheHiddenColKeys,
+      checkDisabled: checkDisabledColKeys.includes(col.dataKey)
     });
   }))));
 });
@@ -183,7 +186,8 @@ function TableSettingMenuItem(_ref2) {
       cacheHiddenColKeys = _ref2.cacheHiddenColKeys,
       setCacheHiddenColKeys = _ref2.setCacheHiddenColKeys,
       dropProps = _ref2.dropProps,
-      index = _ref2.index;
+      index = _ref2.index,
+      checkDisabled = _ref2.checkDisabled;
   var dataKey = column.dataKey,
       title = column.title;
 
@@ -203,6 +207,7 @@ function TableSettingMenuItem(_ref2) {
   }, getDragTriggerProps(), getDropTriggerProps()), /*#__PURE__*/React__default["default"].createElement("div", {
     className: prefixCls + "-item__wrap"
   }, /*#__PURE__*/React__default["default"].createElement(Checkbox.Checkbox, {
+    disabled: checkDisabled,
     checked: !cacheHiddenColKeys.includes(dataKey),
     onChange: function onChange(evt) {
       var shouldChecked = evt.target.checked;

package/lib/cjs/hooks/use-col-width.js

@@ -32,52 +32,62 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var useColWidth = function useColWidth(_ref) {
   var columns = _ref.columns,
       virtual = _ref.virtual;
-  var measureRowElementRef = React.useRef(null);
 
-  var _React$useState = React__default["default"].useState(function () {
+  var _React$useState = React__default["default"].useState(null),
+      measureRowElement = _React$useState[0],
+      setMeasureRowElement = _React$useState[1];
+
+  var _React$useState2 = React__default["default"].useState(function () {
     return index.getGroupItemWidth(columns);
   }),
-      colWidths = _React$useState[0],
-      setColWidths = _React$useState[1];
+      colWidths = _React$useState2[0],
+      setColWidths = _React$useState2[1];
 
-  console.error({
-    useColWidth: 1,
-    colWidths: colWidths
-  });
+  var getVirtualWidths = React.useCallback(function () {
+    if (!measureRowElement) {
+      return index.getGroupItemWidth(columns);
+    }
+    /** 虚拟滚动时，内容宽度不能用以前table自动渲染的方式获取，需要手动计算 */
+
+
+    var columnDefaultWidth = 200;
+    var containerWidth = measureRowElement.clientWidth;
+    var totalWidth = 0;
+    /** 虚拟滚动，需要根据collist的虚拟宽度来计算宽度 */
+
+    columns.forEach(function (columnItem) {
+      totalWidth += columnItem.width || columnDefaultWidth;
+    });
+
+    if (totalWidth < containerWidth) {
+      // 容器宽度大于设置的宽度总和时，col宽度等比分分配占满容器。
+      return columns.map(function (columnItem) {
+        return (columnItem.width || columnDefaultWidth) * containerWidth / totalWidth;
+      });
+    } else {
+      // 容器宽度小于设置的宽度总和时，col宽度等于设置/默认宽度。
+      return columns.map(function (columnItem) {
+        return columnItem.width || columnDefaultWidth;
+      });
+    }
+  }, [measureRowElement, columns]);
   useUpdateEffect.useUpdateEffect(function () {
-    setColWidths(index.getGroupItemWidth(columns));
-  }, [columns]);
+    if (virtual) {
+      // 虚拟滚动的计算需要根据容器来做分配，不能使用没有witdh默认设置为0的方式来做表格平均分配
+      setColWidths(getVirtualWidths());
+    } else {
+      setColWidths(index.getGroupItemWidth(columns));
+    }
+  }, [columns, getVirtualWidths, virtual]);
   /**
    * 根据实际内容区（table 的第一行）渲染，再次精确收集并设置每列宽度
    */
 
   React__default["default"].useEffect(function () {
-    var measureRowElement = measureRowElementRef.current;
-
     if (measureRowElement) {
       var _resizeObserver = new ResizeObserver(function () {
         if (virtual) {
-          /** 虚拟滚动时，内容宽度不能用以前table自动渲染的方式获取，需要手动计算 */
-          var columnDefaultWidth = 200;
-          var containerWidth = measureRowElement.clientWidth;
-          var totalWidth = 0;
-          /** 虚拟滚动，需要根据collist的虚拟宽度来计算宽度 */
-
-          columns.forEach(function (columnItem) {
-            totalWidth += columnItem.width || columnDefaultWidth;
-          });
-
-          if (totalWidth < containerWidth) {
-            // 容器宽度大于设置的宽度总和时，col宽度等比分分配占满容器。
-            setColWidths(columns.map(function (columnItem) {
-              return (columnItem.width || columnDefaultWidth) * containerWidth / totalWidth;
-            }));
-          } else {
-            // 容器宽度小于设置的宽度总和时，col宽度等于设置/默认宽度。
-            setColWidths(columns.map(function (columnItem) {
-              return columnItem.width || columnDefaultWidth;
-            }));
-          }
+          setColWidths(getVirtualWidths());
         } else {
           if (measureRowElement.childNodes) {
             var _realColumnsWidth = Array.from(measureRowElement.childNodes).map(function (node) {
@@ -96,12 +106,12 @@ var useColWidth = function useColWidth(_ref) {
       _resizeObserver.observe(measureRowElement);
     }
 
-    return function () {};
-  }, []);
+    return function () {}; // 测量元素在内容列为空时会是空，切换会使测量元素变化，导致后续的resize时间无法响应,此处测量元素变化时需要重新绑定
+  }, [measureRowElement, virtual]);
 
-  var _React$useState2 = React__default["default"].useState(null),
-      headerTableElement = _React$useState2[0],
-      setHeaderTableElement = _React$useState2[1];
+  var _React$useState3 = React__default["default"].useState(null),
+      headerTableElement = _React$useState3[0],
+      setHeaderTableElement = _React$useState3[1];
   /**
    *  控制列最小可调整宽度
    */
@@ -155,7 +165,8 @@ var useColWidth = function useColWidth(_ref) {
     };
   }, [colWidths]);
   return {
-    measureRowElementRef: measureRowElementRef,
+    measureRowElement: measureRowElement,
+    setMeasureRowElement: setMeasureRowElement,
     onColumnResizable: onColumnResizable,
     getColgroupProps: getColgroupProps,
     setHeaderTableElement: setHeaderTableElement,

package/lib/cjs/styles/index.scss.js

@@ -12,7 +12,7 @@
 Object.defineProperty(exports, '__esModule', {
   value: true
 });
-var css_248z = ".hi-v4-table {-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 14px;position: relative; }.hi-v4-table table {width: 100%;text-align: left;background-color: var(--hi-v4-color-static-white, #fff);border-radius: 2px 2px 0 0;border-spacing: 0;border-collapse: separate;display: table;table-layout: fixed; }.hi-v4-table__wrapper {position: relative;z-index: 0; }.hi-v4-table__switcher.hi-v4-icon-button {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table__switcher--expanded.hi-v4-icon-button {color: var(--hi-v4-color-primary-400, var(--hi-v4-color-brandblue-400, #4a9eff)); }.hi-v4-table--size-md table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-md table thead > tr > th {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-sm table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-sm table thead > tr > th {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-lg table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--size-lg table thead > tr > th {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--bordered table thead > tr > th {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered table td {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-header {border-top: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-body {border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--sticky {position: -webkit-sticky;position: sticky;top: 0; }.hi-v4-table--virtual {width: 100%;overflow: hidden; }.hi-v4-table--virtual .hi-v4-table-cell {-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-header {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;overflow: hidden; }.hi-v4-table-header__resizable {position: relative;background-clip: padding-box; }.hi-v4-table-header__resizable-handle {-webkit-box-sizing: content-box;box-sizing: content-box;position: absolute;width: 2px;height: 100%;bottom: 0;right: 0;border-left: 2px solid var(--hi-v4-color-gray-50, #f5f7fa);cursor: col-resize;z-index: 1; }.hi-v4-table-header__resizable:hover .hi-v4-table-header__resizable-handle {background-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active[data-sticky] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-row--hover:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--striped > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--expanded > .hi-v4-table-cell {color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-table-row--error > .hi-v4-table-cell {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-table-row--highlight > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--dragging > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--drag-top > .hi-v4-table-cell {border-top: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--drag-bottom > .hi-v4-table-cell {border-bottom: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--avg > .hi-v4-table-cell, .hi-v4-table-row--total > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--avg:hover > .hi-v4-table-cell, .hi-v4-table-row--total:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--virtual {display: -webkit-box;display: -ms-flexbox;display: flex; }.hi-v4-table-header .hi-v4-table-header-col, .hi-v4-table-header .hi-v4-table-col {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-body .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-body .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-header .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-body {position: relative;overflow: auto; }.hi-v4-table-header-cell {color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-medium, 500);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-table-header-cell.hi-v4-table__embed-col, .hi-v4-table-header-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell {word-break: break-word;border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-700, #1f2733);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-cell__indent {display: inline-block;width: 14px;height: 100%;margin-right: var(--hi-v4-spacing-1, 2px); }.hi-v4-table-cell__switcher.hi-v4-icon-button {margin-right: var(--hi-v4-spacing-1, 2px);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-cell.hi-v4-table__embed-col, .hi-v4-table-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell.hi-v4-table-cell__col--highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-cell.hi-v4-table-cell__col--hovered-highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-freeze-shadow {position: absolute;top: 0;bottom: 0;z-index: 20;pointer-events: none;overflow: hidden;height: 100%;width: 200px; }.hi-v4-table-freeze-shadow--left {margin-right: 10px;left: 0;-webkit-box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-freeze-shadow--right {margin-left: 10px;right: 0;-webkit-box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-header-filter-dropdown__trigger.hi-v4-icon-button {margin-left: 4px; }.hi-v4-table-header-filter-dropdown__content {width: 124px;padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-4, 8px);font-weight: var(--hi-v4-text-weight-normal, 400); }.hi-v4-table-header-filter-dropdown__item {margin-top: var(--hi-v4-spacing-4, 8px);padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);border-radius: var(--hi-v4-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-table-header-filter-dropdown__item:first-child {margin-top: 0; }.hi-v4-table-header-filter-dropdown__item:hover {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-filter-dropdown__item--active {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-dropdown__item--active:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-sorter {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 20px;margin-top: 2px;margin-left: 6px; }.hi-v4-table-header-filter-sorter__icon {display: inline-block;height: 8px;cursor: pointer;overflow: hidden;font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-header-filter-sorter__icon svg {position: relative;top: -5px; }.hi-v4-table-header-filter-sorter__icon--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-filter-custom__trigger {margin-left: 6px;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer; }.hi-v4-table-header-filter-custom__content {padding: 12px 8px; }.hi-v4-table-embed-row {position: relative;z-index: 0; }.hi-v4-table-embed-row > td {background-color: var(--hi-v4-color-gray-200, #ebedf0);padding: var(--hi-v4-spacing-10, 20px); }.hi-v4-table-setting {position: absolute;height: 100%;z-index: 11;-webkit-box-sizing: border-box;box-sizing: border-box;right: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);border-bottom: none;border-top: none;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer;font-size: var(--hi-v4-text-size-sm, 0.75rem);width: 18px;background: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-table-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-setting-item--dragging .hi-v4-table-setting-item__wrap {opacity: 0.6; }.hi-v4-table-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-table-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-table-setting-item::before, .hi-v4-table-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-table-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-table-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-table-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-table-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }.hi-v4-table-pagination {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;row-gap: 8px;padding: var(--hi-v4-spacing-6, 12px) 0;background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-pagination--placement-left {-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start; }.hi-v4-table-pagination--placement-right {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-pagination--placement-middle {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-table-empty-content td {text-align: center;padding: var(--hi-v4-spacing-12, 24px) 0; }.hi-v4-table--bordered .hi-v4-table-empty-content td {border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }";
+var css_248z = ".hi-v4-table {-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 14px;position: relative; }.hi-v4-table table {width: 100%;text-align: left;background-color: var(--hi-v4-color-static-white, #fff);border-radius: 2px 2px 0 0;border-spacing: 0;border-collapse: separate;display: table;table-layout: fixed; }.hi-v4-table__wrapper {position: relative;z-index: 0; }.hi-v4-table__switcher.hi-v4-icon-button {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table__switcher--expanded.hi-v4-icon-button {color: var(--hi-v4-color-primary-400, var(--hi-v4-color-brandblue-400, #4a9eff)); }.hi-v4-table--size-md table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-md table thead > tr > th {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-sm table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-sm table thead > tr > th {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-lg table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--size-lg table thead > tr > th {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--bordered table thead > tr > th {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered table td {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-header {border-top: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-body {border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--sticky {position: -webkit-sticky;position: sticky;top: 0; }.hi-v4-table--virtual {width: 100%;overflow: hidden; }.hi-v4-table--virtual .hi-v4-table-cell {-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-header {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;overflow: hidden; }.hi-v4-table-header__resizable {position: relative;background-clip: padding-box; }.hi-v4-table-header__resizable-handle {-webkit-box-sizing: content-box;box-sizing: content-box;position: absolute;width: 2px;height: 100%;bottom: 0;right: 0;border-left: 2px solid var(--hi-v4-color-gray-50, #f5f7fa);cursor: col-resize;z-index: 1; }.hi-v4-table-header__resizable:hover .hi-v4-table-header__resizable-handle {background-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active[data-sticky] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-row--hover:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--striped > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--expanded > .hi-v4-table-cell {color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-table-row--error > .hi-v4-table-cell {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-table-row--highlight > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--dragging > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--drag-top > .hi-v4-table-cell {border-top: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--drag-bottom > .hi-v4-table-cell {border-bottom: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--avg > .hi-v4-table-cell, .hi-v4-table-row--total > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--avg:hover > .hi-v4-table-cell, .hi-v4-table-row--total:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--virtual {display: -webkit-box;display: -ms-flexbox;display: flex; }.hi-v4-table-header .hi-v4-table-header-col, .hi-v4-table-header .hi-v4-table-col {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-body .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-body .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-header .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-body {position: relative;overflow: auto; }.hi-v4-table-header-cell {color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-medium, 500);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-table-header-cell.hi-v4-table__embed-col, .hi-v4-table-header-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell {word-break: break-word;border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-700, #1f2733);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-cell__indent {display: inline-block;width: 14px;height: 100%;margin-right: var(--hi-v4-spacing-1, 2px); }.hi-v4-table-cell__switcher.hi-v4-icon-button {margin-right: var(--hi-v4-spacing-1, 2px);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-cell.hi-v4-table__embed-col, .hi-v4-table-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell.hi-v4-table-cell__col--highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-cell.hi-v4-table-cell__col--hovered-highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-freeze-shadow {position: absolute;top: 0;bottom: 0;z-index: 20;pointer-events: none;overflow: hidden;height: 100%;width: 200px; }.hi-v4-table-freeze-shadow--left {margin-right: 10px;left: 0;-webkit-box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-freeze-shadow--right {margin-left: 10px;right: 0;-webkit-box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-header-filter-dropdown__trigger.hi-v4-icon-button {margin-left: 4px; }.hi-v4-table-header-filter-dropdown__content {width: 124px;padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-4, 8px);font-weight: var(--hi-v4-text-weight-normal, 400); }.hi-v4-table-header-filter-dropdown__item {margin-top: var(--hi-v4-spacing-4, 8px);padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);border-radius: var(--hi-v4-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-table-header-filter-dropdown__item:first-child {margin-top: 0; }.hi-v4-table-header-filter-dropdown__item:hover {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-filter-dropdown__item--active {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-dropdown__item--active:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-sorter {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 20px;vertical-align: middle;margin-left: 6px; }.hi-v4-table-header-filter-sorter__icon {display: inline-block;height: 8px;cursor: pointer;overflow: hidden;font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-header-filter-sorter__icon svg {position: relative;top: -5px; }.hi-v4-table-header-filter-sorter__icon--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-filter-custom__trigger {margin-left: 6px;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer; }.hi-v4-table-header-filter-custom__content {padding: 12px 8px; }.hi-v4-table-embed-row {position: relative;z-index: 0; }.hi-v4-table-embed-row > td {background-color: var(--hi-v4-color-gray-200, #ebedf0);padding: var(--hi-v4-spacing-10, 20px); }.hi-v4-table-setting {position: absolute;height: 100%;z-index: 11;-webkit-box-sizing: border-box;box-sizing: border-box;right: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);border-bottom: none;border-top: none;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer;font-size: var(--hi-v4-text-size-sm, 0.75rem);width: 18px;background: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-table-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-setting-item--dragging .hi-v4-table-setting-item__wrap {opacity: 0.6; }.hi-v4-table-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-table-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-table-setting-item::before, .hi-v4-table-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-table-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-table-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-table-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-table-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }.hi-v4-table-pagination {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;row-gap: 8px;padding: var(--hi-v4-spacing-6, 12px) 0;background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-pagination--placement-left {-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start; }.hi-v4-table-pagination--placement-right {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-pagination--placement-middle {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-table-empty-content td {text-align: center;padding: var(--hi-v4-spacing-12, 24px) 0; }.hi-v4-table--bordered .hi-v4-table-empty-content td {border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }";
 
 var __styleInject__ = require('inject-head-style')["default"];
 

package/lib/cjs/use-table.js

@@ -215,7 +215,7 @@ var useTable = function useTable(_a) {
     resizable: resizable,
     virtual: virtual
   }),
-      measureRowElementRef = _useColWidth.measureRowElementRef,
+      setMeasureRowElement = _useColWidth.setMeasureRowElement,
       getColgroupProps = _useColWidth.getColgroupProps,
       onColumnResizable = _useColWidth.onColumnResizable,
       colWidths = _useColWidth.colWidths; // ************************ 列冻结 ************************ //
@@ -565,7 +565,7 @@ var useTable = function useTable(_a) {
     // 行多选
     rowSelection: rowSelection,
     cacheData: cacheData,
-    measureRowElementRef: measureRowElementRef,
+    setMeasureRowElement: setMeasureRowElement,
     leafColumns: leafColumns,
     // ui
     // 有表头分组那么也要 bordered

package/lib/esm/Table.js

@@ -61,6 +61,7 @@ var Table = /*#__PURE__*/forwardRef(function (_a, ref) {
       onHiddenColKeysChange = _a.onHiddenColKeysChange,
       sortedColKeysPropBeforeVerify = _a.sortedColKeys,
       onSortedColKeysChange = _a.onSortedColKeysChange,
+      checkDisabledColKeys = _a.checkDisabledColKeys,
       onSetColKeysChange = _a.onSetColKeysChange,
       rowSelection = _a.rowSelection,
       _a$fieldKey = _a.fieldKey,
@@ -69,7 +70,7 @@ var Table = /*#__PURE__*/forwardRef(function (_a, ref) {
       _a$data = _a.data,
       data = _a$data === void 0 ? DEFAULT_DATA : _a$data,
       virtual = _a.virtual,
-      rest = __rest(_a, ["prefixCls", "standard", "loading", "dataSource", "pagination", "uniqueId", "columns", "hiddenColKeys", "onHiddenColKeysChange", "sortedColKeys", "onSortedColKeysChange", "onSetColKeysChange", "rowSelection", "fieldKey", "extra", "data", "virtual"]);
+      rest = __rest(_a, ["prefixCls", "standard", "loading", "dataSource", "pagination", "uniqueId", "columns", "hiddenColKeys", "onHiddenColKeysChange", "sortedColKeys", "onSortedColKeysChange", "checkDisabledColKeys", "onSetColKeysChange", "rowSelection", "fieldKey", "extra", "data", "virtual"]);
 
   var tableProps = withDefaultProps(rest, standard ? STANDARD_PRESET : undefined);
 
@@ -294,6 +295,7 @@ var Table = /*#__PURE__*/forwardRef(function (_a, ref) {
         setHiddenColKeys: setHiddenColKeys,
         cacheHiddenColKeys: cacheHiddenColKeys,
         setCacheHiddenColKeys: setCacheHiddenColKeys,
+        checkDisabledColKeys: checkDisabledColKeys,
         onSetColKeysChange: onSetColKeysChange
       }) : null,
       footer: dataSource || !hiddenPagination ? /*#__PURE__*/React__default.createElement(Pagination, Object.assign({

package/lib/esm/TableBody.js

@@ -32,7 +32,7 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _useTableContext = useTableContext(),
       columns = _useTableContext.columns,
       leafColumns = _useTableContext.leafColumns,
-      measureRowElementRef = _useTableContext.measureRowElementRef,
+      setMeasureRowElement = _useTableContext.setMeasureRowElement,
       isExpandTreeRows = _useTableContext.isExpandTreeRows,
       transitionData = _useTableContext.transitionData,
       getColgroupProps = _useTableContext.getColgroupProps,
@@ -97,7 +97,9 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
         overflowX: canScroll ? 'scroll' : undefined
       }
     }, /*#__PURE__*/React__default.createElement("div", {
-      ref: measureRowElementRef,
+      ref: function ref(domElement) {
+        setMeasureRowElement(domElement);
+      },
       style: {
         height: 1,
         background: 'transparent'
@@ -162,7 +164,11 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }, getColgroupProps(col, idx)));
   })), /*#__PURE__*/React__default.createElement("tbody", null, isArrayNonEmpty(transitionData) ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, transitionData.map(function (row, index) {
     return /*#__PURE__*/React__default.createElement(TableRow, Object.assign({
-      ref: index === 0 ? measureRowElementRef : null,
+      ref: function ref(dom) {
+        if (index === 0) {
+          setMeasureRowElement(dom);
+        }
+      },
       // key={depth + index}
       key: row.id,
       // @ts-ignore

package/lib/esm/TableSettingMenu.js

@@ -40,7 +40,9 @@ var TableSettingMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
       setHiddenColKeys = _ref.setHiddenColKeys,
       cacheHiddenColKeys = _ref.cacheHiddenColKeys,
       setCacheHiddenColKeys = _ref.setCacheHiddenColKeys,
-      onSetColKeysChange = _ref.onSetColKeysChange;
+      onSetColKeysChange = _ref.onSetColKeysChange,
+      _ref$checkDisabledCol = _ref.checkDisabledColKeys,
+      checkDisabledColKeys = _ref$checkDisabledCol === void 0 ? [] : _ref$checkDisabledCol;
   var i18n = useLocaleContext();
   var dropProps = useDrop({
     draggable: true,
@@ -136,7 +138,8 @@ var TableSettingMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
       index: index,
       dropProps: dropProps,
       cacheHiddenColKeys: cacheHiddenColKeys,
-      setCacheHiddenColKeys: setCacheHiddenColKeys
+      setCacheHiddenColKeys: setCacheHiddenColKeys,
+      checkDisabled: checkDisabledColKeys.includes(col.dataKey)
     });
   }))));
 });
@@ -151,7 +154,8 @@ function TableSettingMenuItem(_ref2) {
       cacheHiddenColKeys = _ref2.cacheHiddenColKeys,
       setCacheHiddenColKeys = _ref2.setCacheHiddenColKeys,
       dropProps = _ref2.dropProps,
-      index = _ref2.index;
+      index = _ref2.index,
+      checkDisabled = _ref2.checkDisabled;
   var dataKey = column.dataKey,
       title = column.title;
 
@@ -171,6 +175,7 @@ function TableSettingMenuItem(_ref2) {
   }, getDragTriggerProps(), getDropTriggerProps()), /*#__PURE__*/React__default.createElement("div", {
     className: prefixCls + "-item__wrap"
   }, /*#__PURE__*/React__default.createElement(Checkbox, {
+    disabled: checkDisabled,
     checked: !cacheHiddenColKeys.includes(dataKey),
     onChange: function onChange(evt) {
       var shouldChecked = evt.target.checked;

package/lib/esm/hooks/use-col-width.js

@@ -7,59 +7,69 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import React__default, { useRef } from 'react';
+import React__default, { useCallback } from 'react';
 import { getGroupItemWidth } from '../utils/index.js';
 import { useUpdateEffect } from '@hi-ui/use-update-effect';
 
 var useColWidth = function useColWidth(_ref) {
   var columns = _ref.columns,
       virtual = _ref.virtual;
-  var measureRowElementRef = useRef(null);
 
-  var _React$useState = React__default.useState(function () {
+  var _React$useState = React__default.useState(null),
+      measureRowElement = _React$useState[0],
+      setMeasureRowElement = _React$useState[1];
+
+  var _React$useState2 = React__default.useState(function () {
     return getGroupItemWidth(columns);
   }),
-      colWidths = _React$useState[0],
-      setColWidths = _React$useState[1];
+      colWidths = _React$useState2[0],
+      setColWidths = _React$useState2[1];
 
-  console.error({
-    useColWidth: 1,
-    colWidths: colWidths
-  });
+  var getVirtualWidths = useCallback(function () {
+    if (!measureRowElement) {
+      return getGroupItemWidth(columns);
+    }
+    /** 虚拟滚动时，内容宽度不能用以前table自动渲染的方式获取，需要手动计算 */
+
+
+    var columnDefaultWidth = 200;
+    var containerWidth = measureRowElement.clientWidth;
+    var totalWidth = 0;
+    /** 虚拟滚动，需要根据collist的虚拟宽度来计算宽度 */
+
+    columns.forEach(function (columnItem) {
+      totalWidth += columnItem.width || columnDefaultWidth;
+    });
+
+    if (totalWidth < containerWidth) {
+      // 容器宽度大于设置的宽度总和时，col宽度等比分分配占满容器。
+      return columns.map(function (columnItem) {
+        return (columnItem.width || columnDefaultWidth) * containerWidth / totalWidth;
+      });
+    } else {
+      // 容器宽度小于设置的宽度总和时，col宽度等于设置/默认宽度。
+      return columns.map(function (columnItem) {
+        return columnItem.width || columnDefaultWidth;
+      });
+    }
+  }, [measureRowElement, columns]);
   useUpdateEffect(function () {
-    setColWidths(getGroupItemWidth(columns));
-  }, [columns]);
+    if (virtual) {
+      // 虚拟滚动的计算需要根据容器来做分配，不能使用没有witdh默认设置为0的方式来做表格平均分配
+      setColWidths(getVirtualWidths());
+    } else {
+      setColWidths(getGroupItemWidth(columns));
+    }
+  }, [columns, getVirtualWidths, virtual]);
   /**
    * 根据实际内容区（table 的第一行）渲染，再次精确收集并设置每列宽度
    */
 
   React__default.useEffect(function () {
-    var measureRowElement = measureRowElementRef.current;
-
     if (measureRowElement) {
       var _resizeObserver = new ResizeObserver(function () {
         if (virtual) {
-          /** 虚拟滚动时，内容宽度不能用以前table自动渲染的方式获取，需要手动计算 */
-          var columnDefaultWidth = 200;
-          var containerWidth = measureRowElement.clientWidth;
-          var totalWidth = 0;
-          /** 虚拟滚动，需要根据collist的虚拟宽度来计算宽度 */
-
-          columns.forEach(function (columnItem) {
-            totalWidth += columnItem.width || columnDefaultWidth;
-          });
-
-          if (totalWidth < containerWidth) {
-            // 容器宽度大于设置的宽度总和时，col宽度等比分分配占满容器。
-            setColWidths(columns.map(function (columnItem) {
-              return (columnItem.width || columnDefaultWidth) * containerWidth / totalWidth;
-            }));
-          } else {
-            // 容器宽度小于设置的宽度总和时，col宽度等于设置/默认宽度。
-            setColWidths(columns.map(function (columnItem) {
-              return columnItem.width || columnDefaultWidth;
-            }));
-          }
+          setColWidths(getVirtualWidths());
         } else {
           if (measureRowElement.childNodes) {
             var _realColumnsWidth = Array.from(measureRowElement.childNodes).map(function (node) {
@@ -78,12 +88,12 @@ var useColWidth = function useColWidth(_ref) {
       _resizeObserver.observe(measureRowElement);
     }
 
-    return function () {};
-  }, []);
+    return function () {}; // 测量元素在内容列为空时会是空，切换会使测量元素变化，导致后续的resize时间无法响应,此处测量元素变化时需要重新绑定
+  }, [measureRowElement, virtual]);
 
-  var _React$useState2 = React__default.useState(null),
-      headerTableElement = _React$useState2[0],
-      setHeaderTableElement = _React$useState2[1];
+  var _React$useState3 = React__default.useState(null),
+      headerTableElement = _React$useState3[0],
+      setHeaderTableElement = _React$useState3[1];
   /**
    *  控制列最小可调整宽度
    */
@@ -137,7 +147,8 @@ var useColWidth = function useColWidth(_ref) {
     };
   }, [colWidths]);
   return {
-    measureRowElementRef: measureRowElementRef,
+    measureRowElement: measureRowElement,
+    setMeasureRowElement: setMeasureRowElement,
     onColumnResizable: onColumnResizable,
     getColgroupProps: getColgroupProps,
     setHeaderTableElement: setHeaderTableElement,

package/lib/esm/styles/index.scss.js

@@ -8,7 +8,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import __styleInject__ from 'inject-head-style';
-var css_248z = ".hi-v4-table {-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 14px;position: relative; }.hi-v4-table table {width: 100%;text-align: left;background-color: var(--hi-v4-color-static-white, #fff);border-radius: 2px 2px 0 0;border-spacing: 0;border-collapse: separate;display: table;table-layout: fixed; }.hi-v4-table__wrapper {position: relative;z-index: 0; }.hi-v4-table__switcher.hi-v4-icon-button {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table__switcher--expanded.hi-v4-icon-button {color: var(--hi-v4-color-primary-400, var(--hi-v4-color-brandblue-400, #4a9eff)); }.hi-v4-table--size-md table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-md table thead > tr > th {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-sm table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-sm table thead > tr > th {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-lg table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--size-lg table thead > tr > th {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--bordered table thead > tr > th {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered table td {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-header {border-top: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-body {border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--sticky {position: -webkit-sticky;position: sticky;top: 0; }.hi-v4-table--virtual {width: 100%;overflow: hidden; }.hi-v4-table--virtual .hi-v4-table-cell {-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-header {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;overflow: hidden; }.hi-v4-table-header__resizable {position: relative;background-clip: padding-box; }.hi-v4-table-header__resizable-handle {-webkit-box-sizing: content-box;box-sizing: content-box;position: absolute;width: 2px;height: 100%;bottom: 0;right: 0;border-left: 2px solid var(--hi-v4-color-gray-50, #f5f7fa);cursor: col-resize;z-index: 1; }.hi-v4-table-header__resizable:hover .hi-v4-table-header__resizable-handle {background-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active[data-sticky] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-row--hover:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--striped > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--expanded > .hi-v4-table-cell {color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-table-row--error > .hi-v4-table-cell {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-table-row--highlight > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--dragging > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--drag-top > .hi-v4-table-cell {border-top: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--drag-bottom > .hi-v4-table-cell {border-bottom: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--avg > .hi-v4-table-cell, .hi-v4-table-row--total > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--avg:hover > .hi-v4-table-cell, .hi-v4-table-row--total:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--virtual {display: -webkit-box;display: -ms-flexbox;display: flex; }.hi-v4-table-header .hi-v4-table-header-col, .hi-v4-table-header .hi-v4-table-col {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-body .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-body .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-header .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-body {position: relative;overflow: auto; }.hi-v4-table-header-cell {color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-medium, 500);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-table-header-cell.hi-v4-table__embed-col, .hi-v4-table-header-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell {word-break: break-word;border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-700, #1f2733);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-cell__indent {display: inline-block;width: 14px;height: 100%;margin-right: var(--hi-v4-spacing-1, 2px); }.hi-v4-table-cell__switcher.hi-v4-icon-button {margin-right: var(--hi-v4-spacing-1, 2px);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-cell.hi-v4-table__embed-col, .hi-v4-table-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell.hi-v4-table-cell__col--highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-cell.hi-v4-table-cell__col--hovered-highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-freeze-shadow {position: absolute;top: 0;bottom: 0;z-index: 20;pointer-events: none;overflow: hidden;height: 100%;width: 200px; }.hi-v4-table-freeze-shadow--left {margin-right: 10px;left: 0;-webkit-box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-freeze-shadow--right {margin-left: 10px;right: 0;-webkit-box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-header-filter-dropdown__trigger.hi-v4-icon-button {margin-left: 4px; }.hi-v4-table-header-filter-dropdown__content {width: 124px;padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-4, 8px);font-weight: var(--hi-v4-text-weight-normal, 400); }.hi-v4-table-header-filter-dropdown__item {margin-top: var(--hi-v4-spacing-4, 8px);padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);border-radius: var(--hi-v4-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-table-header-filter-dropdown__item:first-child {margin-top: 0; }.hi-v4-table-header-filter-dropdown__item:hover {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-filter-dropdown__item--active {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-dropdown__item--active:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-sorter {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 20px;margin-top: 2px;margin-left: 6px; }.hi-v4-table-header-filter-sorter__icon {display: inline-block;height: 8px;cursor: pointer;overflow: hidden;font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-header-filter-sorter__icon svg {position: relative;top: -5px; }.hi-v4-table-header-filter-sorter__icon--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-filter-custom__trigger {margin-left: 6px;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer; }.hi-v4-table-header-filter-custom__content {padding: 12px 8px; }.hi-v4-table-embed-row {position: relative;z-index: 0; }.hi-v4-table-embed-row > td {background-color: var(--hi-v4-color-gray-200, #ebedf0);padding: var(--hi-v4-spacing-10, 20px); }.hi-v4-table-setting {position: absolute;height: 100%;z-index: 11;-webkit-box-sizing: border-box;box-sizing: border-box;right: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);border-bottom: none;border-top: none;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer;font-size: var(--hi-v4-text-size-sm, 0.75rem);width: 18px;background: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-table-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-setting-item--dragging .hi-v4-table-setting-item__wrap {opacity: 0.6; }.hi-v4-table-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-table-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-table-setting-item::before, .hi-v4-table-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-table-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-table-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-table-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-table-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }.hi-v4-table-pagination {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;row-gap: 8px;padding: var(--hi-v4-spacing-6, 12px) 0;background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-pagination--placement-left {-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start; }.hi-v4-table-pagination--placement-right {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-pagination--placement-middle {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-table-empty-content td {text-align: center;padding: var(--hi-v4-spacing-12, 24px) 0; }.hi-v4-table--bordered .hi-v4-table-empty-content td {border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }";
+var css_248z = ".hi-v4-table {-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 14px;position: relative; }.hi-v4-table table {width: 100%;text-align: left;background-color: var(--hi-v4-color-static-white, #fff);border-radius: 2px 2px 0 0;border-spacing: 0;border-collapse: separate;display: table;table-layout: fixed; }.hi-v4-table__wrapper {position: relative;z-index: 0; }.hi-v4-table__switcher.hi-v4-icon-button {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table__switcher--expanded.hi-v4-icon-button {color: var(--hi-v4-color-primary-400, var(--hi-v4-color-brandblue-400, #4a9eff)); }.hi-v4-table--size-md table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-md table thead > tr > th {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-sm table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-sm table thead > tr > th {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-lg table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--size-lg table thead > tr > th {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--bordered table thead > tr > th {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered table td {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-header {border-top: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-body {border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--sticky {position: -webkit-sticky;position: sticky;top: 0; }.hi-v4-table--virtual {width: 100%;overflow: hidden; }.hi-v4-table--virtual .hi-v4-table-cell {-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-header {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;overflow: hidden; }.hi-v4-table-header__resizable {position: relative;background-clip: padding-box; }.hi-v4-table-header__resizable-handle {-webkit-box-sizing: content-box;box-sizing: content-box;position: absolute;width: 2px;height: 100%;bottom: 0;right: 0;border-left: 2px solid var(--hi-v4-color-gray-50, #f5f7fa);cursor: col-resize;z-index: 1; }.hi-v4-table-header__resizable:hover .hi-v4-table-header__resizable-handle {background-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active[data-sticky] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-row--hover:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--striped > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--expanded > .hi-v4-table-cell {color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-table-row--error > .hi-v4-table-cell {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-table-row--highlight > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--dragging > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--drag-top > .hi-v4-table-cell {border-top: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--drag-bottom > .hi-v4-table-cell {border-bottom: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--avg > .hi-v4-table-cell, .hi-v4-table-row--total > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--avg:hover > .hi-v4-table-cell, .hi-v4-table-row--total:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--virtual {display: -webkit-box;display: -ms-flexbox;display: flex; }.hi-v4-table-header .hi-v4-table-header-col, .hi-v4-table-header .hi-v4-table-col {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-body .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-body .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-header .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-body {position: relative;overflow: auto; }.hi-v4-table-header-cell {color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-medium, 500);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-table-header-cell.hi-v4-table__embed-col, .hi-v4-table-header-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell {word-break: break-word;border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-700, #1f2733);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-cell__indent {display: inline-block;width: 14px;height: 100%;margin-right: var(--hi-v4-spacing-1, 2px); }.hi-v4-table-cell__switcher.hi-v4-icon-button {margin-right: var(--hi-v4-spacing-1, 2px);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-cell.hi-v4-table__embed-col, .hi-v4-table-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell.hi-v4-table-cell__col--highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-cell.hi-v4-table-cell__col--hovered-highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-freeze-shadow {position: absolute;top: 0;bottom: 0;z-index: 20;pointer-events: none;overflow: hidden;height: 100%;width: 200px; }.hi-v4-table-freeze-shadow--left {margin-right: 10px;left: 0;-webkit-box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-freeze-shadow--right {margin-left: 10px;right: 0;-webkit-box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-header-filter-dropdown__trigger.hi-v4-icon-button {margin-left: 4px; }.hi-v4-table-header-filter-dropdown__content {width: 124px;padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-4, 8px);font-weight: var(--hi-v4-text-weight-normal, 400); }.hi-v4-table-header-filter-dropdown__item {margin-top: var(--hi-v4-spacing-4, 8px);padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);border-radius: var(--hi-v4-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-table-header-filter-dropdown__item:first-child {margin-top: 0; }.hi-v4-table-header-filter-dropdown__item:hover {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-filter-dropdown__item--active {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-dropdown__item--active:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-sorter {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 20px;vertical-align: middle;margin-left: 6px; }.hi-v4-table-header-filter-sorter__icon {display: inline-block;height: 8px;cursor: pointer;overflow: hidden;font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-header-filter-sorter__icon svg {position: relative;top: -5px; }.hi-v4-table-header-filter-sorter__icon--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-filter-custom__trigger {margin-left: 6px;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer; }.hi-v4-table-header-filter-custom__content {padding: 12px 8px; }.hi-v4-table-embed-row {position: relative;z-index: 0; }.hi-v4-table-embed-row > td {background-color: var(--hi-v4-color-gray-200, #ebedf0);padding: var(--hi-v4-spacing-10, 20px); }.hi-v4-table-setting {position: absolute;height: 100%;z-index: 11;-webkit-box-sizing: border-box;box-sizing: border-box;right: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);border-bottom: none;border-top: none;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer;font-size: var(--hi-v4-text-size-sm, 0.75rem);width: 18px;background: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-table-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-setting-item--dragging .hi-v4-table-setting-item__wrap {opacity: 0.6; }.hi-v4-table-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-table-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-table-setting-item::before, .hi-v4-table-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-table-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-table-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-table-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-table-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }.hi-v4-table-pagination {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;row-gap: 8px;padding: var(--hi-v4-spacing-6, 12px) 0;background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-pagination--placement-left {-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start; }.hi-v4-table-pagination--placement-right {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-pagination--placement-middle {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-table-empty-content td {text-align: center;padding: var(--hi-v4-spacing-12, 24px) 0; }.hi-v4-table--bordered .hi-v4-table-empty-content td {border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }";
 
 __styleInject__(css_248z);
 

package/lib/esm/use-table.js

@@ -183,7 +183,7 @@ var useTable = function useTable(_a) {
     resizable: resizable,
     virtual: virtual
   }),
-      measureRowElementRef = _useColWidth.measureRowElementRef,
+      setMeasureRowElement = _useColWidth.setMeasureRowElement,
       getColgroupProps = _useColWidth.getColgroupProps,
       onColumnResizable = _useColWidth.onColumnResizable,
       colWidths = _useColWidth.colWidths; // ************************ 列冻结 ************************ //
@@ -533,7 +533,7 @@ var useTable = function useTable(_a) {
     // 行多选
     rowSelection: rowSelection,
     cacheData: cacheData,
-    measureRowElementRef: measureRowElementRef,
+    setMeasureRowElement: setMeasureRowElement,
     leafColumns: leafColumns,
     // ui
     // 有表头分组那么也要 bordered

package/lib/types/SettingDrawer.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { UseTableProps } from './use-table';
+/**
+ * 表头右侧高级设置菜单（抽屉式）
+ */
+export declare const TableSettingMenuDrawer: React.ForwardRefExoticComponent<TableColumnMenuProps & React.RefAttributes<HTMLDivElement | null>>;
+export interface TableColumnMenuProps extends UseTableProps {
+    prefixCls?: string;
+    visible?: boolean;
+    onClose?: () => void;
+    checkDisabledColKeys?: string[];
+    onSetColKeysChange?: (sortedColKeys: string[], hiddenColKeys: string[]) => void;
+    hiddenColKeys?: string[];
+    onHiddenColKeysChange?: (hiddenColKeys: string[]) => void;
+    sortedColKeys?: string[];
+    onSortedColKeysChange?: (sortedColKeys: string[]) => void;
+}

package/lib/types/Table.d.ts

@@ -35,6 +35,10 @@ export interface TableProps extends BaseTableProps {
      *  列排序设置时回调
      */
     onSortedColKeysChange?: (sortedColKeys: string[]) => void;
+    /**
+     * checkbox 被禁用的列
+     */
+    checkDisabledColKeys?: string[];
     /**
      *  列设置时回调
      */

package/lib/types/TableSettingMenu.d.ts

@@ -8,5 +8,6 @@ import { UseColHiddenReturn } from './hooks/use-col-hidden';
 export declare const TableSettingMenu: React.ForwardRefExoticComponent<TableColumnMenuProps & React.RefAttributes<HTMLDivElement | null>>;
 export interface TableColumnMenuProps extends UseTableProps, UseColSorterReturn, Omit<UseColHiddenReturn, 'visibleCols'> {
     prefixCls?: string;
+    checkDisabledColKeys?: string[];
     onSetColKeysChange?: (sortedColKeys: string[], hiddenColKeys: string[]) => void;
 }

package/lib/types/context.d.ts

@@ -69,7 +69,7 @@ export declare const TableProvider: import("react").Provider<(Omit<{
     flattedColumnsWithoutChildren: import("./types").FlattedTableColumnItemData[];
     rowSelection: import("./types").TableRowSelection | undefined;
     cacheData: object[];
-    measureRowElementRef: import("react").RefObject<HTMLTableRowElement>;
+    setMeasureRowElement: import("react").Dispatch<import("react").SetStateAction<Element | null>>;
     leafColumns: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
     bordered: boolean;
     scrollHeaderElementRef: import("react").RefObject<HTMLTableElement>;
@@ -174,7 +174,7 @@ export declare const useTableContext: () => Omit<{
     flattedColumnsWithoutChildren: import("./types").FlattedTableColumnItemData[];
     rowSelection: import("./types").TableRowSelection | undefined;
     cacheData: object[];
-    measureRowElementRef: import("react").RefObject<HTMLTableRowElement>;
+    setMeasureRowElement: import("react").Dispatch<import("react").SetStateAction<Element | null>>;
     leafColumns: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
     bordered: boolean;
     scrollHeaderElementRef: import("react").RefObject<HTMLTableElement>;

package/lib/types/hooks/use-col-width.d.ts

@@ -6,7 +6,8 @@ export declare const useColWidth: ({ resizable, data, columns, virtual, }: {
     columns: TableColumnItem[];
     virtual?: boolean | undefined;
 }) => {
-    measureRowElementRef: React.RefObject<HTMLTableRowElement>;
+    measureRowElement: Element | null;
+    setMeasureRowElement: React.Dispatch<React.SetStateAction<Element | null>>;
     onColumnResizable: (_: any, { size }: any, index: number) => void;
     getColgroupProps: (column: FlattedTableColumnItemData, index: number) => {
         style: {

package/lib/types/use-table.d.ts

@@ -85,7 +85,7 @@ export declare const useTable: ({ data, columns: columnsProp, defaultFixedToColu
     flattedColumnsWithoutChildren: FlattedTableColumnItemData[];
     rowSelection: TableRowSelection | undefined;
     cacheData: object[];
-    measureRowElementRef: React.RefObject<HTMLTableRowElement>;
+    setMeasureRowElement: React.Dispatch<React.SetStateAction<Element | null>>;
     leafColumns: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
     bordered: boolean;
     scrollHeaderElementRef: React.RefObject<HTMLTableElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/table",
-  "version": "4.1.0-beta.2",
+  "version": "4.1.0-beta.4",
   "description": "A sub-package for @hi-ui/hiui.",
   "keywords": [],
   "author": "HiUI <mi-hiui@xiaomi.com>",