@kdcloudjs/table 1.1.5-canary.1 → 1.1.5-canary.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/@kdcloudjs/table.css +1 -1
  2. package/dist/@kdcloudjs/table.js +74 -65
  3. package/dist/@kdcloudjs/table.js.map +1 -1
  4. package/dist/@kdcloudjs/table.min.css +1 -1
  5. package/dist/@kdcloudjs/table.min.js +7 -7
  6. package/dist/@kdcloudjs/table.min.js.map +1 -1
  7. package/es/table/base/styles.js +2 -2
  8. package/es/table/base/table.d.ts +1 -1
  9. package/es/table/base/table.js +3 -2
  10. package/es/table/common-views.js +1 -1
  11. package/es/table/pipeline/features/colGroupExtendable.d.ts +2 -0
  12. package/es/table/pipeline/features/colGroupExtendable.js +5 -3
  13. package/es/table/pipeline/features/columnFilter.d.ts +5 -1
  14. package/es/table/pipeline/features/columnFilter.js +6 -2
  15. package/es/table/pipeline/features/contextMenu.d.ts +5 -1
  16. package/es/table/pipeline/features/contextMenu.js +18 -28
  17. package/es/table/pipeline/features/filter/DefaultFilterContent.js +5 -5
  18. package/es/table/pipeline/features/filter/Filter.d.ts +3 -1
  19. package/es/table/pipeline/features/filter/Filter.js +21 -12
  20. package/es/table/pipeline/features/rangeSelection.js +10 -0
  21. package/es/table/pipeline/pipeline.d.ts +0 -4
  22. package/es/table/pipeline/pipeline.js +4 -10
  23. package/lib/table/base/styles.js +2 -2
  24. package/lib/table/base/table.d.ts +1 -1
  25. package/lib/table/base/table.js +3 -2
  26. package/lib/table/common-views.js +1 -1
  27. package/lib/table/pipeline/features/colGroupExtendable.d.ts +2 -0
  28. package/lib/table/pipeline/features/colGroupExtendable.js +5 -3
  29. package/lib/table/pipeline/features/columnFilter.d.ts +5 -1
  30. package/lib/table/pipeline/features/columnFilter.js +6 -2
  31. package/lib/table/pipeline/features/contextMenu.d.ts +5 -1
  32. package/lib/table/pipeline/features/contextMenu.js +17 -28
  33. package/lib/table/pipeline/features/filter/DefaultFilterContent.js +5 -5
  34. package/lib/table/pipeline/features/filter/Filter.d.ts +3 -1
  35. package/lib/table/pipeline/features/filter/Filter.js +21 -12
  36. package/lib/table/pipeline/features/rangeSelection.js +10 -0
  37. package/lib/table/pipeline/pipeline.d.ts +0 -4
  38. package/lib/table/pipeline/pipeline.js +4 -11
  39. package/package.json +1 -1
package/es/table/base/styles.js CHANGED
@@ -103,7 +103,7 @@ export var defaultCSSVariables = {
103
103
  '--row-height': '48px',
104
104
  '--color': '#333',
105
105
  '--bgcolor': 'white',
106
- '--hover-bgcolor': 'var(--hover-color, #F2F6FF)',
106
+ '--hover-bgcolor': 'var(--hover-color, #f5f5f5)',
107
107
  '--highlight-bgcolor': '#eee',
108
108
  '--primary-color': '#5582F3',
109
109
  '--primary-color-level1': 'rgb(242, 248, 255)',
@@ -131,7 +131,7 @@ export var defaultCSSVariables = {
131
131
  export var variableConst = getCssVariableText(defaultCSSVariables);
132
132
  var notBorderedStyleMixin = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n --cell-border-vertical: none;\n --header-cell-border-vertical: none;\n"])));
133
133
  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);
134
- 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 //#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);
134
+ 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);
135
135
  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);
136
136
 
137
137
  function getCssVariableText(obj) {
package/es/table/base/table.d.ts CHANGED
@@ -77,7 +77,7 @@ export interface BaseTableProps {
77
77
  getTableProps?(): React.HTMLAttributes<HTMLTableElement>;
78
78
  setTableWidth?(tableWidth: number): void;
79
79
  setTableDomHelper?(domHelper: TableDOMHelper): void;
80
- clearRangeSelectionStatus?(): void;
80
+ setRowHeightManager?(rowHeightManager: any): void;
81
81
  cssVariables?: {
82
82
  [key: string]: any;
83
83
  };
package/es/table/base/table.js CHANGED
@@ -11,7 +11,7 @@ import _inherits from "@babel/runtime-corejs3/helpers/inherits";
11
11
  import _possibleConstructorReturn from "@babel/runtime-corejs3/helpers/possibleConstructorReturn";
12
12
  import _getPrototypeOf from "@babel/runtime-corejs3/helpers/getPrototypeOf";
13
13
 
14
- 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; } } }; }
14
+ 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; } } }; }
15
15
 
16
16
  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); }
17
17
 
@@ -496,7 +496,7 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
496
496
  }, {
497
497
  key: "componentDidMount",
498
498
  value: function componentDidMount() {
499
- var _a, _b, _c, _d; // console.log('did mount start')
499
+ var _a, _b, _c, _d, _e, _f; // console.log('did mount start')
500
500
  // console.log('update dom helper start')
501
501
 
502
502
 
@@ -517,6 +517,7 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
517
517
  });
518
518
  (_b = (_a = this.props).setTableWidth) === null || _b === void 0 ? void 0 : _b.call(_a, this.domHelper.tableBody.clientWidth);
519
519
  (_d = (_c = this.props).setTableDomHelper) === null || _d === void 0 ? void 0 : _d.call(_c, this.domHelper);
520
+ (_f = (_e = this.props).setRowHeightManager) === null || _f === void 0 ? void 0 : _f.call(_e, this.rowHeightManager);
520
521
  }
521
522
  }, {
522
523
  key: "componentDidUpdate",
package/es/table/common-views.js CHANGED
@@ -67,4 +67,4 @@ export var icons = {
67
67
  CaretRight: CaretRightIcon,
68
68
  Info: InfoIcon
69
69
  };
70
- export var ContextMenuStyleWrap = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n &.", "{\n border: 1px solid #e9ecf1;\n border-radius: 2px;\n background-color: #Fff;\n box-shadow: 0px 0px 5px 0px rgb(154 154 154 / 50%);\n cursor: default;\n font-size: 13px;\n position:absolute;\n z-index: 1050;\n width:120px;\n }\n\n .", "{\n width:100%;\n display: table;\n }\n\n .", " .", "{\n display: table-row;\n color: #666666;\n }\n\n .", " .", "{\n background-color: #f5f5f5;\n }\n\n .", " .", " .", "{\n display: table-cell;\n padding: 5px 8px;\n }\n .", " .", ".", "{\n opacity: .5;\n }\n\n"])), MenuClasses.menu, MenuClasses.menuList, MenuClasses.menuList, MenuClasses.menuOption, MenuClasses.menuList, MenuClasses.menuOptionActive, MenuClasses.menuList, MenuClasses.menuOption, MenuClasses.menuOptionText, MenuClasses.menuList, MenuClasses.menuOption, MenuClasses.menuOptionDisable);
70
+ export var ContextMenuStyleWrap = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n &.", "{\n border: 1px solid #e9ecf1;\n border-radius: 2px;\n background-color: #Fff;\n box-shadow: 0px 0px 5px 0px rgb(154 154 154 / 50%);\n cursor: default;\n font-size: 12px;\n position:absolute;\n z-index: 1050;\n max-width: 600px;\n padding: 8px 0;\n }\n\n .", "{\n width:100%;\n display: table;\n }\n\n .", " .", "{\n display: table-row;\n color: #212121;\n }\n\n .", " .", "{\n background-color: var(--hover-bgcolor);\n }\n\n .", " .", " .", "{\n display: table-cell;\n padding: 8px 12px;\n max-width: 576px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n line-height: 16px;\n }\n .", " .", ".", "{\n opacity: .5;\n }\n\n"])), MenuClasses.menu, MenuClasses.menuList, MenuClasses.menuList, MenuClasses.menuOption, MenuClasses.menuList, MenuClasses.menuOptionActive, MenuClasses.menuList, MenuClasses.menuOption, MenuClasses.menuOptionText, MenuClasses.menuList, MenuClasses.menuOption, MenuClasses.menuOptionDisable);
package/es/table/pipeline/features/colGroupExtendable.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  import { TablePipeline } from "../pipeline";
2
+ import { ReactNode } from 'react';
2
3
  export interface colGroupExtendOption {
3
4
  onChangeExtendStatus?({}: any, {}: any): void;
4
5
  extendStatus?: {};
6
+ extendIcon?: ReactNode | ((extendStatus: boolean) => ReactNode);
5
7
  }
6
8
  export declare const colGroupExtendable: (opts?: colGroupExtendOption) => (pipeline: TablePipeline) => TablePipeline;
package/es/table/pipeline/features/colGroupExtendable.js CHANGED
@@ -60,11 +60,13 @@ export var colGroupExtendable = function colGroupExtendable() {
60
60
  var addIcon = function addIcon(col) {
61
61
  var result = _extends({}, col);
62
62
 
63
+ var curColState = curState[col.code];
64
+ var displaycolExtendIcon = typeof opts.extendIcon === 'function' ? opts.extendIcon(curColState) : opts.extendIcon;
63
65
  var addIconNode = /*#__PURE__*/React.createElement(React.Fragment, null, internals.safeRenderHeader(_extends({}, col)), /*#__PURE__*/React.createElement(ExtendIconStyle, {
64
66
  onClick: function onClick() {
65
67
  toggle(col);
66
68
  }
67
- }, /*#__PURE__*/React.createElement(ExpandIcon, {
69
+ }, displaycolExtendIcon || /*#__PURE__*/React.createElement(ExpandIcon, {
68
70
  style: {
69
71
  userSelect: 'none',
70
72
  marginLeft: 2,
@@ -73,8 +75,8 @@ export var colGroupExtendable = function colGroupExtendable() {
73
75
  verticalAlign: 'middle'
74
76
  },
75
77
  className: cx(_defineProperty({}, Classes.tableExtendIcon, true)),
76
- size: 16,
77
- isExtend: curState[col.code]
78
+ size: 14,
79
+ isExtend: curColState
78
80
  })));
79
81
  result.title = addIconNode;
80
82
  return result;
package/es/table/pipeline/features/columnFilter.d.ts CHANGED
@@ -16,7 +16,11 @@ export interface FilterFeatureOptions {
16
16
  filterIcon?: ReactNode | ((filtered: boolean) => ReactNode);
17
17
  /** 是否对触发弹出过滤面板 的 click 事件调用 event.stopPropagation() */
18
18
  stopClickEventPropagation?: boolean;
19
- /** 是否隐藏过滤弹出菜单header区域 */
19
+ /** 是否对按ESC键时关闭面板的 keydown 事件调用 event.stopPropagation() */
20
+ stopESCKeyDownEventPropagation?: boolean;
21
+ /** 是否隐藏过滤面板的header区域 */
20
22
  hideFilterPopupHeader?: boolean;
23
+ /** 指定过滤面板渲染的父节点 */
24
+ getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
21
25
  }
22
26
  export declare function filter(opts?: FilterFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
package/es/table/pipeline/features/columnFilter.js CHANGED
@@ -29,7 +29,9 @@ export function filter() {
29
29
  mode = opts.mode,
30
30
  filterIcon = opts.filterIcon,
31
31
  stopClickEventPropagation = opts.stopClickEventPropagation,
32
- hideFilterPopupHeader = opts.hideFilterPopupHeader;
32
+ stopESCKeyDownEventPropagation = opts.stopESCKeyDownEventPropagation,
33
+ hideFilterPopupHeader = opts.hideFilterPopupHeader,
34
+ getPopupParent = opts.getPopupParent;
33
35
  var inputFilters = (_b = (_a = filters !== null && filters !== void 0 ? filters : pipeline.getStateAtKey(stateKey)) !== null && _a !== void 0 ? _a : defaultFilters) !== null && _b !== void 0 ? _b : [];
34
36
  inputFilters = mode === 'single' ? _sliceInstanceProperty(inputFilters).call(inputFilters, 0, 1) : inputFilters;
35
37
  var inputFiltersMap = new _Map(_mapInstanceProperty(inputFilters).call(inputFilters, function (filterItem) {
@@ -93,7 +95,9 @@ export function filter() {
93
95
  isFilterActive: filterActive,
94
96
  className: cx((_cx = {}, _defineProperty(_cx, Classes.tableFilterTrigger, true), _defineProperty(_cx, "active", filterActive), _cx)),
95
97
  stopClickEventPropagation: stopClickEventPropagation,
96
- hideFilterPopupHeader: hideFilterPopupHeader
98
+ stopESCKeyDownEventPropagation: stopESCKeyDownEventPropagation,
99
+ hideFilterPopupHeader: hideFilterPopupHeader,
100
+ getPopupParent: getPopupParent
97
101
  })]); // result.headerCellProps = mergeCellProps(col.headerCellProps, {
98
102
  // style: {
99
103
  // paddingRight: '18px'
package/es/table/pipeline/features/contextMenu.d.ts CHANGED
@@ -1,14 +1,18 @@
1
1
  import { TablePipeline } from '../pipeline';
2
2
  interface ContextMenuItem {
3
+ key?: string;
3
4
  name: string;
4
- action: () => {};
5
+ action: () => void;
5
6
  disabled?: boolean;
7
+ className?: string;
6
8
  }
7
9
  export interface ContextMenuFeatureOptions {
8
10
  /** 获得自定义菜单 */
9
11
  getContextMenuItems?: (params: any) => ContextMenuItem[];
10
12
  /** 弹出框的父容器 */
11
13
  popupParent?: HTMLElement;
14
+ /** 右键菜单className */
15
+ menuClassName?: string;
12
16
  }
13
17
  export declare function contextMenu(opts?: ContextMenuFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
14
18
  export {};
package/es/table/pipeline/features/contextMenu.js CHANGED
@@ -10,12 +10,12 @@ import { ContextMenuStyleWrap } from '../../common-views';
10
10
  import { copyDataToClipboard, executeOnTempElement, console, getEventPath, isElementInEventPath, getTargetEleInEventPath } from '../../utils';
11
11
  import { findByTree } from '../../utils/others';
12
12
  import { internals } from '../../internals';
13
- import { Classes, MenuClasses } from '../../base/styles';
14
- var stateKey = 'contextMenu';
13
+ import { MenuClasses } from '../../base/styles';
15
14
  export function contextMenu() {
16
15
  var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
17
16
  return function step(pipeline) {
18
17
  var popupParent = opts.popupParent || document.body;
18
+ var menuClassName = opts.menuClassName;
19
19
  var menuHelper = new MenuHelper();
20
20
 
21
21
  var addPopup = function addPopup(menu) {
@@ -48,13 +48,11 @@ export function contextMenu() {
48
48
  };
49
49
 
50
50
  var onContextMenu = function onContextMenu(e) {
51
- if (suppressShowContextMenu(e)) {
52
- return;
51
+ if (canShowContextMenu(e, pipeline)) {
52
+ e.preventDefault();
53
+ e.stopPropagation();
54
+ showContextMenu(e);
53
55
  }
54
-
55
- e.preventDefault();
56
- e.stopPropagation();
57
- showContextMenu(e);
58
56
  };
59
57
 
60
58
  pipeline.addTableProps({
@@ -124,7 +122,8 @@ export function contextMenu() {
124
122
  options: options,
125
123
  hideContextMenu: hideContextMenu,
126
124
  position: position,
127
- getPopupParent: getPopupParent
125
+ getPopupParent: getPopupParent,
126
+ className: menuClassName
128
127
  });
129
128
 
130
129
  var _hidePopup = addPopup(menu);
@@ -157,7 +156,8 @@ function getMenuItemKey(_ref) {
157
156
  }
158
157
 
159
158
  function Menu(props) {
160
- var _props$options = props.options,
159
+ var className = props.className,
160
+ _props$options = props.options,
161
161
  options = _props$options === void 0 ? [] : _props$options,
162
162
  hideContextMenu = props.hideContextMenu,
163
163
  position = props.position,
@@ -178,7 +178,7 @@ function Menu(props) {
178
178
  }
179
179
  }, [position]);
180
180
  return /*#__PURE__*/React.createElement(ContextMenuStyleWrap, {
181
- className: MenuClasses.menu,
181
+ className: cx(MenuClasses.menu, className),
182
182
  ref: menuRef,
183
183
  style: {
184
184
  left: position.x,
@@ -194,6 +194,7 @@ function Menu(props) {
194
194
  }),
195
195
  name: item.name,
196
196
  action: item.action,
197
+ className: item.className,
197
198
  disabled: item.disabled,
198
199
  hideContextMenu: hideContextMenu
199
200
  });
@@ -203,6 +204,7 @@ function Menu(props) {
203
204
  function MenuItem(props) {
204
205
  var name = props.name,
205
206
  action = props.action,
207
+ className = props.className,
206
208
  disabled = props.disabled,
207
209
  hideContextMenu = props.hideContextMenu;
208
210
  var itemRef = useRef();
@@ -243,7 +245,7 @@ function MenuItem(props) {
243
245
  };
244
246
 
245
247
  return /*#__PURE__*/React.createElement("div", {
246
- className: cx(MenuClasses.menuOption, _defineProperty({}, MenuClasses.menuOptionDisable, disabled)),
248
+ className: cx(MenuClasses.menuOption, className, _defineProperty({}, MenuClasses.menuOptionDisable, disabled)),
247
249
  ref: itemRef,
248
250
  onClick: handleClick,
249
251
  onMouseEnter: handleMouseEnter,
@@ -387,24 +389,12 @@ function isElementInsideTheFooter(ele) {
387
389
  }
388
390
 
389
391
  return false;
390
- } // 禁止弹出右键菜单
391
-
392
-
393
- function suppressShowContextMenu(e) {
394
- var path = getEventPath(e.nativeEvent);
395
- var pointIndex = 0;
396
-
397
- while (pointIndex < path.length) {
398
- var ele = path[pointIndex];
399
-
400
- if (ele.classList.contains(Classes.tableBody) || ele.classList.contains(Classes.tableFooter)) {
401
- return false;
402
- }
392
+ }
403
393
 
404
- pointIndex++;
405
- }
394
+ function canShowContextMenu(e, pipeline) {
395
+ var _a, _b;
406
396
 
407
- return true;
397
+ return ((_a = pipeline.ref.current.domHelper) === null || _a === void 0 ? void 0 : _a.tableBody.contains(e.target)) || ((_b = pipeline.ref.current.domHelper) === null || _b === void 0 ? void 0 : _b.tableFooter.contains(e.target));
408
398
  } // 默认选项
409
399
 
410
400
 
package/es/table/pipeline/features/filter/DefaultFilterContent.js CHANGED
@@ -26,7 +26,7 @@ function DefaultFilterContent(_ref) {
26
26
  selectedValue = _React$useState2[0],
27
27
  setSelectedValue = _React$useState2[1];
28
28
 
29
- var _React$useState3 = React.useState((filterModel === null || filterModel === void 0 ? void 0 : _filterInstanceProperty(filterModel)) || ''),
29
+ var _React$useState3 = React.useState((filterModel === null || filterModel === void 0 ? void 0 : _filterInstanceProperty(filterModel)) || []),
30
30
  _React$useState4 = _slicedToArray(_React$useState3, 2),
31
31
  innerValue = _React$useState4[0],
32
32
  setInnerValue = _React$useState4[1];
@@ -44,7 +44,7 @@ function DefaultFilterContent(_ref) {
44
44
  var confirm = function confirm() {
45
45
  hidePanel();
46
46
  setFilterModel({
47
- filter: [innerValue],
47
+ filter: innerValue,
48
48
  filterCondition: selectedValue
49
49
  });
50
50
  };
@@ -57,7 +57,7 @@ function DefaultFilterContent(_ref) {
57
57
 
58
58
  useEffect(function () {
59
59
  setSelectedValue((filterModel === null || filterModel === void 0 ? void 0 : filterModel.filterCondition) || 'contain');
60
- setInnerValue((filterModel === null || filterModel === void 0 ? void 0 : _filterInstanceProperty(filterModel)) || '');
60
+ setInnerValue((filterModel === null || filterModel === void 0 ? void 0 : _filterInstanceProperty(filterModel)) || []);
61
61
  }, [filterModel]);
62
62
  useEffect(function () {
63
63
  // 兼容设置焦点后发生滚动
@@ -87,9 +87,9 @@ function DefaultFilterContent(_ref) {
87
87
  className: 'filter-search'
88
88
  }, /*#__PURE__*/React.createElement("input", {
89
89
  className: 'filter-search-inner',
90
- value: innerValue,
90
+ value: innerValue[0],
91
91
  onChange: function onChange(e) {
92
- setInnerValue(e.target.value);
92
+ setInnerValue([e.target.value]);
93
93
  },
94
94
  onKeyDown: handleKeyDown,
95
95
  ref: inputRef
package/es/table/pipeline/features/filter/Filter.d.ts CHANGED
@@ -12,7 +12,9 @@ interface FilterProps {
12
12
  setFilter: CustomeFilterPanelProps['setFilter'];
13
13
  onClick?: (e: React.MouseEvent) => any;
14
14
  stopClickEventPropagation?: boolean;
15
+ stopESCKeyDownEventPropagation?: boolean;
15
16
  hideFilterPopupHeader?: boolean;
17
+ getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
16
18
  }
17
- declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, hideFilterPopupHeader }: FilterProps): JSX.Element;
19
+ declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader, getPopupParent }: FilterProps): JSX.Element;
18
20
  export default Filter;
package/es/table/pipeline/features/filter/Filter.js CHANGED
@@ -26,10 +26,11 @@ function Panel(_ref) {
26
26
  filterIcon = _ref.filterIcon,
27
27
  hidePanel = _ref.hidePanel,
28
28
  renderPanelContent = _ref.renderPanelContent,
29
- hideFilterPopupHeader = _ref.hideFilterPopupHeader;
29
+ hideFilterPopupHeader = _ref.hideFilterPopupHeader,
30
+ popupParent = _ref.popupParent;
30
31
  var filterPanelRef = React.useRef(null);
31
32
 
32
- var _React$useState = React.useState(calculatePopupRelative(ele, document.body, _getPanelOffset(ele, hideFilterPopupHeader))),
33
+ var _React$useState = React.useState(calculatePopupRelative(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader))),
33
34
  _React$useState2 = _slicedToArray(_React$useState, 2),
34
35
  position = _React$useState2[0],
35
36
  setPosition = _React$useState2[1];
@@ -40,7 +41,7 @@ function Panel(_ref) {
40
41
  };
41
42
 
42
43
  var handleFilterPanelResize = function handleFilterPanelResize(resize) {
43
- setPosition(calculatePopupRelative(ele, document.body, _getPanelOffset(ele, hideFilterPopupHeader)));
44
+ setPosition(calculatePopupRelative(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader)));
44
45
  };
45
46
 
46
47
  useEffect(function () {
@@ -74,7 +75,9 @@ function Filter(_ref2) {
74
75
  filterModel = _ref2.filterModel,
75
76
  isFilterActive = _ref2.isFilterActive,
76
77
  stopClickEventPropagation = _ref2.stopClickEventPropagation,
77
- hideFilterPopupHeader = _ref2.hideFilterPopupHeader;
78
+ stopESCKeyDownEventPropagation = _ref2.stopESCKeyDownEventPropagation,
79
+ hideFilterPopupHeader = _ref2.hideFilterPopupHeader,
80
+ getPopupParent = _ref2.getPopupParent;
78
81
 
79
82
  var _React$useState3 = React.useState(false),
80
83
  _React$useState4 = _slicedToArray(_React$useState3, 2),
@@ -109,25 +112,30 @@ function Filter(_ref2) {
109
112
  var handleIconClick = function handleIconClick(e) {
110
113
  // 只有当icon区域点击会触发面板展开
111
114
  // 防止 createPortal 区域的点击触发该事件
112
- if (!e.currentTarget.contains(e.target)) {
113
- return;
115
+ if (e.currentTarget.contains(e.target)) {
116
+ setShowPanel(true);
114
117
  }
115
118
 
116
119
  if (stopClickEventPropagation) {
117
120
  e.stopPropagation();
118
121
  }
119
-
120
- setShowPanel(true);
121
122
  };
122
123
 
123
124
  var handleKeyDown = function handleKeyDown(e) {
124
- if (e.currentTarget.contains(e.target) && e.keyCode === KeyCode.ESC) {
125
- setShowPanel(false);
125
+ if (e.keyCode === KeyCode.ESC) {
126
+ if (e.currentTarget.contains(e.target)) {
127
+ setShowPanel(false);
128
+ }
129
+
130
+ if (stopESCKeyDownEventPropagation) {
131
+ e.stopPropagation();
132
+ }
126
133
  }
127
134
  };
128
135
 
129
136
  var iconClassName = cx((_cx = {}, _defineProperty(_cx, className, true), _defineProperty(_cx, 'filter-panel-open', showPanel), _cx));
130
137
  var displayFilterIcon = typeof filterIcon === 'function' ? filterIcon(isFilterActive) : filterIcon;
138
+ var popupParent = (getPopupParent === null || getPopupParent === void 0 ? void 0 : getPopupParent(iconWrapRef.current)) || document.body;
131
139
  return /*#__PURE__*/React.createElement(FilterIconSpanStyle, {
132
140
  style: style,
133
141
  className: iconClassName,
@@ -146,8 +154,9 @@ function Filter(_ref2) {
146
154
  filterIcon: displayFilterIcon,
147
155
  hidePanel: hidePanel,
148
156
  renderPanelContent: renderPanelContent,
149
- hideFilterPopupHeader: hideFilterPopupHeader
150
- }), document.body));
157
+ hideFilterPopupHeader: hideFilterPopupHeader,
158
+ popupParent: popupParent
159
+ }), popupParent));
151
160
  }
152
161
 
153
162
  function _getPanelOffset(ele, hideFilterPopupHeader) {
package/es/table/pipeline/features/rangeSelection.js CHANGED
@@ -17,6 +17,7 @@ export function rangeSelection(opts) {
17
17
  var SCROLL_SIZE = 30;
18
18
  var tableBody = pipeline.ref.current.domHelper && pipeline.ref.current.domHelper.tableBody;
19
19
  var tableFooter = pipeline.ref.current.domHelper && pipeline.ref.current.domHelper.tableFooter;
20
+ var artTable = pipeline.ref.current.domHelper && pipeline.ref.current.domHelper.artTable;
20
21
 
21
22
  if (!tableBody) {
22
23
  return pipeline;
@@ -48,6 +49,13 @@ export function rangeSelection(opts) {
48
49
  startColumn: startDragCell.column,
49
50
  footerRowRange: footerRowRange
50
51
  };
52
+
53
+ if (isCellRangeSingleCell(rangeSelection)) {
54
+ artTable.classList.remove(cx(Classes.rangeSelection));
55
+ } else {
56
+ artTable.classList.add(cx(Classes.rangeSelection));
57
+ }
58
+
51
59
  rangeSelectedChange(rangeSelection);
52
60
  };
53
61
 
@@ -77,6 +85,7 @@ export function rangeSelection(opts) {
77
85
  // shift + 点击选中
78
86
 
79
87
  shiftKeySelect(mouseDownEvent);
88
+ if (mouseDownEvent.shiftKey) return;
80
89
  var target = mouseDownEvent.target;
81
90
  var startDragCell = getTargetCell(target, columns);
82
91
  var mousemove$ = fromEvent(window, 'mousemove');
@@ -137,6 +146,7 @@ export function rangeSelection(opts) {
137
146
 
138
147
  if (columns.length && rowLen && !getElementEditable(e.target)) {
139
148
  opts.preventkDefaultOfKeyDownEvent !== false && e.preventDefault();
149
+ artTable.classList.add(cx(Classes.rangeSelection));
140
150
  rangeSelectedChange({
141
151
  startRow: 0,
142
152
  endRow: rowLen - 1,
package/es/table/pipeline/pipeline.d.ts CHANGED
@@ -88,10 +88,6 @@ export declare class TablePipeline {
88
88
  setFeatureOptions(optionKey: string, value: any): void;
89
89
  /** 获取 BaseTable 的 props，结果中包含 dataSource/columns/primaryKey/getRowProps 四个字段 */
90
90
  getProps(this: TablePipeline): TableProps;
91
- /**
92
- * 清除范围选中内容
93
- */
94
- clearRangeSelection(): void;
95
91
  }
96
92
  export declare function useTablePipeline(ctx?: Partial<TablePipelineCtx>): TablePipeline;
97
93
  export {};
package/es/table/pipeline/pipeline.js CHANGED
@@ -8,7 +8,6 @@ import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instan
8
8
  import { useState, useRef } from 'react';
9
9
  import { mergeCellProps } from '../utils';
10
10
  import { autoFillTableWidth, tableWidthKey } from './features/autoFill';
11
- import { rangeSelectionKey } from './features/rangeSelection';
12
11
  /**
13
12
  * 表格数据处理流水线。TablePipeline 提供了表格数据处理过程中的一些上下方与工具方法，包括……
14
13
  *
@@ -279,16 +278,11 @@ export var TablePipeline = /*#__PURE__*/function () {
279
278
  _this2.ref.current.domHelper = domHelper;
280
279
  };
281
280
 
282
- return result;
283
- }
284
- /**
285
- * 清除范围选中内容
286
- */
281
+ result.setRowHeightManager = function (rowHeightManager) {
282
+ _this2.ref.current.rowHeightManager = rowHeightManager;
283
+ };
287
284
 
288
- }, {
289
- key: "clearRangeSelection",
290
- value: function clearRangeSelection() {
291
- this.setStateAtKey(rangeSelectionKey, null);
285
+ return result;
292
286
  }
293
287
  }]);
294
288
 
package/lib/table/base/styles.js CHANGED
@@ -128,7 +128,7 @@ var defaultCSSVariables = {
128
128
  '--row-height': '48px',
129
129
  '--color': '#333',
130
130
  '--bgcolor': 'white',
131
- '--hover-bgcolor': 'var(--hover-color, #F2F6FF)',
131
+ '--hover-bgcolor': 'var(--hover-color, #f5f5f5)',
132
132
  '--highlight-bgcolor': '#eee',
133
133
  '--primary-color': '#5582F3',
134
134
  '--primary-color-level1': 'rgb(242, 248, 255)',
@@ -159,7 +159,7 @@ exports.variableConst = variableConst;
159
159
  var notBorderedStyleMixin = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n --cell-border-vertical: none;\n --header-cell-border-vertical: none;\n"])));
160
160
  var borderedStyleMixin = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\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);
161
161
 
162
- var StyledArtTableWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\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 //#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);
162
+ var StyledArtTableWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\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);
163
163
 
164
164
  exports.StyledArtTableWrapper = StyledArtTableWrapper;
165
165
  var ButtonCSS = (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\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);
package/lib/table/base/table.d.ts CHANGED
@@ -77,7 +77,7 @@ export interface BaseTableProps {
77
77
  getTableProps?(): React.HTMLAttributes<HTMLTableElement>;
78
78
  setTableWidth?(tableWidth: number): void;
79
79
  setTableDomHelper?(domHelper: TableDOMHelper): void;
80
- clearRangeSelectionStatus?(): void;
80
+ setRowHeightManager?(rowHeightManager: any): void;
81
81
  cssVariables?: {
82
82
  [key: string]: any;
83
83
  };