@umodeapporg/ui 0.1.0

package/dist/components/UI/DataTable/useColumnOrder.d.ts

@@ -0,0 +1,25 @@
+import { Updater } from '@tanstack/react-table';
+import { IDataTableColumnConfig, IDataTableConfig, IDataTableRow } from './types';
+export declare const getFixedEndColumns: <T extends IDataTableRow>(columns: Array<IDataTableColumnConfig<T>>) => Array<IDataTableColumnConfig<T>>;
+export declare const getFixedStartColumns: <T extends IDataTableRow>(columns: Array<IDataTableColumnConfig<T>>) => Array<IDataTableColumnConfig<T>>;
+export declare const getReorderableColumns: <T extends IDataTableRow>(columns: Array<IDataTableColumnConfig<T>>) => Array<IDataTableColumnConfig<T>>;
+export declare const resolveColumnOrder: <R extends IDataTableRow>(storageKey: string, columns: Array<IDataTableColumnConfig<R>>) => Array<string>;
+interface IUseColumnOrderResult {
+    columnOrder: Array<string>;
+    onColumnOrderChange: (updater: Updater<Array<string>>) => void;
+    resetColumnOrder: () => void;
+}
+export declare const useColumnOrder: <T extends IDataTableRow, C extends IDataTableRow = IDataTableRow>(config: IDataTableConfig<T, C>) => IUseColumnOrderResult;
+interface IUseDetailColumnOrderResult {
+    detailColumnOrder: Array<string>;
+    onDetailColumnOrderChange: (updater: Updater<Array<string>>) => void;
+    resetDetailColumnOrder: () => void;
+}
+/**
+ * Column order for the nested detail table of a `detailTable` expansion.
+ * Same reconcile/persist semantics as the parent order, stored under the
+ * detail entry (`${entityKey}:detail`). Pass `null` columns for tables without
+ * a detailTable expansion: the hook is inert then.
+ */
+export declare const useDetailColumnOrder: <C extends IDataTableRow>(entityKey: string, columns: Array<IDataTableColumnConfig<C>> | null) => IUseDetailColumnOrderResult;
+export {};

package/dist/components/UI/DataTable/useColumnOrder.js

@@ -0,0 +1,94 @@
+import { useState, useEffect } from "react";
+import { readColumnsEntry, writeColumnsEntry, detailColumnsEntryKey } from "./dataTableColumnsStore.js";
+const getFixedEndColumns = (columns) => (columns ?? []).filter((column) => column.type === "actions");
+const getFixedStartColumns = (columns) => (columns ?? []).filter((column) => column.type !== "actions" && column.hideable === false);
+const getReorderableColumns = (columns) => (columns ?? []).filter((column) => column.type !== "actions" && column.hideable !== false);
+const mergeReorderableOrder = (reorderableIds, persistedIds) => {
+  const defaultIndexById = new Map(reorderableIds.map((id, index) => [id, index]));
+  const result = persistedIds.filter((id) => defaultIndexById.has(id));
+  const persistedSet = new Set(result);
+  for (const id of reorderableIds) {
+    if (persistedSet.has(id)) continue;
+    const defaultIndex = defaultIndexById.get(id) ?? 0;
+    const insertAt = result.findIndex((existingId) => (defaultIndexById.get(existingId) ?? 0) > defaultIndex);
+    if (insertAt === -1) result.push(id);
+    else result.splice(insertAt, 0, id);
+  }
+  return result;
+};
+const buildDefaultColumnOrder = (columns) => [
+  ...getFixedStartColumns(columns).map((column) => column.id),
+  ...getReorderableColumns(columns).map((column) => column.id),
+  ...getFixedEndColumns(columns).map((column) => column.id)
+];
+const resolveColumnOrder = (storageKey, columns) => {
+  const reorderableIds = getReorderableColumns(columns).map((column) => column.id);
+  const persisted = readColumnsEntry(storageKey).order;
+  const mergedReorderable = persisted ? mergeReorderableOrder(reorderableIds, persisted) : reorderableIds;
+  return [
+    ...getFixedStartColumns(columns).map((column) => column.id),
+    ...mergedReorderable,
+    ...getFixedEndColumns(columns).map((column) => column.id)
+  ];
+};
+const reconcileColumnOrder = (previous, columns) => {
+  const reorderableIds = getReorderableColumns(columns).map((column) => column.id);
+  const reorderableIdSet = new Set(reorderableIds);
+  const previousReorderable = previous.filter((id) => reorderableIdSet.has(id));
+  const next = [
+    ...getFixedStartColumns(columns).map((column) => column.id),
+    ...mergeReorderableOrder(reorderableIds, previousReorderable),
+    ...getFixedEndColumns(columns).map((column) => column.id)
+  ];
+  return next.length === previous.length && next.every((id, index) => id === previous[index]) ? previous : next;
+};
+const useColumnOrder = (config) => {
+  const [columnOrder, setColumnOrder] = useState(
+    () => resolveColumnOrder(config.entityKey, config.columns)
+  );
+  const onColumnOrderChange = (updater) => {
+    setColumnOrder((previous) => typeof updater === "function" ? updater(previous) : updater);
+  };
+  const resetColumnOrder = () => {
+    setColumnOrder(buildDefaultColumnOrder(config.columns));
+  };
+  const columnIdsSignature = config.columns.map((column) => column.id).join("|");
+  useEffect(() => {
+    setColumnOrder((previous) => reconcileColumnOrder(previous, config.columns));
+  }, [columnIdsSignature]);
+  useEffect(() => {
+    writeColumnsEntry(config.entityKey, { order: columnOrder });
+  }, [config.entityKey, columnOrder]);
+  return { columnOrder, onColumnOrderChange, resetColumnOrder };
+};
+const useDetailColumnOrder = (entityKey, columns) => {
+  const [detailColumnOrder, setDetailColumnOrder] = useState(
+    () => columns ? resolveColumnOrder(detailColumnsEntryKey(entityKey), columns) : []
+  );
+  const onDetailColumnOrderChange = (updater) => {
+    setDetailColumnOrder((previous) => typeof updater === "function" ? updater(previous) : updater);
+  };
+  const resetDetailColumnOrder = () => {
+    if (columns) setDetailColumnOrder(buildDefaultColumnOrder(columns));
+  };
+  const hasDetailColumns = !!columns;
+  const detailColumnIdsSignature = (columns ?? []).map((column) => column.id).join("|");
+  useEffect(() => {
+    if (!columns) return;
+    setDetailColumnOrder((previous) => reconcileColumnOrder(previous, columns));
+  }, [detailColumnIdsSignature, hasDetailColumns]);
+  useEffect(() => {
+    if (!hasDetailColumns) return;
+    writeColumnsEntry(detailColumnsEntryKey(entityKey), { order: detailColumnOrder });
+  }, [entityKey, hasDetailColumns, detailColumnOrder]);
+  return { detailColumnOrder, onDetailColumnOrderChange, resetDetailColumnOrder };
+};
+export {
+  getFixedEndColumns,
+  getFixedStartColumns,
+  getReorderableColumns,
+  resolveColumnOrder,
+  useColumnOrder,
+  useDetailColumnOrder
+};
+//# sourceMappingURL=useColumnOrder.js.map

package/dist/components/UI/DataTable/useColumnOrder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useColumnOrder.js","sources":["../../../../src/components/UI/DataTable/useColumnOrder.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { Updater } from '@tanstack/react-table';\n\nimport { detailColumnsEntryKey, readColumnsEntry, writeColumnsEntry } from './dataTableColumnsStore';\nimport type { IDataTableColumnConfig, IDataTableConfig, IDataTableRow } from './types';\n\n// Fixed columns never enter the drag list. Identity/first columns (`hideable:\n// false`) stay pinned to the start; the `actions` column stays pinned to the\n// end. Only the middle columns are reorderable. `actions` is checked first so a\n// column that is both non-hideable and `actions` lands at the end, not the start.\nexport const getFixedEndColumns = <T extends IDataTableRow>(\n  columns: Array<IDataTableColumnConfig<T>>,\n): Array<IDataTableColumnConfig<T>> => (columns ?? []).filter((column) => column.type === 'actions');\n\nexport const getFixedStartColumns = <T extends IDataTableRow>(\n  columns: Array<IDataTableColumnConfig<T>>,\n): Array<IDataTableColumnConfig<T>> =>\n  (columns ?? []).filter((column) => column.type !== 'actions' && column.hideable === false);\n\nexport const getReorderableColumns = <T extends IDataTableRow>(\n  columns: Array<IDataTableColumnConfig<T>>,\n): Array<IDataTableColumnConfig<T>> =>\n  (columns ?? []).filter((column) => column.type !== 'actions' && column.hideable !== false);\n\n// Reconcile the persisted reorderable ids with the current config:\n// - keep saved ids that are still reorderable, in the saved order;\n// - drop obsolete ids silently (they are absent from the current config);\n// - insert reorderable ids missing from persistence at their default config\n//   position (relative to the other reorderable columns).\nconst mergeReorderableOrder = (reorderableIds: Array<string>, persistedIds: Array<string>): Array<string> => {\n  const defaultIndexById = new Map(reorderableIds.map((id, index) => [id, index]));\n\n  const result = persistedIds.filter((id) => defaultIndexById.has(id));\n  const persistedSet = new Set(result);\n\n  for (const id of reorderableIds) {\n    if (persistedSet.has(id)) continue;\n\n    const defaultIndex = defaultIndexById.get(id) ?? 0;\n    const insertAt = result.findIndex((existingId) => (defaultIndexById.get(existingId) ?? 0) > defaultIndex);\n\n    if (insertAt === -1) result.push(id);\n    else result.splice(insertAt, 0, id);\n  }\n\n  return result;\n};\n\nconst buildDefaultColumnOrder = <R extends IDataTableRow>(columns: Array<IDataTableColumnConfig<R>>): Array<string> => [\n  ...getFixedStartColumns(columns).map((column) => column.id),\n  ...getReorderableColumns(columns).map((column) => column.id),\n  ...getFixedEndColumns(columns).map((column) => column.id),\n];\n\n// Full column order = fixed start + (persisted-merged) reorderable + fixed end.\n// Fixed columns are always re-anchored from the current config, so a column that\n// changed to fixed since the order was saved lands in the right bucket.\nexport const resolveColumnOrder = <R extends IDataTableRow>(\n  storageKey: string,\n  columns: Array<IDataTableColumnConfig<R>>,\n): Array<string> => {\n  const reorderableIds = getReorderableColumns(columns).map((column) => column.id);\n  const persisted = readColumnsEntry(storageKey).order;\n  const mergedReorderable = persisted ? mergeReorderableOrder(reorderableIds, persisted) : reorderableIds;\n\n  return [\n    ...getFixedStartColumns(columns).map((column) => column.id),\n    ...mergedReorderable,\n    ...getFixedEndColumns(columns).map((column) => column.id),\n  ];\n};\n\ninterface IUseColumnOrderResult {\n  columnOrder: Array<string>;\n  onColumnOrderChange: (updater: Updater<Array<string>>) => void;\n  resetColumnOrder: () => void;\n}\n\n// Reconcile a stateful order with the CURRENT config columns. Columns that\n// appeared since the state was built (async/dynamic columns) land at their\n// config position instead of being appended by TanStack; columns that left are\n// dropped; the user's order of surviving reorderable columns is preserved.\n// Returns the previous array identity when nothing changed, so the sync effect\n// below never loops.\nconst reconcileColumnOrder = <R extends IDataTableRow>(\n  previous: Array<string>,\n  columns: Array<IDataTableColumnConfig<R>>,\n): Array<string> => {\n  const reorderableIds = getReorderableColumns(columns).map((column) => column.id);\n  const reorderableIdSet = new Set(reorderableIds);\n  const previousReorderable = previous.filter((id) => reorderableIdSet.has(id));\n\n  const next = [\n    ...getFixedStartColumns(columns).map((column) => column.id),\n    ...mergeReorderableOrder(reorderableIds, previousReorderable),\n    ...getFixedEndColumns(columns).map((column) => column.id),\n  ];\n\n  return next.length === previous.length && next.every((id, index) => id === previous[index]) ? previous : next;\n};\n\nexport const useColumnOrder = <T extends IDataTableRow, C extends IDataTableRow = IDataTableRow>(\n  config: IDataTableConfig<T, C>,\n): IUseColumnOrderResult => {\n  const [columnOrder, setColumnOrder] = useState<Array<string>>(() =>\n    resolveColumnOrder(config.entityKey, config.columns),\n  );\n\n  const onColumnOrderChange = (updater: Updater<Array<string>>) => {\n    setColumnOrder((previous) => (typeof updater === 'function' ? updater(previous) : updater));\n  };\n\n  const resetColumnOrder = () => {\n    setColumnOrder(buildDefaultColumnOrder(config.columns));\n  };\n\n  // Config columns can change while mounted (columns fetched async, dynamic\n  // catalogs). Re-anchor the order so new ids take their config position.\n  const columnIdsSignature = config.columns.map((column) => column.id).join('|');\n  useEffect(() => {\n    setColumnOrder((previous) => reconcileColumnOrder(previous, config.columns));\n  }, [columnIdsSignature]);\n\n  useEffect(() => {\n    writeColumnsEntry(config.entityKey, { order: columnOrder });\n  }, [config.entityKey, columnOrder]);\n\n  return { columnOrder, onColumnOrderChange, resetColumnOrder };\n};\n\ninterface IUseDetailColumnOrderResult {\n  detailColumnOrder: Array<string>;\n  onDetailColumnOrderChange: (updater: Updater<Array<string>>) => void;\n  resetDetailColumnOrder: () => void;\n}\n\n/**\n * Column order for the nested detail table of a `detailTable` expansion.\n * Same reconcile/persist semantics as the parent order, stored under the\n * detail entry (`${entityKey}:detail`). Pass `null` columns for tables without\n * a detailTable expansion: the hook is inert then.\n */\nexport const useDetailColumnOrder = <C extends IDataTableRow>(\n  entityKey: string,\n  columns: Array<IDataTableColumnConfig<C>> | null,\n): IUseDetailColumnOrderResult => {\n  const [detailColumnOrder, setDetailColumnOrder] = useState<Array<string>>(() =>\n    columns ? resolveColumnOrder(detailColumnsEntryKey(entityKey), columns) : [],\n  );\n\n  const onDetailColumnOrderChange = (updater: Updater<Array<string>>) => {\n    setDetailColumnOrder((previous) => (typeof updater === 'function' ? updater(previous) : updater));\n  };\n\n  const resetDetailColumnOrder = () => {\n    if (columns) setDetailColumnOrder(buildDefaultColumnOrder(columns));\n  };\n\n  const hasDetailColumns = !!columns;\n\n  // Same re-anchoring as the parent order when the detail columns change while mounted.\n  const detailColumnIdsSignature = (columns ?? []).map((column) => column.id).join('|');\n  useEffect(() => {\n    if (!columns) return;\n    setDetailColumnOrder((previous) => reconcileColumnOrder(previous, columns));\n  }, [detailColumnIdsSignature, hasDetailColumns]);\n\n  useEffect(() => {\n    if (!hasDetailColumns) return;\n    writeColumnsEntry(detailColumnsEntryKey(entityKey), { order: detailColumnOrder });\n  }, [entityKey, hasDetailColumns, detailColumnOrder]);\n\n  return { detailColumnOrder, onDetailColumnOrderChange, resetDetailColumnOrder };\n};\n"],"names":[],"mappings":"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"}

package/dist/components/UI/DataTable/useColumnSizing.d.ts

@@ -0,0 +1,9 @@
+import { ColumnSizingState, Updater } from '@tanstack/react-table';
+import { IDataTableConfig, IDataTableRow } from './types';
+interface IUseColumnSizingResult {
+    columnSizing: ColumnSizingState;
+    onColumnSizingChange: (updater: Updater<ColumnSizingState>) => void;
+    resetColumnSizing: () => void;
+}
+export declare const useColumnSizing: <T extends IDataTableRow, C extends IDataTableRow = IDataTableRow>(config: IDataTableConfig<T, C>) => IUseColumnSizingResult;
+export {};

package/dist/components/UI/DataTable/useColumnSizing.js

@@ -0,0 +1,21 @@
+import { useState, useEffect } from "react";
+import { readColumnsEntry, writeColumnsEntry } from "./dataTableColumnsStore.js";
+const useColumnSizing = (config) => {
+  const [columnSizing, setColumnSizing] = useState(
+    () => readColumnsEntry(config.entityKey).sizing ?? {}
+  );
+  const onColumnSizingChange = (updater) => {
+    setColumnSizing((previous) => typeof updater === "function" ? updater(previous) : updater);
+  };
+  const resetColumnSizing = () => {
+    setColumnSizing({});
+  };
+  useEffect(() => {
+    writeColumnsEntry(config.entityKey, { sizing: columnSizing });
+  }, [config.entityKey, columnSizing]);
+  return { columnSizing, onColumnSizingChange, resetColumnSizing };
+};
+export {
+  useColumnSizing
+};
+//# sourceMappingURL=useColumnSizing.js.map

package/dist/components/UI/DataTable/useColumnSizing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useColumnSizing.js","sources":["../../../../src/components/UI/DataTable/useColumnSizing.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { ColumnSizingState, Updater } from '@tanstack/react-table';\n\nimport { readColumnsEntry, writeColumnsEntry } from './dataTableColumnsStore';\nimport type { IDataTableConfig, IDataTableRow } from './types';\n\ninterface IUseColumnSizingResult {\n  columnSizing: ColumnSizingState;\n  onColumnSizingChange: (updater: Updater<ColumnSizingState>) => void;\n  resetColumnSizing: () => void;\n}\n\n// An empty sizing map means \"use the seeded default widths\", so appearance is\n// preserved until the user drags a column edge. Persisted widths (per column id)\n// override the seed. Mirrors useColumnVisibility/useColumnOrder: state seeded\n// from the shared columns entry and written back on every change.\nexport const useColumnSizing = <T extends IDataTableRow, C extends IDataTableRow = IDataTableRow>(\n  config: IDataTableConfig<T, C>,\n): IUseColumnSizingResult => {\n  const [columnSizing, setColumnSizing] = useState<ColumnSizingState>(\n    () => readColumnsEntry(config.entityKey).sizing ?? {},\n  );\n\n  const onColumnSizingChange = (updater: Updater<ColumnSizingState>) => {\n    setColumnSizing((previous) => (typeof updater === 'function' ? updater(previous) : updater));\n  };\n\n  const resetColumnSizing = () => {\n    setColumnSizing({});\n  };\n\n  useEffect(() => {\n    writeColumnsEntry(config.entityKey, { sizing: columnSizing });\n  }, [config.entityKey, columnSizing]);\n\n  return { columnSizing, onColumnSizingChange, resetColumnSizing };\n};\n"],"names":[],"mappings":";;AAiBO,MAAM,kBAAkB,CAC7B,WAC2B;AAC3B,QAAM,CAAC,cAAc,eAAe,IAAI;AAAA,IACtC,MAAM,iBAAiB,OAAO,SAAS,EAAE,UAAU,CAAA;AAAA,EAAC;AAGtD,QAAM,uBAAuB,CAAC,YAAwC;AACpE,oBAAgB,CAAC,aAAc,OAAO,YAAY,aAAa,QAAQ,QAAQ,IAAI,OAAQ;AAAA,EAC7F;AAEA,QAAM,oBAAoB,MAAM;AAC9B,oBAAgB,CAAA,CAAE;AAAA,EACpB;AAEA,YAAU,MAAM;AACd,sBAAkB,OAAO,WAAW,EAAE,QAAQ,cAAc;AAAA,EAC9D,GAAG,CAAC,OAAO,WAAW,YAAY,CAAC;AAEnC,SAAO,EAAE,cAAc,sBAAsB,kBAAA;AAC/C;"}

package/dist/components/UI/DataTable/useColumnVisibility.d.ts

@@ -0,0 +1,19 @@
+import { Updater, VisibilityState } from '@tanstack/react-table';
+import { IDataTableColumnConfig, IDataTableConfig, IDataTableRow } from './types';
+interface IUseColumnVisibilityResult {
+    columnVisibility: VisibilityState;
+    onColumnVisibilityChange: (updater: Updater<VisibilityState>) => void;
+}
+export declare const useColumnVisibility: <T extends IDataTableRow, C extends IDataTableRow = IDataTableRow>(config: IDataTableConfig<T, C>) => IUseColumnVisibilityResult;
+interface IUseDetailColumnVisibilityResult {
+    detailColumnVisibility: VisibilityState;
+    toggleDetailColumn: (columnId: string) => void;
+}
+/**
+ * Visibility state for the nested detail table of a `detailTable` expansion.
+ * Lives at the DataTable level (not per expanded row) so every open detail
+ * table shares one state and one persisted entry. Pass `null` columns for
+ * tables without a detailTable expansion: the hook is inert then.
+ */
+export declare const useDetailColumnVisibility: <C extends IDataTableRow>(entityKey: string, columns: Array<IDataTableColumnConfig<C>> | null) => IUseDetailColumnVisibilityResult;
+export {};

package/dist/components/UI/DataTable/useColumnVisibility.js

@@ -0,0 +1,47 @@
+import { useState, useEffect } from "react";
+import { writeColumnsEntry, detailColumnsEntryKey, readColumnsEntry } from "./dataTableColumnsStore.js";
+const resolveInitialColumnVisibility = (storageKey, columns) => {
+  const visibility = {};
+  for (const column of columns) {
+    if (column.hideable === false) continue;
+    if (column.defaultHidden) visibility[column.id] = false;
+  }
+  const persisted = readColumnsEntry(storageKey).visibility;
+  if (!persisted) return visibility;
+  for (const column of columns) {
+    if (column.hideable === false) continue;
+    if (typeof persisted[column.id] === "boolean") visibility[column.id] = persisted[column.id];
+  }
+  return visibility;
+};
+const useColumnVisibility = (config) => {
+  const [columnVisibility, setColumnVisibility] = useState(
+    () => resolveInitialColumnVisibility(config.entityKey, config.columns)
+  );
+  const onColumnVisibilityChange = (updater) => {
+    setColumnVisibility((previous) => typeof updater === "function" ? updater(previous) : updater);
+  };
+  useEffect(() => {
+    writeColumnsEntry(config.entityKey, { visibility: columnVisibility });
+  }, [config.entityKey, columnVisibility]);
+  return { columnVisibility, onColumnVisibilityChange };
+};
+const useDetailColumnVisibility = (entityKey, columns) => {
+  const [detailColumnVisibility, setDetailColumnVisibility] = useState(
+    () => columns ? resolveInitialColumnVisibility(detailColumnsEntryKey(entityKey), columns) : {}
+  );
+  const toggleDetailColumn = (columnId) => {
+    setDetailColumnVisibility((previous) => ({ ...previous, [columnId]: !(previous[columnId] ?? true) }));
+  };
+  const hasDetailColumns = !!columns;
+  useEffect(() => {
+    if (!hasDetailColumns) return;
+    writeColumnsEntry(detailColumnsEntryKey(entityKey), { visibility: detailColumnVisibility });
+  }, [entityKey, hasDetailColumns, detailColumnVisibility]);
+  return { detailColumnVisibility, toggleDetailColumn };
+};
+export {
+  useColumnVisibility,
+  useDetailColumnVisibility
+};
+//# sourceMappingURL=useColumnVisibility.js.map

package/dist/components/UI/DataTable/useColumnVisibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useColumnVisibility.js","sources":["../../../../src/components/UI/DataTable/useColumnVisibility.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { Updater, VisibilityState } from '@tanstack/react-table';\n\nimport { detailColumnsEntryKey, readColumnsEntry, writeColumnsEntry } from './dataTableColumnsStore';\nimport type { IDataTableColumnConfig, IDataTableConfig, IDataTableRow } from './types';\n\n// Non-hideable columns are always forced visible. The persisted map only ever\n// stores the state of hideable columns, so it can never blank out the table.\nconst resolveInitialColumnVisibility = <R extends IDataTableRow>(\n  storageKey: string,\n  columns: Array<IDataTableColumnConfig<R>>,\n): VisibilityState => {\n  const visibility: VisibilityState = {};\n\n  for (const column of columns) {\n    if (column.hideable === false) continue;\n    if (column.defaultHidden) visibility[column.id] = false;\n  }\n\n  const persisted = readColumnsEntry(storageKey).visibility;\n  if (!persisted) return visibility;\n\n  for (const column of columns) {\n    if (column.hideable === false) continue;\n    if (typeof persisted[column.id] === 'boolean') visibility[column.id] = persisted[column.id];\n  }\n\n  return visibility;\n};\n\ninterface IUseColumnVisibilityResult {\n  columnVisibility: VisibilityState;\n  onColumnVisibilityChange: (updater: Updater<VisibilityState>) => void;\n}\n\nexport const useColumnVisibility = <T extends IDataTableRow, C extends IDataTableRow = IDataTableRow>(\n  config: IDataTableConfig<T, C>,\n): IUseColumnVisibilityResult => {\n  const [columnVisibility, setColumnVisibility] = useState<VisibilityState>(() =>\n    resolveInitialColumnVisibility(config.entityKey, config.columns),\n  );\n\n  const onColumnVisibilityChange = (updater: Updater<VisibilityState>) => {\n    setColumnVisibility((previous) => (typeof updater === 'function' ? updater(previous) : updater));\n  };\n\n  useEffect(() => {\n    writeColumnsEntry(config.entityKey, { visibility: columnVisibility });\n  }, [config.entityKey, columnVisibility]);\n\n  return { columnVisibility, onColumnVisibilityChange };\n};\n\ninterface IUseDetailColumnVisibilityResult {\n  detailColumnVisibility: VisibilityState;\n  toggleDetailColumn: (columnId: string) => void;\n}\n\n/**\n * Visibility state for the nested detail table of a `detailTable` expansion.\n * Lives at the DataTable level (not per expanded row) so every open detail\n * table shares one state and one persisted entry. Pass `null` columns for\n * tables without a detailTable expansion: the hook is inert then.\n */\nexport const useDetailColumnVisibility = <C extends IDataTableRow>(\n  entityKey: string,\n  columns: Array<IDataTableColumnConfig<C>> | null,\n): IUseDetailColumnVisibilityResult => {\n  const [detailColumnVisibility, setDetailColumnVisibility] = useState<VisibilityState>(() =>\n    columns ? resolveInitialColumnVisibility(detailColumnsEntryKey(entityKey), columns) : {},\n  );\n\n  const toggleDetailColumn = (columnId: string) => {\n    setDetailColumnVisibility((previous) => ({ ...previous, [columnId]: !(previous[columnId] ?? true) }));\n  };\n\n  const hasDetailColumns = !!columns;\n\n  useEffect(() => {\n    if (!hasDetailColumns) return;\n    writeColumnsEntry(detailColumnsEntryKey(entityKey), { visibility: detailColumnVisibility });\n  }, [entityKey, hasDetailColumns, detailColumnVisibility]);\n\n  return { detailColumnVisibility, toggleDetailColumn };\n};\n"],"names":[],"mappings":";;AASA,MAAM,iCAAiC,CACrC,YACA,YACoB;AACpB,QAAM,aAA8B,CAAA;AAEpC,aAAW,UAAU,SAAS;AAC5B,QAAI,OAAO,aAAa,MAAO;AAC/B,QAAI,OAAO,cAAe,YAAW,OAAO,EAAE,IAAI;AAAA,EACpD;AAEA,QAAM,YAAY,iBAAiB,UAAU,EAAE;AAC/C,MAAI,CAAC,UAAW,QAAO;AAEvB,aAAW,UAAU,SAAS;AAC5B,QAAI,OAAO,aAAa,MAAO;AAC/B,QAAI,OAAO,UAAU,OAAO,EAAE,MAAM,UAAW,YAAW,OAAO,EAAE,IAAI,UAAU,OAAO,EAAE;AAAA,EAC5F;AAEA,SAAO;AACT;AAOO,MAAM,sBAAsB,CACjC,WAC+B;AAC/B,QAAM,CAAC,kBAAkB,mBAAmB,IAAI;AAAA,IAA0B,MACxE,+BAA+B,OAAO,WAAW,OAAO,OAAO;AAAA,EAAA;AAGjE,QAAM,2BAA2B,CAAC,YAAsC;AACtE,wBAAoB,CAAC,aAAc,OAAO,YAAY,aAAa,QAAQ,QAAQ,IAAI,OAAQ;AAAA,EACjG;AAEA,YAAU,MAAM;AACd,sBAAkB,OAAO,WAAW,EAAE,YAAY,kBAAkB;AAAA,EACtE,GAAG,CAAC,OAAO,WAAW,gBAAgB,CAAC;AAEvC,SAAO,EAAE,kBAAkB,yBAAA;AAC7B;AAaO,MAAM,4BAA4B,CACvC,WACA,YACqC;AACrC,QAAM,CAAC,wBAAwB,yBAAyB,IAAI;AAAA,IAA0B,MACpF,UAAU,+BAA+B,sBAAsB,SAAS,GAAG,OAAO,IAAI,CAAA;AAAA,EAAC;AAGzF,QAAM,qBAAqB,CAAC,aAAqB;AAC/C,8BAA0B,CAAC,cAAc,EAAE,GAAG,UAAU,CAAC,QAAQ,GAAG,EAAE,SAAS,QAAQ,KAAK,QAAQ;AAAA,EACtG;AAEA,QAAM,mBAAmB,CAAC,CAAC;AAE3B,YAAU,MAAM;AACd,QAAI,CAAC,iBAAkB;AACvB,sBAAkB,sBAAsB,SAAS,GAAG,EAAE,YAAY,wBAAwB;AAAA,EAC5F,GAAG,CAAC,WAAW,kBAAkB,sBAAsB,CAAC;AAExD,SAAO,EAAE,wBAAwB,mBAAA;AACnC;"}

package/dist/components/UI/DataTable/useDataTableCommitQueue.d.ts

@@ -0,0 +1,69 @@
+import { IDataTableFillChange, IDataTableRow } from './types';
+export type TDataTableCommitStatus = 'pending' | 'saving' | 'saved' | 'error';
+export interface IDataTableCommitItem<T extends IDataTableRow> {
+    row: T;
+    /** Accumulated values for that row, keyed by column id. */
+    changes: Record<string, unknown>;
+}
+/**
+ * Per-row outcome of a batch save. Returning it lets an endpoint with partial
+ * success mark only the rows that actually failed, instead of the whole batch.
+ */
+export interface IDataTableCommitRowResult {
+    rowId: string;
+    ok: boolean;
+    message?: string;
+}
+interface IUseDataTableCommitQueueParams<T extends IDataTableRow> {
+    rows: Array<T>;
+    /** One call per row, run with limited concurrency. The common case. */
+    saveRow?: (item: IDataTableCommitItem<T>) => Promise<void>;
+    /**
+     * One call for everything, for hosts that own a bulk endpoint. Wins over
+     * `saveRow`. Return per-row results to report partial success; returning
+     * nothing means every row saved.
+     */
+    saveBatch?: (items: Array<IDataTableCommitItem<T>>) => Promise<void | Array<IDataTableCommitRowResult>>;
+    /**
+     * Writes an edited value onto the row for the optimistic overlay. The default
+     * assigns the column id as a top-level key, which only holds when the column id
+     * IS the row field: a column reading `row.productReferenceId` (or a dotted path)
+     * must provide this, or the save succeeds and the screen never changes.
+     */
+    applyChange?: (row: T, columnId: string, value: unknown) => T;
+    debounceMs?: number;
+    concurrency?: number;
+    /** `false` keeps every change pending until `flush()` (an explicit save button). */
+    autoFlush?: boolean;
+}
+export interface IUseDataTableCommitQueueResult<T extends IDataTableRow> {
+    /** `rows` with every applied edit merged in, so the cells show what was typed. */
+    mergedRows: Array<T>;
+    onCellChange: (row: T, columnId: string, value: unknown) => void;
+    /** Whole fill range in one update: one render, one flush, one request per row. */
+    onFillCells: (changes: Array<IDataTableFillChange<T>>) => void;
+    flush: () => Promise<void>;
+    retryFailed: () => Promise<void>;
+    statuses: ReadonlyMap<string, TDataTableCommitStatus>;
+    isDirty: boolean;
+    isSaving: boolean;
+    pendingCount: number;
+    errorCount: number;
+}
+/**
+ * The single persistence path for inline editing. It replaces the fire-and-forget
+ * buffer with a queue that:
+ *
+ * - deduplicates by (row, column), so typing three times in a cell sends one value;
+ * - stamps every change with a sequence number, so a slow response can never mark
+ *   a newer value as saved (and never overwrites it);
+ * - runs one request per row with a concurrency cap, instead of `Promise.all` over
+ *   everything (a 40-row fill would otherwise open 40 sockets at once);
+ * - keeps the optimistic overlay until the cell is actually saved, so a refetch
+ *   arriving mid-flight no longer wipes what the user typed;
+ * - flushes on unmount and warns on tab close, so leaving the page does not
+ *   silently discard pending edits;
+ * - exposes a per-cell status the table paints (saving / saved / error).
+ */
+export declare function useDataTableCommitQueue<T extends IDataTableRow>({ rows, saveRow, saveBatch, applyChange, debounceMs, concurrency, autoFlush, }: IUseDataTableCommitQueueParams<T>): IUseDataTableCommitQueueResult<T>;
+export {};

package/dist/components/UI/DataTable/useDataTableCommitQueue.js

@@ -0,0 +1,220 @@
+import { useRef, useState, useCallback, useEffect, useMemo } from "react";
+import { uiLogger } from "../../../helpers/uiLogger.js";
+import { buildGridCellKey } from "./grid/gridTypes.js";
+const DEFAULT_DEBOUNCE_MS = 800;
+const DEFAULT_CONCURRENCY = 4;
+const runWithConcurrency = async (items, limit, worker) => {
+  let nextIndex = 0;
+  const runners = Array.from({ length: Math.max(1, Math.min(limit, items.length)) }, async () => {
+    while (nextIndex < items.length) {
+      const item = items[nextIndex];
+      nextIndex += 1;
+      if (item !== void 0) await worker(item);
+    }
+  });
+  await Promise.all(runners);
+};
+function useDataTableCommitQueue({
+  rows,
+  saveRow,
+  saveBatch,
+  applyChange,
+  debounceMs = DEFAULT_DEBOUNCE_MS,
+  concurrency = DEFAULT_CONCURRENCY,
+  autoFlush = true
+}) {
+  const overlayRef = useRef(/* @__PURE__ */ new Map());
+  const pendingRef = useRef(/* @__PURE__ */ new Map());
+  const inFlightRef = useRef(/* @__PURE__ */ new Map());
+  const statusesRef = useRef(/* @__PURE__ */ new Map());
+  const sequenceRef = useRef(0);
+  const timeoutRef = useRef(null);
+  const isSavingRef = useRef(false);
+  const rowsRef = useRef(rows);
+  rowsRef.current = rows;
+  const saveRowRef = useRef(saveRow);
+  saveRowRef.current = saveRow;
+  const saveBatchRef = useRef(saveBatch);
+  saveBatchRef.current = saveBatch;
+  const applyChangeRef = useRef(applyChange);
+  applyChangeRef.current = applyChange;
+  const [version, setVersion] = useState(0);
+  const publish = useCallback(() => setVersion((current) => current + 1), []);
+  const flushRef = useRef(async () => void 0);
+  const flush = useCallback(async () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+    if (pendingRef.current.size === 0) return;
+    const outgoing = Array.from(pendingRef.current.values());
+    pendingRef.current.clear();
+    const rowById = new Map(rowsRef.current.map((row) => [row.id, row]));
+    const itemsByRowId = /* @__PURE__ */ new Map();
+    outgoing.forEach((change) => {
+      const cellKey = buildGridCellKey(change.rowId, change.columnId);
+      inFlightRef.current.set(cellKey, change.sequence);
+      statusesRef.current.set(cellKey, "saving");
+      const row = rowById.get(change.rowId);
+      if (!row) return;
+      const item = itemsByRowId.get(change.rowId) ?? { row, changes: {} };
+      item.changes[change.columnId] = change.value;
+      itemsByRowId.set(change.rowId, item);
+    });
+    isSavingRef.current = true;
+    publish();
+    const settleRow = (rowChanges, succeeded) => {
+      rowChanges.forEach((change) => {
+        const cellKey = buildGridCellKey(change.rowId, change.columnId);
+        if (inFlightRef.current.get(cellKey) !== change.sequence) return;
+        inFlightRef.current.delete(cellKey);
+        statusesRef.current.set(cellKey, succeeded ? "saved" : "error");
+        if (!succeeded) pendingRef.current.set(cellKey, change);
+      });
+    };
+    const changesByRowId = /* @__PURE__ */ new Map();
+    outgoing.forEach((change) => {
+      const list = changesByRowId.get(change.rowId) ?? [];
+      list.push(change);
+      changesByRowId.set(change.rowId, list);
+    });
+    const items = Array.from(itemsByRowId.values());
+    try {
+      if (saveBatchRef.current) {
+        try {
+          const rowResults = await saveBatchRef.current(items);
+          const failedRowIds = new Set(
+            (Array.isArray(rowResults) ? rowResults : []).filter((result) => !result.ok).map((result) => result.rowId)
+          );
+          changesByRowId.forEach((rowChanges, rowId) => settleRow(rowChanges, !failedRowIds.has(rowId)));
+        } catch (error) {
+          uiLogger.error("DataTable batch save failed", error);
+          changesByRowId.forEach((rowChanges) => settleRow(rowChanges, false));
+        }
+      } else if (saveRowRef.current) {
+        await runWithConcurrency(items, concurrency, async (item) => {
+          const rowChanges = changesByRowId.get(item.row.id) ?? [];
+          try {
+            await saveRowRef.current?.(item);
+            settleRow(rowChanges, true);
+          } catch (error) {
+            uiLogger.error("DataTable row save failed", error);
+            settleRow(rowChanges, false);
+          }
+        });
+      }
+    } finally {
+      isSavingRef.current = false;
+      publish();
+    }
+  }, [concurrency, publish]);
+  flushRef.current = flush;
+  const scheduleFlush = useCallback(() => {
+    if (!autoFlush) return;
+    if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    timeoutRef.current = setTimeout(() => {
+      void flushRef.current();
+    }, debounceMs);
+  }, [autoFlush, debounceMs]);
+  const applyChanges = useCallback(
+    (changes) => {
+      changes.forEach(({ rowId, columnId, value }) => {
+        sequenceRef.current += 1;
+        const rowOverlay = { ...overlayRef.current.get(rowId) ?? {}, [columnId]: value };
+        overlayRef.current.set(rowId, rowOverlay);
+        const cellKey = buildGridCellKey(rowId, columnId);
+        pendingRef.current.set(cellKey, { rowId, columnId, value, sequence: sequenceRef.current });
+        statusesRef.current.set(cellKey, "pending");
+      });
+      publish();
+      scheduleFlush();
+    },
+    [publish, scheduleFlush]
+  );
+  const onCellChange = useCallback(
+    (row, columnId, value) => applyChanges([{ rowId: row.id, columnId, value }]),
+    [applyChanges]
+  );
+  const onFillCells = useCallback(
+    (changes) => applyChanges(
+      (changes ?? []).map((change) => ({ rowId: change.row.id, columnId: change.columnId, value: change.value }))
+    ),
+    [applyChanges]
+  );
+  const retryFailed = useCallback(async () => {
+    const failedKeys = Array.from(statusesRef.current.entries()).filter(([, status]) => status === "error").map(([cellKey]) => cellKey);
+    if (failedKeys.length === 0) return;
+    failedKeys.forEach((cellKey) => statusesRef.current.set(cellKey, "pending"));
+    await flush();
+  }, [flush]);
+  const previousRowsRef = useRef(rows);
+  useEffect(() => {
+    if (previousRowsRef.current === rows) return;
+    previousRowsRef.current = rows;
+    let changed = false;
+    overlayRef.current.forEach((rowOverlay, rowId) => {
+      Object.keys(rowOverlay).forEach((columnId) => {
+        const cellKey = buildGridCellKey(rowId, columnId);
+        if (statusesRef.current.get(cellKey) !== "saved") return;
+        delete rowOverlay[columnId];
+        statusesRef.current.delete(cellKey);
+        changed = true;
+      });
+      if (Object.keys(rowOverlay).length === 0) overlayRef.current.delete(rowId);
+    });
+    if (changed) publish();
+  }, [rows, publish]);
+  useEffect(
+    () => () => {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      void flushRef.current();
+    },
+    []
+  );
+  const hasUnsavedWork = pendingRef.current.size > 0 || inFlightRef.current.size > 0;
+  useEffect(() => {
+    if (!hasUnsavedWork) return void 0;
+    const handleBeforeUnload = (event) => {
+      void flushRef.current();
+      event.preventDefault();
+      event.returnValue = "";
+    };
+    window.addEventListener("beforeunload", handleBeforeUnload);
+    return () => window.removeEventListener("beforeunload", handleBeforeUnload);
+  }, [hasUnsavedWork]);
+  const mergedRows = useMemo(() => {
+    const safeRows = rows ?? [];
+    if (overlayRef.current.size === 0) return safeRows;
+    const applyToRow = applyChangeRef.current ?? ((row, columnId, value) => ({
+      ...row,
+      [columnId]: value
+    }));
+    return safeRows.map((row) => {
+      const rowOverlay = overlayRef.current.get(row.id);
+      if (!rowOverlay || Object.keys(rowOverlay).length === 0) return row;
+      return Object.entries(rowOverlay).reduce(
+        (current, [columnId, value]) => applyToRow(current, columnId, value),
+        row
+      );
+    });
+  }, [rows, version]);
+  const statuses = useMemo(() => new Map(statusesRef.current), [version]);
+  const pendingCount = pendingRef.current.size + inFlightRef.current.size;
+  const errorCount = Array.from(statusesRef.current.values()).filter((status) => status === "error").length;
+  return {
+    mergedRows,
+    onCellChange,
+    onFillCells,
+    flush,
+    retryFailed,
+    statuses,
+    isDirty: pendingCount > 0,
+    isSaving: isSavingRef.current,
+    pendingCount,
+    errorCount
+  };
+}
+export {
+  useDataTableCommitQueue
+};
+//# sourceMappingURL=useDataTableCommitQueue.js.map

package/dist/components/UI/DataTable/useDataTableCommitQueue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTableCommitQueue.js","sources":["../../../../src/components/UI/DataTable/useDataTableCommitQueue.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { uiLogger } from '@/helpers/uiLogger';\n\nimport { buildGridCellKey } from './grid/gridTypes';\nimport type { IDataTableFillChange, IDataTableRow } from './types';\n\nconst DEFAULT_DEBOUNCE_MS = 800;\nconst DEFAULT_CONCURRENCY = 4;\n\nexport type TDataTableCommitStatus = 'pending' | 'saving' | 'saved' | 'error';\n\nexport interface IDataTableCommitItem<T extends IDataTableRow> {\n  row: T;\n  /** Accumulated values for that row, keyed by column id. */\n  changes: Record<string, unknown>;\n}\n\n/**\n * Per-row outcome of a batch save. Returning it lets an endpoint with partial\n * success mark only the rows that actually failed, instead of the whole batch.\n */\nexport interface IDataTableCommitRowResult {\n  rowId: string;\n  ok: boolean;\n  message?: string;\n}\n\ninterface IPendingChange {\n  rowId: string;\n  columnId: string;\n  value: unknown;\n  sequence: number;\n}\n\ninterface IUseDataTableCommitQueueParams<T extends IDataTableRow> {\n  rows: Array<T>;\n  /** One call per row, run with limited concurrency. The common case. */\n  saveRow?: (item: IDataTableCommitItem<T>) => Promise<void>;\n  /**\n   * One call for everything, for hosts that own a bulk endpoint. Wins over\n   * `saveRow`. Return per-row results to report partial success; returning\n   * nothing means every row saved.\n   */\n  saveBatch?: (items: Array<IDataTableCommitItem<T>>) => Promise<void | Array<IDataTableCommitRowResult>>;\n  /**\n   * Writes an edited value onto the row for the optimistic overlay. The default\n   * assigns the column id as a top-level key, which only holds when the column id\n   * IS the row field: a column reading `row.productReferenceId` (or a dotted path)\n   * must provide this, or the save succeeds and the screen never changes.\n   */\n  applyChange?: (row: T, columnId: string, value: unknown) => T;\n  debounceMs?: number;\n  concurrency?: number;\n  /** `false` keeps every change pending until `flush()` (an explicit save button). */\n  autoFlush?: boolean;\n}\n\nexport interface IUseDataTableCommitQueueResult<T extends IDataTableRow> {\n  /** `rows` with every applied edit merged in, so the cells show what was typed. */\n  mergedRows: Array<T>;\n  onCellChange: (row: T, columnId: string, value: unknown) => void;\n  /** Whole fill range in one update: one render, one flush, one request per row. */\n  onFillCells: (changes: Array<IDataTableFillChange<T>>) => void;\n  flush: () => Promise<void>;\n  retryFailed: () => Promise<void>;\n  statuses: ReadonlyMap<string, TDataTableCommitStatus>;\n  isDirty: boolean;\n  isSaving: boolean;\n  pendingCount: number;\n  errorCount: number;\n}\n\nconst runWithConcurrency = async <TItem>(\n  items: Array<TItem>,\n  limit: number,\n  worker: (item: TItem) => Promise<void>,\n): Promise<void> => {\n  let nextIndex = 0;\n\n  const runners = Array.from({ length: Math.max(1, Math.min(limit, items.length)) }, async () => {\n    while (nextIndex < items.length) {\n      const item = items[nextIndex];\n      nextIndex += 1;\n      if (item !== undefined) await worker(item);\n    }\n  });\n\n  await Promise.all(runners);\n};\n\n/**\n * The single persistence path for inline editing. It replaces the fire-and-forget\n * buffer with a queue that:\n *\n * - deduplicates by (row, column), so typing three times in a cell sends one value;\n * - stamps every change with a sequence number, so a slow response can never mark\n *   a newer value as saved (and never overwrites it);\n * - runs one request per row with a concurrency cap, instead of `Promise.all` over\n *   everything (a 40-row fill would otherwise open 40 sockets at once);\n * - keeps the optimistic overlay until the cell is actually saved, so a refetch\n *   arriving mid-flight no longer wipes what the user typed;\n * - flushes on unmount and warns on tab close, so leaving the page does not\n *   silently discard pending edits;\n * - exposes a per-cell status the table paints (saving / saved / error).\n */\nexport function useDataTableCommitQueue<T extends IDataTableRow>({\n  rows,\n  saveRow,\n  saveBatch,\n  applyChange,\n  debounceMs = DEFAULT_DEBOUNCE_MS,\n  concurrency = DEFAULT_CONCURRENCY,\n  autoFlush = true,\n}: IUseDataTableCommitQueueParams<T>): IUseDataTableCommitQueueResult<T> {\n  const overlayRef = useRef(new Map<string, Record<string, unknown>>());\n  const pendingRef = useRef(new Map<string, IPendingChange>());\n  const inFlightRef = useRef(new Map<string, number>());\n  const statusesRef = useRef(new Map<string, TDataTableCommitStatus>());\n  const sequenceRef = useRef(0);\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const isSavingRef = useRef(false);\n\n  const rowsRef = useRef(rows);\n  rowsRef.current = rows;\n  const saveRowRef = useRef(saveRow);\n  saveRowRef.current = saveRow;\n  const saveBatchRef = useRef(saveBatch);\n  saveBatchRef.current = saveBatch;\n  const applyChangeRef = useRef(applyChange);\n  applyChangeRef.current = applyChange;\n\n  const [version, setVersion] = useState(0);\n  const publish = useCallback(() => setVersion((current) => current + 1), []);\n\n  const flushRef = useRef<() => Promise<void>>(async () => undefined);\n\n  const flush = useCallback(async () => {\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n      timeoutRef.current = null;\n    }\n\n    if (pendingRef.current.size === 0) return;\n\n    const outgoing = Array.from(pendingRef.current.values());\n    pendingRef.current.clear();\n\n    const rowById = new Map(rowsRef.current.map((row) => [row.id, row]));\n    const itemsByRowId = new Map<string, IDataTableCommitItem<T>>();\n\n    outgoing.forEach((change) => {\n      const cellKey = buildGridCellKey(change.rowId, change.columnId);\n      inFlightRef.current.set(cellKey, change.sequence);\n      statusesRef.current.set(cellKey, 'saving');\n\n      const row = rowById.get(change.rowId);\n      if (!row) return;\n\n      const item = itemsByRowId.get(change.rowId) ?? { row, changes: {} };\n      item.changes[change.columnId] = change.value;\n      itemsByRowId.set(change.rowId, item);\n    });\n\n    isSavingRef.current = true;\n    publish();\n\n    const settleRow = (rowChanges: Array<IPendingChange>, succeeded: boolean) => {\n      rowChanges.forEach((change) => {\n        const cellKey = buildGridCellKey(change.rowId, change.columnId);\n        // A newer edit replaced this value while the request was in flight: its own\n        // flush owns the cell now, so this response says nothing about it.\n        if (inFlightRef.current.get(cellKey) !== change.sequence) return;\n\n        inFlightRef.current.delete(cellKey);\n        statusesRef.current.set(cellKey, succeeded ? 'saved' : 'error');\n        if (!succeeded) pendingRef.current.set(cellKey, change);\n      });\n    };\n\n    const changesByRowId = new Map<string, Array<IPendingChange>>();\n    outgoing.forEach((change) => {\n      const list = changesByRowId.get(change.rowId) ?? [];\n      list.push(change);\n      changesByRowId.set(change.rowId, list);\n    });\n\n    const items = Array.from(itemsByRowId.values());\n\n    try {\n      if (saveBatchRef.current) {\n        try {\n          const rowResults = await saveBatchRef.current(items);\n          const failedRowIds = new Set(\n            (Array.isArray(rowResults) ? rowResults : []).filter((result) => !result.ok).map((result) => result.rowId),\n          );\n\n          changesByRowId.forEach((rowChanges, rowId) => settleRow(rowChanges, !failedRowIds.has(rowId)));\n        } catch (error) {\n          uiLogger.error('DataTable batch save failed', error);\n          changesByRowId.forEach((rowChanges) => settleRow(rowChanges, false));\n        }\n      } else if (saveRowRef.current) {\n        await runWithConcurrency(items, concurrency, async (item) => {\n          const rowChanges = changesByRowId.get(item.row.id) ?? [];\n          try {\n            await saveRowRef.current?.(item);\n            settleRow(rowChanges, true);\n          } catch (error) {\n            uiLogger.error('DataTable row save failed', error);\n            settleRow(rowChanges, false);\n          }\n        });\n      }\n    } finally {\n      isSavingRef.current = false;\n      publish();\n    }\n  }, [concurrency, publish]);\n\n  flushRef.current = flush;\n\n  const scheduleFlush = useCallback(() => {\n    if (!autoFlush) return;\n    if (timeoutRef.current) clearTimeout(timeoutRef.current);\n    timeoutRef.current = setTimeout(() => {\n      void flushRef.current();\n    }, debounceMs);\n  }, [autoFlush, debounceMs]);\n\n  const applyChanges = useCallback(\n    (changes: Array<{ rowId: string; columnId: string; value: unknown }>) => {\n      changes.forEach(({ rowId, columnId, value }) => {\n        sequenceRef.current += 1;\n\n        const rowOverlay = { ...(overlayRef.current.get(rowId) ?? {}), [columnId]: value };\n        overlayRef.current.set(rowId, rowOverlay);\n\n        const cellKey = buildGridCellKey(rowId, columnId);\n        pendingRef.current.set(cellKey, { rowId, columnId, value, sequence: sequenceRef.current });\n        statusesRef.current.set(cellKey, 'pending');\n      });\n\n      publish();\n      scheduleFlush();\n    },\n    [publish, scheduleFlush],\n  );\n\n  const onCellChange = useCallback(\n    (row: T, columnId: string, value: unknown) => applyChanges([{ rowId: row.id, columnId, value }]),\n    [applyChanges],\n  );\n\n  const onFillCells = useCallback(\n    (changes: Array<IDataTableFillChange<T>>) =>\n      applyChanges(\n        (changes ?? []).map((change) => ({ rowId: change.row.id, columnId: change.columnId, value: change.value })),\n      ),\n    [applyChanges],\n  );\n\n  const retryFailed = useCallback(async () => {\n    const failedKeys = Array.from(statusesRef.current.entries())\n      .filter(([, status]) => status === 'error')\n      .map(([cellKey]) => cellKey);\n    if (failedKeys.length === 0) return;\n\n    failedKeys.forEach((cellKey) => statusesRef.current.set(cellKey, 'pending'));\n    await flush();\n  }, [flush]);\n\n  // A fresh page of rows already reflects whatever was persisted, so its overlay\n  // entries are noise. Cells still pending, in flight or failed keep theirs: those\n  // values only exist here.\n  const previousRowsRef = useRef(rows);\n  useEffect(() => {\n    if (previousRowsRef.current === rows) return;\n    previousRowsRef.current = rows;\n\n    let changed = false;\n    overlayRef.current.forEach((rowOverlay, rowId) => {\n      Object.keys(rowOverlay).forEach((columnId) => {\n        const cellKey = buildGridCellKey(rowId, columnId);\n        if (statusesRef.current.get(cellKey) !== 'saved') return;\n\n        delete rowOverlay[columnId];\n        statusesRef.current.delete(cellKey);\n        changed = true;\n      });\n\n      if (Object.keys(rowOverlay).length === 0) overlayRef.current.delete(rowId);\n    });\n\n    if (changed) publish();\n  }, [rows, publish]);\n\n  useEffect(\n    () => () => {\n      if (timeoutRef.current) clearTimeout(timeoutRef.current);\n      // Fire and forget on unmount: the request still reaches the backend, which is\n      // the difference between \"left the page\" and \"lost the edit\".\n      void flushRef.current();\n    },\n    [],\n  );\n\n  const hasUnsavedWork = pendingRef.current.size > 0 || inFlightRef.current.size > 0;\n\n  useEffect(() => {\n    if (!hasUnsavedWork) return undefined;\n\n    const handleBeforeUnload = (event: BeforeUnloadEvent) => {\n      void flushRef.current();\n      event.preventDefault();\n      event.returnValue = '';\n    };\n\n    window.addEventListener('beforeunload', handleBeforeUnload);\n    return () => window.removeEventListener('beforeunload', handleBeforeUnload);\n  }, [hasUnsavedWork]);\n\n  const mergedRows = useMemo<Array<T>>(() => {\n    const safeRows = rows ?? [];\n    if (overlayRef.current.size === 0) return safeRows;\n\n    const applyToRow =\n      applyChangeRef.current ??\n      ((row: T, columnId: string, value: unknown) => ({\n        ...row,\n        [columnId]: value,\n      }));\n\n    return safeRows.map((row) => {\n      const rowOverlay = overlayRef.current.get(row.id);\n      if (!rowOverlay || Object.keys(rowOverlay).length === 0) return row;\n\n      return Object.entries(rowOverlay).reduce(\n        (current, [columnId, value]) => applyToRow(current, columnId, value),\n        row,\n      );\n    });\n    // `version` is the queue's own change signal: the overlay lives in a ref so\n    // editing a cell does not rebuild it on every unrelated render.\n  }, [rows, version]);\n\n  const statuses = useMemo(() => new Map(statusesRef.current), [version]);\n\n  const pendingCount = pendingRef.current.size + inFlightRef.current.size;\n  const errorCount = Array.from(statusesRef.current.values()).filter((status) => status === 'error').length;\n\n  return {\n    mergedRows,\n    onCellChange,\n    onFillCells,\n    flush,\n    retryFailed,\n    statuses,\n    isDirty: pendingCount > 0,\n    isSaving: isSavingRef.current,\n    pendingCount,\n    errorCount,\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/components/UI/DataTable/useDataTableEditBuffer.d.ts

@@ -0,0 +1,36 @@
+import { IDataTableRow } from './types';
+export interface IDataTableEditBufferItem<T> {
+    id: string;
+    data: Partial<T>;
+}
+interface IUseDataTableEditBufferParams<T extends IDataTableRow> {
+    rows: Array<T>;
+    onBatchUpdate: (items: Array<IDataTableEditBufferItem<T>>) => Promise<void>;
+    autoFlushMs?: number;
+}
+interface IUseDataTableEditBufferResult<T extends IDataTableRow> {
+    /** `rows` with pending edits applied, so editable `getValue` reflects typing. */
+    mergedRows: Array<T>;
+    /** Wire to `editing.onCellChange`: records the edit and enqueues the batch save. */
+    onCellChange: (row: T, columnId: string, value: unknown) => void;
+    /** Wire to `spreadsheet.fill.onFillCells`: a whole fill range in one update. */
+    onFillCells: (changes: Array<{
+        row: T;
+        columnId: string;
+        value: unknown;
+    }>) => void;
+    /** Manual save: flushes the pending queue to the host handler. */
+    flush: () => Promise<void>;
+    isDirty: boolean;
+    queueSize: number;
+    loading: boolean;
+    statuses: ReadonlyMap<string, string>;
+}
+/**
+ * Backwards-compatible façade over `useDataTableCommitQueue`, kept because five
+ * report tables already speak this shape (`onBatchUpdate` receiving `{ id, data }`).
+ * Everything underneath is the queue, so those tables inherit the dedupe, the
+ * stale-response guard, the flush on unmount and the per-cell status for free.
+ */
+export declare function useDataTableEditBuffer<T extends IDataTableRow>({ rows, onBatchUpdate, autoFlushMs, }: IUseDataTableEditBufferParams<T>): IUseDataTableEditBufferResult<T>;
+export {};