es-grid-template 1.8.32 → 1.8.34

package/es/table-component/TableContainerEdit.js

@@ -63,6 +63,7 @@ const TableContainerEdit = props => {
     prefix,
     commandClick,
     editAble,
+    rowEditable,
     rowKey,
     format,
     dataSource,
@@ -1835,7 +1836,8 @@ const TableContainerEdit = props => {
       windowSize,
       handleCellClick,
       pagination,
-      rowClassName
+      rowClassName,
+      rowEditable
     }
   }, /*#__PURE__*/React.createElement(TableWrapper, {
     contextMenuItems: contextMenuItems,

package/es/table-component/body/TableBodyCellEdit.d.ts

@@ -10,6 +10,7 @@ interface TableBodyCellProps<T> {
     cell: Cell<T, unknown>;
     commandClick?: (args: CommandClick<T>) => void;
     virtualRow: VirtualItem;
+    isRowEditable?: boolean;
     [key: string]: any;
 }
 declare const TableBodyCellEdit: <RecordType extends object>(props: TableBodyCellProps<RecordType>) => React.JSX.Element;

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

@@ -186,6 +186,7 @@ const TableBodyCellEdit = props => {
     // tableId,
     table,
     isEditing,
+    isRowEditable,
     columnVirtualizer,
     rowVirtualizer
     // virtualRow
@@ -242,7 +243,8 @@ const TableBodyCellEdit = props => {
 
   const rowError = dataErrors ? dataErrors.find(it => it.id === cell.row.id) : undefined;
   const message = rowError && rowError[cell.column.id]?.field === cell.column.id ? rowError[cell.column.id].message : undefined;
-  const canEdit = isEditable(cell.column.columnDef.meta, record);
+  const canEdit = isEditable(cell.column.columnDef.meta, record) && isRowEditable !== false;
+
   // const allRows = table.getRowModel().rows;
   const allRows = table.getRowModel().flatRows;
 
@@ -975,7 +977,8 @@ const TableBodyCellEdit = props => {
     className: classNames(`${prefix}-grid-cell cell-editable editable `, {
       [`${prefix}-grid-cell-ellipsis`]: true,
       'cell-editing': isEditing,
-      disable: !isEditable(cell.column.columnDef.meta, record),
+      // disable: !isEditable(cell.column.columnDef.meta as any, record),
+      disable: !canEdit,
       isValid: !isEditing && rowError && rowError[cell.column.id]?.field === cell.column.id,
       [`${prefix}-grid-cell-selected`]: isCellSelected,
       'cell-border-bottom': !isEditing && isInRange && isBottom,
@@ -1087,6 +1090,11 @@ const TableBodyCellEdit = props => {
       }
     },
     onDoubleClick: e => {
+      if (!canEdit) {
+        e.stopPropagation();
+        e.preventDefault();
+        return;
+      }
       if (!(record[rowKey] === editingKey && canEdit)) {
         handleEdit(e);
       }

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

@@ -26,7 +26,8 @@ const TableBodyRow = ({
     prefix,
     recordDoubleClick,
     focusedCell,
-    rowClassName
+    rowClassName,
+    rowEditable
   } = React.useContext(TableContext);
   const visibleCells = row.getVisibleCells();
   const virtualColumns = columnVirtualizer.getVirtualItems();
@@ -38,6 +39,7 @@ const TableBodyRow = ({
   const virtualRight = virtualPaddingRight ? [virtualPaddingRight] : [];
   const templateColumns = [...leftTemplate, ...virtualLeft, ...centerTemplate, ...virtualRight, ...rightTemplate];
   const rowClass = typeof rowClassName === 'function' ? rowClassName(row.original, row.index, row.depth) : rowClassName;
+  const isRowEditable = rowEditable ? rowEditable(row.original) : true;
   return /*#__PURE__*/React.createElement("div", {
     "data-index": virtualRow.index //needed for dynamic row height measurement
     ,
@@ -91,6 +93,7 @@ const TableBodyRow = ({
         commandClick: commandClick,
         virtualRow: virtualRow,
         isEditing: isEditing,
+        isRowEditable: isRowEditable,
         rowVirtualizer: rowVirtualizer,
         columnVirtualizer: columnVirtualizer
       }));
@@ -124,6 +127,7 @@ const TableBodyRow = ({
           cell: cell,
           commandClick: commandClick,
           isEditing: isEditing,
+          isRowEditable: isRowEditable,
           rowVirtualizer: rowVirtualizer,
           columnVirtualizer: columnVirtualizer,
           virtualRow: virtualRow
@@ -150,6 +154,7 @@ const TableBodyRow = ({
         cell: row.getVisibleCells().find(c => c.column.id === column.id),
         commandClick: commandClick,
         isEditing: isEditing,
+        isRowEditable: isRowEditable,
         rowVirtualizer: rowVirtualizer,
         columnVirtualizer: columnVirtualizer,
         virtualRow: virtualRow

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

@@ -135,7 +135,6 @@ export declare const convertToObjTrue: (arr: any) => {
     [k: string]: any;
 };
 export declare const getDiffent2Array: (a: any[], b: any[]) => any[];
-export declare function isTree(arr: any[]): boolean;
 export declare function findFirst(items: Column<any>[]): Column<any, unknown>;
 export declare function isTreeArray(arr: any[], options?: any): boolean;
 export declare function updateColumnWidthsRecursive(columns: any[], sizing: Record<string, number>): any[];

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

@@ -1902,76 +1902,69 @@ export const convertToObjTrue = arr => {
 export const getDiffent2Array = (a, b) => {
   return [...a.filter(x => !b.includes(x)), ...b.filter(x => !a.includes(x))];
 };
-export function isTree(arr) {
-  if (!Array.isArray(arr)) {
-    return false;
-  }
-  function checkNode(node) {
-    if (typeof node !== "object" || node === null) {
-      return false;
-    }
-    if ("children" in node) {
-      if (!Array.isArray(node.children)) {
-        return false;
-      }
-      if (node.children.length === 0) {
-        return false;
-      }
-      for (const child of node.children) {
-        if (!checkNode(child)) {
-          return false;
-        }
-      }
-    }
-    return true;
-  }
-  for (const item of arr) {
-    if (!checkNode(item)) return false;
-  }
-  return true;
-}
-export function findFirst(items) {
-  const leftItem = items.find(item => item.getIsPinned() === 'left');
-  if (leftItem) return leftItem;
-  return null;
-}
 
-// export function isTreeArray(arr: any[]): boolean {
+// export function isTree(arr: any[]): boolean {
+//   if (!Array.isArray(arr)){
+//     return false
+//   }
 
-// // if (!Array.isArray(arr)) return false;
+//   function checkNode(node: any): boolean {
+//     if (typeof node !== "object" || node === null) {
+//       return false
+//     }
 
-// //   return arr.every(item => {
-// //     if ("children" in item) {
-// //       return Array.isArray(item.children) && item.children.length > 0;
-// //     }
-// //     return true; // node lá thì hợp lệ
-// //   });
+//     if ("children" in node) {
 
-//  if (!Array.isArray(arr)) return false;
+//       if (!Array.isArray(node.children)) {
+//         return false
+//       }
+//       if (node.children.length === 0) {
+//         return false
+//       }
 
-//   return arr.every(item => {
-//     if (typeof item !== "object" || item === null) return false;
+//       for (const child of node.children) {
+//         if (!checkNode(child)) {
+//           return false
+//         }
+//       }
 
-//     if ("children" in item) {
-//       return Array.isArray(item.children);
 //     }
 
-//     return false; // node lá thì hợp lệ
-//   });
+//     return true;
+//   }
+
+//   for (const item of arr) {
+//     if (!checkNode(item)) return false;
+//   }
 
+//   return true;
 // }
 
+export function findFirst(items) {
+  const leftItem = items.find(item => item.getIsPinned() === 'left');
+  if (leftItem) return leftItem;
+  return null;
+}
 export function isTreeArray(arr, options) {
-  if (!Array.isArray(arr) || arr.length === 0) return false;
+  if (!Array.isArray(arr) || arr.length === 0) {
+    return false;
+  }
   const requireNonEmpty = options?.requireNonEmptyChildren ?? false;
   let hasParent = false;
   for (const item of arr) {
-    if (typeof item !== 'object' || item === null) return false;
+    if (typeof item !== 'object' || item === null) {
+      return false;
+    }
     if ('children' in item) {
       const children = item.children;
-      if (!Array.isArray(children)) return false;
+      if (!Array.isArray(children)) {
+        // return false;
+        hasParent = false;
+      }
       if (requireNonEmpty) {
-        if (children.length > 0) hasParent = true;
+        if (children.length > 0) {
+          hasParent = true;
+        }
       } else {
         hasParent = true;
       }

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

@@ -133,8 +133,8 @@ const Grid = props => {
     // ColumnSorting
     // getSortedRowModel: getSortedRowModel(),
     onSortingChange: setSorting,
-    enableMultiSort: sortMultiple,
-    isMultiSortEvent: () => sortMultiple ? true : false,
+    enableMultiSort: sortMultiple !== false,
+    isMultiSortEvent: () => sortMultiple === false ? false : true,
     enableSorting: allowSortering !== false,
     // ColumnSorting
 

package/es/table-component/useContext.d.ts

@@ -77,6 +77,7 @@ export interface IContext<T> {
     pagination?: false | PaginationConfig;
     rowClassName?: string | RowClassName<T>;
     table?: Table<T>;
+    rowEditable?: (rowData: T) => boolean;
 }
 export declare const TableContext: import("react").Context<IContext<any>>;
 export type ContextCellChange = {

package/lib/table-component/TableContainerEdit.js

@@ -70,6 +70,7 @@ const TableContainerEdit = props => {
     prefix,
     commandClick,
     editAble,
+    rowEditable,
     rowKey,
     format,
     dataSource,
@@ -1842,7 +1843,8 @@ const TableContainerEdit = props => {
       windowSize,
       handleCellClick,
       pagination,
-      rowClassName
+      rowClassName,
+      rowEditable
     }
   }, /*#__PURE__*/_react.default.createElement(_TableWrapper.default, {
     contextMenuItems: contextMenuItems,

package/lib/table-component/body/TableBodyCellEdit.d.ts

@@ -10,6 +10,7 @@ interface TableBodyCellProps<T> {
     cell: Cell<T, unknown>;
     commandClick?: (args: CommandClick<T>) => void;
     virtualRow: VirtualItem;
+    isRowEditable?: boolean;
     [key: string]: any;
 }
 declare const TableBodyCellEdit: <RecordType extends object>(props: TableBodyCellProps<RecordType>) => React.JSX.Element;

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

@@ -192,6 +192,7 @@ const TableBodyCellEdit = props => {
     // tableId,
     table,
     isEditing,
+    isRowEditable,
     columnVirtualizer,
     rowVirtualizer
     // virtualRow
@@ -248,7 +249,8 @@ const TableBodyCellEdit = props => {
 
   const rowError = dataErrors ? dataErrors.find(it => it.id === cell.row.id) : undefined;
   const message = rowError && rowError[cell.column.id]?.field === cell.column.id ? rowError[cell.column.id].message : undefined;
-  const canEdit = (0, _utils.isEditable)(cell.column.columnDef.meta, record);
+  const canEdit = (0, _utils.isEditable)(cell.column.columnDef.meta, record) && isRowEditable !== false;
+
   // const allRows = table.getRowModel().rows;
   const allRows = table.getRowModel().flatRows;
 
@@ -981,7 +983,8 @@ const TableBodyCellEdit = props => {
     className: (0, _classnames.default)(`${prefix}-grid-cell cell-editable editable `, {
       [`${prefix}-grid-cell-ellipsis`]: true,
       'cell-editing': isEditing,
-      disable: !(0, _utils.isEditable)(cell.column.columnDef.meta, record),
+      // disable: !isEditable(cell.column.columnDef.meta as any, record),
+      disable: !canEdit,
       isValid: !isEditing && rowError && rowError[cell.column.id]?.field === cell.column.id,
       [`${prefix}-grid-cell-selected`]: isCellSelected,
       'cell-border-bottom': !isEditing && isInRange && isBottom,
@@ -1093,6 +1096,11 @@ const TableBodyCellEdit = props => {
       }
     },
     onDoubleClick: e => {
+      if (!canEdit) {
+        e.stopPropagation();
+        e.preventDefault();
+        return;
+      }
       if (!(record[rowKey] === editingKey && canEdit)) {
         handleEdit(e);
       }

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

@@ -33,7 +33,8 @@ const TableBodyRow = ({
     prefix,
     recordDoubleClick,
     focusedCell,
-    rowClassName
+    rowClassName,
+    rowEditable
   } = _react.default.useContext(_useContext.TableContext);
   const visibleCells = row.getVisibleCells();
   const virtualColumns = columnVirtualizer.getVirtualItems();
@@ -45,6 +46,7 @@ const TableBodyRow = ({
   const virtualRight = virtualPaddingRight ? [virtualPaddingRight] : [];
   const templateColumns = [...leftTemplate, ...virtualLeft, ...centerTemplate, ...virtualRight, ...rightTemplate];
   const rowClass = typeof rowClassName === 'function' ? rowClassName(row.original, row.index, row.depth) : rowClassName;
+  const isRowEditable = rowEditable ? rowEditable(row.original) : true;
   return /*#__PURE__*/_react.default.createElement("div", {
     "data-index": virtualRow.index //needed for dynamic row height measurement
     ,
@@ -98,6 +100,7 @@ const TableBodyRow = ({
         commandClick: commandClick,
         virtualRow: virtualRow,
         isEditing: isEditing,
+        isRowEditable: isRowEditable,
         rowVirtualizer: rowVirtualizer,
         columnVirtualizer: columnVirtualizer
       }));
@@ -131,6 +134,7 @@ const TableBodyRow = ({
           cell: cell,
           commandClick: commandClick,
           isEditing: isEditing,
+          isRowEditable: isRowEditable,
           rowVirtualizer: rowVirtualizer,
           columnVirtualizer: columnVirtualizer,
           virtualRow: virtualRow
@@ -157,6 +161,7 @@ const TableBodyRow = ({
         cell: row.getVisibleCells().find(c => c.column.id === column.id),
         commandClick: commandClick,
         isEditing: isEditing,
+        isRowEditable: isRowEditable,
         rowVirtualizer: rowVirtualizer,
         columnVirtualizer: columnVirtualizer,
         virtualRow: virtualRow

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

@@ -135,7 +135,6 @@ export declare const convertToObjTrue: (arr: any) => {
     [k: string]: any;
 };
 export declare const getDiffent2Array: (a: any[], b: any[]) => any[];
-export declare function isTree(arr: any[]): boolean;
 export declare function findFirst(items: Column<any>[]): Column<any, unknown>;
 export declare function isTreeArray(arr: any[], options?: any): boolean;
 export declare function updateColumnWidthsRecursive(columns: any[], sizing: Record<string, number>): any[];

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

@@ -47,7 +47,6 @@ exports.isEmpty = exports.isEditable = exports.isDisable = void 0;
 exports.isEqualSet = isEqualSet;
 exports.isObjEmpty = exports.isNullOrUndefined = exports.isNameColor = exports.isFormattedNumber = void 0;
 exports.isObjEqual = isObjEqual;
-exports.isTree = isTree;
 exports.isTreeArray = isTreeArray;
 exports.parseBooleanToValue = exports.onRemoveBgSelectedCell = exports.onAddBgSelectedCell = exports.newGuid = void 0;
 exports.parseClipboardEvent = parseClipboardEvent;
@@ -2024,77 +2023,69 @@ exports.convertToObjTrue = convertToObjTrue;
 const getDiffent2Array = (a, b) => {
   return [...a.filter(x => !b.includes(x)), ...b.filter(x => !a.includes(x))];
 };
-exports.getDiffent2Array = getDiffent2Array;
-function isTree(arr) {
-  if (!Array.isArray(arr)) {
-    return false;
-  }
-  function checkNode(node) {
-    if (typeof node !== "object" || node === null) {
-      return false;
-    }
-    if ("children" in node) {
-      if (!Array.isArray(node.children)) {
-        return false;
-      }
-      if (node.children.length === 0) {
-        return false;
-      }
-      for (const child of node.children) {
-        if (!checkNode(child)) {
-          return false;
-        }
-      }
-    }
-    return true;
-  }
-  for (const item of arr) {
-    if (!checkNode(item)) return false;
-  }
-  return true;
-}
-function findFirst(items) {
-  const leftItem = items.find(item => item.getIsPinned() === 'left');
-  if (leftItem) return leftItem;
-  return null;
-}
 
-// export function isTreeArray(arr: any[]): boolean {
+// export function isTree(arr: any[]): boolean {
+//   if (!Array.isArray(arr)){
+//     return false
+//   }
 
-// // if (!Array.isArray(arr)) return false;
+//   function checkNode(node: any): boolean {
+//     if (typeof node !== "object" || node === null) {
+//       return false
+//     }
 
-// //   return arr.every(item => {
-// //     if ("children" in item) {
-// //       return Array.isArray(item.children) && item.children.length > 0;
-// //     }
-// //     return true; // node lá thì hợp lệ
-// //   });
+//     if ("children" in node) {
 
-//  if (!Array.isArray(arr)) return false;
+//       if (!Array.isArray(node.children)) {
+//         return false
+//       }
+//       if (node.children.length === 0) {
+//         return false
+//       }
 
-//   return arr.every(item => {
-//     if (typeof item !== "object" || item === null) return false;
+//       for (const child of node.children) {
+//         if (!checkNode(child)) {
+//           return false
+//         }
+//       }
 
-//     if ("children" in item) {
-//       return Array.isArray(item.children);
 //     }
 
-//     return false; // node lá thì hợp lệ
-//   });
+//     return true;
+//   }
 
-// }
+//   for (const item of arr) {
+//     if (!checkNode(item)) return false;
+//   }
 
+//   return true;
+// }
+exports.getDiffent2Array = getDiffent2Array;
+function findFirst(items) {
+  const leftItem = items.find(item => item.getIsPinned() === 'left');
+  if (leftItem) return leftItem;
+  return null;
+}
 function isTreeArray(arr, options) {
-  if (!Array.isArray(arr) || arr.length === 0) return false;
+  if (!Array.isArray(arr) || arr.length === 0) {
+    return false;
+  }
   const requireNonEmpty = options?.requireNonEmptyChildren ?? false;
   let hasParent = false;
   for (const item of arr) {
-    if (typeof item !== 'object' || item === null) return false;
+    if (typeof item !== 'object' || item === null) {
+      return false;
+    }
     if ('children' in item) {
       const children = item.children;
-      if (!Array.isArray(children)) return false;
+      if (!Array.isArray(children)) {
+        // return false;
+        hasParent = false;
+      }
       if (requireNonEmpty) {
-        if (children.length > 0) hasParent = true;
+        if (children.length > 0) {
+          hasParent = true;
+        }
       } else {
         hasParent = true;
       }

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

@@ -135,8 +135,8 @@ const Grid = props => {
     // ColumnSorting
     // getSortedRowModel: getSortedRowModel(),
     onSortingChange: setSorting,
-    enableMultiSort: sortMultiple,
-    isMultiSortEvent: () => sortMultiple ? true : false,
+    enableMultiSort: sortMultiple !== false,
+    isMultiSortEvent: () => sortMultiple === false ? false : true,
     enableSorting: allowSortering !== false,
     // ColumnSorting
 

package/lib/table-component/useContext.d.ts

@@ -77,6 +77,7 @@ export interface IContext<T> {
     pagination?: false | PaginationConfig;
     rowClassName?: string | RowClassName<T>;
     table?: Table<T>;
+    rowEditable?: (rowData: T) => boolean;
 }
 export declare const TableContext: import("react").Context<IContext<any>>;
 export type ContextCellChange = {

package/package.json

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