es-grid-template 1.8.25 → 1.8.27

package/es/table-component/TableContainerEdit.js

@@ -1164,7 +1164,7 @@ const TableContainerEdit = props => {
       // const newData = [...dataSource]
       const newData = [...originData];
       let newElement;
-      if (!record.children || record.children.length === 0) {
+      if (!record?.children || record?.children && record.children.length === 0) {
         newElement = {
           ...record,
           children: [{

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

@@ -274,6 +274,8 @@ const TableBodyCell = props => {
         // maxWidth: cell.column.getSize(),
         ...getCommonPinningStyles(cell.column)
       }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classNames('ui-rc_cell-content', {})
     }, cell.column.getIndex() === expandIconColumnIndex && isDataTree && /*#__PURE__*/React.createElement("div", {
       className: "ui-rc-table-row-expand-trigger",
       style: {
@@ -316,7 +318,7 @@ const TableBodyCell = props => {
       isDataTree,
       setExpanded,
       expandIconColumnIndex
-    }));
+    })));
   }
   return /*#__PURE__*/React.createElement("div", {
     key: cell.id,
@@ -362,8 +364,11 @@ const TableBodyCell = props => {
       if (e.target.firstChild?.clientWidth < e.target.firstChild?.scrollWidth) {
         setIsOpenTooltip(true);
       }
-    },
-    onMouseUp: () => {},
+    }
+
+    // onMouseUp={() => { }}
+    ,
+
     onKeyDown: e => {
       const flatRows = table.getRowModel().flatRows;
       if (e.key === 'ArrowDown' && rowNumber < flatRows.length - 1) {
@@ -406,12 +411,15 @@ const TableBodyCell = props => {
     onDoubleClick: () => {},
     onClick: e => {
       if (selectionSettings?.checkboxOnly !== true) {
-        cell.row.getToggleSelectedHandler()(e);
-        setIsSelectionChange({
-          isChange: true,
-          type: 'rowSelected',
-          rowData: cell.row.original
-        });
+        const isInsideCell = e.target.closest(".ui-rc-grid-cell");
+        if (isInsideCell) {
+          cell.row.getToggleSelectedHandler()(e);
+          setIsSelectionChange({
+            isChange: true,
+            type: 'rowSelected',
+            rowData: cell.row.original
+          });
+        }
       }
     }
   }, /*#__PURE__*/React.createElement("div", {

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

@@ -63,8 +63,8 @@ const TableBodyRow = ({
       // height: isEditing ? '36px' : undefined,
       gridTemplateColumns: `${templateColumns.map(n => `${n}fr`).join(" ")}`,
       // gridTemplateColumns: `repeat(${centerCOlumns.length + fixedLeftColumns.length + fixedRightColumns.length}, minmax(0, 1fr))`,
-      height: isEditing ? virtualRow.size : undefined
-      // minHeight: isEditing ? undefined : virtualRow.size
+      height: isEditing ? virtualRow.size : undefined,
+      minHeight: isEditing ? undefined : virtualRow.size
     },
     onDoubleClick: e => {
       recordDoubleClick?.({

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),
@@ -173,7 +176,7 @@ const TableHeadCell2 = props => {
           marginBottom: 8
         }
       }, renderFilter({
-        column: column,
+        column: column.columnDef,
         selectedKeys,
         setSelectedKeys
         // selectedKeys: (column.getFilterValue() ?? []) as string[],

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

@@ -213,16 +213,16 @@ export const optionFontSize = [{
   label: '48'
 }];
 
-/**
- * Sort order for BaseTable
+/**
+ * Sort order for BaseTable
  */
 const SortOrder = {
-  /**
-   * Sort data in ascending order
+  /**
+   * Sort data in ascending order
    */
   ascend: 'Ascending',
-  /**
-   * Sort data in descending order
+  /**
+   * Sort data in descending order
    */
   descend: 'Descending'
 };

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

@@ -96,7 +96,8 @@ export function convertToTanStackColumns({
       allowResizing,
       minWidth,
       template,
-      allowSorter
+      allowSorter,
+      allowFiltering
     } = col;
     const {
       children,
@@ -148,7 +149,9 @@ export function convertToTanStackColumns({
       sortDescFirst: false,
       minSize: minWidth,
       // maxSize: maxWidth,
-      enableSorting: allowSorter !== false || col.sorter !== false
+      enableSorting: allowSorter !== false || col.sorter !== false,
+      // enableColumnFilter: allowFiltering !== false && !nonActionColumn.includes(field)
+      enableColumnFilter: allowFiltering !== false
     };
     if (children) {
       // @ts-ignore

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

@@ -137,7 +137,7 @@ export declare const convertToObjTrue: (arr: 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[]): boolean;
+export declare function isTreeArray(arr: any[], options?: any): boolean;
 export declare function updateColumnWidthsRecursive(columns: any[], sizing: Record<string, number>): any[];
 export declare function updateWidthsByOther(source: any[], target: any[]): any[];
 export declare function findAllChildrenKeys2<RecordType>(data: readonly RecordType[], rowKey: any, childrenColumnName: string): Key[];

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

@@ -1935,14 +1935,49 @@ export function findFirst(items) {
   if (leftItem) return leftItem;
   return null;
 }
-export function isTreeArray(arr) {
-  if (!Array.isArray(arr)) return false;
-  return arr.every(item => {
-    if ("children" in item) {
-      return Array.isArray(item.children) && item.children.length > 0;
+
+// export function isTreeArray(arr: any[]): boolean {
+
+// // if (!Array.isArray(arr)) 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 (!Array.isArray(arr)) return false;
+
+//   return arr.every(item => {
+//     if (typeof item !== "object" || item === null) return false;
+
+//     if ("children" in item) {
+//       return Array.isArray(item.children);
+//     }
+
+//     return false; // node lá thì hợp lệ
+//   });
+
+// }
+
+export function isTreeArray(arr, options) {
+  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 ('children' in item) {
+      const children = item.children;
+      if (!Array.isArray(children)) return false;
+      if (requireNonEmpty) {
+        if (children.length > 0) hasParent = true;
+      } else {
+        hasParent = true;
+      }
     }
-    return true; // node lá thì hợp lệ
-  });
+  }
+  return hasParent;
 }
 export function updateColumnWidthsRecursive(columns, sizing) {
   return columns.map(col => {