@kdcloudjs/table 1.2.0-canary.1 → 1.2.0-canary.11

package/es/locale/locale.d.ts

@@ -26,10 +26,14 @@ declare class LocaleCache {
      */
     setLocalesData(locale: string, localeData?: LocaleDataType): {
         locale: string;
-        'global.selectholder': string;
-        'global.placeholder': string;
-        'global.cancel': string;
-        'global.confirm': string;
+        contain: string;
+        notContain: string;
+        equal: string;
+        notEqual: string;
+        isNull: string;
+        notIsNull: string;
+        resetFilter: string;
+        confirmFilter: string;
     };
     /**
      * 获取当前语言包数据

package/es/locale/zh-CN.d.ts

@@ -1,8 +1,12 @@
 declare const locale: {
     locale: string;
-    'global.selectholder': string;
-    'global.placeholder': string;
-    'global.cancel': string;
-    'global.confirm': string;
+    contain: string;
+    notContain: string;
+    equal: string;
+    notEqual: string;
+    isNull: string;
+    notIsNull: string;
+    resetFilter: string;
+    confirmFilter: string;
 };
 export default locale;

package/es/locale/zh-CN.js

@@ -1,8 +1,14 @@
 var locale = {
   locale: 'zh-CN',
-  'global.selectholder': '请选择',
-  'global.placeholder': '请输入...',
-  'global.cancel': '取消',
-  'global.confirm': '确定'
+  // Text Filter
+  contain: '包含',
+  notContain: '不包含',
+  equal: '等于',
+  notEqual: '不等于',
+  isNull: '为空',
+  notIsNull: '不为空',
+  // filter button
+  resetFilter: '重置',
+  confirmFilter: '确定'
 };
 export default locale;

package/es/table/base/helpers/TableDOMUtils.js

@@ -44,7 +44,8 @@ import { Classes } from '../styles'; // 表格 DOM 结构
 export var TableDOMHelper = /*#__PURE__*/function () {
   function TableDOMHelper(artTableWrapper) {
     var _this = this,
-        _context2;
+        _context2,
+        _context3;
 
     _classCallCheck(this, TableDOMHelper);
 
@@ -91,7 +92,7 @@ export var TableDOMHelper = /*#__PURE__*/function () {
     this.tableFooter = this.artTable.querySelector(".".concat(Classes.tableFooter));
     this.tableFooterMain = this.artTable.querySelector(".".concat(Classes.tableFooterMain));
 
-    var stickyScrollSelector = _concatInstanceProperty(_context2 = ".".concat(Classes.artTable, " + .")).call(_context2, Classes.stickyScroll);
+    var stickyScrollSelector = _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = ".".concat(Classes.artTable, " + .")).call(_context3, Classes.horizontalStickyScrollContainer, " .")).call(_context2, Classes.stickyScroll);
 
     this.stickyScroll = artTableWrapper.querySelector(stickyScrollSelector);
     this.stickyScrollItem = this.stickyScroll.querySelector(".".concat(Classes.stickyScrollItem));
@@ -105,35 +106,37 @@ export var TableDOMHelper = /*#__PURE__*/function () {
   }, {
     key: "getTableRows",
     value: function getTableRows() {
-      var _context3;
+      var _context4;
 
-      var tbody = this.artTable.querySelector(_concatInstanceProperty(_context3 = ".".concat(Classes.tableBody, " .")).call(_context3, Classes.virtual, " table tbody"));
+      var tbody = this.artTable.querySelector(_concatInstanceProperty(_context4 = ".".concat(Classes.tableBody, " .")).call(_context4, Classes.virtual, " table tbody"));
       return tbody.childNodes;
     }
   }, {
     key: "getTableBodyHtmlTable",
     value: function getTableBodyHtmlTable() {
-      var _context4;
+      var _context5;
 
-      return this.artTable.querySelector(_concatInstanceProperty(_context4 = ".".concat(Classes.tableBody, " .")).call(_context4, Classes.virtual, " table"));
+      return this.artTable.querySelector(_concatInstanceProperty(_context5 = ".".concat(Classes.tableBody, " .")).call(_context5, Classes.virtual, " table"));
     }
   }, {
     key: "getLeftLockShadow",
     value: function getLeftLockShadow() {
-      var _context5;
+      var _context6;
 
-      var selector = _concatInstanceProperty(_context5 = ".".concat(Classes.lockShadowMask, " .")).call(_context5, Classes.leftLockShadow);
+      var selector = _concatInstanceProperty(_context6 = ".".concat(Classes.lockShadowMask, " .")).call(_context6, Classes.leftLockShadow);
 
-      return this.artTable.querySelector(selector);
+      var allLeftLockShadow = this.artTable.querySelectorAll(selector);
+      return allLeftLockShadow[allLeftLockShadow.length - 1]; // 当table-body、table-footer嵌套多层表格时，需要查找最后一个，否则会查找到嵌套表格的
     }
   }, {
     key: "getRightLockShadow",
     value: function getRightLockShadow() {
-      var _context6;
+      var _context7;
 
-      var selector = _concatInstanceProperty(_context6 = ".".concat(Classes.lockShadowMask, " .")).call(_context6, Classes.rightLockShadow);
+      var selector = _concatInstanceProperty(_context7 = ".".concat(Classes.lockShadowMask, " .")).call(_context7, Classes.rightLockShadow);
 
-      return this.artTable.querySelector(selector);
+      var allRightLockShadow = this.artTable.querySelectorAll(selector);
+      return allRightLockShadow[allRightLockShadow.length - 1]; // 当table-body、table-footer嵌套多层表格时，需要查找最后一个，否则会查找到嵌套表格的
     }
   }, {
     key: "getLoadingIndicator",
@@ -143,11 +146,11 @@ export var TableDOMHelper = /*#__PURE__*/function () {
   }, {
     key: "getRowTop",
     value: function getRowTop(rowIndex) {
-      var _context7, _context8;
+      var _context8, _context9;
 
       if (rowIndex === 0) return 0;
 
-      var selector = _concatInstanceProperty(_context7 = _concatInstanceProperty(_context8 = ".".concat(Classes.tableBody, " .")).call(_context8, Classes.tableRow, "[data-rowindex=\"")).call(_context7, rowIndex, "\"]");
+      var selector = _concatInstanceProperty(_context8 = _concatInstanceProperty(_context9 = ".".concat(Classes.tableBody, " .")).call(_context9, Classes.tableRow, "[data-rowindex=\"")).call(_context8, rowIndex, "\"]");
 
       var row = this.artTable.querySelector(selector);
       var rowOffsetTop = row && row.offsetTop || 0;

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

@@ -25,6 +25,9 @@ export declare const Classes: {
     readonly stickyScrollItem: string;
     readonly horizontalScrollContainer: string;
     readonly verticalScrollPlaceholder: string;
+    readonly horizontalStickyScrollContainer: string;
+    readonly horizontalScrollLeftSpacer: string;
+    readonly horizontalScrollRightSpacer: string;
     readonly lockShadowMask: string;
     readonly lockShadow: string;
     readonly leftLockShadow: string;
@@ -67,6 +70,13 @@ export declare const Classes: {
     readonly popup: string;
     readonly popupHeader: string;
     readonly popupBody: string;
+    readonly rowDragging: string;
+    readonly rowDragStart: string;
+    readonly rowDragEnd: string;
+    readonly rowDragEndToTop: string;
+    readonly rowDragEndToBottom: string;
+    readonly rowDragElement: string;
+    readonly rowDragCell: string;
 };
 export declare const MenuClasses: {
     menu: string;

package/es/table/base/styles.js

@@ -37,6 +37,9 @@ export var Classes = {
   stickyScrollItem: "".concat(prefix, "sticky-scroll-item"),
   horizontalScrollContainer: "".concat(prefix, "horizontal-scroll-container"),
   verticalScrollPlaceholder: "".concat(prefix, "vertical-scroll-placeholder"),
+  horizontalStickyScrollContainer: "".concat(prefix, "horizontal-sticky-scroll-container"),
+  horizontalScrollLeftSpacer: "".concat(prefix, "horizontal-scroll-left-spacer"),
+  horizontalScrollRightSpacer: "".concat(prefix, "horizontal-scroll-right-spacer"),
   lockShadowMask: "".concat(prefix, "lock-shadow-mask"),
   lockShadow: "".concat(prefix, "lock-shadow"),
   leftLockShadow: "".concat(prefix, "left-lock-shadow"),
@@ -79,7 +82,14 @@ export var Classes = {
   collapsed: "".concat(prefix, "collapsed"),
   popup: "".concat(prefix, "popup"),
   popupHeader: "".concat(prefix, "popup-header"),
-  popupBody: "".concat(prefix, "popup-body")
+  popupBody: "".concat(prefix, "popup-body"),
+  rowDragging: "".concat(prefix, "row-dragging"),
+  rowDragStart: "".concat(prefix, "row-drag-start"),
+  rowDragEnd: "".concat(prefix, "row-drag-end"),
+  rowDragEndToTop: "".concat(prefix, "row-drag-end-to-top"),
+  rowDragEndToBottom: "".concat(prefix, "row-drag-end-to-bottom"),
+  rowDragElement: "".concat(prefix, "row-drag-element"),
+  rowDragCell: "".concat(prefix, "row-drag-cell")
 };
 export var MenuClasses = {
   menu: "".concat(prefix, "table-menu"),
@@ -131,7 +141,7 @@ export var defaultCSSVariables = {
 export var variableConst = getCssVariableText(defaultCSSVariables);
 var notBorderedStyleMixin = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  --cell-border-vertical: none;\n  --header-cell-border-vertical: none;\n"])));
 var borderedStyleMixin = css(_templateObject3 || (_templateObject3 = _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(_templateObject4 || (_templateObject4 = _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    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-left: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-bottom: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-right: 1px solid #0E5FD8 !important;\n    }\n  }\n\n  .", " {\n    user-select:none;\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: left;\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-right: var(--header-cell-border-vertical);\n    border-bottom: var(--header-cell-border-horizontal);\n    position: relative;\n  }\n\n  th.resizeable{\n    border-right: var(--header-cell-border-vertical)\n  }\n\n  th.", " {\n    border-right: 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-left: 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-right: var(--cell-border-vertical);\n    border-bottom: var(--cell-border-horizontal);\n    word-break: break-all;\n  }\n  td.", " {\n    border-left: 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-right: ", "px;\n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-right: var(--cell-border-vertical);\n      }\n    }\n\n    .", " {\n      margin-left: ", "px;\n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-left: 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 IE\u517C\u5BB9\n  &.ie-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    }\n    .", " {\n      position: relative;\n    }\n\n    .", " {\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      left:0;\n    }\n    .", "{\n      right: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\n\n  //#region \u7C98\u6027\u6EDA\u52A8\u6761\n  .", " {\n    overflow-y: hidden;\n    overflow-x: auto;\n    z-index: ", ";\n    flex-shrink: 0;\n    flex-grow: 0;\n    border-top: 1px solid var(--border-color);\n    background: var(--bgcolor);\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    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    right: 0;\n    width: 5px;\n    &::after{\n      left: 4px;\n    }\n  }\n  //#endregion\n\n  "])), variableConst, variableConst, outerBorderStyleMixin, Classes.artTableBordered, notBorderedStyleMixin, Classes.artTableBordered, borderedStyleMixin, Classes.artTable, Classes.tableHeader, Classes.tableHeaderCellContent, Classes.virtual, Classes.tableFooter, Classes.tableBody, Classes.tableFooter, Classes.tableRow, Classes.tableBody, Classes.tableFooter, Classes.tableCellRangeSelected, Classes.tableCellRangeTop, Classes.tableCellRangeLeft, Classes.tableCellRangeBottom, Classes.tableCellRangeRight, Classes.rangeSelection, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.leaf, Classes.first, Classes.first, Classes.first, Classes.first, Classes.first, Classes.last, Classes.lockLeft, Classes.lockRight, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.virtual, Classes.tableBody, Classes.tableFooter, Classes.tableHeaderMain, Classes.tableHeader, Classes.tableFooterMain, Classes.fixedLeft, Classes.fixedRight, Z.lock, Classes.fixedLeft, Classes.fixedRight, Classes.rowDetailContainer, Classes.rowDetailItem, Z.rowDetail, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingContentWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator, Classes.tableFilterTrigger, Classes.tableSortIcon, Classes.tableExtendIcon, Classes.verticalScrollPlaceholder, Classes.tableFooter, Classes.verticalScrollPlaceholder, Classes.tableHeaderCellResize, Classes.tableHeaderRow, Classes.last, Classes.tableHeaderCellResize);
+export var StyledArtTableWrapper = styled.div(_templateObject4 || (_templateObject4 = _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    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-left: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-bottom: 1px solid #0E5FD8 !important;\n    }\n    .", "{\n      border-right: 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\n  .", "::after{\n    content: \"\";\n    position: absolute;\n    display: block;\n    left: 0px;\n    width: 100%;\n    height: 1px;\n    top:0px;\n    z-index:20;\n    background-color:var(--primary-color);\n  }\n\n  .", "::after{\n    content: \"\";\n    position: absolute;\n    display: block;\n    left: 0px;\n    width: 100%;\n    height: 1px;\n    bottom:0px;\n    z-index:20;\n    background-color:var(--primary-color);\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: left;\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-right: var(--header-cell-border-vertical);\n    border-bottom: var(--header-cell-border-horizontal);\n    position: relative;\n  }\n\n  th.resizeable{\n    border-right: var(--header-cell-border-vertical)\n  }\n\n  th.", " {\n    border-right: 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-left: 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-right: var(--cell-border-vertical);\n    border-bottom: var(--cell-border-horizontal);\n    word-break: break-all;\n  }\n  td.", " {\n    border-left: 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-right: ", "px;\n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-right: var(--cell-border-vertical);\n      }\n    }\n\n    .", " {\n      margin-left: ", "px;\n      box-shadow: none;\n\n      &.show-shadow {\n        box-shadow: var(--lock-shadow);\n        border-left: 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 IE\u517C\u5BB9\n  &.ie-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    }\n    .", " {\n      position: relative;\n    }\n\n    .", " {\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      left:0;\n    }\n    .", "{\n      right: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\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    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    right: 0;\n    width: 5px;\n    &::after{\n      left: 4px;\n    }\n  }\n  //#endregion\n\n  "])), variableConst, variableConst, outerBorderStyleMixin, Classes.artTableBordered, notBorderedStyleMixin, Classes.artTableBordered, borderedStyleMixin, Classes.artTable, Classes.tableHeader, Classes.tableHeaderCellContent, Classes.virtual, Classes.tableFooter, Classes.tableBody, Classes.tableFooter, Classes.tableRow, Classes.tableBody, Classes.tableFooter, Classes.tableCellRangeSelected, Classes.tableCellRangeTop, Classes.tableCellRangeLeft, Classes.tableCellRangeBottom, Classes.tableCellRangeRight, Classes.rangeSelection, Classes.rowDragging, Classes.tableBody, Classes.tableRow, Classes.tableFooter, Classes.tableRow, Classes.rowDragStart, Classes.rowDragEndToTop, Classes.rowDragEndToBottom, Classes.rowDragCell, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.leaf, Classes.first, Classes.first, Classes.first, Classes.first, Classes.first, Classes.last, Classes.lockLeft, Classes.lockRight, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.virtual, Classes.tableBody, Classes.tableFooter, Classes.tableHeaderMain, Classes.tableHeader, Classes.tableFooterMain, Classes.fixedLeft, Classes.fixedRight, Z.lock, Classes.fixedLeft, Classes.fixedRight, Classes.rowDetailContainer, Classes.rowDetailItem, Z.rowDetail, Classes.horizontalStickyScrollContainer, Classes.horizontalScrollLeftSpacer, Classes.horizontalScrollRightSpacer, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingContentWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator, Classes.tableFilterTrigger, Classes.tableSortIcon, Classes.tableExtendIcon, Classes.verticalScrollPlaceholder, Classes.tableFooter, Classes.verticalScrollPlaceholder, Classes.tableHeaderCellResize, Classes.tableHeaderRow, Classes.last, Classes.tableHeaderCellResize);
 export var ButtonCSS = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", "\n  //#region \u6309\u94AE\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//#endregion\n"])), variableConst, Classes.button, Classes.buttonPrimary);
 
 function getCssVariableText(obj) {

package/es/table/base/table.js

@@ -260,10 +260,14 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
 
       if (_lastHasScrollY !== this.hasScrollY) {
         (_b = (_a = this.props).setTableWidth) === null || _b === void 0 ? void 0 : _b.call(_a, this.domHelper.tableBody.clientWidth);
-      } // 设置子节点宽度
+      }
 
+      var _this$lastInfo = this.lastInfo,
+          leftLockTotalWidth = _this$lastInfo.leftLockTotalWidth,
+          rightLockTotalWidth = _this$lastInfo.rightLockTotalWidth;
+      var lockTotalWidth = leftLockTotalWidth + rightLockTotalWidth; // 设置子节点宽度
 
-      stickyScrollItem.style.width = "".concat(innerTableWidth, "px");
+      stickyScrollItem.style.width = "".concat(innerTableWidth - lockTotalWidth, "px");
     }
   }, {
     key: "renderTableHeader",
@@ -433,13 +437,25 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
           stickyBottom = _this$props5.stickyBottom;
       var hasScroll = this.state.hasScroll;
       return /*#__PURE__*/React.createElement("div", {
-        className: cx(Classes.stickyScroll, Classes.horizontalScrollContainer),
+        className: cx(Classes.horizontalScrollContainer, Classes.horizontalStickyScrollContainer)
+      }, /*#__PURE__*/React.createElement("div", {
+        className: cx(Classes.horizontalScrollLeftSpacer),
+        style: {
+          width: info.leftLockTotalWidth
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: cx(Classes.stickyScroll),
         style: {
           display: hasStickyScroll && hasScroll ? 'block' : 'none',
           bottom: stickyBottom
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: Classes.stickyScrollItem
+      })), /*#__PURE__*/React.createElement("div", {
+        className: cx(Classes.horizontalScrollRightSpacer),
+        style: {
+          width: info.rightLockTotalWidth
+        }
       }));
     }
   }, {
@@ -522,7 +538,22 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
-      // console.log('did update start')
+      var _a; // console.log('did update start')
+
+
+      var _this$props8 = this.props,
+          cssVariables = _this$props8.cssVariables,
+          enableCSSVariables = _this$props8.enableCSSVariables,
+          bordered = _this$props8.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 || {},
+          enableCSSVariables: enableCSSVariables,
+          bordered: bordered
+        });
+      }
+
       this.updateDOMHelper();
       this.props$.next(this.props);
       this.didMountOrUpdate(prevProps, prevState); // console.log('did update end')
@@ -752,9 +783,9 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
     value: function adjustNeedRenderLock() {
       var needRenderLock = this.state.needRenderLock;
 
-      var _this$lastInfo = this.lastInfo,
-          flat = _flatInstanceProperty(_this$lastInfo),
-          hasLockColumn = _this$lastInfo.hasLockColumn;
+      var _this$lastInfo2 = this.lastInfo,
+          flat = _flatInstanceProperty(_this$lastInfo2),
+          hasLockColumn = _this$lastInfo2.hasLockColumn;
 
       if (hasLockColumn) {
         var _context;

package/es/table/common-views.js

@@ -7,7 +7,9 @@ import React from 'react';
 import styled from 'styled-components';
 import { MenuClasses, Classes } from './base/styles';
 export var InlineFlexCell = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n"])));
-export var ExpansionCell = styled(InlineFlexCell)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &.", " {\n    cursor: default;\n  }\n\n  .expansion-icon {\n    fill: #999;\n    flex: 0 0 16px;\n    transition: transform 200ms;\n\n    &.", " {\n      transform-origin: center center;\n      transform: rotate(90deg);\n    }\n  }\n"])), Classes.leaf, Classes.expanded);
+export var ExpansionCell = styled(function (props) {
+  return /*#__PURE__*/React.createElement(InlineFlexCell, _extends({}, props));
+})(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &.", " {\n    cursor: default;\n  }\n\n  .expansion-icon {\n    fill: #999;\n    flex: 0 0 16px;\n    transition: transform 200ms;\n\n    &.", " {\n      transform-origin: center center;\n      transform: rotate(90deg);\n    }\n  }\n"])), Classes.leaf, Classes.expanded);
 
 function CaretDownIcon(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({

package/es/table/interfaces.d.ts

@@ -27,6 +27,8 @@ export interface ArtColumnStaticPart {
     features?: {
         [key: string]: any;
     };
+    /** 表头设置操作项到自定义操作区 */
+    renderHeader?: (title: ReactNode, opr: ReactNode) => ReactNode;
 }
 export interface Features {
     /** 是否开启排序功能 */
@@ -90,6 +92,9 @@ export interface FilterPanelProps {
 export interface DefaultFilterPanelProps extends FilterPanelProps {
     setFilterModel(filterItem?: Pick<FilterItem, 'filter' | 'filterCondition'>): void;
     filterModel: FilterItem;
+    localeText: {
+        [key: string]: string;
+    };
 }
 export interface CustomeFilterPanelProps extends FilterPanelProps {
     setFilter(filter?: any[]): void;

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

@@ -27,7 +27,8 @@ export var autoFillTableWidth = function autoFillTableWidth() {
         // 保存剩余的flex总和和剩余宽度总和宽度
         var residualFlexCount = flexCount;
         var residualFlexWidth = remainingWidth;
-        var columnSize = pipeline.getFeatureOptions(COLUMN_SIZE_KEY) || {};
+        var columnSize = pipeline.getFeatureOptions(COLUMN_SIZE_KEY);
+        var enableColumnResizeWidthFeature = !!columnSize;
         pipeline.mapColumns(makeRecursiveMapper(function (col, recursiveFlatMapInfo) {
           var isLeaf = recursiveFlatMapInfo.isLeaf;
 
@@ -46,12 +47,15 @@ export var autoFillTableWidth = function autoFillTableWidth() {
             col.width = clamp(minWidth, preColWidth + (residualFlexCount === flex ? residualFlexWidth : usedRemainingWidth), maxWidth);
             residualFlexCount -= flex;
             residualFlexWidth -= col.width - preColWidth;
-            columnSize[code] = col.width;
+
+            if (enableColumnResizeWidthFeature) {
+              columnSize[code] = col.width;
+            }
           }
 
           return col;
         }));
-        pipeline.setFeatureOptions(COLUMN_SIZE_KEY, columnSize);
+        enableColumnResizeWidthFeature && pipeline.setFeatureOptions(COLUMN_SIZE_KEY, columnSize);
       }
     } else {
       // 未设置了flex宽度，创建占位列
@@ -129,7 +133,9 @@ function getColumnWidthSum(pipeline) {
 }
 
 function getTableRemainingWidth(pipeline) {
-  var tableWidth = pipeline.getStateAtKey(tableWidthKey);
+  var _a, _b;
+
+  var tableWidth = ((_b = (_a = pipeline.ref.current.domHelper) === null || _a === void 0 ? void 0 : _a.tableBody) === null || _b === void 0 ? void 0 : _b.clientWidth) || pipeline.getStateAtKey(tableWidthKey);
   if (!tableWidth) return;
   var remainingWidth = Math.floor(tableWidth - getColumnWidthSum(pipeline));
   return remainingWidth > 0 ? remainingWidth : 0;

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

@@ -315,9 +315,14 @@ export function columnDrag() {
                 if (onColumnDragStopped) {
                   var _context;
 
+                  var isRowDragColumn = function isRowDragColumn(code) {
+                    var rowDragColumnKey = pipeline.getFeatureOptions('rowDragColumnKey');
+                    return code === rowDragColumnKey;
+                  };
+
                   var newColumns = _filterInstanceProperty(_context = sortColumns(columns, cloumnsSortData)).call(_context, function (_ref) {
                     var code = _ref.code;
-                    return code !== FILL_COLUMN_CODE;
+                    return code !== FILL_COLUMN_CODE && !isRowDragColumn(code);
                   }); // TODO drag需要在resize之后use,否则这里返回的列对应的宽度不是拖拽后的
 
 

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

@@ -1,5 +1,5 @@
-import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _toConsumableArray from "@babel/runtime-corejs3/helpers/toConsumableArray";
+import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _Map from "@babel/runtime-corejs3/core-js-stable/map";
@@ -37,6 +37,7 @@ export function filter() {
     var inputFiltersMap = new _Map(_mapInstanceProperty(inputFilters).call(inputFilters, function (filterItem) {
       return [filterItem.code, _extends({}, filterItem)];
     }));
+    var localeText = pipeline.ctx.localeText;
 
     function processColumns(columns) {
       return _mapInstanceProperty(columns).call(columns, dfs);
@@ -50,7 +51,7 @@ export function filter() {
         var filterActive = filterable && ((_c = (_b = inputFiltersMap === null || inputFiltersMap === void 0 ? void 0 : inputFiltersMap.get(col.code)) === null || _b === void 0 ? void 0 : _filterInstanceProperty(_b)) === null || _c === void 0 ? void 0 : _c.length) > 0;
 
         if (filterable) {
-          var _context, _context2, _cx;
+          var _cx;
 
           var handleFilterChanged = function handleFilterChanged(filterItem) {
             var nextFiltersMap = new _Map(inputFiltersMap);
@@ -85,7 +86,8 @@ export function filter() {
 
           var filterPanel = (_d = col.features) === null || _d === void 0 ? void 0 : _d.filterPanel;
           var colFilterIcon = (_f = (_e = col.features) === null || _e === void 0 ? void 0 : _e.filterIcon) !== null && _f !== void 0 ? _f : filterIcon;
-          result.title = _concatInstanceProperty(_context = []).call(_context, _toConsumableArray(_concatInstanceProperty(_context2 = []).call(_context2, (_g = result.title) !== null && _g !== void 0 ? _g : [internals.safeRenderHeader(_extends({}, col))])), [/*#__PURE__*/React.createElement(Filter, {
+
+          var _Filter = /*#__PURE__*/React.createElement(Filter, {
             key: "filter",
             FilterPanelContent: filterPanel,
             filterIcon: colFilterIcon,
@@ -97,12 +99,22 @@ export function filter() {
             stopClickEventPropagation: stopClickEventPropagation,
             stopESCKeyDownEventPropagation: stopESCKeyDownEventPropagation,
             hideFilterPopupHeader: hideFilterPopupHeader,
-            getPopupParent: getPopupParent
-          })]); // result.headerCellProps = mergeCellProps(col.headerCellProps, {
+            getPopupParent: getPopupParent,
+            localeText: localeText
+          });
+
+          if (col.renderHeader) {
+            result.title = col.renderHeader(result.title, _Filter);
+          } else {
+            var _context, _context2;
+
+            result.title = _concatInstanceProperty(_context = []).call(_context, _toConsumableArray(_concatInstanceProperty(_context2 = []).call(_context2, (_g = result.title) !== null && _g !== void 0 ? _g : [internals.safeRenderHeader(_extends({}, col))])), [_Filter]);
+          } // result.headerCellProps = mergeCellProps(col.headerCellProps, {
           //   style: {
           //     paddingRight: '18px'
           //   }
           // })
+
         }
 
         if (!isLeafNode(col)) {

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

@@ -14,7 +14,9 @@ import { mergeCellProps, collectNodes, makeRecursiveMapper, isGroupColumn } from
 import { internals } from '../../internals';
 import { Classes } from '../../base/styles';
 var TableHeaderCellResize = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  right: -5px;\n  height: 100%;\n  width: 10px;\n  cursor: ew-resize;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  z-index:1;\n\n  &:after {\n    content: \"\";\n    position: absolute;\n    display: block;\n    left: calc(50% - 1px);\n    width: 1px;\n    height: calc(100% - 14px);\n    top: 7px;\n  }\n"])));
-var TableHeaderGroupCellResize = styled(TableHeaderCellResize)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &:after {\n    height: 100%;\n    top: 0;\n  }\n"])));
+var TableHeaderGroupCellResize = styled(function (props) {
+  return /*#__PURE__*/React.createElement(TableHeaderCellResize, _extends({}, props));
+})(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &:after {\n    height: 100%;\n    top: 0;\n  }\n"])));
 
 function clamp(min, x, max) {
   return Math.max(min, Math.min(max, x));

package/es/table/pipeline/features/filter/DefaultFilterContent.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { DefaultFilterPanelProps } from '../../../interfaces';
-declare function DefaultFilterContent({ setFilterModel, filterModel, hidePanel }: DefaultFilterPanelProps): JSX.Element;
+declare function DefaultFilterContent({ setFilterModel, filterModel, hidePanel, localeText }: DefaultFilterPanelProps): JSX.Element;
 export default DefaultFilterContent;

package/es/table/pipeline/features/filter/DefaultFilterContent.js

@@ -19,7 +19,11 @@ function DefaultFilterContent(_ref) {
 
   var setFilterModel = _ref.setFilterModel,
       filterModel = _ref.filterModel,
-      hidePanel = _ref.hidePanel;
+      hidePanel = _ref.hidePanel,
+      _ref$localeText = _ref.localeText,
+      localeText = _ref$localeText === void 0 ? {} : _ref$localeText;
+
+  var _a, _b;
 
   var _React$useState = React.useState((filterModel === null || filterModel === void 0 ? void 0 : filterModel.filterCondition) || 'contain'),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -72,16 +76,18 @@ function DefaultFilterContent(_ref) {
   return /*#__PURE__*/React.createElement(DefaultFilterContentStyle, null, /*#__PURE__*/React.createElement("div", {
     className: 'filter-option-list'
   }, /*#__PURE__*/React.createElement("ul", null, _mapInstanceProperty(DEFAULT_FILTER_OPTIONS).call(DEFAULT_FILTER_OPTIONS, function (option, index) {
+    var _a;
+
     return (
       /*#__PURE__*/
       // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
       React.createElement("li", {
-        key: index,
+        key: option.key,
         className: option.key === selectedValue ? 'active' : '',
         onClick: function onClick() {
           return handleClick(option);
         }
-      }, option.title)
+      }, (_a = localeText[option.key]) !== null && _a !== void 0 ? _a : option.title)
     );
   }))), selectedValue !== 'notIsNull' && selectedValue !== 'isNull' && /*#__PURE__*/React.createElement("div", {
     className: 'filter-search'
@@ -100,12 +106,12 @@ function DefaultFilterContent(_ref) {
       'filter-btn': true
     }, Classes.button, true)),
     onClick: reset
-  }, "\u91CD\u7F6E"), /*#__PURE__*/React.createElement("button", {
+  }, (_a = localeText.resetFilter) !== null && _a !== void 0 ? _a : '重置'), /*#__PURE__*/React.createElement("button", {
     className: cx((_cx2 = {
       'filter-btn': true
     }, _defineProperty(_cx2, Classes.button, true), _defineProperty(_cx2, Classes.buttonPrimary, true), _cx2)),
     onClick: confirm
-  }, "\u786E\u5B9A")));
+  }, (_b = localeText.confirmFilter) !== null && _b !== void 0 ? _b : '确定')));
 }
 
 export default DefaultFilterContent;

package/es/table/pipeline/features/filter/Filter.d.ts

@@ -15,6 +15,9 @@ interface FilterProps {
     stopESCKeyDownEventPropagation?: boolean;
     hideFilterPopupHeader?: boolean;
     getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
+    localeText?: {
+        [key: string]: string;
+    };
 }
-declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader, getPopupParent }: FilterProps): JSX.Element;
+declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader, getPopupParent, localeText }: FilterProps): JSX.Element;
 export default Filter;

package/es/table/pipeline/features/filter/Filter.js

@@ -77,7 +77,8 @@ function Filter(_ref2) {
       stopClickEventPropagation = _ref2.stopClickEventPropagation,
       stopESCKeyDownEventPropagation = _ref2.stopESCKeyDownEventPropagation,
       hideFilterPopupHeader = _ref2.hideFilterPopupHeader,
-      getPopupParent = _ref2.getPopupParent;
+      getPopupParent = _ref2.getPopupParent,
+      localeText = _ref2.localeText;
 
   var _React$useState3 = React.useState(false),
       _React$useState4 = _slicedToArray(_React$useState3, 2),
@@ -104,7 +105,8 @@ function Filter(_ref2) {
         setFilterModel: setFilterModel,
         filterModel: filterModel,
         isFilterActive: isFilterActive,
-        hidePanel: hidePanel
+        hidePanel: hidePanel,
+        localeText: localeText
       });
     }
   };

package/es/table/pipeline/features/index.d.ts

@@ -18,3 +18,4 @@ export { rangeSelection, RangeSelectionFeatureOptions } from './rangeSelection';
 export { mergeCellHover } from './mergeCellHover';
 export { footerDataSource, FooterDataSourceFeatureOptions, footerRowMetaSymbol } from './footerDataSource';
 export { colGroupExtendable, colGroupExtendOption } from './colGroupExtendable';
+export { rowDrag, RowDragFeatureOptions } from './rowDrag';

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

@@ -17,4 +17,5 @@ export { filter } from './columnFilter';
 export { rangeSelection } from './rangeSelection';
 export { mergeCellHover } from './mergeCellHover';
 export { footerDataSource, footerRowMetaSymbol } from './footerDataSource';
-export { colGroupExtendable } from './colGroupExtendable';
+export { colGroupExtendable } from './colGroupExtendable';
+export { rowDrag } from './rowDrag';