es-grid-template 1.9.63 → 1.9.65

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

@@ -294,4 +294,402 @@ export const addRowIdArray = inputArray => {
     }
   }
   return result;
-};
+};
+export const unFlattenData = data => {
+  if (!data || data.length === 0) return [];
+  const idToNodeMap = new Map();
+  for (let index = 0; index < data.length; index += 1) {
+    const item = data[index];
+    idToNodeMap.set(item.rowId, {
+      ...item
+    });
+  }
+  const tree = [];
+  for (let index = 0; index < data.length; index += 1) {
+    const item = data[index];
+    const currentNode = idToNodeMap.get(item.rowId);
+    if (!currentNode || !item.parentId) {
+      if (currentNode) tree.push(currentNode);
+      continue;
+    }
+    const parentNode = idToNodeMap.get(item.parentId);
+    if (parentNode) {
+      const parentWithChildren = parentNode;
+      const children = parentWithChildren.children ?? (parentWithChildren.children = []);
+      children.push(currentNode);
+    } else {
+      tree.push(currentNode);
+    }
+  }
+  return tree;
+};
+export const flattenArray = arr => {
+  if (!arr) {
+    return [];
+  }
+  const result = [];
+  const pending = [...arr].reverse();
+  while (pending.length > 0) {
+    const item = pending.pop();
+    if (!item) continue;
+    const {
+      children,
+      ...rest
+    } = item;
+    result.push(rest);
+    if (Array.isArray(children)) {
+      for (let index = children.length - 1; index >= 0; index -= 1) {
+        pending.push(children[index]);
+      }
+    }
+  }
+  return result;
+};
+export function updateOrInsert1(dataArray, dataFilter) {
+  const nodesByRowId = new Map();
+  let head;
+  let tail;
+  for (const item of dataArray) {
+    const node = {
+      item,
+      next: undefined
+    };
+    if (!head) head = node;
+    if (tail) tail.next = node;
+    tail = node;
+
+    // Preserve findIndex semantics when duplicate rowId values exist.
+    if (!nodesByRowId.has(item.rowId)) {
+      nodesByRowId.set(item.rowId, node);
+    }
+  }
+  for (let index = 0; index < dataFilter.length; index += 1) {
+    const filterItem = dataFilter[index];
+    const existingNode = nodesByRowId.get(filterItem.rowId);
+    if (existingNode) {
+      existingNode.item = {
+        ...existingNode.item,
+        ...filterItem
+      };
+      continue;
+    }
+    const node = {
+      item: filterItem,
+      next: undefined
+    };
+    nodesByRowId.set(filterItem.rowId, node);
+    const previousItem = dataFilter[index - 1];
+    const previousNode = previousItem ? nodesByRowId.get(previousItem.rowId) : undefined;
+    if (previousNode) {
+      node.next = previousNode.next;
+      previousNode.next = node;
+      if (tail === previousNode) tail = node;
+    } else {
+      if (tail) tail.next = node;else head = node;
+      tail = node;
+    }
+  }
+  const result = [];
+  let current = head;
+  while (current) {
+    result.push(current.item);
+    current = current.next;
+  }
+  return result;
+}
+
+// export const addRowIdArray = (inputArray: any[]) => {
+//   if (!inputArray || inputArray.length === 0) return []
+
+//   const result = new Array<any>(inputArray.length)
+//   const pending: { source: any, target: any[], index: number, parentId?: any }[] = []
+
+//   for (let index = inputArray.length - 1; index >= 0; index -= 1) {
+//     pending.push({ source: inputArray[index], target: result, index })
+//   }
+
+//   while (pending.length > 0) {
+//     const { source, target, index, parentId } = pending.pop() as {
+//       source: any
+//       target: any[]
+//       index: number
+//       parentId?: any
+//     }
+
+//     const rowId = source.id ?? source.rowId ?? newGuid()
+//     const node = {
+//       ...source,
+//       rowId,
+//       ...(parentId !== undefined && source.parentId == null ? { parentId } : {})
+//     }
+//     target[index] = node
+
+//     if (Array.isArray(source.children) && source.children.length > 0) {
+//       const children = new Array<any>(source.children.length)
+//       node.children = children
+
+//       for (let childIndex = source.children.length - 1; childIndex >= 0; childIndex -= 1) {
+//         pending.push({
+//           source: source.children[childIndex],
+//           target: children,
+//           index: childIndex,
+//           parentId: rowId
+//         })
+//       }
+//     }
+//   }
+
+//   return result
+// }
+
+export function updateOrInsert3(dataArray, dataFilter) {
+  const dataLength = dataArray.length;
+  const filterLength = dataFilter.length;
+
+  // rowId -> index trong data
+  const indexByRowId = new Map();
+
+  // next[index] = index tiếp theo
+  // -1 = không có next
+  const next = new Int32Array(dataLength + filterLength);
+  next.fill(-1);
+
+  // Data hiện tại
+  const items = new Array(dataLength + filterLength);
+  let head = dataLength > 0 ? 0 : -1;
+  let tail = dataLength - 1;
+  for (let i = 0; i < dataLength; i++) {
+    const item = dataArray[i];
+    items[i] = item;
+
+    // Preserve findIndex semantics:
+    // duplicate rowId -> giữ item đầu tiên
+    if (!indexByRowId.has(item.rowId)) {
+      indexByRowId.set(item.rowId, i);
+    }
+    if (i > 0) {
+      next[i - 1] = i;
+    }
+  }
+  let size = dataLength;
+  for (let i = 0; i < filterLength; i++) {
+    const filterItem = dataFilter[i];
+    const rowId = filterItem.rowId;
+    const existingIndex = indexByRowId.get(rowId);
+
+    // =========================
+    // UPDATE
+    // =========================
+    if (existingIndex !== undefined) {
+      const existingItem = items[existingIndex];
+
+      // Nếu chấp nhận mutate object -> nhanh nhất
+      Object.assign(existingItem, filterItem);
+      continue;
+    }
+
+    // =========================
+    // INSERT
+    // =========================
+    const newIndex = size++;
+    items[newIndex] = filterItem;
+    next[newIndex] = -1;
+    indexByRowId.set(rowId, newIndex);
+
+    // previous item trong dataFilter
+    const previousItem = dataFilter[i - 1];
+    if (previousItem) {
+      const previousIndex = indexByRowId.get(previousItem.rowId);
+      if (previousIndex !== undefined) {
+        next[newIndex] = next[previousIndex];
+        next[previousIndex] = newIndex;
+        if (tail === previousIndex) {
+          tail = newIndex;
+        }
+        continue;
+      }
+    }
+
+    // Không có previous -> append cuối
+    if (tail !== -1) {
+      next[tail] = newIndex;
+    } else {
+      head = newIndex;
+    }
+    tail = newIndex;
+  }
+
+  // =========================
+  // BUILD RESULT
+  // =========================
+  const result = new Array(size);
+  let current = head;
+  let resultIndex = 0;
+  while (current !== -1) {
+    result[resultIndex++] = items[current];
+    current = next[current];
+  }
+  return result;
+}
+export function updateOrInsert(dataArray, dataFilter) {
+  const dataLength = dataArray.length;
+  const filterLength = dataFilter.length;
+  if (filterLength === 0) {
+    return dataArray;
+  }
+
+  // =========================================================
+  // Fast lookup bằng Map
+  // =========================================================
+
+  const indexByRowId = new Map();
+  for (let i = 0; i < dataLength; i++) {
+    const rowId = dataArray[i].rowId;
+    if (!indexByRowId.has(rowId)) {
+      indexByRowId.set(rowId, i);
+    }
+  }
+
+  // =========================================================
+  // Xác định update + insert
+  // =========================================================
+
+  const inserted = new Map();
+  for (let i = 0; i < filterLength; i++) {
+    const item = dataFilter[i];
+    const rowId = item.rowId;
+    const index = indexByRowId.get(rowId);
+    if (index !== undefined) {
+      // UPDATE trực tiếp
+      Object.assign(dataArray[index], item);
+    } else {
+      inserted.set(rowId, item);
+    }
+  }
+
+  // Không insert
+  if (inserted.size === 0) {
+    return dataArray;
+  }
+
+  // =========================================================
+  // Build insertion map
+  // =========================================================
+
+  const insertAfter = new Map();
+  let pending = [];
+  for (let i = 0; i < filterLength; i++) {
+    const item = dataFilter[i];
+    const rowId = item.rowId;
+    if (!inserted.has(rowId)) {
+      pending = [];
+      continue;
+    }
+    pending.push(item);
+    const previous = i > 0 ? dataFilter[i - 1] : undefined;
+    if (previous) {
+      const previousId = previous.rowId;
+      let list = insertAfter.get(previousId);
+      if (!list) {
+        list = [];
+        insertAfter.set(previousId, list);
+      }
+      list.push(item);
+      pending = [];
+    }
+  }
+
+  // =========================================================
+  // Build result 1 lần
+  // =========================================================
+
+  const result = new Array(dataLength + inserted.size);
+  let resultIndex = 0;
+  for (let i = 0; i < dataLength; i++) {
+    const item = dataArray[i];
+    result[resultIndex++] = item;
+    const rows = insertAfter.get(item.rowId);
+    if (rows) {
+      for (let j = 0; j < rows.length; j++) {
+        result[resultIndex++] = rows[j];
+      }
+    }
+  }
+  return result;
+}
+export function filterVisibleColumns(columns) {
+  let changed = false;
+  const result = [];
+  for (const column of columns) {
+    if (column.visible === false) {
+      changed = true;
+      continue;
+    }
+    if (column.children?.length) {
+      const children = filterVisibleColumns(column.children);
+      if (children !== column.children) {
+        changed = true;
+        result.push({
+          ...column,
+          children
+        });
+      } else {
+        result.push(column);
+      }
+    } else {
+      result.push(column);
+    }
+  }
+  return changed ? result : columns;
+}
+
+// Sorting function
+export const sortByType = (arr, rowDnd) => {
+  const colDnd = {
+    field: 'drag-handle',
+    width: 50,
+    fixed: 'left',
+    headerText: '',
+    allowFiltering: false,
+    allowResizing: false,
+    allowSortering: false
+  };
+  const cols = rowDnd?.enabled ? [{
+    ...colDnd
+  }, ...arr] : [...arr];
+
+  // const visibleColumns = filterVisibleColumns(cols)
+
+  if (cols) {
+    return cols.sort((a, b) => {
+      if ((a.fixed ?? a.fixedType) === 'left' && (b.fixed ?? b.fixedType) !== 'left') {
+        return -1;
+      } else if ((a.fixed ?? a.fixedType) !== 'left' && (b.fixed ?? b.fixedType) === 'left') {
+        return 1;
+      } else if ((a.fixed ?? a.fixedType) === 'right' && (b.fixed ?? b.fixedType) !== 'right') {
+        return 1;
+      } else if ((a.fixed ?? a.fixedType) !== 'right' && (b.fixed ?? b.fixedType) === 'right') {
+        return -1;
+      }
+      return 0;
+    });
+  } else {
+    return [];
+  }
+};
+export function getVisibleColumnFields(columns) {
+  const result = [];
+  const traverse = items => {
+    for (const column of items) {
+      if (column?.visible === false) continue;
+      if (column.field) {
+        result.push(column.field);
+      }
+      if (column.children && column.children?.length) {
+        traverse(column.children);
+      }
+    }
+  };
+  traverse(columns);
+  return result;
+}

package/es/grid-component/type.d.ts

@@ -825,8 +825,8 @@ export type RangeState = {
     endRowIndex: number | undefined;
     startColIndex: number | undefined;
     endColIndex: number | undefined;
-    rowIds: string[];
-    colIds: string[];
+    rowIds?: string[];
+    colIds?: string[];
     type?: any;
 };
 export type Sorter = {

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, "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">);
     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, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
     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/table-component/InternalTable.js

@@ -165,9 +165,17 @@ const InternalTable = props => {
     selectedRowKeys,
     defaultSelectedRowKeys
   } = selectionSettings ?? {};
-  const [mergedSelectedKeys] = useMergedState(selectedRowKeys || defaultSelectedRowKeys || [], {
-    value: selectedRowKeys
-  });
+
+  // const [mergedSelectedKeys] = useMergedState(
+  //   selectedRowKeys || defaultSelectedRowKeys || [],
+  //   {
+  //     value: selectedRowKeys,
+  //   },
+  // );
+
+  const mergedSelectedKeys = React.useMemo(() => {
+    return selectedRowKeys ?? defaultSelectedRowKeys ?? [];
+  }, [defaultSelectedRowKeys, selectedRowKeys]);
   const mergedData = React.useMemo(() => {
     return filterDataByColumns(convertData, onFilter ? undefined : filterStates ?? defaultFilter, onSorter ? undefined : sorterStates ?? defaultSorter, mergedFilterKeys, ignoreAccents);
   }, [convertData, filterStates, mergedFilterKeys, sorterStates, ignoreAccents, defaultFilter, defaultSorter, onFilter, onSorter]);