@hi-ui/table 4.7.0-alpha.0 → 4.7.0-alpha.1

package/lib/cjs/BaseTable.js

@@ -75,7 +75,8 @@ var BaseTable = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     emptyContent = _a.emptyContent,
     virtual = _a.virtual,
     needDoubleTable = _a.needDoubleTable,
-    rest = tslib.__rest(_a, ["prefixCls", "role", "className", "columns", "data", "striped", "bordered", "rowExpandable", "defaultExpandedEmbedRowKeys", "expandedEmbedRowKeys", "onEmbedExpand", "expandedRender", "size", "extra", "onRow", "onHeaderRow", "stickyFooter", "stickyFooterBottom", "fixedColumnTrigger", "emptyContent", "virtual", "needDoubleTable"]);
+    onResizeStop = _a.onResizeStop,
+    rest = tslib.__rest(_a, ["prefixCls", "role", "className", "columns", "data", "striped", "bordered", "rowExpandable", "defaultExpandedEmbedRowKeys", "expandedEmbedRowKeys", "onEmbedExpand", "expandedRender", "size", "extra", "onRow", "onHeaderRow", "stickyFooter", "stickyFooterBottom", "fixedColumnTrigger", "emptyContent", "virtual", "needDoubleTable", "onResizeStop"]);
   // ********************** 内嵌式面板 *********************** //
   var _useEmbedExpand = useEmbedExpand.useEmbedExpand({
       defaultExpandedEmbedRowKeys: defaultExpandedEmbedRowKeys,
@@ -283,7 +284,8 @@ var BaseTable = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       hasAvgColumn: hasAvgColumn,
       sumRow: sumRow,
       hasSumColumn: hasSumColumn,
-      virtual: virtual
+      virtual: virtual,
+      onResizeStop: onResizeStop
     })
   }, renderTable()), renderFreezeShadow()), tableFooter);
 });

package/lib/cjs/TheadContent.js

@@ -43,7 +43,8 @@ var TheadContent = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     onColumnResizable = _useTableContext.onColumnResizable,
     getStickyColProps = _useTableContext.getStickyColProps,
     showColMenu = _useTableContext.showColMenu,
-    setHeaderTableElement = _useTableContext.setHeaderTableElement;
+    setHeaderTableElement = _useTableContext.setHeaderTableElement,
+    _onResizeStop = _useTableContext.onResizeStop;
   var activeColumnKeysAction = useCheckState.useCheckState();
   return /*#__PURE__*/React__default["default"].createElement("thead", Object.assign({}, rest), groupedColumns.map(function (cols, colsIndex) {
     return /*#__PURE__*/React__default["default"].createElement("tr", {
@@ -100,6 +101,9 @@ var TheadContent = /*#__PURE__*/React.forwardRef(function (_a, ref) {
         width: colWidths[colIndex],
         onResize: function onResize(evt, options) {
           onColumnResizable(evt, options, colIndex);
+        },
+        onResizeStop: function onResizeStop(evt, options) {
+          _onResizeStop === null || _onResizeStop === void 0 ? void 0 : _onResizeStop(evt, options === null || options === void 0 ? void 0 : options.size, colIndex, colWidths);
         }
       }, cell)) : cell;
     }));

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

@@ -25,8 +25,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var useColWidth = function useColWidth(_ref) {
   var resizable = _ref.resizable,
     columns = _ref.columns,
-    virtual = _ref.virtual,
-    onResize = _ref.onResize;
+    virtual = _ref.virtual;
   var measureRowElementRef = React__default["default"].useRef(null);
   // 是否重新设置过表格每列宽度
   var hasResetWidths = React__default["default"].useRef(false);
@@ -209,10 +208,9 @@ var useColWidth = function useColWidth(_ref) {
       }
       nextColWidths[index] = nextWidth;
       nextColWidths[index + 1] = anotherWidth;
-      onResize === null || onResize === void 0 ? void 0 : onResize(evt, size, index, nextColWidths);
       return nextColWidths;
     });
-  }, [minColWidth, onResize]);
+  }, [minColWidth]);
   var getColgroupProps = React__default["default"].useCallback(function (column, index) {
     var width = colWidths[index] || undefined;
     return {

package/lib/cjs/use-table.js

@@ -91,8 +91,7 @@ var useTable = function useTable(_a) {
     scrollbar = _a.scrollbar,
     rowClassName = _a.rowClassName,
     cellClassName = _a.cellClassName,
-    onResize = _a.onResize,
-    rootProps = tslib.__rest(_a, ["data", "columns", "defaultFixedToColumn", "fixedToColumn", "onFixedToColumn", "scrollWidth", "resizable", "errorRowKeys", "highlightedColKeys", "highlightedRowKeys", "showColHighlight", "showRowHighlight", "highlightRowOnDoubleClick", "defaultExpandedRowKeys", "expandedRowKeys", "onExpand", "defaultExpandAll", "onLoadChildren", "maxHeight", "sticky", "stickyTop", "draggable", "onDragStart", "onDrop", "onDropEnd", "showColMenu", "rowSelection", "cellRender", "footerRender", "fieldKey", "virtual", "scrollbar", "rowClassName", "cellClassName", "onResize"]);
+    rootProps = tslib.__rest(_a, ["data", "columns", "defaultFixedToColumn", "fixedToColumn", "onFixedToColumn", "scrollWidth", "resizable", "errorRowKeys", "highlightedColKeys", "highlightedRowKeys", "showColHighlight", "showRowHighlight", "highlightRowOnDoubleClick", "defaultExpandedRowKeys", "expandedRowKeys", "onExpand", "defaultExpandAll", "onLoadChildren", "maxHeight", "sticky", "stickyTop", "draggable", "onDragStart", "onDrop", "onDropEnd", "showColMenu", "rowSelection", "cellRender", "footerRender", "fieldKey", "virtual", "scrollbar", "rowClassName", "cellClassName"]);
   /**
    * 获取 key 字段值
    */
@@ -184,8 +183,7 @@ var useTable = function useTable(_a) {
       data: data,
       columns: columns,
       resizable: resizable,
-      virtual: virtual,
-      onResize: onResize
+      virtual: virtual
     }),
     measureRowElementRef = _useColWidth.measureRowElementRef,
     getColgroupProps = _useColWidth.getColgroupProps,

package/lib/esm/BaseTable.js

@@ -62,7 +62,8 @@ var BaseTable = /*#__PURE__*/forwardRef(function (_a, ref) {
     emptyContent = _a.emptyContent,
     virtual = _a.virtual,
     needDoubleTable = _a.needDoubleTable,
-    rest = __rest(_a, ["prefixCls", "role", "className", "columns", "data", "striped", "bordered", "rowExpandable", "defaultExpandedEmbedRowKeys", "expandedEmbedRowKeys", "onEmbedExpand", "expandedRender", "size", "extra", "onRow", "onHeaderRow", "stickyFooter", "stickyFooterBottom", "fixedColumnTrigger", "emptyContent", "virtual", "needDoubleTable"]);
+    onResizeStop = _a.onResizeStop,
+    rest = __rest(_a, ["prefixCls", "role", "className", "columns", "data", "striped", "bordered", "rowExpandable", "defaultExpandedEmbedRowKeys", "expandedEmbedRowKeys", "onEmbedExpand", "expandedRender", "size", "extra", "onRow", "onHeaderRow", "stickyFooter", "stickyFooterBottom", "fixedColumnTrigger", "emptyContent", "virtual", "needDoubleTable", "onResizeStop"]);
   // ********************** 内嵌式面板 *********************** //
   var _useEmbedExpand = useEmbedExpand({
       defaultExpandedEmbedRowKeys: defaultExpandedEmbedRowKeys,
@@ -270,7 +271,8 @@ var BaseTable = /*#__PURE__*/forwardRef(function (_a, ref) {
       hasAvgColumn: hasAvgColumn,
       sumRow: sumRow,
       hasSumColumn: hasSumColumn,
-      virtual: virtual
+      virtual: virtual,
+      onResizeStop: onResizeStop
     })
   }, renderTable()), renderFreezeShadow()), tableFooter);
 });

package/lib/esm/TheadContent.js

@@ -31,7 +31,8 @@ var TheadContent = /*#__PURE__*/forwardRef(function (_a, ref) {
     onColumnResizable = _useTableContext.onColumnResizable,
     getStickyColProps = _useTableContext.getStickyColProps,
     showColMenu = _useTableContext.showColMenu,
-    setHeaderTableElement = _useTableContext.setHeaderTableElement;
+    setHeaderTableElement = _useTableContext.setHeaderTableElement,
+    _onResizeStop = _useTableContext.onResizeStop;
   var activeColumnKeysAction = useCheckState();
   return /*#__PURE__*/React__default.createElement("thead", Object.assign({}, rest), groupedColumns.map(function (cols, colsIndex) {
     return /*#__PURE__*/React__default.createElement("tr", {
@@ -88,6 +89,9 @@ var TheadContent = /*#__PURE__*/forwardRef(function (_a, ref) {
         width: colWidths[colIndex],
         onResize: function onResize(evt, options) {
           onColumnResizable(evt, options, colIndex);
+        },
+        onResizeStop: function onResizeStop(evt, options) {
+          _onResizeStop === null || _onResizeStop === void 0 ? void 0 : _onResizeStop(evt, options === null || options === void 0 ? void 0 : options.size, colIndex, colWidths);
         }
       }, cell)) : cell;
     }));

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

@@ -13,8 +13,7 @@ import { useUpdateEffect } from '@hi-ui/use-update-effect';
 var useColWidth = function useColWidth(_ref) {
   var resizable = _ref.resizable,
     columns = _ref.columns,
-    virtual = _ref.virtual,
-    onResize = _ref.onResize;
+    virtual = _ref.virtual;
   var measureRowElementRef = React__default.useRef(null);
   // 是否重新设置过表格每列宽度
   var hasResetWidths = React__default.useRef(false);
@@ -197,10 +196,9 @@ var useColWidth = function useColWidth(_ref) {
       }
       nextColWidths[index] = nextWidth;
       nextColWidths[index + 1] = anotherWidth;
-      onResize === null || onResize === void 0 ? void 0 : onResize(evt, size, index, nextColWidths);
       return nextColWidths;
     });
-  }, [minColWidth, onResize]);
+  }, [minColWidth]);
   var getColgroupProps = React__default.useCallback(function (column, index) {
     var width = colWidths[index] || undefined;
     return {

package/lib/esm/use-table.js

@@ -79,8 +79,7 @@ var useTable = function useTable(_a) {
     scrollbar = _a.scrollbar,
     rowClassName = _a.rowClassName,
     cellClassName = _a.cellClassName,
-    onResize = _a.onResize,
-    rootProps = __rest(_a, ["data", "columns", "defaultFixedToColumn", "fixedToColumn", "onFixedToColumn", "scrollWidth", "resizable", "errorRowKeys", "highlightedColKeys", "highlightedRowKeys", "showColHighlight", "showRowHighlight", "highlightRowOnDoubleClick", "defaultExpandedRowKeys", "expandedRowKeys", "onExpand", "defaultExpandAll", "onLoadChildren", "maxHeight", "sticky", "stickyTop", "draggable", "onDragStart", "onDrop", "onDropEnd", "showColMenu", "rowSelection", "cellRender", "footerRender", "fieldKey", "virtual", "scrollbar", "rowClassName", "cellClassName", "onResize"]);
+    rootProps = __rest(_a, ["data", "columns", "defaultFixedToColumn", "fixedToColumn", "onFixedToColumn", "scrollWidth", "resizable", "errorRowKeys", "highlightedColKeys", "highlightedRowKeys", "showColHighlight", "showRowHighlight", "highlightRowOnDoubleClick", "defaultExpandedRowKeys", "expandedRowKeys", "onExpand", "defaultExpandAll", "onLoadChildren", "maxHeight", "sticky", "stickyTop", "draggable", "onDragStart", "onDrop", "onDropEnd", "showColMenu", "rowSelection", "cellRender", "footerRender", "fieldKey", "virtual", "scrollbar", "rowClassName", "cellClassName"]);
   /**
    * 获取 key 字段值
    */
@@ -172,8 +171,7 @@ var useTable = function useTable(_a) {
       data: data,
       columns: columns,
       resizable: resizable,
-      virtual: virtual,
-      onResize: onResize
+      virtual: virtual
     }),
     measureRowElementRef = _useColWidth.measureRowElementRef,
     getColgroupProps = _useColWidth.getColgroupProps,

package/lib/types/BaseTable.d.ts

@@ -3,6 +3,7 @@ import { HiBaseHTMLProps, HiBaseSizeEnum } from '@hi-ui/core';
 import { TableExtra, TableColumnItem, TableOnRowReturn } from './types';
 import { UseTableProps } from './use-table';
 import { UseEmbedExpandProps } from './hooks/use-embed-expand';
+import { ResizeCallbackData } from 'react-resizable';
 export declare const EMBED_DATA_KEY: string;
 export declare const BaseTable: React.ForwardRefExoticComponent<BaseTableProps & React.RefAttributes<HTMLDivElement | null>>;
 export interface BaseTableProps extends Omit<HiBaseHTMLProps<'div'>, 'onDrop' | 'draggable' | 'onDragStart'>, UseTableProps, UseEmbedExpandProps {
@@ -45,6 +46,11 @@ export interface BaseTableProps extends Omit<HiBaseHTMLProps<'div'>, 'onDrop' |
     fixedColumnTrigger?: 'auto' | 'always';
     /**
      * 是否需要使用双表格
+     * @private
      */
     needDoubleTable?: boolean;
+    /**
+     * resizable 模式下，列宽变化后触发的回调
+     */
+    onResizeStop?: (evt: React.SyntheticEvent, size: ResizeCallbackData['size'], index: number, columnsWidth: number[]) => void;
 }

package/lib/types/context.d.ts

@@ -1,5 +1,6 @@
-/// <reference types="react" />
+import { SyntheticEvent } from 'react';
 import { TableOnRowReturn } from './types';
+import { ResizeCallbackData } from 'react-resizable';
 export declare const TableProvider: import("react").Provider<(Omit<{
     getColgroupProps: (column: import("./types").FlattedTableColumnItemData, index: number) => {
         style: {
@@ -114,6 +115,7 @@ export declare const TableProvider: import("react").Provider<(Omit<{
     onRow?: ((rowData: Record<string, any> | null, index: number) => TableOnRowReturn) | undefined;
     striped: boolean;
     virtual?: boolean | undefined;
+    onResizeStop?: ((evt: SyntheticEvent, size: ResizeCallbackData['size'], index: number, columnsWidth: number[]) => void) | undefined;
 }) | null>;
 export declare const useTableContext: () => Omit<{
     getColgroupProps: (column: import("./types").FlattedTableColumnItemData, index: number) => {
@@ -229,4 +231,5 @@ export declare const useTableContext: () => Omit<{
     onRow?: ((rowData: Record<string, any> | null, index: number) => TableOnRowReturn) | undefined;
     striped: boolean;
     virtual?: boolean | undefined;
+    onResizeStop?: ((evt: SyntheticEvent, size: ResizeCallbackData['size'], index: number, columnsWidth: number[]) => void) | undefined;
 };

package/lib/types/hooks/use-col-width.d.ts

@@ -1,12 +1,10 @@
 import React from 'react';
 import { FlattedTableColumnItemData, TableColumnItem, TableRowRecord } from '../types';
-import { ResizeCallbackData } from 'react-resizable';
-export declare const useColWidth: ({ resizable, data, columns, virtual, onResize, }: {
+export declare const useColWidth: ({ resizable, data, columns, virtual, }: {
     resizable: boolean;
     data: TableRowRecord[];
     columns: TableColumnItem[];
     virtual?: boolean | undefined;
-    onResize?: ((e: React.SyntheticEvent, data: ResizeCallbackData, index: number, columnsWidth: number[]) => void) | undefined;
 }) => {
     measureRowElementRef: React.MutableRefObject<HTMLTableRowElement | null>;
     onColumnResizable: (evt: any, { size }: any, index: number) => void;

package/lib/types/use-table.d.ts

@@ -2,8 +2,7 @@ import React from 'react';
 import { PaginationProps } from '@hi-ui/pagination';
 import { ScrollbarProps } from '@hi-ui/scrollbar';
 import { TableColumnItem, TableFrozenColumnOptions, TableRowEventData, TableRowSelection, FlattedTableColumnItemData, FlattedTableRowData } from './types';
-import { ResizeCallbackData } from 'react-resizable';
-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, footerRender, fieldKey, virtual, scrollbar, rowClassName, cellClassName, onResize, ...rootProps }: UseTableProps) => {
+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, footerRender, fieldKey, virtual, scrollbar, rowClassName, cellClassName, ...rootProps }: UseTableProps) => {
     getColgroupProps: (column: FlattedTableColumnItemData, index: number) => {
         style: {
             width: number | undefined;
@@ -297,9 +296,5 @@ export interface UseTableProps {
      * 设置单元格类名
      */
     cellClassName?: (record: Record<string, any>, column: Record<string, any>, index: number) => string;
-    /**
-     * resizable 模式下，设置列宽变化时触发的回调
-     */
-    onResize?: (e: React.SyntheticEvent, data: ResizeCallbackData, index: number, columnsWidth: number[]) => void;
 }
 export declare type UseTableReturn = ReturnType<typeof useTable>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/table",
-  "version": "4.7.0-alpha.0",
+  "version": "4.7.0-alpha.1",
   "description": "A sub-package for @hi-ui/hiui.",
   "keywords": [],
   "author": "HiUI <mi-hiui@xiaomi.com>",