es-grid-template 1.9.78 → 1.9.82

package/es/ali-table/utils/convertColumnsChoose.js

@@ -1,10 +1,11 @@
+import { nonActionColumn } from "../../grid-component/hooks";
 export function convertColumnsToTreeData(columns, groupColumns, t) {
   if (!columns) {
     return [];
   }
   return columns.filter(col => {
     const inGroup = groupColumns ? groupColumns.includes(String(col.field)) : false;
-    if (col.showInColumnChoose === false) return false;
+    if (col.showInColumnChoose === false || nonActionColumn.includes(col.field)) return false;
     if (inGroup && !('children' in col && Array.isArray(col.children))) {
       return false;
     }

package/es/group-component/TableContainerEdit.js

@@ -2023,7 +2023,25 @@ const TableContainerEdit = props => {
     }
     contextMenuClick?.(args);
   };
+
+  // Chống fire onCellClick trùng lặp: double-click = 2 lần mousedown nên callback sẽ bị gọi 2 lần.
+  // Chỉ bỏ qua khi click LIÊN TIẾP cùng 1 cell trong khoảng thời gian rất ngắn.
+  const lastCellClickRef = React.useRef({
+    key: '',
+    time: 0
+  });
   const handleCellClick = (rowNumber, record, column, rowId, cellValue) => {
+    const clickKey = `${rowId}::${column.field ?? ''}`;
+    const now = Date.now();
+
+    // cùng cell && trong vòng 300ms => coi là double-click, bỏ qua lần lặp
+    if (lastCellClickRef.current.key === clickKey && now - lastCellClickRef.current.time < 300) {
+      return;
+    }
+    lastCellClickRef.current = {
+      key: clickKey,
+      time: now
+    };
     const cellClickCallback = newOptions => {
       if (newOptions) {
         const newElem = {

package/es/group-component/body/TableBodyCellEdit.js

@@ -1260,6 +1260,11 @@ const TableBodyCellEdit = props => {
         }
       } else {
         handleMouseDown(cell.row.id, cell.column.id);
+
+        // fire onCellClick ngay lần click đầu (trước đây chỉ fire khi cell đã ở trạng thái editing)
+        if (canEdit) {
+          handleCellClick?.(rowNumber, record, columnMeta, record[rowKey], record[columnMeta.field ?? '']);
+        }
         if (editingKey) {
           setTimeout(() => {
             setEditingKey?.('');

package/es/group-component/hook/utils.d.ts

@@ -196,10 +196,10 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
         value: any;
         rowData: RecordType;
     }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
-    onCellStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
-    onCellHeaderStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
+    onCellStyles?: Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width">);
+    onCellHeaderStyles?: Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width">);
     onCell?: (rowData: RecordType, index: number) => import("react").TdHTMLAttributes<HTMLTableCellElement>;
-    onCellFooterStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
+    onCellFooterStyles?: Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width">);
     getValue?: (row: any, rowIndex: number) => any;
     getCellProps?: (value: any, row: any, rowIndex: number) => import("./../../grid-component/type").CellProps;
     headerCellProps?: import("./../../grid-component/type").CellProps;

package/es/group-component/hook/utils.js

@@ -1,3 +1,4 @@
+import { nonActionColumn } from "./../../grid-component/hooks";
 import { v4 as uuidv4 } from 'uuid';
 import { presetPalettes } from "@ant-design/colors";
 import dayjs from "dayjs";
@@ -1916,8 +1917,8 @@ export function convertColumnsToTreeData(columns, groupColumns) {
 
     // Điều kiện filter:
     // - Nếu meta.showInColumnChoose = false => loại bỏ
-    // - Nếu không nằm trong groupColumns và không phải column group => loại bỏ
-    if (meta.showInColumnChoose === false) return false;
+    // - Nếu là column đặc biệt (selection_column, #, command...) => loại bỏ
+    if (meta.showInColumnChoose === false || nonActionColumn.includes(col.id)) return false;
     if (inGroup && !('columns' in col && Array.isArray(col.columns))) {
       return false;
     }
@@ -1948,6 +1949,15 @@ export const updateColumns1 = (columns, includes) => {
     if (!column.field) {
       return column;
     }
+
+    // Bỏ qua column đặc biệt (selection_column, #, command, drag-handle) — giữ nguyên visible
+    // nhưng vẫn phải đệ quy children để không bỏ sót column con
+    if (nonActionColumn.includes(newColumn.field)) {
+      if (newColumn.children) {
+        newColumn.children = updateColumns1(newColumn.children, includes);
+      }
+      return newColumn;
+    }
     if (newColumn.children) {
       newColumn.children = updateColumns1(newColumn.children, includes);
       hasVisibleChild = newColumn.children.some(child => !child.hidden);

package/es/table-component/TableContainerEdit.js

@@ -2078,7 +2078,25 @@ const TableContainerEdit = props => {
     }
     contextMenuClick?.(args);
   };
+
+  // Chống fire onCellClick trùng lặp: double-click = 2 lần mousedown nên callback sẽ bị gọi 2 lần.
+  // Chỉ bỏ qua khi click LIÊN TIẾP cùng 1 cell trong khoảng thời gian rất ngắn.
+  const lastCellClickRef = React.useRef({
+    key: '',
+    time: 0
+  });
   const handleCellClick = (rowNumber, record, column, rowId, cellValue) => {
+    const clickKey = `${rowId}::${column.field ?? ''}`;
+    const now = Date.now();
+
+    // cùng cell && trong vòng 300ms => coi là double-click, bỏ qua lần lặp
+    if (lastCellClickRef.current.key === clickKey && now - lastCellClickRef.current.time < 300) {
+      return;
+    }
+    lastCellClickRef.current = {
+      key: clickKey,
+      time: now
+    };
     const cellClickCallback = newOptions => {
       if (newOptions) {
         const newElem = {

package/es/table-component/body/TableBodyCellEdit.js

@@ -1344,6 +1344,11 @@ const TableBodyCellEdit = props => {
         }
       } else {
         handleMouseDown(cell.row.id, cell.column.id);
+
+        // fire onCellClick ngay lần click đầu (trước đây chỉ fire khi cell đã ở trạng thái editing)
+        if (canEdit) {
+          handleCellClick?.(rowNumber, record, columnMeta, record[rowKey], record[columnMeta.field ?? '']);
+        }
         if (editingKey) {
           setTimeout(() => {
             setEditingKey?.('');

package/es/table-component/hook/utils.js

@@ -2481,9 +2481,8 @@ export function convertColumnsToTreeData(columns, groupColumns) {
 
     // Điều kiện filter:
     // - Nếu meta.showInColumnChoose = false => loại bỏ
-    // - Nếu không nằm trong groupColumns và không phải column group => loại bỏ
-    // if (meta.showInColumnChoose === false || col.id === "selection_column") return false
-    if (meta.showInColumnChoose === false) return false;
+    // - Nếu là column đặc biệt (selection_column, #, command...) => loại bỏ
+    if (meta.showInColumnChoose === false || nonActionColumn.includes(col.id)) return false;
     // if (inGroup && !('columns' in col && Array.isArray((col as any).columns))) {
     if (inGroup && !('columns' in col && Array.isArray(col.columns))) {
       return false;
@@ -2515,6 +2514,15 @@ export const updateColumns1 = (columns, includes) => {
     if (!column.field) {
       return column;
     }
+
+    // Bỏ qua column đặc biệt (selection_column, #, command, drag-handle) — giữ nguyên visible
+    // nhưng vẫn phải đệ quy children để không bỏ sót column con
+    if (nonActionColumn.includes(newColumn.field)) {
+      if (newColumn.children) {
+        newColumn.children = updateColumns1(newColumn.children, includes);
+      }
+      return newColumn;
+    }
     if (newColumn.children) {
       newColumn.children = updateColumns1(newColumn.children, includes);
       hasVisibleChild = newColumn.children.some(child => !child.hidden);

package/es/table-component/table/Grid.js

@@ -109,6 +109,17 @@ const Grid = props => {
         pageSize: pagination && pagination?.pageSize ? pagination.pageSize : 20,
         ...paginationState
       } : undefined,
+      //  ...(infiniteScroll
+      // ? {}
+      // : {
+      //     pagination: {
+      //       // @ts-ignore
+      //       pageIndex: pagination?.currentPage ? pagination.currentPage - 1 : 0,
+      //       // @ts-ignore
+      //       pageSize: pagination?.pageSize ?? 20,
+      //       ...paginationState,
+      //     },
+      //   }),
       grouping,
       columnSizing,
       columnOrder,
@@ -167,8 +178,13 @@ const Grid = props => {
       return Array.isArray(row.original.children);
     },
     getExpandedRowModel: getExpandedRowModel(),
-    getPaginationRowModel: pagination && !infiniteScroll ? getPaginationRowModel() : undefined,
-    onPaginationChange: setPagination
+    ...(pagination && !infiniteScroll && {
+      getPaginationRowModel: getPaginationRowModel(),
+      onPaginationChange: setPagination
+    })
+
+    // getPaginationRowModel: pagination && !infiniteScroll ? getPaginationRowModel() : undefined,
+    // onPaginationChange: pagination && !infiniteScroll ? setPagination : undefined,
 
     // onColumnVisibilityChange: setColumnVisibility,
     // onColumnPinningChange,

package/es/table-virtuoso/hook/utils.js

@@ -1,3 +1,4 @@
+import { nonActionColumn } from "../../grid-component/hooks";
 import { SELECTION_COLUMN } from "rc-master-ui/es/table/hooks/useSelection";
 import { v4 as uuidv4 } from 'uuid';
 import { presetPalettes } from "@ant-design/colors";
@@ -1888,8 +1889,8 @@ export function convertColumnsToTreeData(columns, groupColumns) {
 
     // Điều kiện filter:
     // - Nếu meta.showInColumnChoose = false => loại bỏ
-    // - Nếu không nằm trong groupColumns và không phải column group => loại bỏ
-    if (meta.showInColumnChoose === false) return false;
+    // - Nếu là column đặc biệt (selection_column, #, command...) => loại bỏ
+    if (meta.showInColumnChoose === false || nonActionColumn.includes(col.id)) return false;
     if (inGroup && !('columns' in col && Array.isArray(col.columns))) {
       return false;
     }
@@ -1920,6 +1921,15 @@ export const updateColumns1 = (columns, includes) => {
     if (!column.field) {
       return column;
     }
+
+    // Bỏ qua column đặc biệt (selection_column, #, command, drag-handle) — giữ nguyên visible
+    // nhưng vẫn phải đệ quy children để không bỏ sót column con
+    if (nonActionColumn.includes(newColumn.field)) {
+      if (newColumn.children) {
+        newColumn.children = updateColumns1(newColumn.children, includes);
+      }
+      return newColumn;
+    }
     if (newColumn.children) {
       newColumn.children = updateColumns1(newColumn.children, includes);
       hasVisibleChild = newColumn.children.some(child => !child.hidden);

package/es/table-virtuoso/style.js

@@ -11,4 +11,4 @@ const colorDark = '#e6e4f3e6';
 export const GridStyle = styled.div.withConfig({
   displayName: "GridStyle",
   componentId: "es-grid-template__sc-rs980s-0"
-})(["&.", "-grid{color:", ";font-size:13px;background-color:", ";table{table-layout:fixed;border-collapse:separate;border-spacing:0;}.", "-grid-container{border:1px solid ", ";.", "-grid-thead{&:has(.resizer.isResizing){.", "-grid-cell{touch-action:none;user-select:none;}}.", "-grid-cell{background-color:#ffffff;&:has(.resizer.isResizing){touch-action:none;user-select:none;}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}}}tbody{.", "-grid-row{&.", "-grid-row-parent{.", "-grid-cell{font-weight:600;background-color:#f5f5f5;}}}}.", "-grid-tfoot{z-index:3 !important;.ui-rc-grid-footer-row{.ui-rc-grid-cell{border-top:1px solid ", ";border-bottom:1px solid ", ";font-weight:500;}}}.", "-grid-cell{padding:5px 8px;&.", "-grid-cell-fix-left-last{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;right:0;bottom:-1px;width:30px;transform:translateX(100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset 10px 0 8px -8px rgba(5,5,5,0.09);}}&.", "-grid-cell-fix-right-first{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;bottom:-1px;left:0;width:30px;transform:translateX(-100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset -10px 0 8px -8px rgba(5,5,5,0.09);}&::before{content:'';position:absolute;inset-block:0;inset-inline-start:-1px;border-inline-start:1px solid #e0e0e0;}}&.", "-grid-cell-ellipsis{.group-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}.class-content:has(*){background:lightblue;}.class-content:not(:has(*)){background:lightgreen;}&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-righ{text-align:right;justify-content:flex-end;}}.", "-grid-cell:not(:has(*)){&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-right{text-align:right;justify-content:flex-end;}&.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "-grid-light{.", "-grid-container{.", "-grid-thead{z-index:3 !important;background-color:", ";font-weight:500;.", "-grid-cell{font-weight:inherit;color:", ";background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-ellipsis{.ui-rc-table-column-title,.", "-grid-cell-ellipsis{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}&.ui-rc-grid-cell-wrap{.ui-rc-table-column-title,.", "-grid-cell-text-wrap{white-space:normal;word-break:break-word;overflow:hidden;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "-grid-filter-column{display:flex;justify-content:space-between;width:100%;align-items:center;position:relative;}.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}.resizer.isResizing{opacity:1;}}}.", "-grid-tbody{.", "-grid-row{background-color:", ";color:", ";}}tbody{background-color:", ";color:", ";.", "-grid-row{&.ui-rc-grid-row-selected{.", "-grid-cell{background-color:", ";}}}.", "-grid-cell{outline:none;background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-selected{background-color:", " !important;}&.disable{background-color:#f0f0f0;}&.cell-editable{user-select:none;&.cell-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-bottom{border-bottom:1px solid ", ";}&.cell-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-right{border-inline-end:1px solid ", ";}&.cell-paste-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px dashed #949494;pointer-events:none;z-index:1;}&.ui-rc-grid-cell-fix-left-last{&::after{left:-100%;}}&.ui-rc-grid-cell-fix-right-first{&::after{left:100%;}}}&.cell-paste-border-bottom{border-bottom:1px dashed #949494;}&.cell-paste-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px dashed #949494;pointer-events:none;z-index:1;}}&.cell-paste-border-right{border-inline-end:1px dashed #949494;}.dragging-point{width:6px;height:6px;position:absolute;cursor:crosshair;right:0px;bottom:0px;&.hidden{display:none;}.dot-point{position:absolute;width:6px;height:6px;border-radius:0px;background-color:", ";bottom:0;right:0;}}}&.cell-editing{padding:0;&:focus-visible{outline:none;}.ant-form-item,.ant-row.ant-form-item-row,.ant-col.ant-form-item-control,.ant-form-item-control-input,.ant-form-item-control-input-content,.ant-input{height:100% !important;&:focus-visible{outline:none;}}textarea.ant-input{line-height:1.8;height:36px !important;min-height:36px !important;}input.be-cell-editing,.ant-picker,.ui-rc-select-selector,.ui-rc-table-select-selector{padding-inline:7px;}.", "-checkbox-wrapper{.", "-checkbox{background-color:red;}.", "-checkbox-input{&:focus-visible{outline:none;}}}.ant-input,.ant-picker{border-radius:0;}.ant-color-picker-trigger{height:100%;border-radius:0;.ant-color-picker-color-block{height:100%;width:100%;}}.", "-table-select-single .", "-table-select-selector,.", "-select-single .", "-select-selector,.ui-rc-table-select-selector{border-radius:0 !important;}.", "-table-select-single:not(.", "-table-select-customize-input){.", "-table-select-selector{.", "-table-select-selection-search-input{height:auto;}}}}}}.", "-grid-tfoot{.", "-grid-footer-row{border-bottom-width:1px;border-bottom-color:", ";border-bottom-style:solid;border-top-width:1px;border-top-color:", ";border-top-style:solid;background-color:#fafafa;}.", "-grid-cell{background-color:inherit;border-inline-end:1px solid ", ";}}}}&.", "-grid-dark{background-color:", ";color:", ";.", "-grid-container{border-color:", ";&::after{border-right-color:", ";}}}}"], props => props.$prefix, color, BgColor, props => props.$prefix, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => props.$prefix, props => `${props.$theme.color ? props.$theme.color : color}`, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => props.$prefix, props => props.$prefix, rowSelectedBg, props => props.$prefix, tableBorderColor, tableBorderColor, cellSelectedBg, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, tableBorderColor, props => props.$prefix, BgColorDark, colorDark, props => props.$prefix, tableBorderColorDark, tableBorderColorDark);
+})(["&.", "-grid{color:", ";font-size:12px;background-color:", ";table{table-layout:fixed;border-collapse:separate;border-spacing:0;}.", "-grid-container{border:1px solid ", ";.", "-grid-thead{&:has(.resizer.isResizing){.", "-grid-cell{touch-action:none;user-select:none;}}.", "-grid-cell{background-color:#ffffff;&:has(.resizer.isResizing){touch-action:none;user-select:none;}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}}}tbody{.", "-grid-row{font-weight:500;&.", "-grid-row-parent{.", "-grid-cell{font-weight:700;background-color:#f5f5f5;}}}}.", "-grid-tfoot{z-index:3 !important;.ui-rc-grid-footer-row{.ui-rc-grid-cell{border-top:1px solid ", ";border-bottom:1px solid ", ";font-weight:500;}}}.", "-grid-cell{padding:5px 8px;&.", "-grid-cell-fix-left-last{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;right:0;bottom:-1px;width:30px;transform:translateX(100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset 10px 0 8px -8px rgba(5,5,5,0.09);}}&.", "-grid-cell-fix-right-first{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;bottom:-1px;left:0;width:30px;transform:translateX(-100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset -10px 0 8px -8px rgba(5,5,5,0.09);}&::before{content:'';position:absolute;inset-block:0;inset-inline-start:-1px;border-inline-start:1px solid #e0e0e0;}}&.", "-grid-cell-ellipsis{.group-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}.class-content:has(*){background:lightblue;}.class-content:not(:has(*)){background:lightgreen;}&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-righ{text-align:right;justify-content:flex-end;}}.", "-grid-cell:not(:has(*)){&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-right{text-align:right;justify-content:flex-end;}&.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "-grid-light{.", "-grid-container{.", "-grid-thead{z-index:3 !important;background-color:", ";font-weight:600;.", "-grid-cell{font-weight:inherit;color:", ";background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-ellipsis{.ui-rc-table-column-title,.", "-grid-cell-ellipsis{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}&.ui-rc-grid-cell-wrap{.ui-rc-table-column-title,.", "-grid-cell-text-wrap{white-space:normal;word-break:break-word;overflow:hidden;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "-grid-filter-column{display:flex;justify-content:space-between;width:100%;align-items:center;position:relative;}.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}.resizer.isResizing{opacity:1;}}}.", "-grid-tbody{.", "-grid-row{background-color:", ";color:", ";}}tbody{background-color:", ";color:", ";.", "-grid-row{&.ui-rc-grid-row-selected{.", "-grid-cell{background-color:", ";}}}.", "-grid-cell{outline:none;background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-selected{background-color:", " !important;}&.disable{background-color:#f0f0f0;}&.cell-editable{user-select:none;&.cell-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-bottom{border-bottom:1px solid ", ";}&.cell-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-right{border-inline-end:1px solid ", ";}&.cell-paste-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px dashed #949494;pointer-events:none;z-index:1;}&.ui-rc-grid-cell-fix-left-last{&::after{left:-100%;}}&.ui-rc-grid-cell-fix-right-first{&::after{left:100%;}}}&.cell-paste-border-bottom{border-bottom:1px dashed #949494;}&.cell-paste-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px dashed #949494;pointer-events:none;z-index:1;}}&.cell-paste-border-right{border-inline-end:1px dashed #949494;}.dragging-point{width:6px;height:6px;position:absolute;cursor:crosshair;right:0px;bottom:0px;&.hidden{display:none;}.dot-point{position:absolute;width:6px;height:6px;border-radius:0px;background-color:", ";bottom:0;right:0;}}}&.cell-editing{padding:0;&:focus-visible{outline:none;}.ant-form-item,.ant-row.ant-form-item-row,.ant-col.ant-form-item-control,.ant-form-item-control-input,.ant-form-item-control-input-content,.ant-input{height:100% !important;&:focus-visible{outline:none;}}textarea.ant-input{line-height:1.8;height:36px !important;min-height:36px !important;}input.be-cell-editing,.ant-picker,.ui-rc-select-selector,.ui-rc-table-select-selector{padding-inline:7px;}.", "-checkbox-wrapper{.", "-checkbox{background-color:red;}.", "-checkbox-input{&:focus-visible{outline:none;}}}.ant-input,.ant-picker{border-radius:0;}.ant-color-picker-trigger{height:100%;border-radius:0;.ant-color-picker-color-block{height:100%;width:100%;}}.", "-table-select-single .", "-table-select-selector,.", "-select-single .", "-select-selector,.ui-rc-table-select-selector{border-radius:0 !important;}.", "-table-select-single:not(.", "-table-select-customize-input){.", "-table-select-selector{.", "-table-select-selection-search-input{height:auto;}}}}}}.", "-grid-tfoot{.", "-grid-footer-row{border-bottom-width:1px;border-bottom-color:", ";border-bottom-style:solid;border-top-width:1px;border-top-color:", ";border-top-style:solid;background-color:#fafafa;}.", "-grid-cell{background-color:inherit;border-inline-end:1px solid ", ";}}}}&.", "-grid-dark{background-color:", ";color:", ";.", "-grid-container{border-color:", ";&::after{border-right-color:", ";}}}}"], props => props.$prefix, color, BgColor, props => props.$prefix, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => props.$prefix, props => `${props.$theme.color ? props.$theme.color : color}`, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => props.$prefix, props => props.$prefix, rowSelectedBg, props => props.$prefix, tableBorderColor, tableBorderColor, cellSelectedBg, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, tableBorderColor, props => props.$prefix, BgColorDark, colorDark, props => props.$prefix, tableBorderColorDark, tableBorderColorDark);

package/lib/ali-table/utils/convertColumnsChoose.js

@@ -6,13 +6,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.convertColumnsToTreeData = convertColumnsToTreeData;
 exports.filterColumnsByField = filterColumnsByField;
 exports.filterVisibleColumns = filterVisibleColumns;
+var _hooks = require("../../grid-component/hooks");
 function convertColumnsToTreeData(columns, groupColumns, t) {
   if (!columns) {
     return [];
   }
   return columns.filter(col => {
     const inGroup = groupColumns ? groupColumns.includes(String(col.field)) : false;
-    if (col.showInColumnChoose === false) return false;
+    if (col.showInColumnChoose === false || _hooks.nonActionColumn.includes(col.field)) return false;
     if (inGroup && !('children' in col && Array.isArray(col.children))) {
       return false;
     }

package/lib/group-component/TableContainerEdit.js

@@ -2031,7 +2031,25 @@ const TableContainerEdit = props => {
     }
     contextMenuClick?.(args);
   };
+
+  // Chống fire onCellClick trùng lặp: double-click = 2 lần mousedown nên callback sẽ bị gọi 2 lần.
+  // Chỉ bỏ qua khi click LIÊN TIẾP cùng 1 cell trong khoảng thời gian rất ngắn.
+  const lastCellClickRef = _react.default.useRef({
+    key: '',
+    time: 0
+  });
   const handleCellClick = (rowNumber, record, column, rowId, cellValue) => {
+    const clickKey = `${rowId}::${column.field ?? ''}`;
+    const now = Date.now();
+
+    // cùng cell && trong vòng 300ms => coi là double-click, bỏ qua lần lặp
+    if (lastCellClickRef.current.key === clickKey && now - lastCellClickRef.current.time < 300) {
+      return;
+    }
+    lastCellClickRef.current = {
+      key: clickKey,
+      time: now
+    };
     const cellClickCallback = newOptions => {
       if (newOptions) {
         const newElem = {

package/lib/group-component/body/TableBodyCellEdit.js

@@ -1267,6 +1267,11 @@ const TableBodyCellEdit = props => {
         }
       } else {
         handleMouseDown(cell.row.id, cell.column.id);
+
+        // fire onCellClick ngay lần click đầu (trước đây chỉ fire khi cell đã ở trạng thái editing)
+        if (canEdit) {
+          handleCellClick?.(rowNumber, record, columnMeta, record[rowKey], record[columnMeta.field ?? '']);
+        }
         if (editingKey) {
           setTimeout(() => {
             setEditingKey?.('');

package/lib/group-component/hook/utils.d.ts

@@ -167,7 +167,7 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
     haveSum?: boolean;
     isSummary?: boolean;
     sumGroup?: boolean;
-    summaryTemplate?: (data: number, key: string) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode;
+    summaryTemplate?: (data: number, key: string) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
     sorter?: boolean;
     allowFiltering?: boolean;
     allowSortering?: boolean;
@@ -179,27 +179,27 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
     showFilterSearch?: boolean;
     hidden?: boolean;
     visible?: boolean;
-    headerTooltip?: string | boolean | (() => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
+    headerTooltip?: string | boolean | (() => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
     columnGroupText?: string;
     headerTextAlign?: import("./../../grid-component/type").ITextAlign;
-    headerTemplate?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode | ((column: ColumnTable<RecordType>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
+    headerTemplate?: import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | ((column: ColumnTable<RecordType>) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
     fixedType?: import("./../../grid-component/type").FixedType;
     headerTextWrap?: boolean;
     ellipsis?: boolean;
     allowResizing?: boolean;
     align?: import("./../../grid-component/type").ITextAlign;
     textAlign?: import("./../../grid-component/type").ITextAlign;
-    template?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode | ((args: import("./../../grid-component/type").ColumnTemplate<RecordType>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
-    linkTemplate?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode | ((args: import("./../../grid-component/type").ColumnTemplate<RecordType>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
+    template?: import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | ((args: import("./../../grid-component/type").ColumnTemplate<RecordType>) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
+    linkTemplate?: import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | ((args: import("./../../grid-component/type").ColumnTemplate<RecordType>) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
     showTooltip?: boolean;
     tooltipDescription?: string | ((args: {
         value: any;
         rowData: RecordType;
-    }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
-    onCellStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
-    onCellHeaderStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
+    }) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
+    onCellStyles?: Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width">);
+    onCellHeaderStyles?: Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width">);
     onCell?: (rowData: RecordType, index: number) => import("react").TdHTMLAttributes<HTMLTableCellElement>;
-    onCellFooterStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
+    onCellFooterStyles?: Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "minWidth" | "position" | "width">);
     getValue?: (row: any, rowIndex: number) => any;
     getCellProps?: (value: any, row: any, rowIndex: number) => import("./../../grid-component/type").CellProps;
     headerCellProps?: import("./../../grid-component/type").CellProps;

package/lib/group-component/hook/utils.js

@@ -60,6 +60,7 @@ exports.updateColumnWidthsRecursive = updateColumnWidthsRecursive;
 exports.updateColumnsByGroup = exports.updateColumns1 = void 0;
 exports.updateOrInsert = updateOrInsert;
 exports.updateWidthsByOther = updateWidthsByOther;
+var _hooks = require("./../../grid-component/hooks");
 var _uuid = require("uuid");
 var _colors = require("@ant-design/colors");
 var _dayjs = _interopRequireDefault(require("dayjs"));
@@ -2030,8 +2031,8 @@ function convertColumnsToTreeData(columns, groupColumns) {
 
     // Điều kiện filter:
     // - Nếu meta.showInColumnChoose = false => loại bỏ
-    // - Nếu không nằm trong groupColumns và không phải column group => loại bỏ
-    if (meta.showInColumnChoose === false) return false;
+    // - Nếu là column đặc biệt (selection_column, #, command...) => loại bỏ
+    if (meta.showInColumnChoose === false || _hooks.nonActionColumn.includes(col.id)) return false;
     if (inGroup && !('columns' in col && Array.isArray(col.columns))) {
       return false;
     }
@@ -2062,6 +2063,15 @@ const updateColumns1 = (columns, includes) => {
     if (!column.field) {
       return column;
     }
+
+    // Bỏ qua column đặc biệt (selection_column, #, command, drag-handle) — giữ nguyên visible
+    // nhưng vẫn phải đệ quy children để không bỏ sót column con
+    if (_hooks.nonActionColumn.includes(newColumn.field)) {
+      if (newColumn.children) {
+        newColumn.children = updateColumns1(newColumn.children, includes);
+      }
+      return newColumn;
+    }
     if (newColumn.children) {
       newColumn.children = updateColumns1(newColumn.children, includes);
       hasVisibleChild = newColumn.children.some(child => !child.hidden);

package/lib/table-component/TableContainerEdit.js

@@ -2077,7 +2077,25 @@ const TableContainerEdit = props => {
     }
     contextMenuClick?.(args);
   };
+
+  // Chống fire onCellClick trùng lặp: double-click = 2 lần mousedown nên callback sẽ bị gọi 2 lần.
+  // Chỉ bỏ qua khi click LIÊN TIẾP cùng 1 cell trong khoảng thời gian rất ngắn.
+  const lastCellClickRef = _react.default.useRef({
+    key: '',
+    time: 0
+  });
   const handleCellClick = (rowNumber, record, column, rowId, cellValue) => {
+    const clickKey = `${rowId}::${column.field ?? ''}`;
+    const now = Date.now();
+
+    // cùng cell && trong vòng 300ms => coi là double-click, bỏ qua lần lặp
+    if (lastCellClickRef.current.key === clickKey && now - lastCellClickRef.current.time < 300) {
+      return;
+    }
+    lastCellClickRef.current = {
+      key: clickKey,
+      time: now
+    };
     const cellClickCallback = newOptions => {
       if (newOptions) {
         const newElem = {

package/lib/table-component/body/TableBodyCellEdit.js

@@ -1349,6 +1349,11 @@ const TableBodyCellEdit = props => {
         }
       } else {
         handleMouseDown(cell.row.id, cell.column.id);
+
+        // fire onCellClick ngay lần click đầu (trước đây chỉ fire khi cell đã ở trạng thái editing)
+        if (canEdit) {
+          handleCellClick?.(rowNumber, record, columnMeta, record[rowKey], record[columnMeta.field ?? '']);
+        }
         if (editingKey) {
           setTimeout(() => {
             setEditingKey?.('');

package/lib/table-component/hook/utils.js

@@ -2625,9 +2625,8 @@ function convertColumnsToTreeData(columns, groupColumns) {
 
     // Điều kiện filter:
     // - Nếu meta.showInColumnChoose = false => loại bỏ
-    // - Nếu không nằm trong groupColumns và không phải column group => loại bỏ
-    // if (meta.showInColumnChoose === false || col.id === "selection_column") return false
-    if (meta.showInColumnChoose === false) return false;
+    // - Nếu là column đặc biệt (selection_column, #, command...) => loại bỏ
+    if (meta.showInColumnChoose === false || _hooks.nonActionColumn.includes(col.id)) return false;
     // if (inGroup && !('columns' in col && Array.isArray((col as any).columns))) {
     if (inGroup && !('columns' in col && Array.isArray(col.columns))) {
       return false;
@@ -2659,6 +2658,15 @@ const updateColumns1 = (columns, includes) => {
     if (!column.field) {
       return column;
     }
+
+    // Bỏ qua column đặc biệt (selection_column, #, command, drag-handle) — giữ nguyên visible
+    // nhưng vẫn phải đệ quy children để không bỏ sót column con
+    if (_hooks.nonActionColumn.includes(newColumn.field)) {
+      if (newColumn.children) {
+        newColumn.children = updateColumns1(newColumn.children, includes);
+      }
+      return newColumn;
+    }
     if (newColumn.children) {
       newColumn.children = updateColumns1(newColumn.children, includes);
       hasVisibleChild = newColumn.children.some(child => !child.hidden);

package/lib/table-component/table/Grid.js

@@ -114,6 +114,17 @@ const Grid = props => {
         pageSize: pagination && pagination?.pageSize ? pagination.pageSize : 20,
         ...paginationState
       } : undefined,
+      //  ...(infiniteScroll
+      // ? {}
+      // : {
+      //     pagination: {
+      //       // @ts-ignore
+      //       pageIndex: pagination?.currentPage ? pagination.currentPage - 1 : 0,
+      //       // @ts-ignore
+      //       pageSize: pagination?.pageSize ?? 20,
+      //       ...paginationState,
+      //     },
+      //   }),
       grouping,
       columnSizing,
       columnOrder,
@@ -172,8 +183,13 @@ const Grid = props => {
       return Array.isArray(row.original.children);
     },
     getExpandedRowModel: (0, _reactTable.getExpandedRowModel)(),
-    getPaginationRowModel: pagination && !infiniteScroll ? (0, _reactTable.getPaginationRowModel)() : undefined,
-    onPaginationChange: setPagination
+    ...(pagination && !infiniteScroll && {
+      getPaginationRowModel: (0, _reactTable.getPaginationRowModel)(),
+      onPaginationChange: setPagination
+    })
+
+    // getPaginationRowModel: pagination && !infiniteScroll ? getPaginationRowModel() : undefined,
+    // onPaginationChange: pagination && !infiniteScroll ? setPagination : undefined,
 
     // onColumnVisibilityChange: setColumnVisibility,
     // onColumnPinningChange,

package/lib/table-virtuoso/hook/utils.js

@@ -66,6 +66,7 @@ exports.updateColumnWidthsRecursive = updateColumnWidthsRecursive;
 exports.updateColumnsByGroup = exports.updateColumns1 = void 0;
 exports.updateOrInsert = updateOrInsert;
 exports.updateWidthsByOther = updateWidthsByOther;
+var _hooks = require("../../grid-component/hooks");
 var _useSelection = require("rc-master-ui/es/table/hooks/useSelection");
 var _uuid = require("uuid");
 var _colors = require("@ant-design/colors");
@@ -2010,8 +2011,8 @@ function convertColumnsToTreeData(columns, groupColumns) {
 
     // Điều kiện filter:
     // - Nếu meta.showInColumnChoose = false => loại bỏ
-    // - Nếu không nằm trong groupColumns và không phải column group => loại bỏ
-    if (meta.showInColumnChoose === false) return false;
+    // - Nếu là column đặc biệt (selection_column, #, command...) => loại bỏ
+    if (meta.showInColumnChoose === false || _hooks.nonActionColumn.includes(col.id)) return false;
     if (inGroup && !('columns' in col && Array.isArray(col.columns))) {
       return false;
     }
@@ -2042,6 +2043,15 @@ const updateColumns1 = (columns, includes) => {
     if (!column.field) {
       return column;
     }
+
+    // Bỏ qua column đặc biệt (selection_column, #, command, drag-handle) — giữ nguyên visible
+    // nhưng vẫn phải đệ quy children để không bỏ sót column con
+    if (_hooks.nonActionColumn.includes(newColumn.field)) {
+      if (newColumn.children) {
+        newColumn.children = updateColumns1(newColumn.children, includes);
+      }
+      return newColumn;
+    }
     if (newColumn.children) {
       newColumn.children = updateColumns1(newColumn.children, includes);
       hasVisibleChild = newColumn.children.some(child => !child.hidden);

package/lib/table-virtuoso/style.js

@@ -18,4 +18,4 @@ const colorDark = '#e6e4f3e6';
 const GridStyle = exports.GridStyle = _styledComponents.default.div.withConfig({
   displayName: "GridStyle",
   componentId: "es-grid-template__sc-rs980s-0"
-})(["&.", "-grid{color:", ";font-size:13px;background-color:", ";table{table-layout:fixed;border-collapse:separate;border-spacing:0;}.", "-grid-container{border:1px solid ", ";.", "-grid-thead{&:has(.resizer.isResizing){.", "-grid-cell{touch-action:none;user-select:none;}}.", "-grid-cell{background-color:#ffffff;&:has(.resizer.isResizing){touch-action:none;user-select:none;}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}}}tbody{.", "-grid-row{&.", "-grid-row-parent{.", "-grid-cell{font-weight:600;background-color:#f5f5f5;}}}}.", "-grid-tfoot{z-index:3 !important;.ui-rc-grid-footer-row{.ui-rc-grid-cell{border-top:1px solid ", ";border-bottom:1px solid ", ";font-weight:500;}}}.", "-grid-cell{padding:5px 8px;&.", "-grid-cell-fix-left-last{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;right:0;bottom:-1px;width:30px;transform:translateX(100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset 10px 0 8px -8px rgba(5,5,5,0.09);}}&.", "-grid-cell-fix-right-first{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;bottom:-1px;left:0;width:30px;transform:translateX(-100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset -10px 0 8px -8px rgba(5,5,5,0.09);}&::before{content:'';position:absolute;inset-block:0;inset-inline-start:-1px;border-inline-start:1px solid #e0e0e0;}}&.", "-grid-cell-ellipsis{.group-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}.class-content:has(*){background:lightblue;}.class-content:not(:has(*)){background:lightgreen;}&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-righ{text-align:right;justify-content:flex-end;}}.", "-grid-cell:not(:has(*)){&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-right{text-align:right;justify-content:flex-end;}&.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "-grid-light{.", "-grid-container{.", "-grid-thead{z-index:3 !important;background-color:", ";font-weight:500;.", "-grid-cell{font-weight:inherit;color:", ";background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-ellipsis{.ui-rc-table-column-title,.", "-grid-cell-ellipsis{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}&.ui-rc-grid-cell-wrap{.ui-rc-table-column-title,.", "-grid-cell-text-wrap{white-space:normal;word-break:break-word;overflow:hidden;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "-grid-filter-column{display:flex;justify-content:space-between;width:100%;align-items:center;position:relative;}.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}.resizer.isResizing{opacity:1;}}}.", "-grid-tbody{.", "-grid-row{background-color:", ";color:", ";}}tbody{background-color:", ";color:", ";.", "-grid-row{&.ui-rc-grid-row-selected{.", "-grid-cell{background-color:", ";}}}.", "-grid-cell{outline:none;background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-selected{background-color:", " !important;}&.disable{background-color:#f0f0f0;}&.cell-editable{user-select:none;&.cell-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-bottom{border-bottom:1px solid ", ";}&.cell-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-right{border-inline-end:1px solid ", ";}&.cell-paste-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px dashed #949494;pointer-events:none;z-index:1;}&.ui-rc-grid-cell-fix-left-last{&::after{left:-100%;}}&.ui-rc-grid-cell-fix-right-first{&::after{left:100%;}}}&.cell-paste-border-bottom{border-bottom:1px dashed #949494;}&.cell-paste-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px dashed #949494;pointer-events:none;z-index:1;}}&.cell-paste-border-right{border-inline-end:1px dashed #949494;}.dragging-point{width:6px;height:6px;position:absolute;cursor:crosshair;right:0px;bottom:0px;&.hidden{display:none;}.dot-point{position:absolute;width:6px;height:6px;border-radius:0px;background-color:", ";bottom:0;right:0;}}}&.cell-editing{padding:0;&:focus-visible{outline:none;}.ant-form-item,.ant-row.ant-form-item-row,.ant-col.ant-form-item-control,.ant-form-item-control-input,.ant-form-item-control-input-content,.ant-input{height:100% !important;&:focus-visible{outline:none;}}textarea.ant-input{line-height:1.8;height:36px !important;min-height:36px !important;}input.be-cell-editing,.ant-picker,.ui-rc-select-selector,.ui-rc-table-select-selector{padding-inline:7px;}.", "-checkbox-wrapper{.", "-checkbox{background-color:red;}.", "-checkbox-input{&:focus-visible{outline:none;}}}.ant-input,.ant-picker{border-radius:0;}.ant-color-picker-trigger{height:100%;border-radius:0;.ant-color-picker-color-block{height:100%;width:100%;}}.", "-table-select-single .", "-table-select-selector,.", "-select-single .", "-select-selector,.ui-rc-table-select-selector{border-radius:0 !important;}.", "-table-select-single:not(.", "-table-select-customize-input){.", "-table-select-selector{.", "-table-select-selection-search-input{height:auto;}}}}}}.", "-grid-tfoot{.", "-grid-footer-row{border-bottom-width:1px;border-bottom-color:", ";border-bottom-style:solid;border-top-width:1px;border-top-color:", ";border-top-style:solid;background-color:#fafafa;}.", "-grid-cell{background-color:inherit;border-inline-end:1px solid ", ";}}}}&.", "-grid-dark{background-color:", ";color:", ";.", "-grid-container{border-color:", ";&::after{border-right-color:", ";}}}}"], props => props.$prefix, color, BgColor, props => props.$prefix, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => props.$prefix, props => `${props.$theme.color ? props.$theme.color : color}`, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => props.$prefix, props => props.$prefix, rowSelectedBg, props => props.$prefix, tableBorderColor, tableBorderColor, cellSelectedBg, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, tableBorderColor, props => props.$prefix, BgColorDark, colorDark, props => props.$prefix, tableBorderColorDark, tableBorderColorDark);
+})(["&.", "-grid{color:", ";font-size:12px;background-color:", ";table{table-layout:fixed;border-collapse:separate;border-spacing:0;}.", "-grid-container{border:1px solid ", ";.", "-grid-thead{&:has(.resizer.isResizing){.", "-grid-cell{touch-action:none;user-select:none;}}.", "-grid-cell{background-color:#ffffff;&:has(.resizer.isResizing){touch-action:none;user-select:none;}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}}}tbody{.", "-grid-row{font-weight:500;&.", "-grid-row-parent{.", "-grid-cell{font-weight:700;background-color:#f5f5f5;}}}}.", "-grid-tfoot{z-index:3 !important;.ui-rc-grid-footer-row{.ui-rc-grid-cell{border-top:1px solid ", ";border-bottom:1px solid ", ";font-weight:500;}}}.", "-grid-cell{padding:5px 8px;&.", "-grid-cell-fix-left-last{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;right:0;bottom:-1px;width:30px;transform:translateX(100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset 10px 0 8px -8px rgba(5,5,5,0.09);}}&.", "-grid-cell-fix-right-first{.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&::after{position:absolute;top:0;bottom:-1px;left:0;width:30px;transform:translateX(-100%);transition:box-shadow 0.3s;content:'';pointer-events:none;box-shadow:inset -10px 0 8px -8px rgba(5,5,5,0.09);}&::before{content:'';position:absolute;inset-block:0;inset-inline-start:-1px;border-inline-start:1px solid #e0e0e0;}}&.", "-grid-cell-ellipsis{.group-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}.class-content:has(*){background:lightblue;}.class-content:not(:has(*)){background:lightgreen;}&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-righ{text-align:right;justify-content:flex-end;}}.", "-grid-cell:not(:has(*)){&.", "-grid-cell-text-center{text-align:center;justify-content:center;}&.", "-grid-cell-text-right{text-align:right;justify-content:flex-end;}&.", "-grid-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "-grid-light{.", "-grid-container{.", "-grid-thead{z-index:3 !important;background-color:", ";font-weight:600;.", "-grid-cell{font-weight:inherit;color:", ";background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-ellipsis{.ui-rc-table-column-title,.", "-grid-cell-ellipsis{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}&.ui-rc-grid-cell-wrap{.ui-rc-table-column-title,.", "-grid-cell-text-wrap{white-space:normal;word-break:break-word;overflow:hidden;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "-grid-filter-column{display:flex;justify-content:space-between;width:100%;align-items:center;position:relative;}.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}.resizer{cursor:col-resize;height:100%;position:absolute;right:0;top:0;touch-action:none;user-select:none;width:5px;}.resizer.isResizing{opacity:1;}}}.", "-grid-tbody{.", "-grid-row{background-color:", ";color:", ";}}tbody{background-color:", ";color:", ";.", "-grid-row{&.ui-rc-grid-row-selected{.", "-grid-cell{background-color:", ";}}}.", "-grid-cell{outline:none;background-color:#ffffff;border-inline-end:1px solid ", ";border-bottom:1px solid ", ";&.ui-rc-grid-cell-selected{background-color:", " !important;}&.disable{background-color:#f0f0f0;}&.cell-editable{user-select:none;&.cell-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-bottom{border-bottom:1px solid ", ";}&.cell-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px solid ", ";pointer-events:none;z-index:1;}}&.cell-border-right{border-inline-end:1px solid ", ";}&.cell-paste-border-top{&::after{content:'';position:absolute;top:0px;left:0;height:1px;width:100%;border-top:1px dashed #949494;pointer-events:none;z-index:1;}&.ui-rc-grid-cell-fix-left-last{&::after{left:-100%;}}&.ui-rc-grid-cell-fix-right-first{&::after{left:100%;}}}&.cell-paste-border-bottom{border-bottom:1px dashed #949494;}&.cell-paste-border-left{&::before{content:'';position:absolute;top:0;left:0;height:102%;width:1px;border-left:1px dashed #949494;pointer-events:none;z-index:1;}}&.cell-paste-border-right{border-inline-end:1px dashed #949494;}.dragging-point{width:6px;height:6px;position:absolute;cursor:crosshair;right:0px;bottom:0px;&.hidden{display:none;}.dot-point{position:absolute;width:6px;height:6px;border-radius:0px;background-color:", ";bottom:0;right:0;}}}&.cell-editing{padding:0;&:focus-visible{outline:none;}.ant-form-item,.ant-row.ant-form-item-row,.ant-col.ant-form-item-control,.ant-form-item-control-input,.ant-form-item-control-input-content,.ant-input{height:100% !important;&:focus-visible{outline:none;}}textarea.ant-input{line-height:1.8;height:36px !important;min-height:36px !important;}input.be-cell-editing,.ant-picker,.ui-rc-select-selector,.ui-rc-table-select-selector{padding-inline:7px;}.", "-checkbox-wrapper{.", "-checkbox{background-color:red;}.", "-checkbox-input{&:focus-visible{outline:none;}}}.ant-input,.ant-picker{border-radius:0;}.ant-color-picker-trigger{height:100%;border-radius:0;.ant-color-picker-color-block{height:100%;width:100%;}}.", "-table-select-single .", "-table-select-selector,.", "-select-single .", "-select-selector,.ui-rc-table-select-selector{border-radius:0 !important;}.", "-table-select-single:not(.", "-table-select-customize-input){.", "-table-select-selector{.", "-table-select-selection-search-input{height:auto;}}}}}}.", "-grid-tfoot{.", "-grid-footer-row{border-bottom-width:1px;border-bottom-color:", ";border-bottom-style:solid;border-top-width:1px;border-top-color:", ";border-top-style:solid;background-color:#fafafa;}.", "-grid-cell{background-color:inherit;border-inline-end:1px solid ", ";}}}}&.", "-grid-dark{background-color:", ";color:", ";.", "-grid-container{border-color:", ";&::after{border-right-color:", ";}}}}"], props => props.$prefix, color, BgColor, props => props.$prefix, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => props.$prefix, props => `${props.$theme.color ? props.$theme.color : color}`, tableBorderColor, tableBorderColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => `${props.$theme.backgroundColor ? props.$theme.backgroundColor : BgColor}`, props => `${props.$theme.color ? props.$theme.color : color}`, props => props.$prefix, props => props.$prefix, rowSelectedBg, props => props.$prefix, tableBorderColor, tableBorderColor, cellSelectedBg, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, borderSelectedColor, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, props => props.$prefix, tableBorderColor, tableBorderColor, props => props.$prefix, tableBorderColor, props => props.$prefix, BgColorDark, colorDark, props => props.$prefix, tableBorderColorDark, tableBorderColorDark);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "es-grid-template",
-  "version": "1.9.78",
+  "version": "1.9.82",
   "description": "es-grid-template",
   "keywords": [
     "react",