es-grid-template 1.3.8 → 1.4.0

package/es/grid-component/EditableCell.js

@@ -33,7 +33,10 @@ const filterTreeNode = (input, treeNode) => {
     title,
     value
   } = treeNode;
-  return title.toLowerCase().includes(input.toLowerCase()) || value.toLowerCase().includes(input.toLowerCase());
+  if (typeof title === "string" || typeof title === 'number') {
+    return title.toString().toLowerCase().includes(input.toLowerCase()) || value.toLowerCase().includes(input.toLowerCase());
+  }
+  return value.toLowerCase().includes(input.toLowerCase());
 };
 const EditableCell = props => {
   const {
@@ -558,19 +561,17 @@ const EditableCell = props => {
           // autoFocus={true}
           ,
           virtual: true,
-          allowClear: true
+          allowClear: true,
+          showSearch: true
           // maxTagTextLength={column?.editSelectSettings?.showItems}
           ,
           maxTagCount: column?.editSelectSettings?.showItems,
           maxTagPlaceholder: 2,
           treeTitleRender: column?.editSelectSettings?.formatOptionLabel,
           showCheckedStrategy: SHOW_PARENT,
-          multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti,
-          fieldNames: {
-            label: inputKey ? inputKey : 'title',
-            value: keySelect,
-            children: 'children'
-          },
+          multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti
+          // fieldNames={{label: inputKey ? inputKey : 'title', value: keySelect, children: 'children'}}
+          ,
           treeCheckable: column?.editSelectSettings?.selectMode === 'checkbox',
           filterTreeNode: filterTreeNode,
           popupMatchSelectWidth: menuWidth ? menuWidth + 10 : undefined,

package/es/grid-component/InternalTable.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import React from 'react';
+import React, { Fragment } from 'react';
 import { Resizable } from "react-resizable";
 import 'react-resizable/css/styles.css';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
@@ -26,6 +26,7 @@ import { flatColumns2 } from "./hooks/columns";
 import Group from "./table/Group";
 import Swal from "sweetalert2";
 import withReactContent from "sweetalert2-react-content";
+import { Tooltip } from "react-tooltip";
 dayjs.extend(customParseFormat);
 const MySwal = withReactContent(Swal);
 
@@ -103,6 +104,7 @@ const InternalTable = props => {
 
   // const [filterStates, setFilterState] = React.useState<any>(null)
   // const [isFilter, setIsFilter] = React.useState<boolean>(false);
+  // const [cellTooltip, seCellTooltip] = React.useState<any>(undefined);
 
   const mergerdData = React.useMemo(() => {
     // return filterDataByColumns2(addRowIdArray(dataSource), filterStates)
@@ -149,6 +151,11 @@ const InternalTable = props => {
     // @ts-ignore
     return record => record?.[rowKey];
   }, [rowKey]);
+
+  // const onMouseHover = (record: any, col: ColumnTable) => {
+  //
+  // }
+
   const [transformSelectionColumns] = useColumns({
     locale,
     t,
@@ -163,6 +170,7 @@ const InternalTable = props => {
     groupSetting,
     groupColumns,
     handleResize
+    // onMouseHover
   });
   const mergedColumns = React.useMemo(() => {
     return transformSelectionColumns(columns);
@@ -391,7 +399,7 @@ const InternalTable = props => {
     }
   };
   const TableComponent = groupAble ? Group : editAble ? GridEdit : Grid;
-  return /*#__PURE__*/React.createElement(TableComponent, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(TableComponent, _extends({}, rest, {
     t: t,
     locale: locale,
     tableRef: tableRef,
@@ -426,6 +434,20 @@ const InternalTable = props => {
     // isFilter={isFilter}
     // setIsFilter={setIsFilter}
     // onScroll={onScroll}
+  })), /*#__PURE__*/React.createElement(Tooltip, {
+    id: "tooltip-cell-content",
+    style: {
+      zIndex: 1999
+    }
+    // content={'sssss'}
+    // content={cellTooltip}
+    // render={() => {
+    //   return (
+    //     <span>
+    //       aaaa
+    //     </span>
+    //   )
+    // }}
   }));
 };
 export default InternalTable;

package/es/grid-component/hooks/useColumns.d.ts

@@ -13,6 +13,7 @@ interface UseColumnsConfig<RecordType> {
     groupSetting?: IGroupSetting;
     groupColumns?: string[];
     rowKey?: any;
+    onMouseHover?: any;
 }
 declare const useColumns: <RecordType extends AnyObject = AnyObject>(config: UseColumnsConfig<RecordType>) => readonly [any];
 export default useColumns;

package/es/grid-component/hooks/useColumns.js

@@ -37,6 +37,7 @@ const useColumns = config => {
     sortMultiple,
     format,
     handleResize,
+    // onMouseHover,
     groupAble,
     groupColumns,
     groupSetting,
@@ -273,7 +274,11 @@ const useColumns = config => {
               className: classNames(transformedColumn?.onCell?.(data, index).className ?? '', {
                 'cell-group': groupColumns && data.children,
                 'cell-group-fixed': groupColumns && data.children && col.field === firstNonGroupColumn?.field
-              })
+              }),
+              'data-tooltip-id': "tooltip-cell-content"
+              // onMouseEnter: () => {
+              //   onMouseHover(data, col as any)
+              // },
             };
           },
           render: (value, record, rowIndex) => {
@@ -301,7 +306,9 @@ const useColumns = config => {
       });
     };
     return convertColumns(cloneColumns);
-  }, [format, getColumnSearchProps, groupAble, groupColumns, groupSetting, handleResize, sortMultiple, t]);
+  }, [groupColumns, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, dataSource, rowKey, handleResize, format]
+  // format, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, groupColumns, , handleResize, , t, cellHover
+  );
   return [transformColumns];
 };
 export default useColumns;

package/es/grid-component/hooks/useLazyKVMap.d.ts

@@ -0,0 +1,4 @@
+import type { AnyObject, GetRowKey } from "../type";
+import type { Key } from "react";
+declare const useLazyKVMap: <RecordType extends AnyObject = AnyObject>(data: readonly RecordType[], childrenColumnName: string, getRowKey: GetRowKey<RecordType>) => readonly [(key: Key) => RecordType];
+export default useLazyKVMap;

package/es/grid-component/hooks/useLazyKVMap.js

@@ -0,0 +1,35 @@
+/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
+import * as React from 'react';
+
+// import type { AnyObject } from '../../_util/type';
+// import type { GetRowKey, Key } from '../interface';
+
+const useLazyKVMap = (data, childrenColumnName, getRowKey) => {
+  const mapCacheRef = React.useRef({});
+  function getRecordByKey(key) {
+    if (!mapCacheRef.current || mapCacheRef.current.data !== data || mapCacheRef.current.childrenColumnName !== childrenColumnName || mapCacheRef.current.getRowKey !== getRowKey) {
+      const kvMap = new Map();
+
+      // @ts-ignore
+      function dig(records) {
+        records.forEach((record, index) => {
+          const rowKey = getRowKey(record, index);
+          kvMap.set(rowKey, record);
+          if (record && typeof record === 'object' && childrenColumnName in record) {
+            dig(record[childrenColumnName] || []);
+          }
+        });
+      }
+      dig(data);
+      mapCacheRef.current = {
+        data,
+        childrenColumnName,
+        kvMap,
+        getRowKey
+      };
+    }
+    return mapCacheRef.current.kvMap?.get(key);
+  }
+  return [getRecordByKey];
+};
+export default useLazyKVMap;

package/es/grid-component/hooks/utils.js

@@ -274,13 +274,15 @@ export const convertLabelToTitle = data => {
       label,
       title,
       value,
+      key,
       ...rest
     } = item;
     const newItem = {
       ...rest,
       value,
-      key: value,
-      title: title ? title : label
+      label,
+      key: key ?? value,
+      title: title ?? label
     };
     if (item.children) {
       newItem.children = convertLabelToTitle(item.children);

package/es/grid-component/table/GridEdit.js

@@ -833,7 +833,7 @@ const GridEdit = props => {
           if (!isEqualSet(cells, rangeCells)) {
             onRemoveBgSelectedCell(rangeCells, id);
             onRemoveBorderSelectedCell(rangeCells, id);
-            hideDraggingPoint(selectedCells.current, id);
+            hideDraggingPoint(rangeCells, id);
           }
         }
         if (rowsSelected.current && rowsSelected.current.size > 0) {
@@ -859,11 +859,12 @@ const GridEdit = props => {
   };
   const triggerDragPaste = pastesArray => {
     const mergedSet = new Set([...selectedCells.current, ...pastesArray]);
+    const tmpCols = flatColumns2(columns.filter(it => it.visible !== false));
     const rowSelectedFirst = getFirstSelectCell(selectedCells.current).row;
     const rowPasteLast = getLastSelectCell(pasteCells.current).row;
     const selectedArray = Array.from(selectedCells.current).map(key => {
       const [row, col] = key.split("-").map(Number);
-      const columnKey = columns[col].field;
+      const columnKey = tmpCols[col].field;
 
       // @ts-ignore
       return {
@@ -957,13 +958,13 @@ const GridEdit = props => {
         }
         rowValues.forEach((cellValue, colIndex) => {
           const targetCol = startCol + colIndex;
-          if (targetCol >= columns.length) {
+          if (targetCol >= tmpCols.length) {
             // Không vượt quá số cột
             return;
           }
 
           // @ts-ignore
-          const columnKey = columns[targetCol].field;
+          const columnKey = tmpCols[targetCol].field;
 
           // @ts-ignore
           newData[targetRow] = {
@@ -1822,6 +1823,7 @@ const GridEdit = props => {
       }
       hideDraggingPoint(selectedCells.current, id);
       selectedCells.current = cells;
+      setRangeCells(cells);
       setTimeout(() => {
         onAddBgSelectedCell(selectedCells.current, id);
         onAddBorderSelectedCell(selectedCells.current, id);
@@ -1928,6 +1930,7 @@ const GridEdit = props => {
       onCell: (record, rowIndex) => {
         const rowNumber = getRowNumber(dataSource, record[rowKey], rowKey);
         return {
+          ...column?.onCell?.(record, rowIndex),
           onKeyDown: event => {
             const key = getRowKey(record, dataSource.indexOf(record));
             if (event.key === 'Control' && event.ctrlKey) {} else {
@@ -2048,6 +2051,10 @@ const GridEdit = props => {
               rowsSelected.current = new Set();
             }
           },
+          // onMouseEnter: () => {
+          //
+          // },
+
           onClick: () => {
             if (record[rowKey] !== editingKey && editingKey !== '') {
               setEditingKey('');
@@ -2063,7 +2070,7 @@ const GridEdit = props => {
           title: getValueCell(column, record[column.field], format),
           'data-col-index': colIndex,
           'data-row-index': rowNumber,
-          // 'data-tooltip-id': "tooltip-cell-content",
+          'data-tooltip-id': "tooltip-cell-content",
           // 'data-tooltip-content': 'tooltip-cell-content',
           // 'data-tooltip-delay-show': 1000,
           // 'data-tooltip-content': getValueCell(column, record[column.field as any], format),

package/lib/grid-component/EditableCell.js

@@ -35,7 +35,10 @@ const filterTreeNode = (input, treeNode) => {
     title,
     value
   } = treeNode;
-  return title.toLowerCase().includes(input.toLowerCase()) || value.toLowerCase().includes(input.toLowerCase());
+  if (typeof title === "string" || typeof title === 'number') {
+    return title.toString().toLowerCase().includes(input.toLowerCase()) || value.toLowerCase().includes(input.toLowerCase());
+  }
+  return value.toLowerCase().includes(input.toLowerCase());
 };
 const EditableCell = props => {
   const {
@@ -560,19 +563,17 @@ const EditableCell = props => {
           // autoFocus={true}
           ,
           virtual: true,
-          allowClear: true
+          allowClear: true,
+          showSearch: true
           // maxTagTextLength={column?.editSelectSettings?.showItems}
           ,
           maxTagCount: column?.editSelectSettings?.showItems,
           maxTagPlaceholder: 2,
           treeTitleRender: column?.editSelectSettings?.formatOptionLabel,
           showCheckedStrategy: SHOW_PARENT,
-          multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti,
-          fieldNames: {
-            label: inputKey ? inputKey : 'title',
-            value: keySelect,
-            children: 'children'
-          },
+          multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti
+          // fieldNames={{label: inputKey ? inputKey : 'title', value: keySelect, children: 'children'}}
+          ,
           treeCheckable: column?.editSelectSettings?.selectMode === 'checkbox',
           filterTreeNode: filterTreeNode,
           popupMatchSelectWidth: menuWidth ? menuWidth + 10 : undefined,

package/lib/grid-component/InternalTable.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactResizable = require("react-resizable");
 require("react-resizable/css/styles.css");
 var _customParseFormat = _interopRequireDefault(require("dayjs/plugin/customParseFormat"));
@@ -24,6 +24,9 @@ var _columns = require("./hooks/columns");
 var _Group = _interopRequireDefault(require("./table/Group"));
 var _sweetalert = _interopRequireDefault(require("sweetalert2"));
 var _sweetalert2ReactContent = _interopRequireDefault(require("sweetalert2-react-content"));
+var _reactTooltip = require("react-tooltip");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 _dayjs.default.extend(_customParseFormat.default);
 const MySwal = (0, _sweetalert2ReactContent.default)(_sweetalert.default);
 
@@ -101,6 +104,7 @@ const InternalTable = props => {
 
   // const [filterStates, setFilterState] = React.useState<any>(null)
   // const [isFilter, setIsFilter] = React.useState<boolean>(false);
+  // const [cellTooltip, seCellTooltip] = React.useState<any>(undefined);
 
   const mergerdData = _react.default.useMemo(() => {
     // return filterDataByColumns2(addRowIdArray(dataSource), filterStates)
@@ -147,6 +151,11 @@ const InternalTable = props => {
     // @ts-ignore
     return record => record?.[rowKey];
   }, [rowKey]);
+
+  // const onMouseHover = (record: any, col: ColumnTable) => {
+  //
+  // }
+
   const [transformSelectionColumns] = (0, _useColumns.default)({
     locale,
     t,
@@ -161,6 +170,7 @@ const InternalTable = props => {
     groupSetting,
     groupColumns,
     handleResize
+    // onMouseHover
   });
   const mergedColumns = _react.default.useMemo(() => {
     return transformSelectionColumns(columns);
@@ -389,7 +399,7 @@ const InternalTable = props => {
     }
   };
   const TableComponent = groupAble ? _Group.default : editAble ? _GridEdit.default : _Grid.default;
-  return /*#__PURE__*/_react.default.createElement(TableComponent, (0, _extends2.default)({}, rest, {
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(TableComponent, (0, _extends2.default)({}, rest, {
     t: t,
     locale: locale,
     tableRef: tableRef,
@@ -424,6 +434,20 @@ const InternalTable = props => {
     // isFilter={isFilter}
     // setIsFilter={setIsFilter}
     // onScroll={onScroll}
+  })), /*#__PURE__*/_react.default.createElement(_reactTooltip.Tooltip, {
+    id: "tooltip-cell-content",
+    style: {
+      zIndex: 1999
+    }
+    // content={'sssss'}
+    // content={cellTooltip}
+    // render={() => {
+    //   return (
+    //     <span>
+    //       aaaa
+    //     </span>
+    //   )
+    // }}
   }));
 };
 var _default = exports.default = InternalTable;

package/lib/grid-component/hooks/useColumns.d.ts

@@ -13,6 +13,7 @@ interface UseColumnsConfig<RecordType> {
     groupSetting?: IGroupSetting;
     groupColumns?: string[];
     rowKey?: any;
+    onMouseHover?: any;
 }
 declare const useColumns: <RecordType extends AnyObject = AnyObject>(config: UseColumnsConfig<RecordType>) => readonly [any];
 export default useColumns;

package/lib/grid-component/hooks/useColumns.js

@@ -48,6 +48,7 @@ const useColumns = config => {
     sortMultiple,
     format,
     handleResize,
+    // onMouseHover,
     groupAble,
     groupColumns,
     groupSetting,
@@ -284,7 +285,11 @@ const useColumns = config => {
               className: (0, _classnames.default)(transformedColumn?.onCell?.(data, index).className ?? '', {
                 'cell-group': groupColumns && data.children,
                 'cell-group-fixed': groupColumns && data.children && col.field === firstNonGroupColumn?.field
-              })
+              }),
+              'data-tooltip-id': "tooltip-cell-content"
+              // onMouseEnter: () => {
+              //   onMouseHover(data, col as any)
+              // },
             };
           },
           render: (value, record, rowIndex) => {
@@ -312,7 +317,9 @@ const useColumns = config => {
       });
     };
     return convertColumns(cloneColumns);
-  }, [format, getColumnSearchProps, groupAble, groupColumns, groupSetting, handleResize, sortMultiple, t]);
+  }, [groupColumns, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, dataSource, rowKey, handleResize, format]
+  // format, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, groupColumns, , handleResize, , t, cellHover
+  );
   return [transformColumns];
 };
 var _default = exports.default = useColumns;

package/lib/grid-component/hooks/useLazyKVMap.d.ts

@@ -0,0 +1,4 @@
+import type { AnyObject, GetRowKey } from "../type";
+import type { Key } from "react";
+declare const useLazyKVMap: <RecordType extends AnyObject = AnyObject>(data: readonly RecordType[], childrenColumnName: string, getRowKey: GetRowKey<RecordType>) => readonly [(key: Key) => RecordType];
+export default useLazyKVMap;

package/lib/grid-component/hooks/useLazyKVMap.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
+
+// import type { AnyObject } from '../../_util/type';
+// import type { GetRowKey, Key } from '../interface';
+
+const useLazyKVMap = (data, childrenColumnName, getRowKey) => {
+  const mapCacheRef = React.useRef({});
+  function getRecordByKey(key) {
+    if (!mapCacheRef.current || mapCacheRef.current.data !== data || mapCacheRef.current.childrenColumnName !== childrenColumnName || mapCacheRef.current.getRowKey !== getRowKey) {
+      const kvMap = new Map();
+
+      // @ts-ignore
+      function dig(records) {
+        records.forEach((record, index) => {
+          const rowKey = getRowKey(record, index);
+          kvMap.set(rowKey, record);
+          if (record && typeof record === 'object' && childrenColumnName in record) {
+            dig(record[childrenColumnName] || []);
+          }
+        });
+      }
+      dig(data);
+      mapCacheRef.current = {
+        data,
+        childrenColumnName,
+        kvMap,
+        getRowKey
+      };
+    }
+    return mapCacheRef.current.kvMap?.get(key);
+  }
+  return [getRecordByKey];
+};
+var _default = exports.default = useLazyKVMap;

package/lib/grid-component/hooks/utils.js

@@ -327,13 +327,15 @@ const convertLabelToTitle = data => {
       label,
       title,
       value,
+      key,
       ...rest
     } = item;
     const newItem = {
       ...rest,
       value,
-      key: value,
-      title: title ? title : label
+      label,
+      key: key ?? value,
+      title: title ?? label
     };
     if (item.children) {
       newItem.children = convertLabelToTitle(item.children);

package/lib/grid-component/table/GridEdit.js

@@ -841,7 +841,7 @@ const GridEdit = props => {
           if (!(0, _hooks.isEqualSet)(cells, rangeCells)) {
             (0, _hooks.onRemoveBgSelectedCell)(rangeCells, id);
             (0, _hooks.onRemoveBorderSelectedCell)(rangeCells, id);
-            (0, _hooks.hideDraggingPoint)(selectedCells.current, id);
+            (0, _hooks.hideDraggingPoint)(rangeCells, id);
           }
         }
         if (rowsSelected.current && rowsSelected.current.size > 0) {
@@ -867,11 +867,12 @@ const GridEdit = props => {
   };
   const triggerDragPaste = pastesArray => {
     const mergedSet = new Set([...selectedCells.current, ...pastesArray]);
+    const tmpCols = (0, _columns.flatColumns2)(columns.filter(it => it.visible !== false));
     const rowSelectedFirst = (0, _hooks.getFirstSelectCell)(selectedCells.current).row;
     const rowPasteLast = (0, _hooks.getLastSelectCell)(pasteCells.current).row;
     const selectedArray = Array.from(selectedCells.current).map(key => {
       const [row, col] = key.split("-").map(Number);
-      const columnKey = columns[col].field;
+      const columnKey = tmpCols[col].field;
 
       // @ts-ignore
       return {
@@ -965,13 +966,13 @@ const GridEdit = props => {
         }
         rowValues.forEach((cellValue, colIndex) => {
           const targetCol = startCol + colIndex;
-          if (targetCol >= columns.length) {
+          if (targetCol >= tmpCols.length) {
             // Không vượt quá số cột
             return;
           }
 
           // @ts-ignore
-          const columnKey = columns[targetCol].field;
+          const columnKey = tmpCols[targetCol].field;
 
           // @ts-ignore
           newData[targetRow] = {
@@ -1830,6 +1831,7 @@ const GridEdit = props => {
       }
       (0, _hooks.hideDraggingPoint)(selectedCells.current, id);
       selectedCells.current = cells;
+      setRangeCells(cells);
       setTimeout(() => {
         (0, _hooks.onAddBgSelectedCell)(selectedCells.current, id);
         (0, _hooks.onAddBorderSelectedCell)(selectedCells.current, id);
@@ -1936,6 +1938,7 @@ const GridEdit = props => {
       onCell: (record, rowIndex) => {
         const rowNumber = (0, _hooks.getRowNumber)(dataSource, record[rowKey], rowKey);
         return {
+          ...column?.onCell?.(record, rowIndex),
           onKeyDown: event => {
             const key = getRowKey(record, dataSource.indexOf(record));
             if (event.key === 'Control' && event.ctrlKey) {} else {
@@ -2056,6 +2059,10 @@ const GridEdit = props => {
               rowsSelected.current = new Set();
             }
           },
+          // onMouseEnter: () => {
+          //
+          // },
+
           onClick: () => {
             if (record[rowKey] !== editingKey && editingKey !== '') {
               setEditingKey('');
@@ -2071,7 +2078,7 @@ const GridEdit = props => {
           title: (0, _columns.getValueCell)(column, record[column.field], format),
           'data-col-index': colIndex,
           'data-row-index': rowNumber,
-          // 'data-tooltip-id': "tooltip-cell-content",
+          'data-tooltip-id': "tooltip-cell-content",
           // 'data-tooltip-content': 'tooltip-cell-content',
           // 'data-tooltip-delay-show': 1000,
           // 'data-tooltip-content': getValueCell(column, record[column.field as any], format),

package/package.json

@@ -1,109 +1,109 @@
-{
-  "name": "es-grid-template",
-  "version": "1.3.8",
-  "description": "es-grid-template",
-  "keywords": [
-    "react",
-    "react-component",
-    "grid",
-    "table"
-  ],
-  "license": "MIT",
-  "main": "lib/index",
-  "module": "es/index",
-  "files": [
-    "lib",
-    "es",
-    "assets/*.css",
-    "assets/*.scss"
-  ],
-  "scripts": {
-    "__compile": "father build && ",
-    "compile": "father build && sass assets/index.scss assets/index.css",
-    "docs:build": "dumi build",
-    "__docs:deploy": "gh-pages -d dist",
-    "lint": "eslint src/ --ext .tsx,.ts,.jsx,.js",
-    "now-build": "npm run docs:build",
-    "prepare": "dumi setup",
-    "prepublishOnly": "npm run compile",
-    "postpublish": "npm run docs:build",
-    "__postpublish": "npm run docs:build && npm run docs:deploy",
-    "start": "dumi dev",
-    "test": "vitest --watch false",
-    "coverage": "vitest run --coverage"
-  },
-  "dependencies": {
-    "@ant-design/colors": "^8.0.0",
-    "@ant-design/cssinjs": "^1.22.0",
-    "@ant-design/cssinjs-utils": "^1.1.1",
-    "@ant-design/icons": "^5.5.2",
-    "@babel/runtime": "^7.11.2",
-    "@core-rc/rc-select": "^0.0.8",
-    "@ctrl/tinycolor": "^3.6.1",
-    "@faker-js/faker": "^9.5.0",
-    "@floating-ui/react": "^0.27.5",
-    "@rc-component/color-picker": "^2.0.1",
-    "@rc-component/father-plugin": "^2.0.1",
-    "@rc-component/trigger": "^2.0.0",
-    "@rc-component/util": "^1.0.1",
-    "@types/react-resizable": "^3.0.8",
-    "@types/styled-components": "^5.1.34",
-    "@vitest/coverage-v8": "^2.0.5",
-    "antd": "^5.24.1",
-    "antd-style": "^3.7.1",
-    "becoxy-icons": "^2.0.1",
-    "classnames": "^2.3.1",
-    "dayjs": "^1.11.13",
-    "lodash": "^4.17.21",
-    "moment": "^2.30.1",
-    "postcss": "^8.4.35",
-    "rc-checkbox": "^3.5.0",
-    "rc-dropdown": "^4.2.1",
-    "rc-field-form": "^2.6.0",
-    "rc-master-ui": "^1.1.30",
-    "rc-select": "^14.16.3",
-    "rc-tooltip": "^6.3.0",
-    "rc-tree": "^5.10.1",
-    "rc-tree-select": "^5.24.5",
-    "react-hook-form": "^7.54.2",
-    "react-hot-toast": "^2.5.2",
-    "react-numeric-component": "^1.0.7",
-    "react-resizable": "^3.0.5",
-    "react-tooltip": "^5.28.1",
-    "sass": "^1.81.0",
-    "styled-components": "^6.1.15",
-    "sweetalert2": "^11.4.14",
-    "sweetalert2-react-content": "^5.0.0",
-    "throttle-debounce": "^5.0.2",
-    "vitest": "^2.0.5"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.26.4",
-    "@babel/preset-env": "^7.26.9",
-    "@rc-component/np": "^1.0.3",
-    "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.4.0",
-    "@types/react": "^18.0.26",
-    "@types/react-dom": "^18.0.10",
-    "@types/warning": "^3.0.0",
-    "cross-env": "^7.0.0",
-    "dumi": "^2.2.13",
-    "eslint": "^8.56.0",
-    "eslint-plugin-unicorn": "^55.0.0",
-    "father": "^4.0.0",
-    "gh-pages": "^3.1.0",
-    "less": "^4.1.1",
-    "np": "^7.1.0",
-    "rc-test": "^7.0.9",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "typescript": "^4.0.5"
-  },
-  "peerDependencies": {
-    "react": ">=16.9.0",
-    "react-dom": ">=16.9.0"
-  },
-  "umi": {
-    "configFile": "config.ts"
-  }
-}
+{
+  "name": "es-grid-template",
+  "version": "1.4.0",
+  "description": "es-grid-template",
+  "keywords": [
+    "react",
+    "react-component",
+    "grid",
+    "table"
+  ],
+  "license": "MIT",
+  "main": "lib/index",
+  "module": "es/index",
+  "files": [
+    "lib",
+    "es",
+    "assets/*.css",
+    "assets/*.scss"
+  ],
+  "scripts": {
+    "__compile": "father build && ",
+    "compile": "father build && sass assets/index.scss assets/index.css",
+    "docs:build": "dumi build",
+    "__docs:deploy": "gh-pages -d dist",
+    "lint": "eslint src/ --ext .tsx,.ts,.jsx,.js",
+    "now-build": "npm run docs:build",
+    "prepare": "dumi setup",
+    "prepublishOnly": "npm run compile",
+    "postpublish": "npm run docs:build",
+    "__postpublish": "npm run docs:build && npm run docs:deploy",
+    "start": "dumi dev",
+    "test": "vitest --watch false",
+    "coverage": "vitest run --coverage"
+  },
+  "dependencies": {
+    "@ant-design/colors": "^8.0.0",
+    "@ant-design/cssinjs": "^1.22.0",
+    "@ant-design/cssinjs-utils": "^1.1.1",
+    "@ant-design/icons": "^5.5.2",
+    "@babel/runtime": "^7.11.2",
+    "@core-rc/rc-select": "^0.0.8",
+    "@ctrl/tinycolor": "^3.6.1",
+    "@faker-js/faker": "^9.5.0",
+    "@floating-ui/react": "^0.27.5",
+    "@rc-component/color-picker": "^2.0.1",
+    "@rc-component/father-plugin": "^2.0.1",
+    "@rc-component/trigger": "^2.0.0",
+    "@rc-component/util": "^1.0.1",
+    "@types/react-resizable": "^3.0.8",
+    "@types/styled-components": "^5.1.34",
+    "@vitest/coverage-v8": "^2.0.5",
+    "antd": "^5.24.1",
+    "antd-style": "^3.7.1",
+    "becoxy-icons": "^2.0.1",
+    "classnames": "^2.3.1",
+    "dayjs": "^1.11.13",
+    "lodash": "^4.17.21",
+    "moment": "^2.30.1",
+    "postcss": "^8.4.35",
+    "rc-checkbox": "^3.5.0",
+    "rc-dropdown": "^4.2.1",
+    "rc-field-form": "^2.6.0",
+    "rc-master-ui": "^1.1.31",
+    "rc-select": "^14.16.3",
+    "rc-tooltip": "^6.3.0",
+    "rc-tree": "^5.10.1",
+    "rc-tree-select": "^5.24.5",
+    "react-hook-form": "^7.54.2",
+    "react-hot-toast": "^2.5.2",
+    "react-numeric-component": "^1.0.7",
+    "react-resizable": "^3.0.5",
+    "react-tooltip": "^5.28.1",
+    "sass": "^1.81.0",
+    "styled-components": "^6.1.15",
+    "sweetalert2": "^11.4.14",
+    "sweetalert2-react-content": "^5.0.0",
+    "throttle-debounce": "^5.0.2",
+    "vitest": "^2.0.5"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.26.4",
+    "@babel/preset-env": "^7.26.9",
+    "@rc-component/np": "^1.0.3",
+    "@testing-library/react": "^14.0.0",
+    "@types/jest": "^29.4.0",
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.10",
+    "@types/warning": "^3.0.0",
+    "cross-env": "^7.0.0",
+    "dumi": "^2.2.13",
+    "eslint": "^8.56.0",
+    "eslint-plugin-unicorn": "^55.0.0",
+    "father": "^4.0.0",
+    "gh-pages": "^3.1.0",
+    "less": "^4.1.1",
+    "np": "^7.1.0",
+    "rc-test": "^7.0.9",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "typescript": "^4.0.5"
+  },
+  "peerDependencies": {
+    "react": ">=16.9.0",
+    "react-dom": ">=16.9.0"
+  },
+  "umi": {
+    "configFile": "config.ts"
+  }
+}