es-grid-template 1.8.26 → 1.8.28

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

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

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

@@ -119,7 +119,8 @@ const renderSelection = args => {
         type: 'rowSelected',
         rowData: row.original
       });
-    }
+    },
+    disabled: !row.getCanSelect()
   })));
 };
 const TableBodyCell = props => {
@@ -399,7 +400,7 @@ const TableBodyCell = props => {
           cellFocus.focus();
         }
       }
-      if (e.ctrlKey && e.code === 'Space') {
+      if (e.ctrlKey && e.code === 'Space' && cell.row.getCanSelect()) {
         cell.row.getToggleSelectedHandler()(e);
         setIsSelectionChange({
           isChange: true,
@@ -410,7 +411,7 @@ const TableBodyCell = props => {
     },
     onDoubleClick: () => {},
     onClick: e => {
-      if (selectionSettings?.checkboxOnly !== true) {
+      if (selectionSettings?.checkboxOnly !== true && cell.row.getCanSelect()) {
         const isInsideCell = e.target.closest(".ui-rc-grid-cell");
         if (isInsideCell) {
           cell.row.getToggleSelectedHandler()(e);

package/es/table-component/header/TableHeadCell2.js

@@ -144,7 +144,10 @@ const TableHeadCell2 = props => {
     destroyPopupOnHide: true,
     dropdownRender: () => {
       const type = getTypeFilter(originalColumn);
-      const operatorValue = column.getFilterOperator() ?? getDefaultOperator(originalColumn);
+
+      // const operatorValue = (column.getFilterOperator() ?? getDefaultOperator(originalColumn)) as string
+
+      const operatorValue = header.column.getFilterOperator() ?? getDefaultOperator(column.columnDef?.meta ?? {});
       const operatorOptions = ['Checkbox', 'Dropdown', 'DropTree', 'CheckboxDropdown'].includes(type) ? booleanOperator : !type || type === 'Text' ? stringOperator : numberOperator;
       return /*#__PURE__*/React.createElement("div", {
         // className='ui-rc-table-filter-dropdown'
@@ -156,7 +159,7 @@ const TableHeadCell2 = props => {
           minWidth: 275,
           padding: '8px'
         }
-      }, /*#__PURE__*/React.createElement("div", null), column.meta?.showOperator !== false && column.meta?.typeFilter !== 'DateRange' && column.meta?.typeFilter !== 'NumberRange' && /*#__PURE__*/React.createElement("div", {
+      }, /*#__PURE__*/React.createElement("div", null), column.columnDef.meta?.showOperator !== false && column.columnDef.meta?.typeFilter !== 'DateRange' && column.columnDef.meta?.typeFilter !== 'NumberRange' && /*#__PURE__*/React.createElement("div", {
         className: 'mb-1'
       }, /*#__PURE__*/React.createElement(Select, {
         options: translateOption(operatorOptions, t),

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

@@ -17,7 +17,7 @@ import { arrayMove } from '@dnd-kit/sortable';
 import React from 'react';
 import TableContainer from "../TableContainer";
 import { OperatorFeature } from "../features/operator";
-import { convertFilters, convertToObjTrue, filterDataByColumns, getAllRowKey } from "../hook/utils";
+import { convertFilters, convertToObjTrue, filterDataByColumns, getAllRowKey, isObjEqual } from "../hook/utils";
 import TableContainerEdit from "../TableContainerEdit";
 const Grid = props => {
   const {
@@ -108,8 +108,15 @@ const Grid = props => {
     // RowSelection
     enableSubRowSelection: selectionSettings && selectionSettings.mode === 'checkbox' && selectionSettings.type !== 'single',
     enableMultiRowSelection: selectionSettings && (selectionSettings.mode === 'checkbox' || selectionSettings.type !== 'single'),
-    enableRowSelection: true,
+    // enableRowSelection: true,
+    enableRowSelection: row => {
+      if (selectionSettings?.getCheckboxProps) {
+        return !selectionSettings?.getCheckboxProps(row.original).disabled;
+      }
+      return true;
+    },
     onRowSelectionChange: setRowSelection,
+    // get
     // RowSelection
 
     // ColumnSizing
@@ -169,12 +176,21 @@ const Grid = props => {
 
   React.useEffect(() => {
     // if (!manualUpdate) {
-    if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isSelectionChange.isChange) {
-      setRowSelection(convertToObjTrue(mergedSelectedKeys));
-    }
+
+    const isEqual = isObjEqual(convertToObjTrue(mergedSelectedKeys), rowSelection);
+
+    // console.log('isEqual', isEqual)
+    // if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isSelectionChange.isChange) {
+    // // if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isEqual) {
+    //   setRowSelection(convertToObjTrue(mergedSelectedKeys))
 
     // }
-  }, [mergedSelectedKeys, isSelectionChange]);
+
+    if (!isEqual) {
+      // if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isEqual) {
+      setRowSelection(convertToObjTrue(mergedSelectedKeys));
+    }
+  }, [mergedSelectedKeys]);
   React.useEffect(() => {
     if (isSelectionChange.isChange) {
       // setManualUpdate(true)

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

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

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

@@ -126,7 +126,8 @@ const renderSelection = args => {
         type: 'rowSelected',
         rowData: row.original
       });
-    }
+    },
+    disabled: !row.getCanSelect()
   })));
 };
 const TableBodyCell = props => {
@@ -406,7 +407,7 @@ const TableBodyCell = props => {
           cellFocus.focus();
         }
       }
-      if (e.ctrlKey && e.code === 'Space') {
+      if (e.ctrlKey && e.code === 'Space' && cell.row.getCanSelect()) {
         cell.row.getToggleSelectedHandler()(e);
         setIsSelectionChange({
           isChange: true,
@@ -417,7 +418,7 @@ const TableBodyCell = props => {
     },
     onDoubleClick: () => {},
     onClick: e => {
-      if (selectionSettings?.checkboxOnly !== true) {
+      if (selectionSettings?.checkboxOnly !== true && cell.row.getCanSelect()) {
         const isInsideCell = e.target.closest(".ui-rc-grid-cell");
         if (isInsideCell) {
           cell.row.getToggleSelectedHandler()(e);

package/lib/table-component/header/TableHeadCell2.js

@@ -153,7 +153,10 @@ const TableHeadCell2 = props => {
     destroyPopupOnHide: true,
     dropdownRender: () => {
       const type = (0, _utils.getTypeFilter)(originalColumn);
-      const operatorValue = column.getFilterOperator() ?? (0, _utils.getDefaultOperator)(originalColumn);
+
+      // const operatorValue = (column.getFilterOperator() ?? getDefaultOperator(originalColumn)) as string
+
+      const operatorValue = header.column.getFilterOperator() ?? (0, _utils.getDefaultOperator)(column.columnDef?.meta ?? {});
       const operatorOptions = ['Checkbox', 'Dropdown', 'DropTree', 'CheckboxDropdown'].includes(type) ? _constant.booleanOperator : !type || type === 'Text' ? _constant.stringOperator : _constant.numberOperator;
       return /*#__PURE__*/_react.default.createElement("div", {
         // className='ui-rc-table-filter-dropdown'
@@ -165,7 +168,7 @@ const TableHeadCell2 = props => {
           minWidth: 275,
           padding: '8px'
         }
-      }, /*#__PURE__*/_react.default.createElement("div", null), column.meta?.showOperator !== false && column.meta?.typeFilter !== 'DateRange' && column.meta?.typeFilter !== 'NumberRange' && /*#__PURE__*/_react.default.createElement("div", {
+      }, /*#__PURE__*/_react.default.createElement("div", null), column.columnDef.meta?.showOperator !== false && column.columnDef.meta?.typeFilter !== 'DateRange' && column.columnDef.meta?.typeFilter !== 'NumberRange' && /*#__PURE__*/_react.default.createElement("div", {
         className: 'mb-1'
       }, /*#__PURE__*/_react.default.createElement(_rcMasterUi.Select, {
         options: (0, _constant.translateOption)(operatorOptions, t),

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

@@ -110,8 +110,15 @@ const Grid = props => {
     // RowSelection
     enableSubRowSelection: selectionSettings && selectionSettings.mode === 'checkbox' && selectionSettings.type !== 'single',
     enableMultiRowSelection: selectionSettings && (selectionSettings.mode === 'checkbox' || selectionSettings.type !== 'single'),
-    enableRowSelection: true,
+    // enableRowSelection: true,
+    enableRowSelection: row => {
+      if (selectionSettings?.getCheckboxProps) {
+        return !selectionSettings?.getCheckboxProps(row.original).disabled;
+      }
+      return true;
+    },
     onRowSelectionChange: setRowSelection,
+    // get
     // RowSelection
 
     // ColumnSizing
@@ -171,12 +178,21 @@ const Grid = props => {
 
   _react.default.useEffect(() => {
     // if (!manualUpdate) {
-    if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isSelectionChange.isChange) {
-      setRowSelection((0, _utils.convertToObjTrue)(mergedSelectedKeys));
-    }
+
+    const isEqual = (0, _utils.isObjEqual)((0, _utils.convertToObjTrue)(mergedSelectedKeys), rowSelection);
+
+    // console.log('isEqual', isEqual)
+    // if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isSelectionChange.isChange) {
+    // // if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isEqual) {
+    //   setRowSelection(convertToObjTrue(mergedSelectedKeys))
 
     // }
-  }, [mergedSelectedKeys, isSelectionChange]);
+
+    if (!isEqual) {
+      // if (Object.keys(rowSelection) !== Object.keys(mergedSelectedKeys) && !isEqual) {
+      setRowSelection((0, _utils.convertToObjTrue)(mergedSelectedKeys));
+    }
+  }, [mergedSelectedKeys]);
   _react.default.useEffect(() => {
     if (isSelectionChange.isChange) {
       // setManualUpdate(true)

package/package.json

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