@hi-ui/table 4.1.0 → 4.1.1

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 (20) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/lib/cjs/BaseTable.js +0 -4
  3. package/lib/cjs/TableBody.js +18 -9
  4. package/lib/cjs/TableHeader.js +0 -4
  5. package/lib/cjs/TableRow.js +0 -4
  6. package/lib/cjs/styles/index.scss.js +1 -1
  7. package/lib/cjs/use-table.js +12 -6
  8. package/lib/esm/BaseTable.js +0 -4
  9. package/lib/esm/TableBody.js +18 -9
  10. package/lib/esm/TableHeader.js +0 -4
  11. package/lib/esm/TableRow.js +0 -4
  12. package/lib/esm/styles/index.scss.js +1 -1
  13. package/lib/esm/use-table.js +13 -7
  14. package/lib/types/BaseTable.d.ts +0 -3
  15. package/lib/types/TableBody.d.ts +0 -3
  16. package/lib/types/TableHeader.d.ts +0 -3
  17. package/lib/types/TableRow.d.ts +0 -3
  18. package/lib/types/context.d.ts +2 -2
  19. package/lib/types/use-table.d.ts +4 -4
  20. package/package.json +2 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @hi-ui/table
2
2
 
3
+ ## 4.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#2557](https://github.com/XiaoMi/hiui/pull/2557) [`ef7aae038`](https://github.com/XiaoMi/hiui/commit/ef7aae038362d3a7700611737c474c29d1ba07b4) Thanks [@zyprepare](https://github.com/zyprepare)! - feat: maxHeight 支持表达式
8
+
9
+ - [#2558](https://github.com/XiaoMi/hiui/pull/2558) [`bdd913d71`](https://github.com/XiaoMi/hiui/commit/bdd913d7173de64952437014ab9ffd1947ed506c) Thanks [@zyprepare](https://github.com/zyprepare)! - feat: 增加树形结构排序
10
+
11
+ - Updated dependencies [[`bdd913d71`](https://github.com/XiaoMi/hiui/commit/bdd913d7173de64952437014ab9ffd1947ed506c)]:
12
+ - @hi-ui/tree-utils@4.1.0
13
+
3
14
  ## 4.1.0
4
15
 
5
16
  ### Minor Changes
package/lib/cjs/BaseTable.js CHANGED
@@ -60,10 +60,6 @@ var _prefix = classname.getPrefixCls('table');
60
60
  var EMBED_DATA_KEY = "TABLE_EMBED_DATA_KEY_" + index.uuid();
61
61
  var DEFAULT_COLUMNS = [];
62
62
  var DEFAULT_DATA = [];
63
- /**
64
- * TODO: What is BaseTable
65
- */
66
-
67
63
  var BaseTable = /*#__PURE__*/React.forwardRef(function (_a, ref) {
68
64
  // ********************** 内嵌式面板 *********************** //
69
65
  var _a$prefixCls = _a.prefixCls,
package/lib/cjs/TableBody.js CHANGED
@@ -44,16 +44,14 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
44
44
  var _role = 'table';
45
45
 
46
46
  var _prefix = classname.getPrefixCls(_role);
47
- /**
48
- * TODO: What is TableBody
49
- */
50
-
51
47
 
52
48
  var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
53
49
  var _ref$prefixCls = _ref.prefixCls,
54
50
  prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
55
51
  emptyContent = _ref.emptyContent;
56
52
 
53
+ var _a;
54
+
57
55
  var _useTableContext = context.useTableContext(),
58
56
  columns = _useTableContext.columns,
59
57
  leafColumns = _useTableContext.leafColumns,
@@ -110,7 +108,8 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
110
108
 
111
109
  if (showVirtual) {
112
110
  // TODO： avg和summay row的逻辑
113
- var vMaxHeight = maxHeight || 300;
111
+ var realHeight = (_a = scrollBodyElementRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height;
112
+ var vMaxHeight = maxHeight ? !isNaN(Number(String(maxHeight).replace(/px/, ''))) ? Number(maxHeight) : realHeight : 300;
114
113
  return /*#__PURE__*/React__default["default"].createElement("div", {
115
114
  ref: scrollBodyElementRef,
116
115
  className: cls,
@@ -118,8 +117,13 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
118
117
  onWheel: onTableBodyScrollMock,
119
118
  style: {
120
119
  maxHeight: maxHeight !== undefined ? maxHeight : undefined,
121
- // maxHeight 小于 table 实际高度才出现纵向滚动条
122
- overflowY: maxHeight !== undefined && bodyTableRef.current && bodyTableRef.current.clientHeight > maxHeight ? 'scroll' : undefined,
120
+ // // maxHeight 小于 table 实际高度才出现纵向滚动条
121
+ // overflowY:
122
+ // maxHeight !== undefined &&
123
+ // bodyTableRef.current &&
124
+ // bodyTableRef.current.clientHeight > maxHeight
125
+ // ? 'scroll'
126
+ // : undefined,
123
127
  // 表格宽度大于div宽度才出现横向滚动条
124
128
  overflowX: canScroll ? 'scroll' : undefined
125
129
  }
@@ -174,8 +178,13 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
174
178
  onScroll: onTableBodyScroll,
175
179
  style: {
176
180
  maxHeight: maxHeight !== undefined ? maxHeight : undefined,
177
- // maxHeight 小于 table 实际高度才出现纵向滚动条
178
- overflowY: maxHeight !== undefined && bodyTableRef.current && bodyTableRef.current.clientHeight > maxHeight ? 'scroll' : undefined,
181
+ // // maxHeight 小于 table 实际高度才出现纵向滚动条
182
+ // overflowY:
183
+ // maxHeight !== undefined &&
184
+ // bodyTableRef.current &&
185
+ // bodyTableRef.current.clientHeight > maxHeight
186
+ // ? 'scroll'
187
+ // : undefined,
179
188
  // 表格宽度大于div宽度才出现横向滚动条
180
189
  overflowX: canScroll ? 'scroll' : undefined
181
190
  }
package/lib/cjs/TableHeader.js CHANGED
@@ -40,10 +40,6 @@ function _interopDefaultLegacy(e) {
40
40
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
41
41
 
42
42
  var _prefix = classname.getPrefixCls('table-header');
43
- /**
44
- * TODO: What is TableHeader
45
- */
46
-
47
43
 
48
44
  var TableHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
49
45
  var _ref$prefixCls = _ref.prefixCls,
package/lib/cjs/TableRow.js CHANGED
@@ -50,10 +50,6 @@ var _role = 'table';
50
50
  var _prefix = classname.getPrefixCls(_role);
51
51
 
52
52
  var EMBED_ON_ROW_PROPS = {};
53
- /**
54
- * TODO: What is TableRow
55
- */
56
-
57
53
  var TableRow = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
58
54
  var _ref$prefixCls = _ref.prefixCls,
59
55
  prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
package/lib/cjs/styles/index.scss.js CHANGED
@@ -14,7 +14,7 @@ Object.defineProperty(exports, '__esModule', {
14
14
  });
15
15
  var css_248z = ".hi-v4-table {-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 14px;position: relative; }.hi-v4-table table {width: 100%;text-align: left;background-color: var(--hi-v4-color-static-white, #fff);border-radius: 2px 2px 0 0;border-spacing: 0;border-collapse: separate;display: table;table-layout: fixed; }.hi-v4-table__wrapper {position: relative;z-index: 0; }.hi-v4-table__switcher.hi-v4-icon-button {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table__switcher--expanded.hi-v4-icon-button {color: var(--hi-v4-color-primary-400, var(--hi-v4-color-brandblue-400, #4a9eff)); }.hi-v4-table--size-md table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-md table thead > tr > th {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-sm table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-sm table thead > tr > th {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-lg table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--size-lg table thead > tr > th {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--bordered table thead > tr > th {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered table td {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-header {border-top: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-body {border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--sticky {position: -webkit-sticky;position: sticky;top: 0; }.hi-v4-table--virtual {width: 100%;overflow: hidden; }.hi-v4-table--virtual .hi-v4-table-cell {-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-header {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;overflow: hidden; }.hi-v4-table-header__resizable {position: relative;background-clip: padding-box; }.hi-v4-table-header__resizable-handle {-webkit-box-sizing: content-box;box-sizing: content-box;position: absolute;width: 2px;height: 100%;bottom: 0;right: 0;border-left: 2px solid var(--hi-v4-color-gray-50, #f5f7fa);cursor: col-resize;z-index: 1; }.hi-v4-table-header__resizable:hover .hi-v4-table-header__resizable-handle {background-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active[data-sticky] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-row--hover:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--striped > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--expanded > .hi-v4-table-cell {color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-table-row--error > .hi-v4-table-cell {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-table-row--highlight > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--dragging > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--drag-top > .hi-v4-table-cell {border-top: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--drag-bottom > .hi-v4-table-cell {border-bottom: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--avg > .hi-v4-table-cell, .hi-v4-table-row--total > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--avg:hover > .hi-v4-table-cell, .hi-v4-table-row--total:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--virtual {display: -webkit-box;display: -ms-flexbox;display: flex; }.hi-v4-table-header .hi-v4-table-header-col, .hi-v4-table-header .hi-v4-table-col {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-body .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-body .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-header .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-body {position: relative;overflow: auto; }.hi-v4-table-header-cell {color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-medium, 500);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-table-header-cell.hi-v4-table__embed-col, .hi-v4-table-header-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell {word-break: break-word;border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-700, #1f2733);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-cell__indent {display: inline-block;width: 14px;height: 100%;margin-right: var(--hi-v4-spacing-1, 2px); }.hi-v4-table-cell__switcher.hi-v4-icon-button {margin-right: var(--hi-v4-spacing-1, 2px);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-cell.hi-v4-table__embed-col, .hi-v4-table-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell.hi-v4-table-cell__col--highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-cell.hi-v4-table-cell__col--hovered-highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-freeze-shadow {position: absolute;top: 0;bottom: 0;z-index: 20;pointer-events: none;overflow: hidden;height: 100%;width: 200px; }.hi-v4-table-freeze-shadow--left {margin-right: 10px;left: 0;-webkit-box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-freeze-shadow--right {margin-left: 10px;right: 0;-webkit-box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-header-filter-dropdown__trigger.hi-v4-icon-button {margin-left: 4px; }.hi-v4-table-header-filter-dropdown__content {width: 124px;padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-4, 8px);font-weight: var(--hi-v4-text-weight-normal, 400); }.hi-v4-table-header-filter-dropdown__item {margin-top: var(--hi-v4-spacing-4, 8px);padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);border-radius: var(--hi-v4-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-table-header-filter-dropdown__item:first-child {margin-top: 0; }.hi-v4-table-header-filter-dropdown__item:hover {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-filter-dropdown__item--active {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-dropdown__item--active:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-sorter {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 20px;vertical-align: middle;margin-left: 6px; }.hi-v4-table-header-filter-sorter__icon {display: inline-block;height: 8px;cursor: pointer;overflow: hidden;font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-header-filter-sorter__icon svg {position: relative;top: -5px; }.hi-v4-table-header-filter-sorter__icon--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-filter-custom__trigger {margin-left: 6px;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer; }.hi-v4-table-header-filter-custom__content {padding: 12px 8px; }.hi-v4-table-embed-row {position: relative;z-index: 0; }.hi-v4-table-embed-row > td {background-color: var(--hi-v4-color-gray-200, #ebedf0);padding: var(--hi-v4-spacing-10, 20px); }.hi-v4-table-setting {position: absolute;height: 100%;z-index: 11;-webkit-box-sizing: border-box;box-sizing: border-box;right: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);border-bottom: none;border-top: none;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer;font-size: var(--hi-v4-text-size-sm, 0.75rem);width: 18px;background: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-table-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-setting-item--dragging .hi-v4-table-setting-item__wrap {opacity: 0.6; }.hi-v4-table-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-table-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-table-setting-item::before, .hi-v4-table-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-table-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-table-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-table-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-table-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }.hi-v4-table-pagination {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;row-gap: 8px;padding: var(--hi-v4-spacing-6, 12px) 0;background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-pagination--placement-left {-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start; }.hi-v4-table-pagination--placement-right {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-pagination--placement-middle {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-table-empty-content td {text-align: center;padding: var(--hi-v4-spacing-12, 24px) 0; }.hi-v4-table--bordered .hi-v4-table-empty-content td {border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-setting-drawer .hi-v4-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-setting-item--dragging .hi-v4-setting-item__wrap {opacity: 0.6; }.hi-v4-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-setting-item::before, .hi-v4-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }";
16
16
 
17
- var __styleInject__ = require('inject-head-style')["default"];
17
+ var __styleInject__ = require('style-inject')["default"];
18
18
 
19
19
  __styleInject__(css_248z);
20
20
 
package/lib/cjs/use-table.js CHANGED
@@ -527,17 +527,23 @@ var useTable = function useTable(_a) {
527
527
 
528
528
 
529
529
  var showData = React.useMemo(function () {
530
- var _data = transitionData.concat();
530
+ var _a;
531
+
532
+ var _data = treeUtils.cloneTree(transitionData);
531
533
 
532
534
  if (activeSorterColumn) {
533
- var sorter = columns.filter(function (d) {
534
- return d.dataKey === activeSorterColumn;
535
- })[0] && columns.filter(function (d) {
535
+ var sorter = (_a = columns.filter(function (d) {
536
536
  return d.dataKey === activeSorterColumn;
537
- })[0].sorter;
537
+ })[0]) === null || _a === void 0 ? void 0 : _a.sorter;
538
538
 
539
539
  if (sorter) {
540
- _data = activeSorterType === 'ascend' ? [].concat(_data).sort(sorter) : [].concat(_data).sort(sorter).reverse();
540
+ activeSorterType === 'ascend' ? _data.sort(sorter) : _data.sort(sorter).reverse(); // 平铺的树形结构排序
541
+
542
+ if (_data.some(function (d) {
543
+ return d.depth !== 0;
544
+ })) {
545
+ _data = treeUtils.flattedTreeSort(_data);
546
+ }
541
547
  }
542
548
  }
543
549
 
package/lib/esm/BaseTable.js CHANGED
@@ -29,10 +29,6 @@ var _prefix = getPrefixCls('table');
29
29
  var EMBED_DATA_KEY = "TABLE_EMBED_DATA_KEY_" + uuid();
30
30
  var DEFAULT_COLUMNS = [];
31
31
  var DEFAULT_DATA = [];
32
- /**
33
- * TODO: What is BaseTable
34
- */
35
-
36
32
  var BaseTable = /*#__PURE__*/forwardRef(function (_a, ref) {
37
33
  // ********************** 内嵌式面板 *********************** //
38
34
  var _a$prefixCls = _a.prefixCls,
package/lib/esm/TableBody.js CHANGED
@@ -19,16 +19,14 @@ import { useTableContext } from './context.js';
19
19
  var _role = 'table';
20
20
 
21
21
  var _prefix = getPrefixCls(_role);
22
- /**
23
- * TODO: What is TableBody
24
- */
25
-
26
22
 
27
23
  var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
28
24
  var _ref$prefixCls = _ref.prefixCls,
29
25
  prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
30
26
  emptyContent = _ref.emptyContent;
31
27
 
28
+ var _a;
29
+
32
30
  var _useTableContext = useTableContext(),
33
31
  columns = _useTableContext.columns,
34
32
  leafColumns = _useTableContext.leafColumns,
@@ -85,7 +83,8 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
85
83
 
86
84
  if (showVirtual) {
87
85
  // TODO： avg和summay row的逻辑
88
- var vMaxHeight = maxHeight || 300;
86
+ var realHeight = (_a = scrollBodyElementRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height;
87
+ var vMaxHeight = maxHeight ? !isNaN(Number(String(maxHeight).replace(/px/, ''))) ? Number(maxHeight) : realHeight : 300;
89
88
  return /*#__PURE__*/React__default.createElement("div", {
90
89
  ref: scrollBodyElementRef,
91
90
  className: cls,
@@ -93,8 +92,13 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
93
92
  onWheel: onTableBodyScrollMock,
94
93
  style: {
95
94
  maxHeight: maxHeight !== undefined ? maxHeight : undefined,
96
- // maxHeight 小于 table 实际高度才出现纵向滚动条
97
- overflowY: maxHeight !== undefined && bodyTableRef.current && bodyTableRef.current.clientHeight > maxHeight ? 'scroll' : undefined,
95
+ // // maxHeight 小于 table 实际高度才出现纵向滚动条
96
+ // overflowY:
97
+ // maxHeight !== undefined &&
98
+ // bodyTableRef.current &&
99
+ // bodyTableRef.current.clientHeight > maxHeight
100
+ // ? 'scroll'
101
+ // : undefined,
98
102
  // 表格宽度大于div宽度才出现横向滚动条
99
103
  overflowX: canScroll ? 'scroll' : undefined
100
104
  }
@@ -149,8 +153,13 @@ var TableBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
149
153
  onScroll: onTableBodyScroll,
150
154
  style: {
151
155
  maxHeight: maxHeight !== undefined ? maxHeight : undefined,
152
- // maxHeight 小于 table 实际高度才出现纵向滚动条
153
- overflowY: maxHeight !== undefined && bodyTableRef.current && bodyTableRef.current.clientHeight > maxHeight ? 'scroll' : undefined,
156
+ // // maxHeight 小于 table 实际高度才出现纵向滚动条
157
+ // overflowY:
158
+ // maxHeight !== undefined &&
159
+ // bodyTableRef.current &&
160
+ // bodyTableRef.current.clientHeight > maxHeight
161
+ // ? 'scroll'
162
+ // : undefined,
154
163
  // 表格宽度大于div宽度才出现横向滚动条
155
164
  overflowX: canScroll ? 'scroll' : undefined
156
165
  }
package/lib/esm/TableHeader.js CHANGED
@@ -17,10 +17,6 @@ import { renderFilter } from './TableAdvancedFilter.js';
17
17
  import { useCheckState } from '@hi-ui/use-check-state';
18
18
 
19
19
  var _prefix = getPrefixCls('table-header');
20
- /**
21
- * TODO: What is TableHeader
22
- */
23
-
24
20
 
25
21
  var TableHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
26
22
  var _ref$prefixCls = _ref.prefixCls,
package/lib/esm/TableRow.js CHANGED
@@ -23,10 +23,6 @@ var _role = 'table';
23
23
  var _prefix = getPrefixCls(_role);
24
24
 
25
25
  var EMBED_ON_ROW_PROPS = {};
26
- /**
27
- * TODO: What is TableRow
28
- */
29
-
30
26
  var TableRow = /*#__PURE__*/forwardRef(function (_ref, ref) {
31
27
  var _ref$prefixCls = _ref.prefixCls,
32
28
  prefixCls = _ref$prefixCls === void 0 ? _prefix : _ref$prefixCls,
package/lib/esm/styles/index.scss.js CHANGED
@@ -7,7 +7,7 @@
7
7
  * This source code is licensed under the MIT license found in the
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
- import __styleInject__ from 'inject-head-style';
10
+ import __styleInject__ from 'style-inject';
11
11
  var css_248z = ".hi-v4-table {-webkit-box-sizing: border-box;box-sizing: border-box;font-size: 14px;position: relative; }.hi-v4-table table {width: 100%;text-align: left;background-color: var(--hi-v4-color-static-white, #fff);border-radius: 2px 2px 0 0;border-spacing: 0;border-collapse: separate;display: table;table-layout: fixed; }.hi-v4-table__wrapper {position: relative;z-index: 0; }.hi-v4-table__switcher.hi-v4-icon-button {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table__switcher--expanded.hi-v4-icon-button {color: var(--hi-v4-color-primary-400, var(--hi-v4-color-brandblue-400, #4a9eff)); }.hi-v4-table--size-md table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-md table thead > tr > th {padding: var(--hi-v4-spacing-7, 14px); }.hi-v4-table--size-sm table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-sm table thead > tr > th {padding: var(--hi-v4-spacing-5, 10px); }.hi-v4-table--size-lg table tbody > tr:not(.hi-v4-table-empty-content) > td {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--size-lg table thead > tr > th {padding: var(--hi-v4-spacing-9, 18px); }.hi-v4-table--bordered table thead > tr > th {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered table td {border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-header {border-top: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--bordered .hi-v4-table-body {border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-table--sticky {position: -webkit-sticky;position: sticky;top: 0; }.hi-v4-table--virtual {width: 100%;overflow: hidden; }.hi-v4-table--virtual .hi-v4-table-cell {-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-header {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;overflow: hidden; }.hi-v4-table-header__resizable {position: relative;background-clip: padding-box; }.hi-v4-table-header__resizable-handle {-webkit-box-sizing: content-box;box-sizing: content-box;position: absolute;width: 2px;height: 100%;bottom: 0;right: 0;border-left: 2px solid var(--hi-v4-color-gray-50, #f5f7fa);cursor: col-resize;z-index: 1; }.hi-v4-table-header__resizable:hover .hi-v4-table-header__resizable-handle {background-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight, .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-header-cell.hi-v4-table-header-cell__col--highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--hovered-highlight[data-sticky], .hi-v4-table-header-cell.hi-v4-table-header-cell__col--active[data-sticky] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-row--hover:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--striped > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--expanded > .hi-v4-table-cell {color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-table-row--error > .hi-v4-table-cell {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-table-row--highlight > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--dragging > .hi-v4-table-cell {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-row--drag-top > .hi-v4-table-cell {border-top: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--drag-bottom > .hi-v4-table-cell {border-bottom: 2px dashed var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-row--avg > .hi-v4-table-cell, .hi-v4-table-row--total > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--avg:hover > .hi-v4-table-cell, .hi-v4-table-row--total:hover > .hi-v4-table-cell {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-row--virtual {display: -webkit-box;display: -ms-flexbox;display: flex; }.hi-v4-table-header .hi-v4-table-header-col, .hi-v4-table-header .hi-v4-table-col {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-body .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-body .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header .hi-v4-table-header-col[data-hover-highlight], .hi-v4-table-header .hi-v4-table-col[data-hover-highlight] {background-color: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-table-body {position: relative;overflow: auto; }.hi-v4-table-header-cell {color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-medium, 500);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-table-header-cell.hi-v4-table__embed-col, .hi-v4-table-header-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell {word-break: break-word;border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);font-size: var(--hi-v4-text-size-md, 0.875rem);font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-700, #1f2733);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-8, 16px);background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-cell__indent {display: inline-block;width: 14px;height: 100%;margin-right: var(--hi-v4-spacing-1, 2px); }.hi-v4-table-cell__switcher.hi-v4-icon-button {margin-right: var(--hi-v4-spacing-1, 2px);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-cell.hi-v4-table__embed-col, .hi-v4-table-cell.hi-v4-table__selection-col {padding: var(--hi-v4-spacing-7, 14px) var(--hi-v4-spacing-5, 10px); }.hi-v4-table-cell.hi-v4-table-cell__col--highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-cell.hi-v4-table-cell__col--hovered-highlight {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-freeze-shadow {position: absolute;top: 0;bottom: 0;z-index: 20;pointer-events: none;overflow: hidden;height: 100%;width: 200px; }.hi-v4-table-freeze-shadow--left {margin-right: 10px;left: 0;-webkit-box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: 6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-freeze-shadow--right {margin-left: 10px;right: 0;-webkit-box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15);box-shadow: -6px 0 6px -4px rgba(0, 0, 0, 0.15); }.hi-v4-table-header-filter-dropdown__trigger.hi-v4-icon-button {margin-left: 4px; }.hi-v4-table-header-filter-dropdown__content {width: 124px;padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-4, 8px);font-weight: var(--hi-v4-text-weight-normal, 400); }.hi-v4-table-header-filter-dropdown__item {margin-top: var(--hi-v4-spacing-4, 8px);padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);border-radius: var(--hi-v4-border-radius-md, 4px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;color: var(--hi-v4-color-gray-700, #1f2733);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-table-header-filter-dropdown__item:first-child {margin-top: 0; }.hi-v4-table-header-filter-dropdown__item:hover {background-color: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-header-filter-dropdown__item--active {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-dropdown__item--active:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-header-filter-sorter {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 20px;vertical-align: middle;margin-left: 6px; }.hi-v4-table-header-filter-sorter__icon {display: inline-block;height: 8px;cursor: pointer;overflow: hidden;font-weight: var(--hi-v4-text-weight-normal, 400);color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-table-header-filter-sorter__icon svg {position: relative;top: -5px; }.hi-v4-table-header-filter-sorter__icon--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-table-header-filter-custom__trigger {margin-left: 6px;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer; }.hi-v4-table-header-filter-custom__content {padding: 12px 8px; }.hi-v4-table-embed-row {position: relative;z-index: 0; }.hi-v4-table-embed-row > td {background-color: var(--hi-v4-color-gray-200, #ebedf0);padding: var(--hi-v4-spacing-10, 20px); }.hi-v4-table-setting {position: absolute;height: 100%;z-index: 11;-webkit-box-sizing: border-box;box-sizing: border-box;right: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-left: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8);border-bottom: none;border-top: none;color: var(--hi-v4-color-gray-500, #929aa6);cursor: pointer;font-size: var(--hi-v4-text-size-sm, 0.75rem);width: 18px;background: var(--hi-v4-color-gray-50, #f5f7fa); }.hi-v4-table-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-table-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-table-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-table-setting-item--dragging .hi-v4-table-setting-item__wrap {opacity: 0.6; }.hi-v4-table-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-table-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-table-setting-item::before, .hi-v4-table-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-table-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-table-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-table-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-table-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }.hi-v4-table-pagination {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;row-gap: 8px;padding: var(--hi-v4-spacing-6, 12px) 0;background-color: var(--hi-v4-color-static-white, #fff); }.hi-v4-table-pagination--placement-left {-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start; }.hi-v4-table-pagination--placement-right {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-table-pagination--placement-middle {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-table-empty-content td {text-align: center;padding: var(--hi-v4-spacing-12, 24px) 0; }.hi-v4-table--bordered .hi-v4-table-empty-content td {border-bottom: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-setting-drawer .hi-v4-setting__btn-group {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }.hi-v4-setting-item {position: relative;padding-top: var(--hi-v4-spacing-1, 2px);padding-bottom: var(--hi-v4-spacing-1, 2px);-webkit-box-sizing: border-box;box-sizing: border-box; }.hi-v4-setting-item__wrap {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: move;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;padding: var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-4, 8px);line-height: var(--hi-v4-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v4-border-radius-md, 4px); }.hi-v4-setting-item__wrap:hover {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe)); }.hi-v4-setting-item--dragging .hi-v4-setting-item__wrap {opacity: 0.6; }.hi-v4-setting-item::before {position: absolute;left: 0;z-index: 9999;display: none;-webkit-box-sizing: border-box;box-sizing: border-box;width: 8px;height: 8px;content: '';background-color: var(--hi-v4-color-static-white, #fff);border: 1px solid var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));border-radius: 100%; }.hi-v4-setting-item::after {position: absolute;content: '';z-index: 9998;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom-width: 0;border-bottom-style: solid;border-bottom-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));left: 0;width: 100%; }.hi-v4-setting-item::before, .hi-v4-setting-item::after {margin-left: -10px;margin-right: -10px; }.hi-v4-setting-item--direction-before::before {display: block;top: -0.5px;-webkit-transform: translateY(-4px);transform: translateY(-4px); }.hi-v4-setting-item--direction-before::after {top: -0.5px;border-bottom-width: 1px; }.hi-v4-setting-item--direction-after::before {display: block;bottom: 0.5px;-webkit-transform: translateY(4px);transform: translateY(4px); }.hi-v4-setting-item--direction-after::after {bottom: 0.5px;border-bottom-width: 1px; }";
12
12
 
13
13
  __styleInject__(css_248z);
package/lib/esm/use-table.js CHANGED
@@ -8,7 +8,7 @@
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
10
  import { __rest } from 'tslib';
11
- import { cloneTree, flattenTree, getLeafChildren, getNodeRootParent } from '@hi-ui/tree-utils';
11
+ import { cloneTree, flattenTree, getLeafChildren, getNodeRootParent, flattedTreeSort } from '@hi-ui/tree-utils';
12
12
  import React__default, { useMemo, useState, useRef, useCallback, useEffect } from 'react';
13
13
  import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
14
14
  import { useColWidth } from './hooks/use-col-width.js';
@@ -495,17 +495,23 @@ var useTable = function useTable(_a) {
495
495
 
496
496
 
497
497
  var showData = useMemo(function () {
498
- var _data = transitionData.concat();
498
+ var _a;
499
+
500
+ var _data = cloneTree(transitionData);
499
501
 
500
502
  if (activeSorterColumn) {
501
- var sorter = columns.filter(function (d) {
502
- return d.dataKey === activeSorterColumn;
503
- })[0] && columns.filter(function (d) {
503
+ var sorter = (_a = columns.filter(function (d) {
504
504
  return d.dataKey === activeSorterColumn;
505
- })[0].sorter;
505
+ })[0]) === null || _a === void 0 ? void 0 : _a.sorter;
506
506
 
507
507
  if (sorter) {
508
- _data = activeSorterType === 'ascend' ? [].concat(_data).sort(sorter) : [].concat(_data).sort(sorter).reverse();
508
+ activeSorterType === 'ascend' ? _data.sort(sorter) : _data.sort(sorter).reverse(); // 平铺的树形结构排序
509
+
510
+ if (_data.some(function (d) {
511
+ return d.depth !== 0;
512
+ })) {
513
+ _data = flattedTreeSort(_data);
514
+ }
509
515
  }
510
516
  }
511
517
 
package/lib/types/BaseTable.d.ts CHANGED
@@ -4,9 +4,6 @@ import { TableExtra, TableColumnItem, TableOnRowReturn } from './types';
4
4
  import { UseTableProps } from './use-table';
5
5
  import { UseEmbedExpandProps } from './hooks/use-embed-expand';
6
6
  export declare const EMBED_DATA_KEY: string;
7
- /**
8
- * TODO: What is BaseTable
9
- */
10
7
  export declare const BaseTable: React.ForwardRefExoticComponent<BaseTableProps & React.RefAttributes<HTMLDivElement | null>>;
11
8
  export interface BaseTableProps extends Omit<HiBaseHTMLProps<'div'>, 'onDrop' | 'draggable' | 'onDragStart'>, UseTableProps, UseEmbedExpandProps {
12
9
  /**
package/lib/types/TableBody.d.ts CHANGED
@@ -1,7 +1,4 @@
1
1
  import React from 'react';
2
- /**
3
- * TODO: What is TableBody
4
- */
5
2
  export declare const TableBody: React.ForwardRefExoticComponent<TableBodyProps & React.RefAttributes<HTMLDivElement | null>>;
6
3
  export interface TableBodyProps {
7
4
  /**
package/lib/types/TableHeader.d.ts CHANGED
@@ -1,7 +1,4 @@
1
1
  import React from 'react';
2
- /**
3
- * TODO: What is TableHeader
4
- */
5
2
  export declare const TableHeader: React.ForwardRefExoticComponent<TableHeaderProps & React.RefAttributes<HTMLDivElement | null>>;
6
3
  export interface TableHeaderProps {
7
4
  /**
package/lib/types/TableRow.d.ts CHANGED
@@ -1,8 +1,5 @@
1
1
  import React from 'react';
2
2
  import { FlattedTableRowData } from './types';
3
- /**
4
- * TODO: What is TableRow
5
- */
6
3
  export declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement | null>>;
7
4
  export interface TableRowProps {
8
5
  /**
package/lib/types/context.d.ts CHANGED
@@ -54,7 +54,7 @@ export declare const TableProvider: import("react").Provider<(Omit<{
54
54
  activeSorterType: string | null;
55
55
  setActiveSorterType: import("react").Dispatch<import("react").SetStateAction<string | null>>;
56
56
  canScroll: boolean;
57
- maxHeight: number | undefined;
57
+ maxHeight: string | number | undefined;
58
58
  getTableHeaderProps: () => {
59
59
  style: import("react").CSSProperties;
60
60
  'data-sticky': "" | undefined;
@@ -159,7 +159,7 @@ export declare const useTableContext: () => Omit<{
159
159
  activeSorterType: string | null;
160
160
  setActiveSorterType: import("react").Dispatch<import("react").SetStateAction<string | null>>;
161
161
  canScroll: boolean;
162
- maxHeight: number | undefined;
162
+ maxHeight: string | number | undefined;
163
163
  getTableHeaderProps: () => {
164
164
  style: import("react").CSSProperties;
165
165
  'data-sticky': "" | undefined;
package/lib/types/use-table.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { TableColumnItem, TableFrozenColumnOptions, TableRowEventData, TableRowSelection, FlattedTableColumnItemData } from './types';
2
+ import { TableColumnItem, TableFrozenColumnOptions, TableRowEventData, TableRowSelection, FlattedTableColumnItemData, FlattedTableRowData } from './types';
3
3
  import { PaginationProps } from '@hi-ui/pagination';
4
4
  export declare const useTable: ({ data, columns: columnsProp, defaultFixedToColumn, fixedToColumn: fixedToColumnProp, onFixedToColumn, scrollWidth, resizable, errorRowKeys, highlightedColKeys: highlightedColKeysProp, highlightedRowKeys: highlightedRowKeysProp, showColHighlight, showRowHighlight, highlightRowOnDoubleClick, defaultExpandedRowKeys, expandedRowKeys: expandRowKeysProp, onExpand, defaultExpandAll, onLoadChildren, maxHeight, sticky, stickyTop, draggable, onDragStart, onDrop: onDropProp, onDropEnd, showColMenu, rowSelection, cellRender, fieldKey, virtual, ...rootProps }: UseTableProps) => {
5
5
  getColgroupProps: (column: FlattedTableColumnItemData, index: number) => {
@@ -70,7 +70,7 @@ export declare const useTable: ({ data, columns: columnsProp, defaultFixedToColu
70
70
  activeSorterType: string | null;
71
71
  setActiveSorterType: React.Dispatch<React.SetStateAction<string | null>>;
72
72
  canScroll: boolean;
73
- maxHeight: number | undefined;
73
+ maxHeight: string | number | undefined;
74
74
  getTableHeaderProps: () => {
75
75
  style: React.CSSProperties;
76
76
  'data-sticky': "" | undefined;
@@ -80,7 +80,7 @@ export declare const useTable: ({ data, columns: columnsProp, defaultFixedToColu
80
80
  scrollBodyElementRef: React.RefObject<HTMLTableElement>;
81
81
  columns: FlattedTableColumnItemData[];
82
82
  data: object[];
83
- transitionData: import("./types").FlattedTableRowData[];
83
+ transitionData: FlattedTableRowData[];
84
84
  flattedColumns: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
85
85
  flattedColumnsWithoutChildren: FlattedTableColumnItemData[];
86
86
  rowSelection: TableRowSelection | undefined;
@@ -147,7 +147,7 @@ export interface UseTableProps {
147
147
  /**
148
148
  * 表格最大高度，当穿过该高度时，展示滚动条且表头固定
149
149
  */
150
- maxHeight?: number;
150
+ maxHeight?: number | string;
151
151
  /**
152
152
  * 表格列冻结默认设置，为 string 时仅支持从左侧冻结至某一列
153
153
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/table",
3
- "version": "4.1.0",
3
+ "version": "4.1.1",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HiUI <mi-hiui@xiaomi.com>",
@@ -62,7 +62,7 @@
62
62
  "@hi-ui/select": "^4.0.8",
63
63
  "@hi-ui/spinner": "^4.0.4",
64
64
  "@hi-ui/times": "^4.0.1",
65
- "@hi-ui/tree-utils": "^4.0.2",
65
+ "@hi-ui/tree-utils": "^4.1.0",
66
66
  "@hi-ui/type-assertion": "^4.0.1",
67
67
  "@hi-ui/use-cache": "^4.0.1",
68
68
  "@hi-ui/use-check": "^4.0.2",
@@ -83,7 +83,6 @@
83
83
  "devDependencies": {
84
84
  "@hi-ui/core": "^4.0.4",
85
85
  "@hi-ui/core-css": "^4.0.1",
86
- "@hi-ui/hi-build": "^4.0.1",
87
86
  "@types/react-resizable": "^1.7.4",
88
87
  "react": "^17.0.1",
89
88
  "react-dom": "^17.0.1"