@kdcloudjs/table 1.2.2-canary.17 → 1.2.2-canary.19

package/es/table/base/renderTemplates.js

@@ -49,7 +49,7 @@ function renderTableHeaderInIE(info, props, extra) {
     style: typeof (extra === null || extra === void 0 ? void 0 : extra.stickyRightOffset) === 'number' ? {
       width: extra === null || extra === void 0 ? void 0 : extra.stickyRightOffset
     } : undefined
-  })), left.length > 0 ? /*#__PURE__*/React.createElement("div", {
+  })), left.length > 0 ? (/*#__PURE__*/React.createElement("div", {
     className: Classes.fixedLeft
   }, /*#__PURE__*/React.createElement(TableHeader, {
     info: _extends(_extends({}, info), {
@@ -75,7 +75,7 @@ function renderTableHeaderInIE(info, props, extra) {
     }),
     theaderPosition: "left",
     rowCount: rowCount
-  })) : null, right.length > 0 ? /*#__PURE__*/React.createElement("div", {
+  }))) : null, right.length > 0 ? (/*#__PURE__*/React.createElement("div", {
     className: Classes.fixedRight,
     style: fixedRightTableStyle
   }, /*#__PURE__*/React.createElement(TableHeader, {
@@ -102,7 +102,7 @@ function renderTableHeaderInIE(info, props, extra) {
     }),
     theaderPosition: 'right',
     rowCount: rowCount
-  })) : null);
+  }))) : null);
 }
 function renderTableBodyInIE(info, props, extra) {
   var dataSource = props.dataSource,
@@ -134,33 +134,33 @@ function renderTableBodyInIE(info, props, extra) {
   }, /*#__PURE__*/React.createElement("div", {
     className: Classes.virtual,
     tabIndex: -1
-  }, topBlank > 0 && /*#__PURE__*/React.createElement("div", {
+  }, topBlank > 0 && (/*#__PURE__*/React.createElement("div", {
     key: "top-blank",
     className: cx(Classes.virtualBlank, 'top'),
     style: {
       height: topBlank
     }
-  }), /*#__PURE__*/React.createElement(HtmlTable, _extends({
+  })), /*#__PURE__*/React.createElement(HtmlTable, _extends({
     tbodyHtmlTag: "tbody"
   }, commonProps, {
     tbodyPosition: hasLockColumn ? 'center' : undefined,
     horizontalRenderInfo: info,
     verticalRenderInfo: verticalRenderInfo
-  })), bottomBlank > 0 && /*#__PURE__*/React.createElement("div", {
+  })), bottomBlank > 0 && (/*#__PURE__*/React.createElement("div", {
     key: "bottom-blank",
     className: cx(Classes.virtualBlank, 'bottom'),
     style: {
       height: bottomBlank
     }
-  })), left.length > 0 ? /*#__PURE__*/React.createElement("div", {
+  }))), left.length > 0 ? (/*#__PURE__*/React.createElement("div", {
     className: Classes.fixedLeft
-  }, topBlank > 0 && /*#__PURE__*/React.createElement("div", {
+  }, topBlank > 0 && (/*#__PURE__*/React.createElement("div", {
     key: "top-blank",
     className: cx(Classes.virtualBlank, 'top'),
     style: {
       height: topBlank
     }
-  }), /*#__PURE__*/React.createElement(HtmlTable, _extends({
+  })), /*#__PURE__*/React.createElement(HtmlTable, _extends({
     tbodyHtmlTag: "tbody"
   }, commonProps, {
     tbodyPosition: "left",
@@ -174,21 +174,21 @@ function renderTableBodyInIE(info, props, extra) {
       visible: _sliceInstanceProperty(visible).call(visible, 0, left.length)
     }),
     verticalRenderInfo: verticalRenderInfo
-  })), bottomBlank > 0 && /*#__PURE__*/React.createElement("div", {
+  })), bottomBlank > 0 && (/*#__PURE__*/React.createElement("div", {
     key: "bottom-blank",
     className: cx(Classes.virtualBlank, 'bottom'),
     style: {
       height: bottomBlank
     }
-  })) : null, right.length > 0 ? /*#__PURE__*/React.createElement("div", {
+  })))) : null, right.length > 0 ? (/*#__PURE__*/React.createElement("div", {
     className: Classes.fixedRight
-  }, topBlank > 0 && /*#__PURE__*/React.createElement("div", {
+  }, topBlank > 0 && (/*#__PURE__*/React.createElement("div", {
     key: "top-blank",
     className: cx(Classes.virtualBlank, 'top'),
     style: {
       height: topBlank
     }
-  }), /*#__PURE__*/React.createElement(HtmlTable, _extends({
+  })), /*#__PURE__*/React.createElement(HtmlTable, _extends({
     tbodyHtmlTag: "tbody"
   }, commonProps, {
     tbodyPosition: "right",
@@ -202,13 +202,13 @@ function renderTableBodyInIE(info, props, extra) {
       visible: _sliceInstanceProperty(visible).call(visible, visible.length - right.length)
     }),
     verticalRenderInfo: verticalRenderInfo
-  })), bottomBlank > 0 && /*#__PURE__*/React.createElement("div", {
+  })), bottomBlank > 0 && (/*#__PURE__*/React.createElement("div", {
     key: "bottom-blank",
     className: cx(Classes.virtualBlank, 'bottom'),
     style: {
       height: bottomBlank
     }
-  })) : null, /*#__PURE__*/React.createElement("div", {
+  })))) : null, /*#__PURE__*/React.createElement("div", {
     className: Classes.rowDetailContainer
   }));
 }
@@ -295,7 +295,7 @@ function renderRowDetailInIE(params) {
   if (!domHelper) return;
   var artTable = domHelper.artTable;
   var rowDetailContainer = artTable && artTable.querySelector(".".concat(Classes.rowDetailContainer));
-  return /*#__PURE__*/ReactDom.createPortal( /*#__PURE__*/React.createElement(RowDetail, _extends({}, params)), rowDetailContainer);
+  return /*#__PURE__*/ReactDom.createPortal(/*#__PURE__*/React.createElement(RowDetail, _extends({}, params)), rowDetailContainer);
 }
 function RowDetail(props) {
   var detailRef = useRef(null);
@@ -322,9 +322,7 @@ function RowDetail(props) {
   useEffect(function () {
     // 这时候行才渲染完，只能在这里设置偏移量
     var offsetTop = domHelper.getRowTop(rowIndex) || 0;
-    setTimeout(function () {
-      detailRef.current.style.transform = "translateY(".concat(offsetTop + 'px', ")");
-    }, 0);
+    detailRef.current.style.transform = "translateY(".concat(offsetTop + 'px', ")");
   });
   return /*#__PURE__*/React.createElement("div", {
     ref: detailRef,

package/es/table/base/styles.js

@@ -1,7 +1,7 @@
 import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
 import styled, { css, createGlobalStyle } from 'styled-components';
 import { swapRTLDirection } from './utils';
 export var LOCK_SHADOW_PADDING = 20;
@@ -156,7 +156,11 @@ export var defaultCSSVariables = {
 export var variableConst = getCssVariableText(defaultCSSVariables);
 var notBorderedStyleMixin = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  --cell-border-vertical: none;\n  --header-cell-border-vertical: none;\n"])));
 var borderedStyleMixin = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  //th\u9690\u85CF\u5217\u5BBD\u62D6\u62FD\u7684\u80CC\u666F\u8272\uFF0C\u4F7F\u7528th\u7684\u53F3\u8FB9\u6846\u4EE3\u66FF\n  .", "::after{\n    background-color: inherit;\n  }\n"])), Classes.tableHeaderCellResize);
-export var StyledArtTableWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  :root {\n    ", "\n  }\n  ", "\n\n  box-sizing: border-box;\n  * {\n    box-sizing: border-box;\n  }\n  cursor: default;\n  color: var(--color);\n  font-size: var(--font-size);\n  line-height: var(--line-height);\n  position: relative;\n\n  // \u8868\u683C\u5916\u8FB9\u6846\u7531 art-table-wrapper \u63D0\u4F9B\uFF0C\u800C\u4E0D\u662F\u7531\u5355\u5143\u683C\u63D0\u4F9B\n  &.use-outer-border {\n    ", ";\n  }\n\n  // \u8868\u683C\u4E0D\u542F\u7528\u8FB9\u6846\u7EBF\uFF0C\u9690\u85CFth\u3001td\u7684\u5355\u5143\u683C\u5DE6\u53F3\u8FB9\u6846\u7EBF\n  &:not(.", ") {\n    ", "\n  }\n  &.", "{\n    ", "\n  }\n\n  .no-scrollbar {\n    ::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .", " {\n    overflow: auto;\n    flex-shrink: 1;\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .", " {\n    overflow: hidden;\n    background: var(--header-bgcolor);\n    display: flex;\n    flex-shrink: 0;\n    border-bottom: var(--header-cell-border-horizontal);\n  }\n\n  .", " {\n    display: flex;\n    // justify-content: flex-start;\n    align-items: center;\n    height: inherit;\n  }\n\n  .", " {\n     overflow-x:auto;\n     flex-shrink: 0;\n     flex-grow: 0;\n     scrollbar-width: none; // \u517C\u5BB9\u706B\u72D0\n     & {\n       ::-webkit-scrollbar {\n         display:none;\n       }\n     }\n   }\n\n  .", " {\n    display: flex;\n    flex: none;\n  }\n  .", "{\n    flex-grow:1;\n  }\n  .", ", .", " {\n    background: var(--bgcolor);\n    overflow: auto;\n    overflow-x: hidden;\n    overflow-anchor: none;\n    position:relative;\n    &.empty {\n      position: relative;\n    }\n  }\n\n  .", " {\n    position: relative;\n  }\n  .", ", .", "  {\n    .", "{\n      background-color: #e6effb !important;\n    }\n    .", "{\n      border-top: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-", ": 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-bottom: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-", ": 1px solid #0E5FD8 !important;\n    }\n  }\n\n  .", " {\n    user-select:none;\n  }\n\n  .", " {\n    user-select:none;\n    // .", " .", " >td{\n    //     cursor:move;\n    // }\n\n    // .", " .", " >td{\n    //     cursor:no-drop;\n    // }\n    \n  }\n\n  .", "{\n    opacity: 0.5;\n  }\n  .", "{\n    border: 1px solid var(--primary-color)\n  }\n\n  .", " td{\n    border-top: 1px solid var(--primary-color) !important;\n    border-bottom: 1px solid var(--primary-color) !important;\n    \n  }\n  .", " td:first-child{\n    border-", ": 1px solid var(--primary-color) !important;\n    \n  }\n  .", " td:last-child{\n    border-", ": 1px solid var(--primary-color) !important;\n    \n  }\n\n\n  // .", " td{\n  //   border-top: 1px solid var(--primary-color) !important;\n  // }\n\n  .", " td{\n    border-top: 1px solid var(--primary-color) !important;\n    border-bottom: 1px solid var(--primary-color) !important;\n  }\n\n  .", " td:first-child{\n    border-", ": 1px solid var(--primary-color) !important;\n  }\n\n  .", " td:last-child{\n    border-", ": 1px solid var(--primary-color) !important;\n  }\n\n  // .", " td{\n  //   border-bottom: 1px solid var(--primary-color) !important;\n  // }\n\n  .", " {\n    cursor:pointer;\n  }\n\n\n  &.sticky-header .", " {\n    position: sticky;\n    top: 0;\n    z-index: ", ";\n  }\n\n  &.sticky-footer .", " {\n    position: sticky;\n    bottom: 0;\n    z-index: ", ";\n  }\n\n  table {\n    width: 0;\n    table-layout: fixed;\n    border-collapse: separate;\n    border-spacing: 0;\n    display: table;\n    margin: 0;\n    padding: 0;\n    flex-shrink: 0;\n    flex-grow: 0;\n    position:relative;\n  }\n\n  // \u5728 tr \u4E0A\u8BBE\u7F6E .no-hover \u53EF\u4EE5\u7981\u7528\u9F20\u6807\u60AC\u505C\u6548\u679C\n  tr:not(.no-hover):hover > td {\n    background: var(--hover-bgcolor);\n  }\n  // \u4F7F\u7528 js \u6DFB\u52A0\u60AC\u6D6E\u6548\u679C\n  tr:not(.no-hover).row-hover > td {\n    background: var(--hover-bgcolor);\n  }\n  // \u5728 tr \u8BBE\u7F6E highlight \u53EF\u4EE5\u4E3A\u5E95\u4E0B\u7684 td \u8BBE\u7F6E\u4E3A\u9AD8\u4EAE\u8272\n  // \u800C\u8BBE\u7F6E .no-highlight \u7684\u8BDD\u5219\u53EF\u4EE5\u7981\u7528\u9AD8\u4EAE\u6548\u679C\uFF1B\n  tr:not(.no-highlight).highlight > td {\n    background: var(--highlight-bgcolor);\n  }\n\n  th {\n    font-weight: normal;\n    text-align: ", ";\n    padding: var(--cell-padding);\n    height: var(--header-row-height);\n    color: var(--header-color);\n    background: var(--header-bgcolor);\n    border:1px solid transparent;\n    border-", ": var(--header-cell-border-vertical);\n    border-bottom: var(--header-cell-border-horizontal);\n    position: relative;\n  }\n\n  th.resizeable{\n    border-", ": var(--header-cell-border-vertical)\n  }\n\n  th.", " {\n    border-", ": var(--header-cell-border-vertical);\n    border-bottom: none;\n  }\n\n  tr.", " th {\n    border-top: var(--header-cell-border-horizontal);\n  }\n  th.", " {\n    border-", ": var(--header-cell-border-vertical);\n  }\n\n  td {\n    padding: var(--cell-padding);\n    background: var(--bgcolor);\n    height: var(--row-height);\n    border:1px solid transparent;\n    border-", ": var(--cell-border-vertical);\n    border-bottom: var(--cell-border-horizontal);\n    word-break: break-all;\n  }\n  td.", " {\n    border-", ": var(--cell-border-vertical);\n  }\n  tr.", " td {\n    border-top: var(--cell-border-horizontal);\n  }\n  &.has-header tbody tr.", " td {\n    border-top: none;\n  }\n  &.has-footer tbody tr.", " td {\n    border-bottom: none;\n  }\n\n  .", ",\n  .", " {\n    z-index: ", ";\n  }\n\n  //#region \u9501\u5217\u9634\u5F71\n  .", " {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    z-index: ", ";\n    pointer-events: none;\n    overflow: hidden;\n\n    .", " {\n      height: 100%;\n    }\n\n    .", " {\n      margin-", ": ", "px;\n     \n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-", ": var(--cell-border-vertical);\n      }\n    }\n\n    .", " {\n      margin-", ": ", "px;\n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-", ": var(--cell-border-vertical);\n      }\n    }\n  }\n  //#endregion\n\n  //#region \u7A7A\u8868\u683C\u5C55\u73B0\n  .", " {\n    pointer-events: none;\n    color: #99a3b3;\n    font-size: 12px;\n    text-align: center;\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    transform: translate(-50%, -50%);\n\n    .empty-image {\n      width: 50px;\n      height: 50px;\n    }\n\n    .empty-tips {\n      margin-top: 16px;\n      line-height: 1.5;\n    }\n  }\n  //#endregion\n\n  //#region sticky\u517C\u5BB9\n  &.sticky-polyfill-wrapper{\n    //\u9501\u5B9A\u5217\u517C\u5BB9 \u4EC5\u5728\u9501\u5B9A\u5217\u7684\u60C5\u51B5\u4E0B\u751F\u6548\n    .", " {\n      overflow-x: hidden;\n    }\n    .", ", .", " {\n      position:relative;\n    }\n    .", " {\n      overflow: hidden;\n      display: flex;\n    }\n    .", " {\n      position: relative;\n    }\n\n    .", " {\n      display: flex;\n      overflow: auto;\n      overflow-x: hidden;\n      overflow-anchor: none;\n    }\n\n    .", ", .", "{\n      position: absolute;\n      z-index: ", ";\n      top: 0;\n    }\n    .", "{\n      ", ":0;\n    }\n    .", "{\n      ", ":0;\n    }\n\n    .", "{\n      .", "{\n        position: absolute;\n        top: 0;\n        width: 100%;\n        z-index: ", ";\n      }\n    }\n\n    tr:not(.no-hover).row-hover > td {\n      background: var(--hover-bgcolor);\n    }\n  }\n  //#endregion sticky\u517C\u5BB9\n\n  //#region \u7C98\u6027\u6EDA\u52A8\u6761\n  .", "{\n    display:flex;\n    background: var(--bgcolor);\n  }\n  .", "{\n    height: 1px;\n    flex-shrink: 0;\n    border-top: 1px solid var(--border-color);\n  }\n\n  .", "{\n    height: 1px;\n    flex-shrink: 0;\n    border-top: 1px solid var(--border-color);\n  }\n  .", " {\n    overflow-y: hidden;\n    overflow-x: auto;\n    z-index: ", ";\n    flex-shrink: 1;\n    flex-grow: 0;\n    border-top: 1px solid var(--border-color);\n  }\n\n  .", " {\n    // \u5FC5\u987B\u6709\u9AD8\u5EA6\u624D\u80FD\u51FA\u73B0\u6EDA\u52A8\u6761\n    height: 1px;\n    visibility: hidden;\n  }\n  //#endregion\n\n  //#region \u52A0\u8F7D\u6837\u5F0F\n  .", " {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    overflow: auto;\n\n    .", " {\n      filter: none;\n      width: 100%;\n      height: 100%;\n      overflow: hidden;//\u5217\u5168\u90E8\u56FA\u5B9A\u65F6\uFF0C\u5B58\u5728\u53CC\u6A2A\u5411\u6EDA\u52A8\u6761\n      display: flex;\n      position: relative;\n      flex-direction: column;\n    }\n\n    .", " {\n      position: absolute;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      pointer-events: none;\n    }\n\n    .", " {\n      position: sticky;\n      z-index: ", ";\n      transform: translateY(-50%);\n    }\n  }\n  //#endregion\n\n  //#region \u8868\u683C\u8FC7\u6EE4\n  .", " {\n    color:var(--icon-color);\n    &.active{\n      color:var(--primary-color);\n    }\n    padding: 6px 4px;\n    &:hover{\n      background-color: #e5e5e5;\n    }\n    &:focus {\n      outline: none\n    }\n  }\n  //#endregion\n\n  //#region \u8868\u683C\u6392\u5E8F\n  .", " {\n    color:var(--icon-color);\n    &.active{\n      color:var(--primary-color);\n    }\n  }\n  .", " {\n    color:var(--icon-color);\n    &.active{\n      color:var(--primary-color);\n    }\n  }\n  //#endregion\n\n  //#region \u6EDA\u52A8\u6761\u5360\u4F4D\n  .", " {\n    // visibility: hidden;\n    background: var(--header-bgcolor);\n    position:sticky;\n    z-index:5;\n    ", ":0px;\n    flex-shrink: 0;\n  }\n  .", " .", " {\n    border-top: var(--cell-border-horizontal);\n  }\n  //#endregion\n\n  //#region \u62D6\u62FD\u5217\u5BBD\u5927\u5C0F\n  .", "::after{\n    background-color: var(--border-color);\n  }\n  //\u89E3\u51B3\u90E8\u5206\u6D4F\u89C8\u5668(chrome109)\u6700\u540E\u4E00\u4E2A\u5355\u5143\u683C\u7684\u5217\u5BBD\u62D6\u62FD\u533A\u57DF\u7EDD\u5BF9\u5B9A\u4F4D\u8D85\u51FA\u8868\u683C\uFF0C\u5BFC\u81F4\u8868\u683C\u7AD6\u5206\u5272\u7EBF\u65E0\u6CD5\u5BF9\u9F50\n  .", " th.", " .", "{\n    ", ": 0;\n    width: 5px;\n    &::after{\n      ", ": 4px;\n    }\n  }\n"])), variableConst, variableConst, outerBorderStyleMixin, Classes.artTableBordered, notBorderedStyleMixin, Classes.artTableBordered, borderedStyleMixin, Classes.artTable, Classes.tableHeader, Classes.tableHeaderCellContent, Classes.virtual, Classes.tableFooter, Classes.tableBody, Classes.tableBody, Classes.tableFooter, Classes.tableRow, Classes.tableBody, Classes.tableFooter, Classes.tableCellRangeSelected, Classes.tableCellRangeTop, Classes.tableCellRangeLeft, function (props) {
+export var StyledArtTableWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", "\n  box-sizing: border-box;\n  * {\n    box-sizing: border-box;\n  }\n  cursor: default;\n  color: var(--color);\n  font-size: var(--font-size);\n  line-height: var(--line-height);\n  position: relative;\n\n  // \u8868\u683C\u5916\u8FB9\u6846\u7531 art-table-wrapper \u63D0\u4F9B\uFF0C\u800C\u4E0D\u662F\u7531\u5355\u5143\u683C\u63D0\u4F9B\n  &.use-outer-border {\n    ", ";\n  }\n\n  // \u8868\u683C\u4E0D\u542F\u7528\u8FB9\u6846\u7EBF\uFF0C\u9690\u85CFth\u3001td\u7684\u5355\u5143\u683C\u5DE6\u53F3\u8FB9\u6846\u7EBF\n  &:not(.", ") {\n    ", "\n  }\n  &.", "{\n    ", "\n  }\n\n  .no-scrollbar {\n    ::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .", " {\n    overflow: auto;\n    flex-shrink: 1;\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .", " {\n    overflow: hidden;\n    background: var(--header-bgcolor);\n    display: flex;\n    flex-shrink: 0;\n    border-bottom: var(--header-cell-border-horizontal);\n  }\n\n  .", " {\n    display: flex;\n    // justify-content: flex-start;\n    align-items: center;\n    height: inherit;\n  }\n\n  .", " {\n     overflow-x:auto;\n     flex-shrink: 0;\n     flex-grow: 0;\n     scrollbar-width: none; // \u517C\u5BB9\u706B\u72D0\n     & {\n       ::-webkit-scrollbar {\n         display:none;\n       }\n     }\n   }\n\n  .", " {\n    display: flex;\n    flex: none;\n  }\n  .", "{\n    flex-grow:1;\n  }\n  .", ", .", " {\n    background: var(--bgcolor);\n    overflow: auto;\n    overflow-x: hidden;\n    overflow-anchor: none;\n    position:relative;\n    &.empty {\n      position: relative;\n    }\n  }\n\n  .", " {\n    position: relative;\n  }\n  .", ", .", "  {\n    .", "{\n      background-color: #e6effb !important;\n    }\n    .", "{\n      border-top: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-", ": 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-bottom: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-", ": 1px solid #0E5FD8 !important;\n    }\n  }\n\n  .", " {\n    user-select:none;\n  }\n\n  .", " {\n    user-select:none;\n    // .", " .", " >td{\n    //     cursor:move;\n    // }\n\n    // .", " .", " >td{\n    //     cursor:no-drop;\n    // }\n    \n  }\n\n  .", "{\n    opacity: 0.5;\n  }\n  .", "{\n    border: 1px solid var(--primary-color)\n  }\n\n  .", " td{\n    border-top: 1px solid var(--primary-color) !important;\n    border-bottom: 1px solid var(--primary-color) !important;\n    \n  }\n  .", " td:first-child{\n    border-", ": 1px solid var(--primary-color) !important;\n    \n  }\n  .", " td:last-child{\n    border-", ": 1px solid var(--primary-color) !important;\n    \n  }\n\n\n  // .", " td{\n  //   border-top: 1px solid var(--primary-color) !important;\n  // }\n\n  .", " td{\n    border-top: 1px solid var(--primary-color) !important;\n    border-bottom: 1px solid var(--primary-color) !important;\n  }\n\n  .", " td:first-child{\n    border-", ": 1px solid var(--primary-color) !important;\n  }\n\n  .", " td:last-child{\n    border-", ": 1px solid var(--primary-color) !important;\n  }\n\n  // .", " td{\n  //   border-bottom: 1px solid var(--primary-color) !important;\n  // }\n\n  .", " {\n    cursor:pointer;\n  }\n\n\n  &.sticky-header .", " {\n    position: sticky;\n    top: 0;\n    z-index: ", ";\n  }\n\n  &.sticky-footer .", " {\n    position: sticky;\n    bottom: 0;\n    z-index: ", ";\n  }\n\n  table {\n    width: 0;\n    table-layout: fixed;\n    border-collapse: separate;\n    border-spacing: 0;\n    display: table;\n    margin: 0;\n    padding: 0;\n    flex-shrink: 0;\n    flex-grow: 0;\n    position:relative;\n  }\n\n  // \u5728 tr \u4E0A\u8BBE\u7F6E .no-hover \u53EF\u4EE5\u7981\u7528\u9F20\u6807\u60AC\u505C\u6548\u679C\n  tr:not(.no-hover):hover > td {\n    background: var(--hover-bgcolor);\n  }\n  // \u4F7F\u7528 js \u6DFB\u52A0\u60AC\u6D6E\u6548\u679C\n  tr:not(.no-hover).row-hover > td {\n    background: var(--hover-bgcolor);\n  }\n  // \u5728 tr \u8BBE\u7F6E highlight \u53EF\u4EE5\u4E3A\u5E95\u4E0B\u7684 td \u8BBE\u7F6E\u4E3A\u9AD8\u4EAE\u8272\n  // \u800C\u8BBE\u7F6E .no-highlight \u7684\u8BDD\u5219\u53EF\u4EE5\u7981\u7528\u9AD8\u4EAE\u6548\u679C\uFF1B\n  tr:not(.no-highlight).highlight > td {\n    background: var(--highlight-bgcolor);\n  }\n\n  th {\n    font-weight: normal;\n    text-align: ", ";\n    padding: var(--cell-padding);\n    height: var(--header-row-height);\n    color: var(--header-color);\n    background: var(--header-bgcolor);\n    border:1px solid transparent;\n    border-", ": var(--header-cell-border-vertical);\n    border-bottom: var(--header-cell-border-horizontal);\n    position: relative;\n  }\n\n  th.resizeable{\n    border-", ": var(--header-cell-border-vertical)\n  }\n\n  th.", " {\n    border-", ": var(--header-cell-border-vertical);\n    border-bottom: none;\n  }\n\n  tr.", " th {\n    border-top: var(--header-cell-border-horizontal);\n  }\n  th.", " {\n    border-", ": var(--header-cell-border-vertical);\n  }\n\n  td {\n    padding: var(--cell-padding);\n    background: var(--bgcolor);\n    height: var(--row-height);\n    border:1px solid transparent;\n    border-", ": var(--cell-border-vertical);\n    border-bottom: var(--cell-border-horizontal);\n    word-break: break-all;\n  }\n  td.", " {\n    border-", ": var(--cell-border-vertical);\n  }\n  tr.", " td {\n    border-top: var(--cell-border-horizontal);\n  }\n  &.has-header tbody tr.", " td {\n    border-top: none;\n  }\n  &.has-footer tbody tr.", " td {\n    border-bottom: none;\n  }\n\n  .", ",\n  .", " {\n    z-index: ", ";\n  }\n\n  //#region \u9501\u5217\u9634\u5F71\n  .", " {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    z-index: ", ";\n    pointer-events: none;\n    overflow: hidden;\n\n    .", " {\n      height: 100%;\n    }\n\n    .", " {\n      margin-", ": ", "px;\n     \n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-", ": var(--cell-border-vertical);\n      }\n    }\n\n    .", " {\n      margin-", ": ", "px;\n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-", ": var(--cell-border-vertical);\n      }\n    }\n  }\n  //#endregion\n\n  //#region \u7A7A\u8868\u683C\u5C55\u73B0\n  .", " {\n    pointer-events: none;\n    color: #99a3b3;\n    font-size: 12px;\n    text-align: center;\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    transform: translate(-50%, -50%);\n\n    .empty-image {\n      width: 50px;\n      height: 50px;\n    }\n\n    .empty-tips {\n      margin-top: 16px;\n      line-height: 1.5;\n    }\n  }\n  //#endregion\n\n  //#region sticky\u517C\u5BB9\n  &.sticky-polyfill-wrapper{\n    //\u9501\u5B9A\u5217\u517C\u5BB9 \u4EC5\u5728\u9501\u5B9A\u5217\u7684\u60C5\u51B5\u4E0B\u751F\u6548\n    .", " {\n      overflow-x: hidden;\n    }\n    .", ", .", " {\n      position:relative;\n    }\n    .", " {\n      overflow: hidden;\n      display: flex;\n    }\n    .", " {\n      position: relative;\n    }\n\n    .", " {\n      display: flex;\n      overflow: auto;\n      overflow-x: hidden;\n      overflow-anchor: none;\n    }\n\n    .", ", .", "{\n      position: absolute;\n      z-index: ", ";\n      top: 0;\n    }\n    .", "{\n      ", ":0;\n    }\n    .", "{\n      ", ":0;\n    }\n\n    .", "{\n      .", "{\n        position: absolute;\n        top: 0;\n        width: 100%;\n        z-index: ", ";\n      }\n    }\n\n    tr:not(.no-hover).row-hover > td {\n      background: var(--hover-bgcolor);\n    }\n  }\n  //#endregion sticky\u517C\u5BB9\n\n  //#region \u7C98\u6027\u6EDA\u52A8\u6761\n  .", "{\n    display:flex;\n    background: var(--bgcolor);\n  }\n  .", "{\n    height: 1px;\n    flex-shrink: 0;\n    border-top: 1px solid var(--border-color);\n  }\n\n  .", "{\n    height: 1px;\n    flex-shrink: 0;\n    border-top: 1px solid var(--border-color);\n  }\n  .", " {\n    overflow-y: hidden;\n    overflow-x: auto;\n    z-index: ", ";\n    flex-shrink: 1;\n    flex-grow: 0;\n    border-top: 1px solid var(--border-color);\n  }\n\n  .", " {\n    // \u5FC5\u987B\u6709\u9AD8\u5EA6\u624D\u80FD\u51FA\u73B0\u6EDA\u52A8\u6761\n    height: 1px;\n    visibility: hidden;\n  }\n  //#endregion\n\n  //#region \u52A0\u8F7D\u6837\u5F0F\n  .", " {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    overflow: auto;\n\n    .", " {\n      filter: none;\n      width: 100%;\n      height: 100%;\n      overflow: hidden;//\u5217\u5168\u90E8\u56FA\u5B9A\u65F6\uFF0C\u5B58\u5728\u53CC\u6A2A\u5411\u6EDA\u52A8\u6761\n      display: flex;\n      position: relative;\n      flex-direction: column;\n    }\n\n    .", " {\n      position: absolute;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      pointer-events: none;\n    }\n\n    .", " {\n      position: sticky;\n      z-index: ", ";\n      transform: translateY(-50%);\n    }\n  }\n  //#endregion\n\n  //#region \u8868\u683C\u8FC7\u6EE4\n  .", " {\n    color:var(--icon-color);\n    &.active{\n      color:var(--primary-color);\n    }\n    padding: 6px 4px;\n    &:hover{\n      background-color: #e5e5e5;\n    }\n    &:focus {\n      outline: none\n    }\n  }\n  //#endregion\n\n  //#region \u8868\u683C\u6392\u5E8F\n  .", " {\n    color:var(--icon-color);\n    &.active{\n      color:var(--primary-color);\n    }\n  }\n  .", " {\n    color:var(--icon-color);\n    &.active{\n      color:var(--primary-color);\n    }\n  }\n  //#endregion\n\n  //#region \u6EDA\u52A8\u6761\u5360\u4F4D\n  .", " {\n    // visibility: hidden;\n    background: var(--header-bgcolor);\n    position:sticky;\n    z-index:5;\n    ", ":0px;\n    flex-shrink: 0;\n  }\n  .", " .", " {\n    border-top: var(--cell-border-horizontal);\n  }\n  //#endregion\n\n  //#region \u62D6\u62FD\u5217\u5BBD\u5927\u5C0F\n  .", "::after{\n    background-color: var(--border-color);\n  }\n  //\u89E3\u51B3\u90E8\u5206\u6D4F\u89C8\u5668(chrome109)\u6700\u540E\u4E00\u4E2A\u5355\u5143\u683C\u7684\u5217\u5BBD\u62D6\u62FD\u533A\u57DF\u7EDD\u5BF9\u5B9A\u4F4D\u8D85\u51FA\u8868\u683C\uFF0C\u5BFC\u81F4\u8868\u683C\u7AD6\u5206\u5272\u7EBF\u65E0\u6CD5\u5BF9\u9F50\n  .", " th.", " .", "{\n    ", ": 0;\n    width: 5px;\n    &::after{\n      ", ": 4px;\n    }\n  }\n"])), function (_ref) {
+  var _context, _context2, _context3;
+  var prefixCls = _ref.prefixCls;
+  return prefixCls ? _concatInstanceProperty(_context = _concatInstanceProperty(_context2 = "&.".concat(prefixCls, "-table {:root {")).call(_context2, variableConst, "} ")).call(_context, variableConst, "}") : _concatInstanceProperty(_context3 = ":root {".concat(variableConst, "} ")).call(_context3, variableConst);
+}, outerBorderStyleMixin, Classes.artTableBordered, notBorderedStyleMixin, Classes.artTableBordered, borderedStyleMixin, Classes.artTable, Classes.tableHeader, Classes.tableHeaderCellContent, Classes.virtual, Classes.tableFooter, Classes.tableBody, Classes.tableBody, Classes.tableFooter, Classes.tableRow, Classes.tableBody, Classes.tableFooter, Classes.tableCellRangeSelected, Classes.tableCellRangeTop, Classes.tableCellRangeLeft, function (props) {
   return swapRTLDirection(props.direction, 'left');
 }, Classes.tableCellRangeBottom, Classes.tableCellRangeRight, function (props) {
   return swapRTLDirection(props.direction, 'right');
@@ -204,8 +208,8 @@ export var StyledArtTableWrapper = styled.div(_templateObject5 || (_templateObje
 export var ButtonCSS = css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  ", "\n  .", "{\n    color: var(--color);\n    background:#ffffff;\n    border:1px solid var(--strong-border-color);\n    border-radius: 2px;\n    cursor: pointer;\n    &:hover{\n      color: var(--primary-color);\n      border:1px solid var(--primary-color);\n    }\n  }\n  .", " {\n    color:#ffffff;\n    background-color: var(--primary-color);\n    border:none;\n    &:hover{\n      color:#ffffff;\n      background-color: var(--primary-color-level2);\n      border:none;\n    }\n  }\n"])), variableConst, Classes.button, Classes.buttonPrimary);
 function getCssVariableText(obj) {
   return _Object$keys(obj).reduce(function (acc, key) {
-    var _context;
-    acc += _concatInstanceProperty(_context = "".concat(key, ":")).call(_context, obj[key], ";");
+    var _context4;
+    acc += _concatInstanceProperty(_context4 = "".concat(key, ":")).call(_context4, obj[key], ";");
     return acc;
   }, '');
 }

package/es/table/base/table.d.ts

@@ -91,6 +91,7 @@ export interface BaseTableProps {
         blockSize?: number;
     };
     direction?: string;
+    prefixCls?: string;
 }
 export interface BaseTableState {
     /** 是否要展示自定义滚动条(stickyScroll) */

package/es/table/base/table.js

@@ -7,17 +7,17 @@ import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _classCallCheck from "@babel/runtime-corejs3/helpers/classCallCheck";
 import _createClass from "@babel/runtime-corejs3/helpers/createClass";
-import _inherits from "@babel/runtime-corejs3/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime-corejs3/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime-corejs3/helpers/getPrototypeOf";
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof _Symbol !== "undefined" && _getIteratorMethod(o) || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-function _unsupportedIterableToArray(o, minLen) { var _context2; if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = _sliceInstanceProperty(_context2 = Object.prototype.toString.call(o)).call(_context2, 8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return _Array$from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+import _inherits from "@babel/runtime-corejs3/helpers/inherits";
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof _Symbol && _getIteratorMethod(r) || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { var _context2; if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = _sliceInstanceProperty(_context2 = {}.toString.call(r)).call(_context2, 8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? _Array$from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _flatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/flat";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct) return false; if (_Reflect$construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? _Reflect$construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import cx from 'classnames';
 import React from 'react';
 import { BehaviorSubject, combineLatest, noop, Subscription, Subject, from } from 'rxjs';
@@ -45,12 +45,10 @@ function warnPropsDotEmptyContentIsDeprecated() {
   }
 }
 export var BaseTable = /*#__PURE__*/function (_React$Component) {
-  _inherits(BaseTable, _React$Component);
-  var _super = _createSuper(BaseTable);
   function BaseTable(props) {
     var _this;
     _classCallCheck(this, BaseTable);
-    _this = _super.call(this, props);
+    _this = _callSuper(this, BaseTable, [props]);
     _this.rowHeightManager = makeRowHeightManager(_this.props.dataSource.length, _this.props.estimatedRowHeight);
     _this.artTableWrapperRef = /*#__PURE__*/React.createRef();
     _this.hasScrollY = false;
@@ -182,7 +180,8 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
     return _this;
   }
   /** @deprecated BaseTable.getDoms() 已经过时，请勿调用 */
-  _createClass(BaseTable, [{
+  _inherits(BaseTable, _React$Component);
+  return _createClass(BaseTable, [{
     key: "getDoms",
     value: function getDoms() {
       console.warn('[kd-table] BaseTable.getDoms() 已经过时');
@@ -395,19 +394,18 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "renderLockShadows",
     value: function renderLockShadows(info) {
-      var _style, _style2;
       var stickyRightOffset = this.hasScrollY ? this.getScrollBarWidth() : 0;
       // console.log('render LockShadows')
       var leftLockShadowWidth = info.leftLockTotalWidth + LOCK_SHADOW_PADDING;
       var rightLockShadownWidth = info.rightLockTotalWidth + LOCK_SHADOW_PADDING + stickyRightOffset;
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
         className: Classes.lockShadowMask,
-        style: (_style = {}, _defineProperty(_style, swapRTLDirection(info.direction, 'left'), 0), _defineProperty(_style, "width", leftLockShadowWidth), _style)
+        style: _defineProperty(_defineProperty({}, swapRTLDirection(info.direction, 'left'), 0), "width", leftLockShadowWidth)
       }, /*#__PURE__*/React.createElement("div", {
         className: cx(Classes.lockShadow, Classes.leftLockShadow)
       })), /*#__PURE__*/React.createElement("div", {
         className: Classes.lockShadowMask,
-        style: (_style2 = {}, _defineProperty(_style2, swapRTLDirection(info.direction, 'right'), 0), _defineProperty(_style2, "width", rightLockShadownWidth), _style2)
+        style: _defineProperty(_defineProperty({}, swapRTLDirection(info.direction, 'right'), 0), "width", rightLockShadownWidth)
       }, /*#__PURE__*/React.createElement("div", {
         className: cx(Classes.lockShadow, Classes.rightLockShadow)
       })));
@@ -471,7 +469,6 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
-      var _cx;
       // console.log('render table')
       var info = calculateRenderInfo(this);
       this.lastInfo = info;
@@ -489,9 +486,11 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
         footerDataSource = _this$props8.footerDataSource,
         components = _this$props8.components,
         bordered = _this$props8.bordered,
-        direction = _this$props8.direction;
+        direction = _this$props8.direction,
+        _prefixCls = _this$props8.prefixCls;
+      var prefixCls = _prefixCls === 'kd' || !_prefixCls ? undefined : _prefixCls; // 不生效上层传的prefix为kd，只有传除'kd'外的前缀才生效，kui默认传kd，避免对之前的样式层级有影响
       info.direction = direction;
-      var artTableWrapperClassName = cx(Classes.artTableWrapper, (_cx = {
+      var artTableWrapperClassName = cx(Classes.artTableWrapper, _defineProperty(_defineProperty(_defineProperty(_defineProperty({
         'use-outer-border': useOuterBorder,
         empty: dataSource.length === 0,
         lock: info.hasLockColumn,
@@ -499,7 +498,7 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
         'sticky-header': isStickyHeader !== null && isStickyHeader !== void 0 ? isStickyHeader : isStickyHead,
         'has-footer': footerDataSource.length > 0,
         'sticky-footer': isStickyFooter
-      }, _defineProperty(_cx, Classes.artTableBordered, bordered), _defineProperty(_cx, 'ie-polyfill-wrapper', browserType.isIE), _defineProperty(_cx, 'sticky-polyfill-wrapper', isStickyUIDegrade()), _cx), className);
+      }, Classes.artTableBordered, bordered), 'ie-polyfill-wrapper', browserType.isIE), 'sticky-polyfill-wrapper', isStickyUIDegrade()), "".concat(prefixCls, "-table"), prefixCls), className);
       var artTableWrapperProps = _defineProperty({
         className: artTableWrapperClassName,
         style: _extends(_extends({}, style), {
@@ -510,7 +509,8 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(GlobalStyleComponent, {
         direction: info.direction
       }), /*#__PURE__*/React.createElement(StyledArtTableWrapper, _extends({}, artTableWrapperProps, {
-        direction: info.direction
+        direction: info.direction,
+        prefixCls: this.props.prefixCls
       }), /*#__PURE__*/React.createElement(Loading, {
         visible: isLoading,
         LoadingIcon: components.LoadingIcon,
@@ -548,10 +548,10 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
     value: function componentDidUpdate(prevProps, prevState) {
       var _a;
       // console.log('did update start')
-      var _this$props10 = this.props,
-        cssVariables = _this$props10.cssVariables,
-        enableCSSVariables = _this$props10.enableCSSVariables,
-        bordered = _this$props10.bordered;
+      var _this$props0 = this.props,
+        cssVariables = _this$props0.cssVariables,
+        enableCSSVariables = _this$props0.enableCSSVariables,
+        bordered = _this$props0.bordered;
       if (!shallowEqual(prevProps === null || prevProps === void 0 ? void 0 : prevProps.cssVariables, (_a = this.props) === null || _a === void 0 ? void 0 : _a.cssVariables)) {
         cssPolifill({
           variables: cssVariables || {},
@@ -813,7 +813,6 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
       }
     }
   }]);
-  return BaseTable;
 }(React.Component);
 BaseTable.defaultProps = {
   hasHeader: true,

package/es/table/base/utils.js

@@ -4,9 +4,9 @@ import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
 import _getIteratorMethod from "@babel/runtime-corejs3/core-js/get-iterator-method";
 import _typeof from "@babel/runtime-corejs3/helpers/typeof";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof _Symbol !== "undefined" && _getIteratorMethod(o) || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-function _unsupportedIterableToArray(o, minLen) { var _context; if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = _sliceInstanceProperty(_context = Object.prototype.toString.call(o)).call(_context, 8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return _Array$from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof _Symbol && _getIteratorMethod(r) || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { var _context; if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = _sliceInstanceProperty(_context = {}.toString.call(r)).call(_context, 8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? _Array$from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import _Set from "@babel/runtime-corejs3/core-js-stable/set";
 import _Object$is from "@babel/runtime-corejs3/core-js-stable/object/is";
 import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";

package/es/table/interfaces.d.ts

@@ -2,6 +2,21 @@ import React, { ReactNode } from 'react';
 export declare type ArtColumnAlign = 'left' | 'center' | 'right';
 export declare type ArtColumnVerticalAlign = 'top' | 'bottom' | 'middle';
 export declare type CellProps = React.TdHTMLAttributes<HTMLTableCellElement>;
+export interface selectRenderProps {
+    type: 'multi' | 'single';
+    row: any;
+    rowIndex: number;
+    rowKey: string;
+    checked: boolean;
+    disabled: boolean;
+    defaultElement: React.ReactNode;
+    actions: {
+        /** 将当前行设置为选中（若已选中则不操作） */
+        select: () => void;
+        /** 切换当前行选中状态 */
+        toggle: (batch?: boolean) => void;
+    };
+}
 export interface ArtColumnStaticPart {
     /** 列的名称 */
     name: string;
@@ -29,6 +44,10 @@ export interface ArtColumnStaticPart {
     };
     /** 表头设置操作项到自定义操作区 */
     renderHeader?: (title: ReactNode, opr: ReactNode) => ReactNode;
+    /** 自定义选择列渲染  **/
+    customRender?: selectRenderProps;
+    /** 在分组情况下是否需要合并表头 默认不合并 */
+    isHeaderMerge?: boolean;
 }
 export interface Features {
     /** 是否开启排序功能 */

package/es/table/internals.d.ts

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 import { ArtColumn } from './interfaces';
-declare function safeRenderHeader(column: ArtColumn): {};
+declare function safeRenderHeader(column: ArtColumn): number | boolean | import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any>) | (new (props: any) => import("react").Component<any, any, any>)> | import("react").ReactFragment;
 declare function safeGetValue(column: ArtColumn, record: any, rowIndex: number): any;
 declare function safeGetRowKey(primaryKey: string | ((record: any) => string), record: any, rowIndex: number): string;
 declare function safeGetCellProps(column: ArtColumn, record: any, rowIndex: number): import("./interfaces").CellProps;

package/es/table/pipeline/features/columnDrag.js

@@ -51,13 +51,33 @@ export function columnDrag() {
       var style = cloumnsTranslateData ? {
         transition: '.3s',
         transform: "translate3d(".concat(cloumnsTranslateData[col.code], "px, 0px, 0px)")
-      } : {};
+      } : null;
       var prevGetCellProps = col.getCellProps;
       // !col.code: 选择列 col.lock: 固定列 不允许拖拽
       if (col.lock || !col.code) return col;
+      // 没有拖拽进行时，不包装 getCellProps，避免每个 cell 多一层函数调用
+      if (style == null) {
+        return _extends(_extends({}, col), {
+          headerCellProps: mergeCellProps(col.headerCellProps, _extends({}, isLeaf && path.length === 1 ? {
+            onMouseDown: function onMouseDown(e) {
+              if (e.button !== 0 || !e.currentTarget.contains(e.target)) {
+                return;
+              }
+              handlePointerDown(e.nativeEvent, false, e.currentTarget);
+            },
+            onTouchStart: function onTouchStart(e) {
+              if (e.cancelable) {
+                e.preventDefault();
+              }
+              handlePointerDown(e.nativeEvent, true, e.currentTarget);
+            }
+          } : {}))
+        });
+      }
       return _extends(_extends({}, col), {
         getCellProps: function getCellProps(value, record, rowIndex) {
           var prevCellProps = prevGetCellProps === null || prevGetCellProps === void 0 ? void 0 : prevGetCellProps(value, record, rowIndex);
+          if (style == null) return prevCellProps;
           return mergeCellProps(prevCellProps, {
             style: style
           });
@@ -220,7 +240,6 @@ export function columnDrag() {
             e.stopPropagation(); // 存在移动就阻止冒泡
             currentTarget.addEventListener('click', stopClickPropagation); // 阻止列头点击事件，防止拖动后触发列头过滤事件
           }
-
           window.requestAnimationFrame(function () {
             // 取消阻止列头点击事件
             currentTarget.removeEventListener('click', stopClickPropagation);

package/es/table/pipeline/features/columnFilter.js

@@ -45,7 +45,6 @@ export function filter() {
         var filterable = col.code && ((_a = col.features) === null || _a === void 0 ? void 0 : _a.filterable);
         var filterActive = !!(filterable && (inputFiltersMap === null || inputFiltersMap === void 0 ? void 0 : inputFiltersMap.get(col.code)));
         if (filterable) {
-          var _cx;
           var handleFilterChanged = function handleFilterChanged(filterItem) {
             var nextFiltersMap = new _Map(inputFiltersMap);
             var currentFilter = _extends({
@@ -80,7 +79,7 @@ export function filter() {
             setFilterModel: handleFilterChanged,
             setFilter: setFilter,
             isFilterActive: filterActive,
-            className: cx((_cx = {}, _defineProperty(_cx, Classes.tableFilterTrigger, true), _defineProperty(_cx, "active", filterActive), _cx)),
+            className: cx(_defineProperty(_defineProperty({}, Classes.tableFilterTrigger, true), "active", filterActive)),
             stopClickEventPropagation: stopClickEventPropagation,
             stopESCKeyDownEventPropagation: stopESCKeyDownEventPropagation,
             hideFilterPopupHeader: hideFilterPopupHeader,
@@ -100,7 +99,6 @@ export function filter() {
           //   }
           // })
         }
-
         if (!isLeafNode(col)) {
           var _context3;
           result.children = _mapInstanceProperty(_context3 = col.children).call(_context3, dfs);

package/es/table/pipeline/features/columnHover.js

@@ -24,20 +24,25 @@ export function columnHover() {
       }
       var colIndexMatched = range.start <= hoverColIndex && hoverColIndex < range.end;
       var prevGetCellProps = col.getCellProps;
+      // 预构建 merge 用的 extra 对象，避免在每个 cell 里重复创建
+      var onMouseEnter = function onMouseEnter() {
+        onChangeHoverColIndex(range.start);
+      };
+      var onMouseLeave = function onMouseLeave() {
+        onChangeHoverColIndex(-1);
+      };
+      var cellExtra = {
+        style: {
+          '--bgcolor': colIndexMatched ? hoverColor : undefined
+        },
+        onMouseEnter: onMouseEnter,
+        onMouseLeave: onMouseLeave
+      };
       return _extends(_extends({}, col), {
         getCellProps: function getCellProps(value, record, rowIndex) {
           var prevCellProps = prevGetCellProps === null || prevGetCellProps === void 0 ? void 0 : prevGetCellProps(value, record, rowIndex);
-          return mergeCellProps(prevCellProps, {
-            style: {
-              '--bgcolor': colIndexMatched ? hoverColor : undefined
-            },
-            onMouseEnter: function onMouseEnter() {
-              onChangeHoverColIndex(range.start);
-            },
-            onMouseLeave: function onMouseLeave() {
-              onChangeHoverColIndex(-1);
-            }
-          });
+          if (!prevCellProps) return cellExtra;
+          return mergeCellProps(prevCellProps, cellExtra);
         }
       });
     }));

package/es/table/pipeline/features/columnRangeHover.js

@@ -44,31 +44,32 @@ export function columnRangeHover() {
         });
       }
       var prevGetCellProps = col.getCellProps;
+      // 预构建 merge 用的 extra 对象，避免在每个 cell 里重复创建
+      var onMouseEnter = function onMouseEnter() {
+        onChangeHoverRange(colRange);
+      };
+      var onMouseLeave = function onMouseLeave() {
+        onChangeHoverRange(EMPTY_RANGE);
+      };
+      var cellExtra = {
+        onMouseEnter: onMouseEnter,
+        onMouseLeave: onMouseLeave,
+        style: {
+          '--bgcolor': match ? hoverColor : undefined
+        }
+      };
       return _extends(_extends({}, col), {
         headerCellProps: mergeCellProps(col.headerCellProps, {
-          onMouseEnter: function onMouseEnter() {
-            onChangeHoverRange(colRange);
-          },
-          onMouseLeave: function onMouseLeave() {
-            onChangeHoverRange(EMPTY_RANGE);
-          },
+          onMouseEnter: onMouseEnter,
+          onMouseLeave: onMouseLeave,
           style: {
             '--header-bgcolor': match ? headerHoverColor : undefined
           }
         }),
         getCellProps: function getCellProps(value, record, rowIndex) {
           var prevCellProps = prevGetCellProps === null || prevGetCellProps === void 0 ? void 0 : prevGetCellProps(value, record, rowIndex);
-          return mergeCellProps(prevCellProps, {
-            onMouseEnter: function onMouseEnter() {
-              onChangeHoverRange(colRange);
-            },
-            onMouseLeave: function onMouseLeave() {
-              onChangeHoverRange(EMPTY_RANGE);
-            },
-            style: {
-              '--bgcolor': match ? hoverColor : undefined
-            }
-          });
+          if (!prevCellProps) return cellExtra;
+          return mergeCellProps(prevCellProps, cellExtra);
         }
       });
     }));

package/es/table/pipeline/features/columnResizeWidth.js

@@ -177,7 +177,7 @@ export function columnResize() {
         width = col.width;
       return _extends(_extends({}, col), {
         width: (_a = columnSize[code]) !== null && _a !== void 0 ? _a : width,
-        title: /*#__PURE__*/React.createElement(React.Fragment, null, prevTitle, (features === null || features === void 0 ? void 0 : features.resizeable) !== false && (isGroup ? /*#__PURE__*/React.createElement(TableHeaderGroupCellResize, {
+        title: (/*#__PURE__*/React.createElement(React.Fragment, null, prevTitle, (features === null || features === void 0 ? void 0 : features.resizeable) !== false && (isGroup ? /*#__PURE__*/React.createElement(TableHeaderGroupCellResize, {
           direction: pipeline.ctx.direction,
           className: Classes.tableHeaderCellResize,
           onDoubleClick: function onDoubleClick(e) {
@@ -201,7 +201,7 @@ export function columnResize() {
           onTouchStart: function onTouchStart(e) {
             return handleTouchStart(e, col);
           }
-        }))),
+        })))),
         headerCellProps: mergeCellProps(col.headerCellProps, {
           className: 'resizeable'
         })