es-grid-template 1.3.4 → 1.3.5

package/es/grid-component/TableGrid.js

@@ -512,7 +512,10 @@ const TableGrid = props => {
     ,
     showTotal: (total, range) => `${range[0]}-${range[1]} / ${total} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
   }, pagination)), bottomToolbar?.(), /*#__PURE__*/React.createElement(Tooltip, {
-    id: "tooltip-header"
+    id: "tooltip-header",
+    style: {
+      zIndex: 1999
+    }
   }));
 };
 export default TableGrid;

package/es/grid-component/hooks/columns/index.js

@@ -8,9 +8,13 @@ import CheckboxFilter from "../../CheckboxFilter";
 import { SELECTION_COLUMN } from "rc-master-ui/es/table/hooks/useSelection";
 import NumberRange from "../../number-range";
 import Number from "../../number";
+// import {Typography} from "antd";
 const {
   RangePicker
 } = DatePicker;
+
+// const { Text } = Typography;
+
 export function flatColumns(columns, parentKey = 'key') {
   // @ts-ignore
   return columns.filter(column => column && typeof column === 'object').reduce((list, column, index) => {

package/es/grid-component/hooks/content/HeaderContent.js

@@ -67,7 +67,9 @@ const HeaderContent = props => {
     // style={{flex: 1, overflow: 'hidden', textOverflow: 'ellipsis', wordBreak: 'keep-all'}}
     // style={{flex: 1}}
     className: classnames('', {}),
-    "data-tooltip-id": "tooltip-header",
+    "data-tooltip-id": "tooltip-header"
+    // data-tooltip-id="tooltip-cell-content"
+    ,
     "data-tooltip-content": tooltip,
     "data-tooltip-offset": 16
   }, headerTemplate ? getTemplate(headerTemplate) : t ? t(text) : text));

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

@@ -801,8 +801,6 @@ const GridEdit = props => {
     };
   }, []);
   const handleMouseDown = (record, row, col, e) => {
-    // setEditingKey('')
-
     if (e.button === 2) {
       e.stopPropagation();
       return;
@@ -1049,6 +1047,14 @@ const GridEdit = props => {
       }
       if (row < rowSelectedEnd) {
         // kéo lên trên
+
+        const rowSelectedStart = getFirstSelectCell(selectedCells).row;
+        const newPasteCells = new Set();
+        for (let r = Math.min(rowSelectedStart, row); r <= Math.max(rowSelectedStart, row) - 1; r++) {
+          for (let c = Math.min(colStart, col); c <= Math.max(colStart, colEnd); c++) {
+            newPasteCells.add(`${r}-${c}`);
+          }
+        }
       }
       if (col > colEnd) {
         // kéo sang phải
@@ -1153,7 +1159,7 @@ const GridEdit = props => {
       return {
         row,
         col,
-        value: flattenData(childrenColumnName, dataSource)[row][columnKey]
+        value: flattenData(childrenColumnName, dataSource)[row][columnKey] ?? ''
       };
       // return { row, col, value: '' };
     });
@@ -1297,7 +1303,7 @@ const GridEdit = props => {
   };
   const handlePaste = (record, indexCol, rowNumber, e) => {
     // const clipboard: any = (e.clipboardData || (window && window?.Clipboard)).getData("text")
-    const pasteData = e.clipboardData.getData("text/plain").trim();
+    const pasteData = e.clipboardData.getData("text/plain");
 
     // Chuyển đổi dữ liệu từ clipboard thành mảng
     const rowsPasted = pasteData.split("\n").map(row =>
@@ -1724,7 +1730,7 @@ const GridEdit = props => {
     const isPasteLeft = colIndex === Math.min(cellPasteStart.col, cellPasteSEnd?.col);
     return `${cellClass} ${isPasteBottom ? `cell-paste-border-bottom` : ''} ${isPasteSelected && isPasteRight ? `cell-paste-border-right` : ''} ${isPasteSelected && isPasteLeft ? `fixed-cell-paste-border-left` : ''}  ${isBottom ? `cell-border-bottom` : ''}  ${isRight ? `cell-border-right` : ''} ${isLeft ? `fixed-cell-border-left` : ''} ${isBottom && isRight ? `cell-border-end` : ''}`;
   };
-  const convertColumns = flatColumns2(columns).map((column, colIndex) => {
+  const convertColumns = flatColumns2(columns.filter(it => it.visible !== false)).map((column, colIndex) => {
     if (!column?.field && !column?.key) {
       return column;
     }
@@ -1918,6 +1924,10 @@ 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-content': 'tooltip-cell-content',
+          // 'data-tooltip-delay-show': 1000,
+          // 'data-tooltip-content': getValueCell(column, record[column.field as any], format),
           editing: isEditing(record) && rowEditable?.(record) !== false && isEditable(column, record),
           cellEditing,
           t,
@@ -1978,7 +1988,9 @@ const GridEdit = props => {
           // onMouseEnter={(event) => handlePointEnter(event)}
           // onMouseLeave={() => handlePointLeave()}
           ,
-          onMouseDown: () => {
+          onMouseDown: e => {
+            // e.stopPropagation()
+            // e.preventDefault()
             setIsPasteDragging(true);
           },
           onDoubleClick: handlePointDoubleClick
@@ -2000,6 +2012,11 @@ const GridEdit = props => {
           ...find
         };
       }
+      if (!find) {
+        return {
+          ...column
+        };
+      }
 
       // Xử lý đệ quy cho children
       if (column.children?.length) {

package/lib/grid-component/TableGrid.js

@@ -513,7 +513,10 @@ const TableGrid = props => {
     ,
     showTotal: (total, range) => `${range[0]}-${range[1]} / ${total} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
   }, pagination)), bottomToolbar?.(), /*#__PURE__*/_react.default.createElement(_reactTooltip.Tooltip, {
-    id: "tooltip-header"
+    id: "tooltip-header",
+    style: {
+      zIndex: 1999
+    }
   }));
 };
 var _default = exports.default = TableGrid;

package/lib/grid-component/hooks/columns/index.js

@@ -19,9 +19,13 @@ var _numberRange = _interopRequireDefault(require("../../number-range"));
 var _number = _interopRequireDefault(require("../../number"));
 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; }
+// import {Typography} from "antd";
 const {
   RangePicker
 } = _rcMasterUi.DatePicker;
+
+// const { Text } = Typography;
+
 function flatColumns(columns, parentKey = 'key') {
   // @ts-ignore
   return columns.filter(column => column && typeof column === 'object').reduce((list, column, index) => {

package/lib/grid-component/hooks/content/HeaderContent.js

@@ -76,7 +76,9 @@ const HeaderContent = props => {
     // style={{flex: 1, overflow: 'hidden', textOverflow: 'ellipsis', wordBreak: 'keep-all'}}
     // style={{flex: 1}}
     className: (0, _classnames.default)('', {}),
-    "data-tooltip-id": "tooltip-header",
+    "data-tooltip-id": "tooltip-header"
+    // data-tooltip-id="tooltip-cell-content"
+    ,
     "data-tooltip-content": tooltip,
     "data-tooltip-offset": 16
   }, headerTemplate ? (0, _utils.getTemplate)(headerTemplate) : t ? t(text) : text));

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

@@ -801,8 +801,6 @@ const GridEdit = props => {
     };
   }, []);
   const handleMouseDown = (record, row, col, e) => {
-    // setEditingKey('')
-
     if (e.button === 2) {
       e.stopPropagation();
       return;
@@ -1049,6 +1047,14 @@ const GridEdit = props => {
       }
       if (row < rowSelectedEnd) {
         // kéo lên trên
+
+        const rowSelectedStart = (0, _hooks.getFirstSelectCell)(selectedCells).row;
+        const newPasteCells = new Set();
+        for (let r = Math.min(rowSelectedStart, row); r <= Math.max(rowSelectedStart, row) - 1; r++) {
+          for (let c = Math.min(colStart, col); c <= Math.max(colStart, colEnd); c++) {
+            newPasteCells.add(`${r}-${c}`);
+          }
+        }
       }
       if (col > colEnd) {
         // kéo sang phải
@@ -1153,7 +1159,7 @@ const GridEdit = props => {
       return {
         row,
         col,
-        value: (0, _hooks.flattenData)(childrenColumnName, dataSource)[row][columnKey]
+        value: (0, _hooks.flattenData)(childrenColumnName, dataSource)[row][columnKey] ?? ''
       };
       // return { row, col, value: '' };
     });
@@ -1297,7 +1303,7 @@ const GridEdit = props => {
   };
   const handlePaste = (record, indexCol, rowNumber, e) => {
     // const clipboard: any = (e.clipboardData || (window && window?.Clipboard)).getData("text")
-    const pasteData = e.clipboardData.getData("text/plain").trim();
+    const pasteData = e.clipboardData.getData("text/plain");
 
     // Chuyển đổi dữ liệu từ clipboard thành mảng
     const rowsPasted = pasteData.split("\n").map(row =>
@@ -1724,7 +1730,7 @@ const GridEdit = props => {
     const isPasteLeft = colIndex === Math.min(cellPasteStart.col, cellPasteSEnd?.col);
     return `${cellClass} ${isPasteBottom ? `cell-paste-border-bottom` : ''} ${isPasteSelected && isPasteRight ? `cell-paste-border-right` : ''} ${isPasteSelected && isPasteLeft ? `fixed-cell-paste-border-left` : ''}  ${isBottom ? `cell-border-bottom` : ''}  ${isRight ? `cell-border-right` : ''} ${isLeft ? `fixed-cell-border-left` : ''} ${isBottom && isRight ? `cell-border-end` : ''}`;
   };
-  const convertColumns = (0, _columns.flatColumns2)(columns).map((column, colIndex) => {
+  const convertColumns = (0, _columns.flatColumns2)(columns.filter(it => it.visible !== false)).map((column, colIndex) => {
     if (!column?.field && !column?.key) {
       return column;
     }
@@ -1918,6 +1924,10 @@ 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-content': 'tooltip-cell-content',
+          // 'data-tooltip-delay-show': 1000,
+          // 'data-tooltip-content': getValueCell(column, record[column.field as any], format),
           editing: isEditing(record) && rowEditable?.(record) !== false && (0, _hooks.isEditable)(column, record),
           cellEditing,
           t,
@@ -1978,7 +1988,9 @@ const GridEdit = props => {
           // onMouseEnter={(event) => handlePointEnter(event)}
           // onMouseLeave={() => handlePointLeave()}
           ,
-          onMouseDown: () => {
+          onMouseDown: e => {
+            // e.stopPropagation()
+            // e.preventDefault()
             setIsPasteDragging(true);
           },
           onDoubleClick: handlePointDoubleClick
@@ -2000,6 +2012,11 @@ const GridEdit = props => {
           ...find
         };
       }
+      if (!find) {
+        return {
+          ...column
+        };
+      }
 
       // Xử lý đệ quy cho children
       if (column.children?.length) {

package/package.json

@@ -1,109 +1,109 @@
-{
-  "name": "es-grid-template",
-  "version": "1.3.4",
-  "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.23",
-    "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.3.5",
+  "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.24",
+    "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"
+  }
+}