@hi-ui/table 4.6.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

@@ -194,7 +194,7 @@ var useColWidth = function useColWidth(_ref) {
   /**
    * 列宽拖拽 resize，只处理拖拽线两边的列宽度
    */
-  var onColumnResizable = React__default["default"].useCallback(function (_, _ref3, index) {
+  var onColumnResizable = React__default["default"].useCallback(function (evt, _ref3, index) {
     var size = _ref3.size;
     var minWidth = minColWidth[index];
     var anotherMinWidth = minColWidth[index + 1];

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

@@ -182,7 +182,7 @@ var useColWidth = function useColWidth(_ref) {
   /**
    * 列宽拖拽 resize，只处理拖拽线两边的列宽度
    */
-  var onColumnResizable = React__default.useCallback(function (_, _ref3, index) {
+  var onColumnResizable = React__default.useCallback(function (evt, _ref3, index) {
     var size = _ref3.size;
     var minWidth = minColWidth[index];
     var anotherMinWidth = minColWidth[index + 1];

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: {
@@ -37,7 +38,7 @@ export declare const TableProvider: import("react").Provider<(Omit<{
     onTreeNodeSwitch: (node: import("./types").TableRowEventData, onlyExpand?: any) => Promise<void>;
     resizable: boolean;
     colWidths: number[];
-    onColumnResizable: (_: any, { size }: any, index: number) => void;
+    onColumnResizable: (evt: any, { size }: any, index: number) => void;
     isTree: boolean;
     cellRender: ((text: any) => import("react").ReactNode) | undefined;
     footerRender: ((...nodes: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>[]) => import("react").ReactNode) | undefined;
@@ -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) => {
@@ -152,7 +154,7 @@ export declare const useTableContext: () => Omit<{
     onTreeNodeSwitch: (node: import("./types").TableRowEventData, onlyExpand?: any) => Promise<void>;
     resizable: boolean;
     colWidths: number[];
-    onColumnResizable: (_: any, { size }: any, index: number) => void;
+    onColumnResizable: (evt: any, { size }: any, index: number) => void;
     isTree: boolean;
     cellRender: ((text: any) => import("react").ReactNode) | undefined;
     footerRender: ((...nodes: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>[]) => import("react").ReactNode) | undefined;
@@ -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

@@ -7,7 +7,7 @@ export declare const useColWidth: ({ resizable, data, columns, virtual, }: {
     virtual?: boolean | undefined;
 }) => {
     measureRowElementRef: React.MutableRefObject<HTMLTableRowElement | null>;
-    onColumnResizable: (_: any, { size }: any, index: number) => void;
+    onColumnResizable: (evt: any, { size }: any, index: number) => void;
     getColgroupProps: (column: FlattedTableColumnItemData, index: number) => {
         style: {
             width: number | undefined;

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

@@ -39,7 +39,7 @@ export declare const useTable: ({ data, columns: columnsProp, defaultFixedToColu
     onTreeNodeSwitch: (node: TableRowEventData, onlyExpand?: any) => Promise<void>;
     resizable: boolean;
     colWidths: number[];
-    onColumnResizable: (_: any, { size }: any, index: number) => void;
+    onColumnResizable: (evt: any, { size }: any, index: number) => void;
     isTree: boolean;
     cellRender: ((text: any) => React.ReactNode) | undefined;
     footerRender: ((...nodes: React.ReactElement[]) => React.ReactNode) | undefined;

package/package.json

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