@hi-ui/table 4.3.1 → 4.3.2

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 (137) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/lib/cjs/BaseTable.js +136 -189
  3. package/lib/cjs/ColGroupContent.js +5 -28
  4. package/lib/cjs/SettingDrawer.js +76 -127
  5. package/lib/cjs/Table.js +107 -171
  6. package/lib/cjs/TableAdvancedFilter.js +49 -85
  7. package/lib/cjs/TableBody.js +33 -69
  8. package/lib/cjs/TableCell.js +56 -102
  9. package/lib/cjs/TableColumnMenu.js +39 -77
  10. package/lib/cjs/TableEmbedRow.js +11 -38
  11. package/lib/cjs/TableHeader.js +8 -33
  12. package/lib/cjs/TableRow.js +48 -88
  13. package/lib/cjs/TableSettingMenu.js +48 -94
  14. package/lib/cjs/TbodyContent.js +28 -56
  15. package/lib/cjs/TheadContent.js +20 -49
  16. package/lib/cjs/_virtual/index.js +0 -3
  17. package/lib/cjs/_virtual/index2.js +0 -3
  18. package/lib/cjs/_virtual/react-is.development.js +0 -3
  19. package/lib/cjs/_virtual/react-is.production.min.js +0 -3
  20. package/lib/cjs/context.js +0 -9
  21. package/lib/cjs/hooks/use-async-switch.js +13 -51
  22. package/lib/cjs/hooks/use-check.js +47 -77
  23. package/lib/cjs/hooks/use-col-hidden.js +16 -28
  24. package/lib/cjs/hooks/use-col-set.js +5 -18
  25. package/lib/cjs/hooks/use-col-sorter.js +18 -32
  26. package/lib/cjs/hooks/use-col-width.js +21 -57
  27. package/lib/cjs/hooks/use-colgroup.js +63 -85
  28. package/lib/cjs/hooks/use-drag.js +10 -31
  29. package/lib/cjs/hooks/use-embed-expand.js +23 -68
  30. package/lib/cjs/hooks/use-expand.js +32 -64
  31. package/lib/cjs/hooks/use-pagination.js +19 -50
  32. package/lib/cjs/hooks/use-queue.js +2 -14
  33. package/lib/cjs/icons/index.js +4 -21
  34. package/lib/cjs/index.js +0 -4
  35. package/lib/cjs/node_modules/classnames/index.js +2 -11
  36. package/lib/cjs/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js +31 -227
  37. package/lib/cjs/node_modules/rc-resize-observer/es/index.js +10 -68
  38. package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/Children/toArray.js +1 -17
  39. package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/Dom/findDOMNode.js +1 -14
  40. package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/ref.js +1 -25
  41. package/lib/cjs/node_modules/rc-resize-observer/node_modules/rc-util/es/warning.js +1 -5
  42. package/lib/cjs/node_modules/rc-util/es/Dom/canUseDom.js +0 -2
  43. package/lib/cjs/node_modules/rc-util/es/Dom/findDOMNode.js +1 -14
  44. package/lib/cjs/node_modules/rc-util/es/hooks/useLayoutEffect.js +2 -9
  45. package/lib/cjs/node_modules/rc-util/es/raf.js +0 -11
  46. package/lib/cjs/node_modules/rc-virtual-list/es/Filler.js +6 -25
  47. package/lib/cjs/node_modules/rc-virtual-list/es/Item.js +3 -14
  48. package/lib/cjs/node_modules/rc-virtual-list/es/List.js +103 -194
  49. package/lib/cjs/node_modules/rc-virtual-list/es/ScrollBar.js +16 -96
  50. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useChildren.js +2 -11
  51. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useDiffItem.js +8 -34
  52. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useFrameWheel.js +0 -10
  53. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useHeights.js +6 -39
  54. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js +0 -16
  55. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useOriginScroll.js +4 -9
  56. package/lib/cjs/node_modules/rc-virtual-list/es/hooks/useScrollTo.js +3 -28
  57. package/lib/cjs/node_modules/rc-virtual-list/es/index.js +0 -2
  58. package/lib/cjs/node_modules/rc-virtual-list/es/utils/CacheMap.js +2 -9
  59. package/lib/cjs/node_modules/rc-virtual-list/es/utils/algorithmUtil.js +0 -15
  60. package/lib/cjs/node_modules/rc-virtual-list/es/utils/isFirefox.js +0 -2
  61. package/lib/cjs/node_modules/react-is/cjs/react-is.development.js +3 -29
  62. package/lib/cjs/node_modules/react-is/cjs/react-is.production.min.js +19 -45
  63. package/lib/cjs/node_modules/react-is/index.js +0 -5
  64. package/lib/cjs/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +83 -248
  65. package/lib/cjs/packages/hooks/use-merge-refs/lib/esm/index.js +3 -14
  66. package/lib/cjs/packages/ui/scrollbar/lib/esm/Scrollbar.js +48 -86
  67. package/lib/cjs/packages/ui/scrollbar/lib/esm/styles/index.scss.js +1 -15
  68. package/lib/cjs/packages/ui/scrollbar/lib/esm/utils/index.js +0 -13
  69. package/lib/cjs/styles/index.scss.js +1 -4
  70. package/lib/cjs/use-table.js +268 -355
  71. package/lib/cjs/utils/index.js +11 -45
  72. package/lib/esm/BaseTable.js +117 -138
  73. package/lib/esm/ColGroupContent.js +3 -9
  74. package/lib/esm/SettingDrawer.js +64 -83
  75. package/lib/esm/Table.js +97 -124
  76. package/lib/esm/TableAdvancedFilter.js +37 -47
  77. package/lib/esm/TableBody.js +24 -34
  78. package/lib/esm/TableCell.js +48 -72
  79. package/lib/esm/TableColumnMenu.js +24 -38
  80. package/lib/esm/TableEmbedRow.js +8 -15
  81. package/lib/esm/TableHeader.js +5 -11
  82. package/lib/esm/TableRow.js +36 -51
  83. package/lib/esm/TableSettingMenu.js +33 -49
  84. package/lib/esm/TbodyContent.js +20 -27
  85. package/lib/esm/TheadContent.js +14 -21
  86. package/lib/esm/context.js +0 -4
  87. package/lib/esm/hooks/use-async-switch.js +9 -28
  88. package/lib/esm/hooks/use-check.js +42 -55
  89. package/lib/esm/hooks/use-col-hidden.js +16 -21
  90. package/lib/esm/hooks/use-col-set.js +5 -13
  91. package/lib/esm/hooks/use-col-sorter.js +18 -23
  92. package/lib/esm/hooks/use-col-width.js +14 -34
  93. package/lib/esm/hooks/use-colgroup.js +60 -66
  94. package/lib/esm/hooks/use-drag.js +9 -13
  95. package/lib/esm/hooks/use-embed-expand.js +20 -42
  96. package/lib/esm/hooks/use-expand.js +32 -56
  97. package/lib/esm/hooks/use-pagination.js +13 -25
  98. package/lib/esm/hooks/use-queue.js +2 -10
  99. package/lib/esm/node_modules/classnames/index.js +2 -9
  100. package/lib/esm/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js +31 -228
  101. package/lib/esm/node_modules/rc-resize-observer/es/index.js +3 -26
  102. package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/Children/toArray.js +0 -3
  103. package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/Dom/findDOMNode.js +1 -2
  104. package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/ref.js +0 -8
  105. package/lib/esm/node_modules/rc-resize-observer/node_modules/rc-util/es/warning.js +0 -5
  106. package/lib/esm/node_modules/rc-util/es/Dom/canUseDom.js +0 -1
  107. package/lib/esm/node_modules/rc-util/es/Dom/findDOMNode.js +1 -2
  108. package/lib/esm/node_modules/rc-util/es/hooks/useLayoutEffect.js +1 -0
  109. package/lib/esm/node_modules/rc-util/es/raf.js +0 -10
  110. package/lib/esm/node_modules/rc-virtual-list/es/Filler.js +4 -15
  111. package/lib/esm/node_modules/rc-virtual-list/es/Item.js +1 -3
  112. package/lib/esm/node_modules/rc-virtual-list/es/List.js +101 -174
  113. package/lib/esm/node_modules/rc-virtual-list/es/ScrollBar.js +14 -86
  114. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useChildren.js +0 -2
  115. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useDiffItem.js +6 -25
  116. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useFrameWheel.js +0 -6
  117. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useHeights.js +4 -28
  118. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js +0 -13
  119. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useOriginScroll.js +4 -8
  120. package/lib/esm/node_modules/rc-virtual-list/es/hooks/useScrollTo.js +1 -19
  121. package/lib/esm/node_modules/rc-virtual-list/es/index.js +1 -1
  122. package/lib/esm/node_modules/rc-virtual-list/es/utils/CacheMap.js +2 -8
  123. package/lib/esm/node_modules/rc-virtual-list/es/utils/algorithmUtil.js +1 -12
  124. package/lib/esm/node_modules/rc-virtual-list/es/utils/isFirefox.js +0 -1
  125. package/lib/esm/node_modules/react-is/cjs/react-is.development.js +4 -27
  126. package/lib/esm/node_modules/react-is/cjs/react-is.production.min.js +20 -44
  127. package/lib/esm/node_modules/react-is/index.js +0 -1
  128. package/lib/esm/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js +82 -248
  129. package/lib/esm/packages/hooks/use-merge-refs/lib/esm/index.js +3 -9
  130. package/lib/esm/packages/ui/scrollbar/lib/esm/Scrollbar.js +47 -64
  131. package/lib/esm/packages/ui/scrollbar/lib/esm/styles/index.scss.js +1 -3
  132. package/lib/esm/packages/ui/scrollbar/lib/esm/utils/index.js +0 -10
  133. package/lib/esm/styles/index.scss.js +1 -3
  134. package/lib/esm/use-table.js +261 -318
  135. package/lib/esm/utils/index.js +11 -41
  136. package/lib/types/BaseTable.d.ts +2 -2
  137. package/package.json +33 -33
@@ -9,39 +9,29 @@
9
9
  */
10
10
  'use strict';
11
11
 
12
- Object.defineProperty(exports, '__esModule', {
13
- value: true
14
- });
15
-
16
12
  var React = require('react');
17
-
18
13
  var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
19
-
20
14
  var index = require('../utils/index.js');
21
-
22
15
  var DEFAULT_COLUMNS = [];
23
16
  /**
24
17
  * 列操作逻辑
25
18
  */
26
-
27
19
  var useColHidden = function useColHidden(_ref) {
28
20
  var uniqueId = _ref.uniqueId,
29
- _ref$columns = _ref.columns,
30
- columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
31
- hiddenColKeysProp = _ref.hiddenColKeys,
32
- onHiddenColKeysChange = _ref.onHiddenColKeysChange;
21
+ _ref$columns = _ref.columns,
22
+ columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
23
+ hiddenColKeysProp = _ref.hiddenColKeys,
24
+ onHiddenColKeysChange = _ref.onHiddenColKeysChange;
33
25
  var cacheKey = uniqueId ? uniqueId + "_hiddenColKeys" : '';
34
-
35
26
  var _useUncontrolledState = useUncontrolledState.useUncontrolledState(function () {
36
- return index.parseLocalArray({
37
- key: cacheKey,
38
- defaultValue: []
39
- });
40
- }, hiddenColKeysProp, onHiddenColKeysChange),
41
- _hiddenColKeys = _useUncontrolledState[0],
42
- setHiddenColKeys = _useUncontrolledState[1]; // 保证 includes 匹配 column,是有效的可展示的列
43
-
44
-
27
+ return index.parseLocalArray({
28
+ key: cacheKey,
29
+ defaultValue: []
30
+ });
31
+ }, hiddenColKeysProp, onHiddenColKeysChange),
32
+ _hiddenColKeys = _useUncontrolledState[0],
33
+ setHiddenColKeys = _useUncontrolledState[1];
34
+ // 保证 includes 匹配 column,是有效的可展示的列
45
35
  var hiddenColKeys = React.useMemo(function () {
46
36
  return _hiddenColKeys.filter(function (dataKey) {
47
37
  return typeof dataKey === 'string' && dataKey !== '';
@@ -50,12 +40,11 @@ var useColHidden = function useColHidden(_ref) {
50
40
  React.useEffect(function () {
51
41
  if (!cacheKey) return;
52
42
  window.localStorage.setItem(cacheKey, JSON.stringify(hiddenColKeys));
53
- }, [cacheKey, hiddenColKeys]); // 用于维护列操作时显隐临时状态
54
-
43
+ }, [cacheKey, hiddenColKeys]);
44
+ // 用于维护列操作时显隐临时状态
55
45
  var _useState = React.useState(hiddenColKeys),
56
- cacheHiddenColKeys = _useState[0],
57
- setCacheHiddenColKeys = _useState[1];
58
-
46
+ cacheHiddenColKeys = _useState[0],
47
+ setCacheHiddenColKeys = _useState[1];
59
48
  var visibleCols = React.useMemo(function () {
60
49
  // TODO: 支持隐藏叶子结点,而不是根节点
61
50
  // @ts-ignore
@@ -71,5 +60,4 @@ var useColHidden = function useColHidden(_ref) {
71
60
  setCacheHiddenColKeys: setCacheHiddenColKeys
72
61
  };
73
62
  };
74
-
75
63
  exports.useColHidden = useColHidden;
@@ -9,50 +9,38 @@
9
9
  */
10
10
  'use strict';
11
11
 
12
- Object.defineProperty(exports, '__esModule', {
13
- value: true
14
- });
15
-
16
12
  var React = require('react');
17
-
18
13
  var DEFAULT_COLUMNS = [];
19
14
  /**
20
15
  * 列设置
21
16
  */
22
-
23
17
  var useColSet = function useColSet(_ref) {
24
18
  var _ref$columns = _ref.columns,
25
- columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
26
- sortedColKeysProp = _ref.sortedColKeys,
27
- hiddenColKeysProp = _ref.hiddenColKeys;
19
+ columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
20
+ sortedColKeysProp = _ref.sortedColKeys,
21
+ hiddenColKeysProp = _ref.hiddenColKeys;
28
22
  var isColumnsEqual = React.useMemo(function () {
29
- var _a; // 判断columns和之前的是不是一样的,如果之前columns对不上,那么认为设置数据无效。
30
-
31
-
23
+ var _a;
24
+ // 判断columns和之前的是不是一样的,如果之前columns对不上,那么认为设置数据无效。
32
25
  if (!sortedColKeysProp) {
33
26
  return true;
34
27
  }
35
-
36
28
  if (columns.length !== sortedColKeysProp.length) {
37
29
  return false;
38
30
  }
39
-
40
31
  for (var cIndex = 0; cIndex < columns.length; cIndex++) {
41
32
  var exist = false;
42
33
  var dataKey = (_a = columns[cIndex]) === null || _a === void 0 ? void 0 : _a.dataKey;
43
-
44
34
  for (var sIndex = 0; sIndex < sortedColKeysProp.length; sIndex++) {
45
35
  if (dataKey === sortedColKeysProp[sIndex]) {
46
36
  exist = true;
47
37
  break;
48
38
  }
49
39
  }
50
-
51
40
  if (!exist) {
52
41
  return false;
53
42
  }
54
43
  }
55
-
56
44
  return true;
57
45
  }, [columns, sortedColKeysProp]);
58
46
  return {
@@ -60,5 +48,4 @@ var useColSet = function useColSet(_ref) {
60
48
  hiddenColKeys: isColumnsEqual ? hiddenColKeysProp : undefined
61
49
  };
62
50
  };
63
-
64
51
  exports.useColSet = useColSet;
@@ -9,44 +9,32 @@
9
9
  */
10
10
  'use strict';
11
11
 
12
- Object.defineProperty(exports, '__esModule', {
13
- value: true
14
- });
15
-
16
12
  var React = require('react');
17
-
18
13
  var useUpdateEffect = require('@hi-ui/use-update-effect');
19
-
20
14
  var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
21
-
22
15
  var useLatest = require('@hi-ui/use-latest');
23
-
24
16
  var index = require('../utils/index.js');
25
-
26
17
  var DEFAULT_COLUMNS = [];
27
18
  /**
28
19
  * 列排序
29
20
  */
30
-
31
21
  var useColSorter = function useColSorter(_ref) {
32
22
  var uniqueId = _ref.uniqueId,
33
- _ref$columns = _ref.columns,
34
- columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
35
- sortedColKeysProp = _ref.sortedColKeys,
36
- onSortedColKeysChange = _ref.onSortedColKeysChange;
23
+ _ref$columns = _ref.columns,
24
+ columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
25
+ sortedColKeysProp = _ref.sortedColKeys,
26
+ onSortedColKeysChange = _ref.onSortedColKeysChange;
37
27
  var cacheKey = uniqueId ? uniqueId + "_sortCols" : '';
38
-
39
28
  var _useUncontrolledState = useUncontrolledState.useUncontrolledState(function () {
40
- return index.parseLocalArray({
41
- key: cacheKey,
42
- defaultValue: columns.map(function (column) {
43
- return column.dataKey;
44
- })
45
- });
46
- }, sortedColKeysProp, onSortedColKeysChange),
47
- sortedColKeys = _useUncontrolledState[0],
48
- setSortColKeys = _useUncontrolledState[1];
49
-
29
+ return index.parseLocalArray({
30
+ key: cacheKey,
31
+ defaultValue: columns.map(function (column) {
32
+ return column.dataKey;
33
+ })
34
+ });
35
+ }, sortedColKeysProp, onSortedColKeysChange),
36
+ sortedColKeys = _useUncontrolledState[0],
37
+ setSortColKeys = _useUncontrolledState[1];
50
38
  useUpdateEffect.useUpdateEffect(function () {
51
39
  // 当column发生改变的时候,同步 setting 的 sortedCols 设置
52
40
  setSortColKeys(columns.map(function (column) {
@@ -66,13 +54,12 @@ var useColSorter = function useColSorter(_ref) {
66
54
  React.useEffect(function () {
67
55
  if (!cacheKey) return;
68
56
  window.localStorage.setItem(cacheKey, JSON.stringify(sortedColKeys));
69
- }, [cacheKey, sortedColKeys]); // 用于维护列操作时排序临时状态((未确认保存时))
70
-
57
+ }, [cacheKey, sortedColKeys]);
58
+ // 用于维护列操作时排序临时状态((未确认保存时))
71
59
  var _useState = React.useState(sortedCols),
72
- _cacheSortedCols = _useState[0],
73
- setCacheSortedCols = _useState[1]; // 保证排序的 column,是有效的可展示的列
74
-
75
-
60
+ _cacheSortedCols = _useState[0],
61
+ setCacheSortedCols = _useState[1];
62
+ // 保证排序的 column,是有效的可展示的列
76
63
  var cacheSortedCols = React.useMemo(function () {
77
64
  return _cacheSortedCols.filter(function (col) {
78
65
  return col && typeof col.dataKey === 'string' && col.dataKey !== '';
@@ -85,5 +72,4 @@ var useColSorter = function useColSorter(_ref) {
85
72
  setCacheSortedCols: setCacheSortedCols
86
73
  };
87
74
  };
88
-
89
75
  exports.useColSorter = useColSorter;
@@ -9,56 +9,32 @@
9
9
  */
10
10
  'use strict';
11
11
 
12
- var _typeof = require("@babel/runtime/helpers/typeof");
13
-
14
- Object.defineProperty(exports, '__esModule', {
15
- value: true
16
- });
17
-
18
12
  var React = require('react');
19
-
20
13
  var index = require('../utils/index.js');
21
-
22
14
  var useUpdateEffect = require('@hi-ui/use-update-effect');
23
-
24
- function _interopDefaultLegacy(e) {
25
- return e && _typeof(e) === 'object' && 'default' in e ? e : {
26
- 'default': e
27
- };
28
- }
29
-
30
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
31
-
32
15
  var useColWidth = function useColWidth(_ref) {
33
16
  var resizable = _ref.resizable,
34
- columns = _ref.columns,
35
- virtual = _ref.virtual;
36
- var measureRowElementRef = React__default["default"].useRef(null);
37
-
38
- var _React$useState = React__default["default"].useState(function () {
39
- return index.getGroupItemWidth(columns);
40
- }),
41
- colWidths = _React$useState[0],
42
- setColWidths = _React$useState[1];
43
-
17
+ columns = _ref.columns,
18
+ virtual = _ref.virtual;
19
+ var measureRowElementRef = React.useRef(null);
20
+ var _React$useState = React.useState(function () {
21
+ return index.getGroupItemWidth(columns);
22
+ }),
23
+ colWidths = _React$useState[0],
24
+ setColWidths = _React$useState[1];
44
25
  var getVirtualWidths = React.useCallback(function () {
45
26
  var measureRowElement = measureRowElementRef.current;
46
-
47
27
  if (!measureRowElement) {
48
28
  return index.getGroupItemWidth(columns);
49
29
  }
50
30
  /** 虚拟滚动时,内容宽度不能用以前table自动渲染的方式获取,需要手动计算 */
51
-
52
-
53
31
  var columnDefaultWidth = 200;
54
32
  var containerWidth = measureRowElement.clientWidth;
55
33
  var totalWidth = 0;
56
34
  /** 虚拟滚动,需要根据collist的虚拟宽度来计算宽度 */
57
-
58
35
  columns.forEach(function (columnItem) {
59
36
  totalWidth += columnItem.width || columnDefaultWidth;
60
37
  });
61
-
62
38
  if (totalWidth < containerWidth) {
63
39
  // 容器宽度大于设置的宽度总和时,col宽度等比分分配占满容器。
64
40
  return columns.map(function (columnItem) {
@@ -83,15 +59,14 @@ var useColWidth = function useColWidth(_ref) {
83
59
  /**
84
60
  * 根据实际内容区(table 的第一行)渲染,再次精确收集并设置每列宽度
85
61
  */
86
-
87
- React__default["default"].useEffect(function () {
62
+ React.useEffect(function () {
88
63
  var measureRowElement = measureRowElementRef.current;
89
-
90
64
  if (measureRowElement) {
91
65
  var _resizeObserver = new ResizeObserver(function () {
92
66
  if (virtual) {
93
67
  setColWidths(getVirtualWidths());
94
- } // else {
68
+ }
69
+ // else {
95
70
  // if (measureRowElement.childNodes) {
96
71
  // const _realColumnsWidth = Array.from(measureRowElement.childNodes).map((node) => {
97
72
  // return (node as HTMLElement).getBoundingClientRect().width || 0
@@ -101,27 +76,22 @@ var useColWidth = function useColWidth(_ref) {
101
76
  // }
102
77
  // }
103
78
  // }
104
-
105
79
  });
106
80
 
107
81
  _resizeObserver.observe(measureRowElement);
108
82
  }
109
-
110
- return function () {}; // 测量元素在内容列为空时会是空,切换会使测量元素变化,导致后续的resize时间无法响应,此处测量元素变化时需要重新绑定
83
+ return function () {};
84
+ // 测量元素在内容列为空时会是空,切换会使测量元素变化,导致后续的resize时间无法响应,此处测量元素变化时需要重新绑定
111
85
  }, [getVirtualWidths, virtual]);
112
-
113
- var _React$useState2 = React__default["default"].useState(null),
114
- headerTableElement = _React$useState2[0],
115
- setHeaderTableElement = _React$useState2[1];
86
+ var _React$useState2 = React.useState(null),
87
+ headerTableElement = _React$useState2[0],
88
+ setHeaderTableElement = _React$useState2[1];
116
89
  /**
117
90
  * 控制列最小可调整宽度
118
91
  */
119
-
120
-
121
- var minColWidth = React__default["default"].useMemo(function () {
92
+ var minColWidth = React.useMemo(function () {
122
93
  if (resizable && headerTableElement) {
123
94
  var resizableHandlerWidth = 4;
124
-
125
95
  var _minColWidth = Array.from(headerTableElement.childNodes).map(function (th) {
126
96
  var thPaddingLeft = parseFloat(window.getComputedStyle(th).getPropertyValue('padding-left'));
127
97
  var childNodes = Array.from(th.childNodes);
@@ -131,17 +101,14 @@ var useColWidth = function useColWidth(_ref) {
131
101
  return prev + next;
132
102
  }) + thPaddingLeft * 2 + resizableHandlerWidth;
133
103
  });
134
-
135
104
  return _minColWidth;
136
105
  }
137
-
138
106
  return Array(columns.length).fill(0);
139
107
  }, [columns.length, headerTableElement, resizable]);
140
108
  /**
141
109
  * 列宽拖拽 resize,只处理拖拽线两边的列宽度
142
110
  */
143
-
144
- var onColumnResizable = React__default["default"].useCallback(function (_, _ref2, index) {
111
+ var onColumnResizable = React.useCallback(function (_, _ref2, index) {
145
112
  var size = _ref2.size;
146
113
  var minWidth = minColWidth[index];
147
114
  var anotherMinWidth = minColWidth[index + 1];
@@ -149,26 +116,24 @@ var useColWidth = function useColWidth(_ref) {
149
116
  setColWidths(function (prev) {
150
117
  var nextColWidths = [].concat(prev);
151
118
  var anotherWidth = nextColWidths[index + 1] + nextColWidths[index] - nextWidth;
152
-
153
119
  if (anotherWidth <= anotherMinWidth) {
154
120
  anotherWidth = anotherMinWidth;
155
121
  nextWidth = nextColWidths[index + 1] - anotherMinWidth + nextColWidths[index];
156
122
  }
157
-
158
123
  nextColWidths[index] = nextWidth;
159
124
  nextColWidths[index + 1] = anotherWidth;
160
125
  return nextColWidths;
161
126
  });
162
127
  }, [minColWidth]);
163
- var getColgroupProps = React__default["default"].useCallback(function (column, index) {
128
+ var getColgroupProps = React.useCallback(function (column, index) {
164
129
  var width = colWidths[index] || undefined;
165
130
  return {
166
131
  style: {
167
132
  width: width,
168
133
  // TODO(疑惑): minWidth 所要解决的问题
169
134
  minWidth: width
170
- } // 'data-hover-highlight': setAttrStatus(isHoveredCol(column.dataKey)),
171
-
135
+ }
136
+ // 'data-hover-highlight': setAttrStatus(isHoveredCol(column.dataKey)),
172
137
  };
173
138
  }, [colWidths]);
174
139
  return {
@@ -179,5 +144,4 @@ var useColWidth = function useColWidth(_ref) {
179
144
  colWidths: colWidths
180
145
  };
181
146
  };
182
-
183
147
  exports.useColWidth = useColWidth;
@@ -9,99 +9,78 @@
9
9
  */
10
10
  'use strict';
11
11
 
12
- var _typeof = require("@babel/runtime/helpers/typeof");
13
-
14
- Object.defineProperty(exports, '__esModule', {
15
- value: true
16
- });
17
-
18
12
  var React = require('react');
19
-
20
13
  var treeUtils = require('@hi-ui/tree-utils');
21
-
22
14
  var typeAssertion = require('@hi-ui/type-assertion');
23
-
24
- function _interopDefaultLegacy(e) {
25
- return e && _typeof(e) === 'object' && 'default' in e ? e : {
26
- 'default': e
27
- };
28
- }
29
-
30
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
31
-
32
15
  var useColumns = function useColumns(_ref) {
33
- var columns = _ref.columns; // 拉平后的数据
34
-
35
- var _React$useMemo = React__default["default"].useMemo(function () {
36
- var clonedColumns = treeUtils.cloneTree(columns);
37
- var maxDepth = 0; // @ts-ignore
38
- // @ts-ignore
39
-
40
- var flattedColumns = treeUtils.flattenTree(clonedColumns, function (node) {
41
- var _a;
42
-
43
- if (node.depth > maxDepth) {
44
- maxDepth = node.depth;
45
- }
46
-
47
- var raw = node.raw;
48
- return Object.assign(Object.assign({}, node), {
49
- id: raw.dataKey,
50
- width: raw.width,
51
- // TODO: remove it
52
- dataKey: raw.dataKey,
53
- title: raw.title,
54
- align: (_a = raw.align) !== null && _a !== void 0 ? _a : 'left',
55
- render: raw.render
56
- });
57
- }); // 记录下标位置,方便冻结列操作计算时快速获取更新
58
- // 记录下标位置,方便冻结列操作计算时快速获取更新
59
-
60
- flattedColumns.forEach(function (column, index) {
16
+ var columns = _ref.columns;
17
+ // 拉平后的数据
18
+ var _React$useMemo = React.useMemo(function () {
19
+ var clonedColumns = treeUtils.cloneTree(columns);
20
+ var maxDepth = 0;
61
21
  // @ts-ignore
62
- column.index = index;
63
- });
64
- return [flattedColumns, maxDepth];
65
- }, [columns]),
66
- flattedColumns = _React$useMemo[0],
67
- maxColumnDepth = _React$useMemo[1]; // 末级 column
68
-
69
-
70
- var flattedColumnsWithoutChildren = React__default["default"].useMemo(function () {
22
+ // @ts-ignore
23
+ var flattedColumns = treeUtils.flattenTree(clonedColumns, function (node) {
24
+ var _a;
25
+ if (node.depth > maxDepth) {
26
+ maxDepth = node.depth;
27
+ }
28
+ var raw = node.raw;
29
+ return Object.assign(Object.assign({}, node), {
30
+ id: raw.dataKey,
31
+ width: raw.width,
32
+ // TODO: remove it
33
+ dataKey: raw.dataKey,
34
+ title: raw.title,
35
+ align: (_a = raw.align) !== null && _a !== void 0 ? _a : 'left',
36
+ render: raw.render
37
+ });
38
+ });
39
+ // 记录下标位置,方便冻结列操作计算时快速获取更新
40
+ // 记录下标位置,方便冻结列操作计算时快速获取更新
41
+ flattedColumns.forEach(function (column, index) {
42
+ // @ts-ignore
43
+ column.index = index;
44
+ });
45
+ return [flattedColumns, maxDepth];
46
+ }, [columns]),
47
+ flattedColumns = _React$useMemo[0],
48
+ maxColumnDepth = _React$useMemo[1];
49
+ // 末级 column
50
+ var flattedColumnsWithoutChildren = React.useMemo(function () {
71
51
  return flattedColumns.filter(function (col) {
72
52
  return !typeAssertion.isArrayNonEmpty(col.children);
73
53
  });
74
54
  }, [flattedColumns]);
75
-
76
- var _React$useMemo2 = React__default["default"].useMemo(function () {
77
- var nextColumns = [].concat( // @ts-ignore
78
- // flattedColumns.filter((col) => isLeaf(col)) as FlattedTableColumnItemData[]
79
- flattedColumns); // 表头分组
80
- // 在最后一层,colSpan = 1, rowSpan = maxDepth - depth + 1
81
- // 不在最后一层,rowSpan = 1, colSpan = 叶子节点后代数量
82
- // 表头分组
83
- // 在最后一层,colSpan = 1, rowSpan = maxDepth - depth + 1
84
- // 不在最后一层,rowSpan = 1, colSpan = 叶子节点后代数量
85
-
86
- flattedColumns.forEach(function (column) {
87
- if (treeUtils.isLeaf(column)) {
88
- column.rowSpan = maxColumnDepth - column.depth + 1;
89
- column.colSpan = 1;
90
- } else {
91
- column.rowSpan = 1;
92
- column.colSpan = treeUtils.getLeafChildren(column).length;
93
- }
94
- });
95
- var leafColumns = flattedColumns.filter(function (col) {
96
- return treeUtils.isLeaf(col);
97
- });
98
- var groupedColumns = treeUtils.groupByTreeDepth(nextColumns);
99
- return [nextColumns, groupedColumns, leafColumns];
100
- }, [flattedColumns, maxColumnDepth]),
101
- mergedColumns = _React$useMemo2[0],
102
- groupedColumns = _React$useMemo2[1],
103
- leafColumns = _React$useMemo2[2];
104
-
55
+ var _React$useMemo2 = React.useMemo(function () {
56
+ var nextColumns = [].concat(
57
+ // @ts-ignore
58
+ // flattedColumns.filter((col) => isLeaf(col)) as FlattedTableColumnItemData[]
59
+ flattedColumns);
60
+ // 表头分组
61
+ // 在最后一层,colSpan = 1, rowSpan = maxDepth - depth + 1
62
+ // 不在最后一层,rowSpan = 1, colSpan = 叶子节点后代数量
63
+ // 表头分组
64
+ // 在最后一层,colSpan = 1, rowSpan = maxDepth - depth + 1
65
+ // 不在最后一层,rowSpan = 1, colSpan = 叶子节点后代数量
66
+ flattedColumns.forEach(function (column) {
67
+ if (treeUtils.isLeaf(column)) {
68
+ column.rowSpan = maxColumnDepth - column.depth + 1;
69
+ column.colSpan = 1;
70
+ } else {
71
+ column.rowSpan = 1;
72
+ column.colSpan = treeUtils.getLeafChildren(column).length;
73
+ }
74
+ });
75
+ var leafColumns = flattedColumns.filter(function (col) {
76
+ return treeUtils.isLeaf(col);
77
+ });
78
+ var groupedColumns = treeUtils.groupByTreeDepth(nextColumns);
79
+ return [nextColumns, groupedColumns, leafColumns];
80
+ }, [flattedColumns, maxColumnDepth]),
81
+ mergedColumns = _React$useMemo2[0],
82
+ groupedColumns = _React$useMemo2[1],
83
+ leafColumns = _React$useMemo2[2];
105
84
  return {
106
85
  // getColgroupProps,
107
86
  flattedColumns: flattedColumns,
@@ -111,5 +90,4 @@ var useColumns = function useColumns(_ref) {
111
90
  flattedColumnsWithoutChildren: flattedColumnsWithoutChildren
112
91
  };
113
92
  };
114
-
115
93
  exports.useColumns = useColumns;
@@ -9,54 +9,34 @@
9
9
  */
10
10
  'use strict';
11
11
 
12
- var _typeof = require("@babel/runtime/helpers/typeof");
13
-
14
- Object.defineProperty(exports, '__esModule', {
15
- value: true
16
- });
17
-
18
12
  var React = require('react');
19
-
20
13
  var useLatest = require('@hi-ui/use-latest');
21
-
22
14
  var treeUtils = require('@hi-ui/tree-utils');
23
-
24
15
  var typeAssertion = require('@hi-ui/type-assertion');
25
-
26
- function _interopDefaultLegacy(e) {
27
- return e && _typeof(e) === 'object' && 'default' in e ? e : {
28
- 'default': e
29
- };
30
- }
31
-
32
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
33
-
34
16
  var useTableDrag = function useTableDrag(_ref) {
35
17
  var cacheData = _ref.cacheData,
36
- setCacheData = _ref.setCacheData,
37
- draggable = _ref.draggable,
38
- onDropEnd = _ref.onDropEnd,
39
- onDropProp = _ref.onDrop,
40
- fieldKey = _ref.fieldKey;
41
- var dragRowRef = React__default["default"].useRef(null);
18
+ setCacheData = _ref.setCacheData,
19
+ draggable = _ref.draggable,
20
+ onDropEnd = _ref.onDropEnd,
21
+ onDropProp = _ref.onDrop,
22
+ fieldKey = _ref.fieldKey;
23
+ var dragRowRef = React.useRef(null);
42
24
  var onDropEndLatest = useLatest.useLatestCallback(onDropEnd);
43
25
  var onDrop = React.useCallback(function (evt, sourceId, targetId, dragDirection) {
44
26
  if (!draggable) return;
45
- if (targetId === sourceId) return; // TODO: 根据 id 查询数据原始数据或者直接使用引用值,两者选择,避免bug
27
+ if (targetId === sourceId) return;
28
+ // TODO: 根据 id 查询数据原始数据或者直接使用引用值,两者选择,避免bug
46
29
  // const { rowData, dropRowData, level } = dragRowRef.current
47
-
48
30
  var sourceNode = treeUtils.findNodeById(cacheData, sourceId, {
49
31
  idFieldName: fieldKey
50
32
  });
51
33
  var targetNode = treeUtils.findNodeById(cacheData, targetId, {
52
34
  idFieldName: fieldKey
53
35
  });
54
-
55
36
  if (!sourceNode || !targetNode) {
56
37
  // console.log('未找到任何节点(sourceNode, targetNode)', sourceNode, targetNode)
57
38
  return;
58
39
  }
59
-
60
40
  var nextTreeData = treeUtils.cloneTree(cacheData);
61
41
  treeUtils.deleteNodeById(nextTreeData, sourceId, {
62
42
  idFieldName: fieldKey
@@ -64,7 +44,8 @@ var useTableDrag = function useTableDrag(_ref) {
64
44
  treeUtils.insertNodeById(nextTreeData, targetId, sourceNode, dragDirection === 'top' ? 0 : 1, {
65
45
  idFieldName: fieldKey
66
46
  });
67
- var resultMaybePromise = typeAssertion.isFunction(onDropProp) ? // TODO: 支持 tree 拖拽层级,第四个参数
47
+ var resultMaybePromise = typeAssertion.isFunction(onDropProp) ?
48
+ // TODO: 支持 tree 拖拽层级,第四个参数
68
49
  onDropProp(evt, {
69
50
  dragNode: sourceNode,
70
51
  dropNode: targetNode,
@@ -73,7 +54,6 @@ var useTableDrag = function useTableDrag(_ref) {
73
54
  after: nextTreeData
74
55
  }
75
56
  }) : true;
76
-
77
57
  if (typeAssertion.isPromise(resultMaybePromise)) {
78
58
  resultMaybePromise.then(function (returnResult) {
79
59
  if (returnResult === true) {
@@ -105,5 +85,4 @@ var useTableDrag = function useTableDrag(_ref) {
105
85
  dragRowRef: dragRowRef
106
86
  };
107
87
  };
108
-
109
88
  exports.useTableDrag = useTableDrag;