@hi-ui/table 4.0.0-alpha.7 → 4.0.0-beta.2

package/lib/cjs/hooks/use-check.js

@@ -0,0 +1,106 @@
+/** @LICENSE
+ * @hi-ui/table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/table#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var useCheck = require('@hi-ui/use-check');
+
+var React = require('react');
+
+var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
+
+function _interopDefaultLegacy(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var DEFAULT_CHECKED_ROW_KEYS = [];
+
+var useTableCheck = function useTableCheck(_ref) {
+  var rowSelection = _ref.rowSelection,
+      flattedData = _ref.flattedData,
+      fieldKey = _ref.fieldKey;
+  var checkRowIsDisabledCheckbox = React__default['default'].useCallback(function (rowItem) {
+    var checkboxConfig = rowSelection && rowSelection.getCheckboxConfig && rowSelection.getCheckboxConfig(rowItem);
+    return checkboxConfig && checkboxConfig.disabled || false;
+  }, [rowSelection]);
+
+  var _useUncontrolledState = useUncontrolledState.useUncontrolledState(DEFAULT_CHECKED_ROW_KEYS, rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys, rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.onChange),
+      checkedRowKeys = _useUncontrolledState[0],
+      trySetCheckedRowKeys = _useUncontrolledState[1]; // TODO: 暂时不支持正反选
+
+
+  var _useCheck = useCheck.useCheck({
+    checkedIds: checkedRowKeys,
+    onCheck: trySetCheckedRowKeys,
+    idFieldName: fieldKey
+  }),
+      onCheckedRowKeysChange = _useCheck[0],
+      isCheckedRowKey = _useCheck[1]; // 判断是否全选
+
+
+  var _React$useMemo = React__default['default'].useMemo(function () {
+    if (rowSelection) {
+      if (flattedData.length === 0 || checkedRowKeys.length === 0) {
+        return [false, false];
+      }
+
+      var _checkedAll = flattedData.filter(function (item) {
+        return !checkRowIsDisabledCheckbox(item.raw);
+      }) // TODO: 数组项完全匹配工具函数
+      . // TODO: 数组项完全匹配工具函数
+      every(function (item) {
+        return isCheckedRowKey(item.id);
+      });
+
+      return [_checkedAll, _checkedAll ? false : checkedRowKeys.length > 0];
+    }
+
+    return [false, false];
+  }, [flattedData, rowSelection, isCheckedRowKey, checkedRowKeys.length, checkRowIsDisabledCheckbox]),
+      checkedAll = _React$useMemo[0],
+      semiChecked = _React$useMemo[1];
+
+  var tryCheckAllRow = React__default['default'].useCallback(function () {
+    if (checkedAll) {
+      trySetCheckedRowKeys([], [], false);
+      return;
+    }
+
+    var targetItems = flattedData.filter(function (item) {
+      return !checkRowIsDisabledCheckbox(item.raw);
+    });
+    var checkedRowKeys = targetItems.map(function (item) {
+      return item.id;
+    });
+    trySetCheckedRowKeys(checkedRowKeys, targetItems, true);
+  }, [trySetCheckedRowKeys, flattedData, checkRowIsDisabledCheckbox, checkedAll]);
+  return {
+    tryCheckAllRow: tryCheckAllRow,
+    checkedAll: checkedAll,
+    semiChecked: semiChecked,
+    onCheckedRowKeysChange: onCheckedRowKeysChange,
+    isCheckedRowKey: isCheckedRowKey,
+    checkedRowKeys: checkedRowKeys,
+    trySetCheckedRowKeys: trySetCheckedRowKeys,
+    checkRowIsDisabledCheckbox: checkRowIsDisabledCheckbox
+  };
+};
+
+exports.useTableCheck = useTableCheck;
+//# sourceMappingURL=use-check.js.map

package/lib/cjs/hooks/use-check.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-check.js","sources":["../../../src/hooks/use-check.ts"],"sourcesContent":[null],"names":["DEFAULT_CHECKED_ROW_KEYS","useTableCheck","rowSelection","flattedData","fieldKey","checkRowIsDisabledCheckbox","React","useCallback","rowItem","checkboxConfig","getCheckboxConfig","disabled","useUncontrolledState","selectedRowKeys","onChange","checkedRowKeys","trySetCheckedRowKeys","useCheck","checkedIds","onCheck","idFieldName","onCheckedRowKeysChange","isCheckedRowKey","useMemo","length","checkedAll","filter","item","raw","every","id","semiChecked","tryCheckAllRow","targetItems","map"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,IAAMA,wBAAwB,GAAG,EAAjC;;IAEaC,aAAa,GAAG,SAAhBA,aAAgB,KAAA;MAC3BC,oBAAAA;MACAC,mBAAAA;MACAC,gBAAAA;MAMMC,0BAA0B,GAAGC,yBAAAA,CAAMC,WAAND,CACjC,UAACE,OAAD;QACQC,cAAc,GAClBP,YAAY,IAAIA,YAAY,CAACQ,iBAA7BR,IAAkDA,YAAY,CAACQ,iBAAbR,CAA+BM,OAA/BN;WAE5CO,cAAc,IAAIA,cAAc,CAACE,QAAjCF,IAA8C;AALvB,GAAAH,EAOjC,CAACJ,YAAD,CAPiCI;;8BAUYM,yCAAAA,CAC7CZ,wBAD6CY,EAE7CV,YAAY,SAAZA,IAAAA,YAAY,WAAZA,SAAAA,GAAAA,YAAY,CAAEW,eAF+BD,EAG7CV,YAAY,SAAZA,IAAAA,YAAY,WAAZA,SAAAA,GAAAA,YAAY,CAAEY,QAH+BF;MAAxCG,cAAP;MAAuBC,oBAAvB;;;kBAOkDC,iBAAAA,CAAS;AACzDC,IAAAA,UAAU,EAAEH,cAD6C;AAEzDI,IAAAA,OAAO,EAAEH,oBAFgD;AAGzDI,IAAAA,WAAW,EAAEhB;AAH4C,GAATa;MAA3CI,sBAAP;MAA+BC,eAA/B;;;uBAOkChB,yBAAAA,CAAMiB,OAANjB,CAAc;QAC1CJ,cAAc;UACZC,WAAW,CAACqB,MAAZrB,KAAuB,CAAvBA,IAA4BY,cAAc,CAACS,MAAfT,KAA0B,GAAG;eACpD,CAAC,KAAD,EAAQ,KAAR;;;UAGHU,WAAU,GAAGtB,WAAW,CAC3BuB,MADgBvB,CACT,UAACwB,IAAD;eAAU,CAACtB,0BAA0B,CAACsB,IAAI,CAACC,GAAN;AAD5B,OAAAzB;AAAAA;AAGhB0B,MAAAA,KAHgB1B,CAGV,UAACwB,IAAD;eAAUL,eAAe,CAACK,IAAI,CAACG,EAAN;AAHf,OAAA3B;;aAKZ,CAACsB,WAAD,EAAaA,WAAU,GAAG,KAAH,GAAWV,cAAc,CAACS,MAAfT,GAAwB,CAA1D;;;WAGF,CAAC,KAAD,EAAQ,KAAR;AAdyB,GAAAT,EAe/B,CACDH,WADC,EAEDD,YAFC,EAGDoB,eAHC,EAIDP,cAAc,CAACS,MAJd,EAKDnB,0BALC,CAf+BC;MAA3BmB,UAAP;MAAmBM,WAAnB;;MAuBMC,cAAc,GAAG1B,yBAAAA,CAAMC,WAAND,CAAkB;QACnCmB,YAAY;AACdT,MAAAA,oBAAoB,CAAC,EAAD,EAAY,EAAZ,EAAgB,KAAhB,CAApBA;;;;QAIIiB,WAAW,GAAG9B,WAAW,CAACuB,MAAZvB,CAAmB,UAACwB,IAAD;aAAe,CAACtB,0BAA0B,CAACsB,IAAI,CAACC,GAAN;AAA7D,KAAAzB;QACdY,cAAc,GAAGkB,WAAW,CAACC,GAAZD,CAAgB,UAACN,IAAD;aAAeA,IAAI,CAACG;AAApC,KAAAG;AAEvBjB,IAAAA,oBAAoB,CAACD,cAAD,EAAiBkB,WAAjB,EAA8B,IAA9B,CAApBjB;AATqB,GAAAV,EAUpB,CAACU,oBAAD,EAAuBb,WAAvB,EAAoCE,0BAApC,EAAgEoB,UAAhE,CAVoBnB;SAYhB;AACL0B,IAAAA,cAAc,EAAdA,cADK;AAELP,IAAAA,UAAU,EAAVA,UAFK;AAGLM,IAAAA,WAAW,EAAXA,WAHK;AAILV,IAAAA,sBAAsB,EAAtBA,sBAJK;AAKLC,IAAAA,eAAe,EAAfA,eALK;AAMLP,IAAAA,cAAc,EAAdA,cANK;AAOLC,IAAAA,oBAAoB,EAApBA,oBAPK;AAQLX,IAAAA,0BAA0B,EAA1BA;AARK;;;"}

package/lib/cjs/hooks/use-col-hidden.js

@@ -0,0 +1,76 @@
+/** @LICENSE
+ * @hi-ui/table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/table#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var React = require('react');
+
+var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
+
+var index = require('../utils/index.js');
+
+var DEFAULT_COLUMNS = [];
+/**
+ * 列操作逻辑
+ */
+
+var useColHidden = function useColHidden(_ref) {
+  var uniqueId = _ref.uniqueId,
+      _ref$columns = _ref.columns,
+      columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns,
+      hiddenColKeysProp = _ref.hiddenColKeys,
+      onHiddenColKeysChange = _ref.onHiddenColKeysChange;
+  var cacheKey = uniqueId ? uniqueId + "_hiddenColKeys" : '';
+
+  var _useUncontrolledState = useUncontrolledState.useUncontrolledState(function () {
+    return index.parseLocalArray({
+      key: cacheKey,
+      defaultValue: []
+    });
+  }, hiddenColKeysProp, onHiddenColKeysChange),
+      _hiddenColKeys = _useUncontrolledState[0],
+      setHiddenColKeys = _useUncontrolledState[1]; // 保证 includes 匹配 column，是有效的可展示的列
+
+
+  var hiddenColKeys = React.useMemo(function () {
+    return _hiddenColKeys.filter(function (dataKey) {
+      return typeof dataKey === 'string' && dataKey !== '';
+    });
+  }, [_hiddenColKeys]);
+  React.useEffect(function () {
+    if (!cacheKey) return;
+    window.localStorage.setItem(cacheKey, JSON.stringify(hiddenColKeys));
+  }, [cacheKey, hiddenColKeys]); // 用于维护列操作时显隐临时状态
+
+  var _useState = React.useState(hiddenColKeys),
+      cacheHiddenColKeys = _useState[0],
+      setCacheHiddenColKeys = _useState[1];
+
+  var visibleCols = React.useMemo(function () {
+    // TODO: 支持隐藏叶子结点，而不是根节点
+    // @ts-ignore
+    return columns.filter(function (col) {
+      return !hiddenColKeys.includes(col.dataKey);
+    });
+  }, [columns, hiddenColKeys]);
+  return {
+    visibleCols: visibleCols,
+    hiddenColKeys: hiddenColKeys,
+    setHiddenColKeys: setHiddenColKeys,
+    cacheHiddenColKeys: cacheHiddenColKeys,
+    setCacheHiddenColKeys: setCacheHiddenColKeys
+  };
+};
+
+exports.useColHidden = useColHidden;
+//# sourceMappingURL=use-col-hidden.js.map

package/lib/cjs/hooks/use-col-hidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-col-hidden.js","sources":["../../../src/hooks/use-col-hidden.ts"],"sourcesContent":[null],"names":["DEFAULT_COLUMNS","useColHidden","uniqueId","columns","hiddenColKeysProp","hiddenColKeys","onHiddenColKeysChange","cacheKey","useUncontrolledState","parseLocalArray","key","defaultValue","_hiddenColKeys","setHiddenColKeys","useMemo","filter","dataKey","useEffect","window","localStorage","setItem","JSON","stringify","useState","cacheHiddenColKeys","setCacheHiddenColKeys","visibleCols","col","includes"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAKA,IAAMA,eAAe,GAAG,EAAxB;AACA;;;;IAGaC,YAAY,GAAG,SAAfA,YAAe,KAAA;MAC1BC,gBAAAA;0BACAC;MAAAA,oCAAUH;MACKI,yBAAfC;MACAC,6BAAAA;MAEMC,QAAQ,GAAGL,QAAQ,GAAMA,QAAN,mBAAA,GAAiC;;8BAEfM,yCAAAA,CACzC;WACSC,qBAAAA,CAAgB;AACrBC,MAAAA,GAAG,EAAEH,QADgB;AAErBI,MAAAA,YAAY,EAAE;AAFO,KAAhBF;AAFoD,GAApBD,EAOzCJ,iBAPyCI,EAQzCF,qBARyCE;MAApCI,cAAP;MAAuBC,gBAAvB;;;MAYMR,aAAa,GAAGS,aAAAA,CAAQ;WACrBF,cAAc,CAACG,MAAfH,CAAsB,UAACI,OAAD;aAAkB,OAAOA,OAAP,KAAmB,QAAnB,IAA+BA,OAAO,KAAK;AAAnF,KAAAJ;AADoB,GAAPE,EAEnB,CAACF,cAAD,CAFmBE;AAItBG,EAAAA,eAAAA,CAAU;QACJ,CAACV,UAAU;AACfW,IAAAA,MAAM,CAACC,YAAPD,CAAoBE,OAApBF,CAA4BX,QAA5BW,EAAsCG,IAAI,CAACC,SAALD,CAAehB,aAAfgB,CAAtCH;AAFO,GAATD,EAGG,CAACV,QAAD,EAAWF,aAAX,CAHHY;;kBAMoDM,cAAAA,CAASlB,aAATkB;MAA7CC,kBAAP;MAA2BC,qBAA3B;;MAEMC,WAAW,GAAGZ,aAAAA,CAAQ;;;WAInBX,OAAO,CAACY,MAARZ,CAAe,UAACwB,GAAD;aAAS,CAACtB,aAAa,CAACuB,QAAdvB,CAAuBsB,GAAG,CAACX,OAA3BX;AAAzB,KAAAF;AAJkB,GAAPW,EAKjB,CAACX,OAAD,EAAUE,aAAV,CALiBS;SAOb;AACLY,IAAAA,WAAW,EAAXA,WADK;AAELrB,IAAAA,aAAa,EAAbA,aAFK;AAGLQ,IAAAA,gBAAgB,EAAhBA,gBAHK;AAILW,IAAAA,kBAAkB,EAAlBA,kBAJK;AAKLC,IAAAA,qBAAqB,EAArBA;AALK;;;"}

package/lib/cjs/hooks/use-col-sorter.js

@@ -0,0 +1,64 @@
+/** @LICENSE
+ * @hi-ui/table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/table#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var React = require('react');
+
+var useUpdateEffect = require('@hi-ui/use-update-effect');
+
+var index = require('../utils/index.js');
+
+var DEFAULT_COLUMNS = [];
+/**
+ * 列排序
+ */
+
+var useColSorter = function useColSorter(_ref) {
+  var uniqueId = _ref.uniqueId,
+      _ref$columns = _ref.columns,
+      columns = _ref$columns === void 0 ? DEFAULT_COLUMNS : _ref$columns;
+  var cacheKey = uniqueId ? uniqueId + "_sortCols" : '';
+
+  var _useState = React.useState(function () {
+    return index.parseLocalArray({
+      key: cacheKey,
+      defaultValue: columns
+    });
+  }),
+      sortedCols = _useState[0],
+      setSortCols = _useState[1];
+
+  React.useEffect(function () {
+    if (!cacheKey) return;
+    window.localStorage.setItem(cacheKey, JSON.stringify(sortedCols));
+  }, [cacheKey, sortedCols]); // 用于维护列操作时排序临时状态（（未确认保存时））
+
+  var _useState2 = React.useState(sortedCols),
+      cacheSortedCols = _useState2[0],
+      setCacheSortedCols = _useState2[1];
+
+  useUpdateEffect.useUpdateEffect(function () {
+    // 当column发生改变的时候，同步 setting 的 sortedCols 设置
+    setSortCols(columns);
+  }, [columns]);
+  return {
+    sortedCols: sortedCols,
+    setSortCols: setSortCols,
+    cacheSortedCols: cacheSortedCols,
+    setCacheSortedCols: setCacheSortedCols
+  };
+};
+
+exports.useColSorter = useColSorter;
+//# sourceMappingURL=use-col-sorter.js.map

package/lib/cjs/hooks/use-col-sorter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-col-sorter.js","sources":["../../../src/hooks/use-col-sorter.ts"],"sourcesContent":[null],"names":["DEFAULT_COLUMNS","useColSorter","uniqueId","columns","cacheKey","useState","parseLocalArray","key","defaultValue","sortedCols","setSortCols","useEffect","window","localStorage","setItem","JSON","stringify","cacheSortedCols","setCacheSortedCols","useUpdateEffect"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAMA,IAAMA,eAAe,GAAG,EAAxB;AAEA;;;;IAGaC,YAAY,GAAG,SAAfA,YAAe,KAAA;MAAGC,gBAAAA;0BAAUC;MAAAA,oCAAUH;MAC3CI,QAAQ,GAAGF,QAAQ,GAAMA,QAAN,cAAA,GAA4B;;kBAEnBG,cAAAA,CAA4B;WACrDC,qBAAAA,CAAgB;AACrBC,MAAAA,GAAG,EAAEH,QADgB;AAErBI,MAAAA,YAAY,EAAEL;AAFO,KAAhBG;AADiC,GAARD;MAA3BI,UAAP;MAAmBC,WAAnB;;AAOAC,EAAAA,eAAAA,CAAU;QACJ,CAACP,UAAU;AACfQ,IAAAA,MAAM,CAACC,YAAPD,CAAoBE,OAApBF,CAA4BR,QAA5BQ,EAAsCG,IAAI,CAACC,SAALD,CAAeN,UAAfM,CAAtCH;AAFO,GAATD,EAGG,CAACP,QAAD,EAAWK,UAAX,CAHHE;;mBAM8CN,cAAAA,CAASI,UAATJ;MAAvCY,eAAP;MAAwBC,kBAAxB;;AAEAC,EAAAA,+BAAAA,CAAgB;;AAEdT,IAAAA,WAAW,CAACP,OAAD,CAAXO;AAFa,GAAfS,EAGG,CAAChB,OAAD,CAHHgB;SAKO;AACLV,IAAAA,UAAU,EAAVA,UADK;AAELC,IAAAA,WAAW,EAAXA,WAFK;AAGLO,IAAAA,eAAe,EAAfA,eAHK;AAILC,IAAAA,kBAAkB,EAAlBA;AAJK;;;"}

package/lib/cjs/hooks/use-col-width.js

@@ -0,0 +1,134 @@
+/** @LICENSE
+ * @hi-ui/table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/table#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var React = require('react');
+
+var index = require('../utils/index.js');
+
+var useUpdateEffect = require('@hi-ui/use-update-effect');
+
+function _interopDefaultLegacy(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var useColWidth = function useColWidth(_ref) {
+  var columns = _ref.columns;
+  var measureRowElementRef = React.useRef(null);
+
+  var _React$useState = React__default['default'].useState(function () {
+    return index.getGroupItemWidth(columns);
+  }),
+      colWidths = _React$useState[0],
+      setColWidths = _React$useState[1];
+
+  useUpdateEffect.useUpdateEffect(function () {
+    setColWidths(index.getGroupItemWidth(columns));
+  }, [columns]);
+  /**
+   * 根据实际内容区（table 的第一行）渲染，再次精确收集并设置每列宽度
+   */
+
+  React__default['default'].useEffect(function () {
+    var measureRowElement = measureRowElementRef.current;
+
+    if (measureRowElement) {
+      var _resizeObserver = new ResizeObserver(function () {
+        if (measureRowElement.childNodes) {
+          var _realColumnsWidth = Array.from(measureRowElement.childNodes).map(function (node) {
+            return node.getBoundingClientRect().width || 0;
+          });
+
+          setColWidths(_realColumnsWidth);
+        }
+      });
+
+      _resizeObserver.observe(measureRowElement);
+    }
+
+    return function () {};
+  }, []);
+
+  var _React$useState2 = React__default['default'].useState(null),
+      headerTableElement = _React$useState2[0],
+      setHeaderTableElement = _React$useState2[1];
+  /**
+   *  控制列最小可调整宽度
+   */
+
+
+  var minColWidth = React__default['default'].useMemo(function () {
+    if (headerTableElement && headerTableElement.childNodes && headerTableElement.childNodes[1].childNodes[0]) {
+      var _minColWidth = Array.from(headerTableElement.childNodes[1].childNodes[0].childNodes).map(function (th) {
+        // @ts-ignore
+        return th.childNodes[0].className === 'hi-table__header__title' ? // @ts-ignore
+        th.childNodes[0].offsetWidth : 0;
+      });
+
+      return _minColWidth;
+    }
+
+    return Array(columns.length).fill(0);
+  }, [columns, headerTableElement]);
+  /**
+   * 列宽拖拽 resize，只处理拖拽线两边的列宽度
+   */
+
+  var onColumnResizable = React__default['default'].useCallback(function (_, _ref2, index) {
+    var size = _ref2.size;
+    var minWidth = minColWidth[index] + 31;
+    var anotherMinWidth = minColWidth[index + 1] + 31;
+    var nextWidth = size.width > minWidth ? size.width : minWidth;
+    setColWidths(function (prev) {
+      var nextColWidths = [].concat(prev);
+      var anotherWidth = nextColWidths[index + 1] + nextColWidths[index] - nextWidth;
+
+      if (anotherWidth <= anotherMinWidth) {
+        anotherWidth = anotherMinWidth;
+        nextWidth = nextColWidths[index + 1] - anotherMinWidth + nextColWidths[index];
+      }
+
+      nextColWidths[index] = nextWidth;
+      nextColWidths[index + 1] = anotherWidth;
+      return nextColWidths;
+    });
+  }, [minColWidth]);
+  var getColgroupProps = React__default['default'].useCallback(function (column, index) {
+    var width = colWidths[index] || undefined;
+    return {
+      style: {
+        width: width,
+        // TODO（疑惑）: minWidth 所要解决的问题
+        minWidth: width
+      } // 'data-hover-highlight': setAttrStatus(isHoveredCol(column.dataKey)),
+
+    };
+  }, [colWidths]);
+  return {
+    measureRowElementRef: measureRowElementRef,
+    onColumnResizable: onColumnResizable,
+    getColgroupProps: getColgroupProps,
+    setHeaderTableElement: setHeaderTableElement,
+    colWidths: colWidths
+  };
+};
+
+exports.useColWidth = useColWidth;
+//# sourceMappingURL=use-col-width.js.map

package/lib/cjs/hooks/use-col-width.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-col-width.js","sources":["../../../src/hooks/use-col-width.ts"],"sourcesContent":[null],"names":["useColWidth","columns","measureRowElementRef","useRef","React","useState","getGroupItemWidth","colWidths","setColWidths","useUpdateEffect","useEffect","measureRowElement","current","resizeObserver","ResizeObserver","childNodes","_realColumnsWidth","Array","from","map","node","getBoundingClientRect","width","observe","headerTableElement","setHeaderTableElement","minColWidth","useMemo","_minColWidth","th","className","offsetWidth","length","fill","onColumnResizable","useCallback","_","index","size","minWidth","anotherMinWidth","nextWidth","prev","nextColWidths","anotherWidth","getColgroupProps","column","undefined","style"],"mappings":"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"}

package/lib/cjs/hooks/use-colgroup.js

@@ -0,0 +1,111 @@
+/** @LICENSE
+ * @hi-ui/table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/table#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+var React = require('react');
+
+var treeUtils = require('@hi-ui/tree-utils');
+
+var typeAssertion = require('@hi-ui/type-assertion');
+
+function _interopDefaultLegacy(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var useColumns = function useColumns(_ref) {
+  var columns = _ref.columns; // 拉平后的数据
+
+  var _React$useMemo = React__default['default'].useMemo(function () {
+    var clonedColumns = treeUtils.cloneTree(columns);
+    var maxDepth = 0; // @ts-ignore
+    // @ts-ignore
+
+    var flattedColumns = treeUtils.flattenTree(clonedColumns, function (node) {
+      var _a;
+
+      if (node.depth > maxDepth) {
+        maxDepth = node.depth;
+      }
+
+      var raw = node.raw;
+      return Object.assign(Object.assign({}, node), {
+        id: raw.dataKey,
+        width: raw.width,
+        // TODO: remove it
+        dataKey: raw.dataKey,
+        title: raw.title,
+        align: (_a = raw.align) !== null && _a !== void 0 ? _a : 'left',
+        render: raw.render
+      });
+    });
+    return [flattedColumns, maxDepth];
+  }, [columns]),
+      flattedColumns = _React$useMemo[0],
+      maxColumnDepth = _React$useMemo[1]; // 末级 column
+
+
+  var flattedColumnsWithoutChildren = React__default['default'].useMemo(function () {
+    return flattedColumns.filter(function (col) {
+      return !typeAssertion.isArrayNonEmpty(col.children);
+    });
+  }, [flattedColumns]);
+
+  var _React$useMemo2 = React__default['default'].useMemo(function () {
+    var preset = [];
+    var nextColumns = preset.concat( // @ts-ignore
+    // flattedColumns.filter((col) => isLeaf(col)) as FlattedTableColumnItemData[]
+    flattedColumns); // 表头分组
+    // 在最后一层，colSpan = 1, rowSpan = maxDepth - depth + 1
+    // 不在最后一层，rowSpan = 1, colSpan = 叶子节点后代数量
+    // 表头分组
+    // 在最后一层，colSpan = 1, rowSpan = maxDepth - depth + 1
+    // 不在最后一层，rowSpan = 1, colSpan = 叶子节点后代数量
+
+    flattedColumns.forEach(function (column) {
+      if (treeUtils.isLeaf(column)) {
+        column.rowSpan = maxColumnDepth - column.depth + 1;
+        column.colSpan = 1;
+      } else {
+        column.rowSpan = 1;
+        column.colSpan = treeUtils.getLeafChildren(column).length;
+      }
+    });
+    var leafColumns = flattedColumns.filter(function (col) {
+      return treeUtils.isLeaf(col);
+    });
+    var groupedColumns = treeUtils.groupByTreeDepth(nextColumns);
+    return [nextColumns, groupedColumns, leafColumns];
+  }, [flattedColumns, maxColumnDepth]),
+      mergedColumns = _React$useMemo2[0],
+      groupedColumns = _React$useMemo2[1],
+      leafColumns = _React$useMemo2[2];
+
+  return {
+    // getColgroupProps,
+    flattedColumns: flattedColumns,
+    mergedColumns: mergedColumns,
+    groupedColumns: groupedColumns,
+    leafColumns: leafColumns,
+    flattedColumnsWithoutChildren: flattedColumnsWithoutChildren
+  };
+};
+
+exports.useColumns = useColumns;
+//# sourceMappingURL=use-colgroup.js.map

package/lib/cjs/hooks/use-colgroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-colgroup.js","sources":["../../../src/hooks/use-colgroup.ts"],"sourcesContent":[null],"names":["useColumns","columns","React","useMemo","clonedColumns","cloneTree","maxDepth","flattedColumns","flattenTree","node","depth","raw","id","dataKey","width","title","align","render","maxColumnDepth","flattedColumnsWithoutChildren","filter","col","isArrayNonEmpty","children","preset","nextColumns","concat","forEach","column","isLeaf","rowSpan","colSpan","getLeafChildren","length","leafColumns","groupedColumns","groupByTreeDepth","mergedColumns"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAWaA,UAAU,GAAG,SAAbA,UAAa,KAAA;MAAGC,eAAAA;;uBAEcC,yBAAAA,CAAMC,OAAND,CAAc;QAC/CE,aAAa,GAAGC,mBAAAA,CAAUJ,OAAVI;QAClBC,QAAQ,GAAG;;;QAGTC,cAAc,GAAGC,qBAAAA,CAAYJ,aAAZI,EAA2B,UAACC,IAAD;;;UAC5CA,IAAI,CAACC,KAALD,GAAaH,UAAU;AACzBA,QAAAA,QAAQ,GAAGG,IAAI,CAACC,KAAhBJ;;;UAGIK,GAAG,GAAGF,IAAI,CAACE;6CAGZF;AACHG,QAAAA,EAAE,EAAED,GAAG,CAACE;AACRC,QAAAA,KAAK,EAAEH,GAAG,CAACG;;AAEXD,QAAAA,OAAO,EAAEF,GAAG,CAACE;AACbE,QAAAA,KAAK,EAAEJ,GAAG,CAACI;AACXC,QAAAA,KAAK,EAAE,MAAAL,GAAG,CAACK,KAAJ,UAAA,iBAAA,KAAA,GAAa;AACpBC,QAAAA,MAAM,EAAEN,GAAG,CAACM;;AAfkB,KAAXT;WAmBhB,CAACD,cAAD,EAAiBD,QAAjB;AAxBgC,GAAAJ,EAyBtC,CAACD,OAAD,CAzBsCC;MAAlCK,cAAP;MAAuBW,cAAvB;;;MA4BMC,6BAA6B,GAAGjB,yBAAAA,CAAMC,OAAND,CAAc;WAC3CK,cAAc,CAACa,MAAfb,CAAsB,UAACc,GAAD;aAAS,CAACC,6BAAAA,CAAgBD,GAAG,CAACE,QAApBD;AAAhC,KAAAf;AAD6B,GAAAL,EAEnC,CAACK,cAAD,CAFmCL;;wBAIeA,yBAAAA,CAAMC,OAAND,CAAc;QAC3DsB,MAAM,GAAiC;QAEvCC,WAAW,GAAGD,MAAM,CAACE,MAAPF;;AAGlBjB,IAAAA,cAHkBiB;;;;;;;AASpBjB,IAAAA,cAAc,CAACoB,OAAfpB,CAAuB,UAACqB,MAAD;UACjBC,gBAAAA,CAAOD,MAAPC,GAAgB;AAClBD,QAAAA,MAAM,CAACE,OAAPF,GAAiBV,cAAc,GAAGU,MAAM,CAAClB,KAAxBQ,GAAgC,CAAjDU;AACAA,QAAAA,MAAM,CAACG,OAAPH,GAAiB,CAAjBA;AAFF,aAGO;AACLA,QAAAA,MAAM,CAACE,OAAPF,GAAiB,CAAjBA;AACAA,QAAAA,MAAM,CAACG,OAAPH,GAAiBI,yBAAAA,CAAgBJ,MAAhBI,EAAwBC,MAAzCL;;AANJ,KAAArB;QAUM2B,WAAW,GAAG3B,cAAc,CAACa,MAAfb,CAAsB,UAACc,GAAD;aAASQ,gBAAAA,CAAOR,GAAPQ;AAA/B,KAAAtB;QACd4B,cAAc,GAAGC,0BAAAA,CAAiBX,WAAjBW;WAEhB,CAACX,WAAD,EAAcU,cAAd,EAA8BD,WAA9B;AAzB4C,GAAAhC,EA0BlD,CAACK,cAAD,EAAiBW,cAAjB,CA1BkDhB;MAA9CmC,aAAP;MAAsBF,cAAtB;MAAsCD,WAAtC;;SA4BO;;AAEL3B,IAAAA,cAAc,EAAdA,cAFK;AAGL8B,IAAAA,aAAa,EAAbA,aAHK;AAILF,IAAAA,cAAc,EAAdA,cAJK;AAKLD,IAAAA,WAAW,EAAXA,WALK;AAMLf,IAAAA,6BAA6B,EAA7BA;AANK;;;"}