persian-data-grid 0.6.0 → 0.7.1

package/dist/index.js

@@ -1,14 +1,14 @@
-import { useColumnWindowOrAll, ColumnWindowCells, columnPinCellProps, ariaColIndex, gridCellA11y, ariaDataRowIndex, indexPinDataAttr, indexPinClassName, gridCellDomId, ariaGridRowCount, ColumnWindowProvider, ARIA_HEADER_ROW_INDEX, ariaFooterRowIndex, ariaPinnedTopRowIndex, ariaPinnedBottomRowIndex, columnPinClassName } from './chunk-6XBXZPBW.js';
-import { resolveFillCorner, resolveCellRangePresentation, cellRangeEdgeAttr, cellRangeClassName, resolveCellAddressFromPoint, createGridTableKey, createGrid, flattenColDefOrGroup, DEFAULT_MEMORY_STORE, isPersistentStore, SparseRowIndex, maxColumnGroupDepth, buildColumnGroupHeaderModel, resolveFilterUi, isColumnFilterActive, canSetColumnVisible, trapTabKey, collectUniqueFilterValues, resolveGroupBlockReorder } from './chunk-HTNJT2QU.js';
-export { ColumnAggIndex, DEFAULT_EVENT_STORE_PREFIX, DEFAULT_GRID_ACTOR, DEFAULT_MEMORY_STORE, EVENT_CATALOG, InMemoryEventStore, InMemorySnapshotStore, IndexedDbEventStore, LEGACY_EVENT_STORE_PREFIX, MemoryKvDatabase, NoopRemoteApi, OfflineStatus, PluginHost, QuickFilterIndex, SnapshotStrategy, SparseRowIndex, TableEngine, accumulateAdd, accumulateRemove, alwaysOnlineConnectivity, applyAgg, applyFilter, applyHostRowDataToTable, applyQuickFilter, buildQuickFilterBlob, collectUniqueFilterValues, columnDefFieldName, createAccumulator, createBrowserConnectivity, createERPTable, createEngineGridQuery, createGrid, createGridApi, createGridTableKey, createLocalStorageWatermark, defaultGetRowId, ensureIndexColumnDef, eventStoreDbName, getEventCatalogEntry, isAggFuncName, isColumnFilterActive, isColumnGroupDef, isCustomAggFunc, isServerRowModel, listUndoableEventTypes, mapColDefOrGroups, mapColumnDefs, mapColumnSchemas, mapColumnSchemasToDefs, mapRowDataToRowInputs, normalizeFilterText, normalizeQuickFilterText, openIndexedDbDatabase, pageWindow, readAccumulator, resolveBuiltinFilterKind, resolveColumnAggSpecs, resolveCreateGridDefaults, toColumnDef, toColumnDefinition, toColumnSchema, toColumnViewBinding, toMinorUnits } from './chunk-HTNJT2QU.js';
+import { useColumnWindowOrAll, ColumnWindowCells, columnPinCellProps, ariaColIndex, gridCellA11y, ariaDataRowIndex, indexPinDataAttr, indexPinClassName, gridCellDomId, ariaGridRowCount, ColumnWindowProvider, ARIA_HEADER_ROW_INDEX, ariaFooterRowIndex, ariaPinnedTopRowIndex, ariaPinnedBottomRowIndex, columnPinClassName } from './chunk-NQUVAJQA.js';
+import { resolveFillCorner, resolveCellRangePresentation, cellRangeEdgeAttr, cellRangeClassName, resolveCellAddressFromPoint, createGridTableKey, createGrid, flattenColDefOrGroup, DEFAULT_MEMORY_STORE, isPersistentStore, SparseRowIndex, maxColumnGroupDepth, buildColumnGroupHeaderModel, resolveFilterUi, isColumnFilterActive, canSetColumnVisible, trapTabKey, collectUniqueFilterValues, resolveGroupBlockReorder } from './chunk-27ALJSZP.js';
+export { ColumnAggIndex, DEFAULT_EVENT_STORE_PREFIX, DEFAULT_GRID_ACTOR, DEFAULT_MEMORY_STORE, EVENT_CATALOG, InMemoryEventStore, InMemorySnapshotStore, IndexedDbEventStore, LEGACY_EVENT_STORE_PREFIX, MemoryKvDatabase, NoopRemoteApi, OfflineStatus, PluginHost, QuickFilterIndex, SnapshotStrategy, SparseRowIndex, TableEngine, accumulateAdd, accumulateRemove, alwaysOnlineConnectivity, applyAgg, applyFilter, applyHostRowDataToTable, applyQuickFilter, buildQuickFilterBlob, collectUniqueFilterValues, columnDefFieldName, createAccumulator, createBrowserConnectivity, createERPTable, createEngineGridQuery, createGrid, createGridApi, createGridTableKey, createLocalStorageWatermark, defaultGetRowId, ensureIndexColumnDef, eventStoreDbName, getEventCatalogEntry, isAggFuncName, isColumnFilterActive, isColumnGroupDef, isCustomAggFunc, isServerRowModel, listUndoableEventTypes, mapColDefOrGroups, mapColumnDefs, mapColumnSchemas, mapColumnSchemasToDefs, mapRowDataToRowInputs, normalizeFilterText, normalizeQuickFilterText, openIndexedDbDatabase, pageWindow, readAccumulator, resolveBuiltinFilterKind, resolveColumnAggSpecs, resolveCreateGridDefaults, toColumnDef, toColumnDefinition, toColumnSchema, toColumnViewBinding, toMinorUnits } from './chunk-27ALJSZP.js';
 import './chunk-5HKVMPBD.js';
 import { columnSizeStyle, overlayStoredColumnWidth, ViewportCalculator, isIndexColumn, clampColumnWidth } from './chunk-IPPIXOVQ.js';
 export { ViewportCalculator, buildCumulativeWidths, calculateColumnViewport } from './chunk-IPPIXOVQ.js';
-import './chunk-RM6ZWNT3.js';
+import './chunk-7T6AWRPU.js';
 import './chunk-KHMG6EI2.js';
 import './chunk-RKVSJU46.js';
-import { useLocale, hasDependValue, buildDependencyBody, useRemoteQuery, useThemePortalStyle, useTranslations, useNumberingSystem, useERPTableHost, useDateAdapter, useLazyRemote, useHostDependOn, useERPTableTheme, translate, themeDefault, isStockDarkTheme, resolveActiveTheme, useGridHostEvents, useMediaQuery, ERPTableHostProvider, themeToStyle, useDirection, useHostToast } from './chunk-QQMU44KJ.js';
-export { AR_MESSAGES, EN_MESSAGES, ERPTableHostProvider, FA_MESSAGES, GridTheme, bindGridHostEvents, gregorianAdapter, themeDark, themeDefault, themeErp, themeErpDark, useERPTableTheme, useStaticDependOn } from './chunk-QQMU44KJ.js';
+import { useLocale, useHostDependOn, hasDependValue, buildDependencyBody, useRemoteQuery, getStaticDependValue, getDependFieldName, useThemePortalStyle, useTranslations, useNumberingSystem, useERPTableHost, useDateAdapter, useLazyRemote, useERPTableTheme, translate, themeDefault, isStockDarkTheme, resolveActiveTheme, useGridHostEvents, useMediaQuery, ERPTableHostProvider, themeToStyle, useDirection, useHostToast } from './chunk-HLOHWFOA.js';
+export { AR_MESSAGES, EN_MESSAGES, ERPTableHostProvider, FA_MESSAGES, GridTheme, bindGridHostEvents, gregorianAdapter, themeDark, themeDefault, themeErp, themeErpDark, useERPTableTheme, useStaticDependOn } from './chunk-HLOHWFOA.js';
 import { formatLocaleNumber, resolveDirection } from './chunk-SZ7BLAY3.js';
 export { formatLocaleDate, formatLocaleNumber, resolveDirection, resolveLocaleMeta } from './chunk-SZ7BLAY3.js';
 import './chunk-F4PYOYHR.js';
@@ -16,17 +16,17 @@ import './chunk-77UXAJII.js';
 import './chunk-TN4MG6FY.js';
 export { jalaliAdapter } from './chunk-GQEDLUMB.js';
 export { CATALOG_TO_HOST_CALLBACKS, ROW_DATA_UPDATED_CATALOG_TYPES, dispatchCatalogHostEvent, subscribeCatalogHostEvents } from './chunk-MUQQKPWR.js';
-import { isHeaderColumnSortable, ariaSortForColumn, sortPriorityForColumn, HEADER_SORT_CLICK_MAX_MOVE_PX, shouldCommitHeaderSortClick, cycleSortModel } from './chunk-AU3RDJYQ.js';
+import { ariaSortForColumn, sortPriorityForColumn, HEADER_SORT_CLICK_MAX_MOVE_PX, isHeaderColumnSortable, shouldCommitHeaderSortClick, cycleSortModel } from './chunk-AU3RDJYQ.js';
 export { HEADER_SORT_CLICK_MAX_MOVE_PX, INDEX_COL_ID, applySort, ariaSortForColumn, compareSortValues, compareTypedValues, cycleSortModel, isBlankSortValue, isHeaderColumnSortable, normalizeDigits, shouldCommitHeaderSortClick, sortPriorityForColumn } from './chunk-AU3RDJYQ.js';
-import { exportActiveCollectionToExcel } from './chunk-EHHHC5JV.js';
-export { ExcelExportPlugin, ExcelImportPlugin, applyImportedRows, exportActiveCollectionToExcel, mapImportedSheet, parseXlsxBlob } from './chunk-EHHHC5JV.js';
+import { exportActiveCollectionToExcel } from './chunk-NB5GCGHL.js';
+export { ExcelExportPlugin, ExcelImportPlugin, applyImportedRows, exportActiveCollectionToExcel, mapImportedSheet, parseXlsxBlob } from './chunk-NB5GCGHL.js';
 import { Viewport } from './chunk-XLRE2J25.js';
 export { RowStateEnum, Viewport } from './chunk-XLRE2J25.js';
-export { buildExportTable } from './chunk-LJ7LMEXO.js';
+export { buildExportTable } from './chunk-7GWV5HGO.js';
 import './chunk-3Y3KKGEC.js';
-export { PdfExportPlugin, TextPdfRenderer, VazirmatnPdfRenderer } from './chunk-MU3RY46O.js';
+export { PdfExportPlugin, TextPdfRenderer, VazirmatnPdfRenderer } from './chunk-VBAZ77Q4.js';
 export { buildXlsxBlob } from './chunk-PQY54EL5.js';
-import './chunk-KYAOSBQN.js';
+import './chunk-GKE33FOJ.js';
 import React7, { lazy, forwardRef, useMemo, useState, useRef, useEffect, createElement, Suspense, useCallback, useLayoutEffect, useId } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
@@ -1794,12 +1794,18 @@ var DescriptionComponent = forwardRef((props, ref) => {
   } = props;
   const showSearchHit = !!(isCurrentSearchMatch && searchQuery?.trim());
   const { endpoint, dependOn } = meta.dynamicSource ?? {};
-  const isReady = hasDependValue(dependOn);
-  const dependencyBody = buildDependencyBody(dependOn);
+  const { dependencyBody: hostValues } = useHostDependOn(dependOn, {
+    enabled: true
+  });
+  const resolveDepend = (item) => getStaticDependValue(item) ?? hostValues[getDependFieldName(item)];
+  const isReady = hasDependValue(dependOn, resolveDepend);
+  const dependencyBody = buildDependencyBody(dependOn, resolveDepend);
   const { data: menuData } = useRemoteQuery({
     url: endpoint,
     body: {
       ...dependencyBody,
+      RepoViewId: 0,
+      RepoId: 0,
       PagingInfo: {
         PageNumber: 1,
         PageRecordCount: 1e4
@@ -1942,6 +1948,8 @@ var ERPTableDynamicSelect = ({
   const {
     endpoint,
     repoViewId,
+    // UI-only flag of the host's select config; never part of the request body.
+    addButton: _addButton,
     dependOn,
     ...bodyRequest
   } = dynamicValue ?? {};
@@ -2121,7 +2129,8 @@ var ERPTableDynamicSelect = ({
     )
   ] });
 };
-var CellRenderer = ({
+var CellRenderer = (props) => props.meta ? /* @__PURE__ */ jsx(CellRendererBody, { ...props, meta: props.meta }) : null;
+var CellRendererBody = ({
   tableKey,
   row,
   columnId,
@@ -2136,7 +2145,6 @@ var CellRenderer = ({
   const numberingSystem = useNumberingSystem();
   const dateAdapter = useDateAdapter();
   const searchState = useGridSearchState(controller);
-  if (!meta) return null;
   const disable = typeof row.visibilityCondition[columnId] === "boolean" && row.visibilityCondition[columnId] === false;
   const viewCell = controller.getCell(row.id, columnId);
   const draft = controller.getEditDraft(row.id, columnId);
@@ -2464,6 +2472,7 @@ var CellRenderer = ({
           popupRender: (menu) => /* @__PURE__ */ jsx("div", { className: "w-full", children: menu }),
           disabled: isDeleted || !isEditable,
           value: selectValue,
+          valueLabel: display != null && display !== "" ? String(display) : void 0,
           dynamicValue: meta?.dynamicSource,
           filterOption: (input, option) => {
             if (meta?.dynamicSelectFilterOption) {
@@ -2911,7 +2920,7 @@ var ERPTableRow = React7.memo(ERPTableRowComponent, (prev, next) => {
   return prev.row === next.row && prev.index === next.index && prev.stripeIndex === next.stripeIndex && prev.controller === next.controller && prev.tableKey === next.tableKey && prev.isSelected === next.isSelected && prev.isActive === next.isActive && prev.isCut === next.isCut && prev.table.columns === next.table.columns && prev.table.columnWidths === next.table.columnWidths && prev.table.activeCell?.rowId === next.table.activeCell?.rowId && prev.table.activeCell?.columnId === next.table.activeCell?.columnId && prev.table.cellRanges === next.table.cellRanges && prev.moreDetailComponent === next.moreDetailComponent;
 });
 var ERPTableGroupRow = React7.lazy(
-  () => import('./ERPTableGroupRow-PSAPAHGL.js').then((m) => ({ default: m.ERPTableGroupRow }))
+  () => import('./ERPTableGroupRow-E5Q6FYDS.js').then((m) => ({ default: m.ERPTableGroupRow }))
 );
 function ERPTableBody({
   controller,
@@ -3118,6 +3127,83 @@ function resolveColumnReorder(columns, sourceField, destField) {
   if (isIndexColumn(source) || isIndexColumn(dest)) return null;
   return { sourceIndex, destIndex };
 }
+
+// engine/dataOps/columnMenu.ts
+function isColumnMenuCustomItem(item) {
+  return typeof item === "object" && item !== null && "name" in item;
+}
+function isColumnFilterable(column) {
+  const ui = resolveFilterUi(column);
+  return ui != null;
+}
+function isColumnSortableInGrid(column, pagedWindow) {
+  if (!isHeaderColumnSortable(column)) return false;
+  return !pagedWindow || column.columnDef?.sortable === true;
+}
+function isColumnFilterableInGrid(column, pagedWindow) {
+  if (!isColumnFilterable(column)) return false;
+  if (!pagedWindow) return true;
+  const def = column.columnDef?.filter;
+  return def != null && def !== false;
+}
+function buildDefaultColumnMenuItems(ctx) {
+  const items = [];
+  if (ctx.sortable) {
+    items.push("sortAsc", "sortDesc", "sortNone", "separator");
+  }
+  if (ctx.filterable) items.push("filter");
+  if (ctx.hideable) items.push("hideColumn");
+  if (ctx.pinnable) {
+    items.push("pinStart", "pinEnd", "pinNone", "separator");
+  }
+  items.push("autoSize", "columnsPanel");
+  return items;
+}
+function resolveColumnMenuItems(column, config, options) {
+  const pagedWindow = options?.pagedWindow === true;
+  const ctx = {
+    sortable: isColumnSortableInGrid(column, pagedWindow),
+    filterable: isColumnFilterableInGrid(column, pagedWindow),
+    hideable: !isIndexColumn(column),
+    pinnable: !isIndexColumn(column)
+  };
+  const defaults = buildDefaultColumnMenuItems(ctx);
+  if (!config) return defaults;
+  if (typeof config === "function") return config(defaults);
+  return config;
+}
+function columnMenuItemLabelKey(id) {
+  switch (id) {
+    case "sortAsc":
+      return "columnMenu.sortAsc";
+    case "sortDesc":
+      return "columnMenu.sortDesc";
+    case "sortNone":
+      return "columnMenu.sortNone";
+    case "filter":
+      return "columnMenu.filter";
+    case "hideColumn":
+      return "columnMenu.hideColumn";
+    case "pinStart":
+      return "columnMenu.pinStart";
+    case "pinEnd":
+      return "columnMenu.pinEnd";
+    case "pinNone":
+      return "columnMenu.pinNone";
+    case "autoSize":
+      return "columnMenu.autoSize";
+    case "columnsPanel":
+      return "columnMenu.columnsPanel";
+    default:
+      return id;
+  }
+}
+function sortModelForMenuAction(current, colId, action) {
+  if (action === "none") {
+    return current.filter((entry) => entry.colId !== colId);
+  }
+  return [{ colId, sort: action }];
+}
 var GRID_REVALIDATE_EVENT = "pdg-grid:revalidate";
 var LEGACY_GRID_REVALIDATE_EVENT = "erp-table:revalidate";
 function useRevalidateRevision() {
@@ -3832,72 +3918,6 @@ function ColumnGroupHeaderRows({
     `group-row-${level}`
   )) });
 }
-
-// engine/dataOps/columnMenu.ts
-function isColumnMenuCustomItem(item) {
-  return typeof item === "object" && item !== null && "name" in item;
-}
-function isColumnFilterable(column) {
-  const ui = resolveFilterUi(column);
-  return ui != null;
-}
-function buildDefaultColumnMenuItems(ctx) {
-  const items = [];
-  if (ctx.sortable) {
-    items.push("sortAsc", "sortDesc", "sortNone", "separator");
-  }
-  if (ctx.filterable) items.push("filter");
-  if (ctx.hideable) items.push("hideColumn");
-  if (ctx.pinnable) {
-    items.push("pinStart", "pinEnd", "pinNone", "separator");
-  }
-  items.push("autoSize", "columnsPanel");
-  return items;
-}
-function resolveColumnMenuItems(column, config) {
-  const ctx = {
-    sortable: isHeaderColumnSortable(column),
-    filterable: isColumnFilterable(column),
-    hideable: !isIndexColumn(column),
-    pinnable: !isIndexColumn(column)
-  };
-  const defaults = buildDefaultColumnMenuItems(ctx);
-  if (!config) return defaults;
-  if (typeof config === "function") return config(defaults);
-  return config;
-}
-function columnMenuItemLabelKey(id) {
-  switch (id) {
-    case "sortAsc":
-      return "columnMenu.sortAsc";
-    case "sortDesc":
-      return "columnMenu.sortDesc";
-    case "sortNone":
-      return "columnMenu.sortNone";
-    case "filter":
-      return "columnMenu.filter";
-    case "hideColumn":
-      return "columnMenu.hideColumn";
-    case "pinStart":
-      return "columnMenu.pinStart";
-    case "pinEnd":
-      return "columnMenu.pinEnd";
-    case "pinNone":
-      return "columnMenu.pinNone";
-    case "autoSize":
-      return "columnMenu.autoSize";
-    case "columnsPanel":
-      return "columnMenu.columnsPanel";
-    default:
-      return id;
-  }
-}
-function sortModelForMenuAction(current, colId, action) {
-  if (action === "none") {
-    return current.filter((entry) => entry.colId !== colId);
-  }
-  return [{ colId, sort: action }];
-}
 function buildRows(items, column, controller, sortModel, onCustomAction, onOpenFilter, onOpenColumnsPanel, t) {
   const colId = column.fieldName;
   const rows = [];
@@ -3982,9 +4002,10 @@ function ColumnMenuPopover({
     left: pos.left,
     zIndex: 1200
   });
+  const pagedWindow = controller.isPagedWindow();
   const items = useMemo(
-    () => resolveColumnMenuItems(column, itemsConfig),
-    [column, itemsConfig]
+    () => resolveColumnMenuItems(column, itemsConfig, { pagedWindow }),
+    [column, itemsConfig, pagedWindow]
   );
   const rows = useMemo(
     () => buildRows(
@@ -4329,6 +4350,7 @@ function ERPTableHeader({
   const columnMenuItems = host.columnMenuItems;
   const onColumnMenuAction = host.onColumnMenuAction;
   const table = controller.getViewState();
+  const pagedWindow = controller.isPagedWindow();
   const draggedFieldRef = useRef(null);
   const draggedGroupRef = useRef(null);
   const pointerOriginRef = useRef(null);
@@ -4441,8 +4463,8 @@ function ERPTableHeader({
         col.fieldName
       );
     }
-    const sortable = isHeaderColumnSortable(col);
-    const filterUi = resolveFilterUi(col);
+    const sortable = isColumnSortableInGrid(col, pagedWindow);
+    const filterUi = isColumnFilterableInGrid(col, pagedWindow) ? resolveFilterUi(col) : null;
     const customFilter = filterUi?.mode === "custom" ? resolveFilterComponent(filterUi.name, filters) : void 0;
     const filterable = filterUi != null && (filterUi.mode === "builtin" || customFilter != null);
     const filterActive = isColumnFilterActive(filterModel, col.fieldName);
@@ -4605,7 +4627,7 @@ function ERPTableHeader({
   };
   const renderFloatingFilterColumn = (col, index) => {
     const size = columnSizeStyle(col, table.columnWidths, colWindow.layoutWidths);
-    const ui = resolveFilterUi(col);
+    const ui = isColumnFilterableInGrid(col, pagedWindow) ? resolveFilterUi(col) : null;
     if (isIndexColumn(col) || !ui || ui.mode !== "builtin") {
       return /* @__PURE__ */ jsx(
         "th",
@@ -4963,12 +4985,14 @@ function useVirtualWindow(session, items, options) {
       () => {
         const vp = session.getViewport();
         const itemCount = isSparseRowIndex(items) ? session.getUiRowCount() : items.length;
+        const indexRevision = isSparseRowIndex(items) ? items.revision : 0;
         return {
           scrollOffset: vp.scrollOffset,
           viewportSize: vp.viewportSize,
           rowHeight: vp.rowHeight,
           overscan: vp.overscan,
-          itemCount
+          itemCount,
+          indexRevision
         };
       },
       sync,
@@ -4991,7 +5015,7 @@ function useVirtualWindow(session, items, options) {
   };
 }
 var ERPTableGroupRow2 = React7.lazy(
-  () => import('./ERPTableGroupRow-PSAPAHGL.js').then((m) => ({ default: m.ERPTableGroupRow }))
+  () => import('./ERPTableGroupRow-E5Q6FYDS.js').then((m) => ({ default: m.ERPTableGroupRow }))
 );
 var DEFAULT_ROW_HEIGHT = 40;
 function ERPTableVirtualBody({
@@ -7040,6 +7064,9 @@ function isInsideSelect(el) {
   );
 }
 function isGridShortcutKey(e) {
+  if (typeof e.getModifierState === "function" && e.getModifierState("AltGraph")) {
+    return false;
+  }
   if (e.altKey) return true;
   return e.ctrlKey && (e.code === "Space" || e.code === "ArrowUp" || e.code === "ArrowDown" || e.code === "End");
 }
@@ -7054,6 +7081,20 @@ function shouldSkipGridNavigation(target, code) {
   }
   return false;
 }
+function resolveGridKeyScope(target, root) {
+  if (!root) return "cell";
+  if (typeof Element === "undefined" || !(target instanceof Element)) return "page";
+  if (typeof document !== "undefined" && (target === document.body || target === document.documentElement)) {
+    return "page";
+  }
+  const owner = target.closest("[data-pdg-grid]");
+  if (owner && owner !== root) return "other-grid";
+  if (!root.contains(target)) return "outside";
+  if (target.closest('[role="menu"], [role="dialog"], .erp-table-modal')) return "outside";
+  if (target.closest('[role="gridcell"], [data-erp-cell-textarea]')) return "cell";
+  if (target.closest('[role="grid"], [role="treegrid"]') === target) return "cell";
+  return "outside";
+}
 function useGrid(config) {
   const generatedKeyRef = useRef(void 0);
   if (config.tableKey) {
@@ -7066,6 +7107,7 @@ function useGrid(config) {
   const [api, setApi] = useState(null);
   const [session, setSession] = useState(null);
   const [pluginHost, setPluginHost] = useState(null);
+  const [eventStore, setEventStore] = useState(null);
   const [rows, setRows] = useState(null);
   const [, setViewVersion] = useState(0);
   const [undoFlags, setUndoFlags] = useState({ canUndo: false, canRedo: false });
@@ -7073,42 +7115,53 @@ function useGrid(config) {
   const [changelog, setChangelog] = useState([]);
   const pagedIdb = config.persistence === "paged-idb";
   const disabled = pagedIdb && !config.tableKey;
-  const [generation, setGeneration] = useState(0);
-  const grid = useMemo(
-    () => disabled ? null : createGrid({ ...config, tableKey }),
-    [tableKey, disabled, generation, config.columns, config.columnDefs, config.store]
-  );
+  const configRef = useRef(config);
+  configRef.current = config;
+  const teardownRef = useRef(Promise.resolve());
   useEffect(() => {
     let cancelled = false;
+    let built = null;
     setController(null);
     setApi(null);
     setSession(null);
     setPluginHost(null);
+    setEventStore(null);
     setRows(null);
-    if (!grid) return void 0;
-    void grid.ready.then((result) => {
+    if (disabled) return void 0;
+    const previous = teardownRef.current;
+    void previous.then(() => {
       if (cancelled) return;
-      setController(result.controller);
-      setApi(result.api);
-      setSession(result.session);
-      setPluginHost(result.pluginHost);
+      const grid = createGrid({ ...configRef.current, tableKey });
+      built = grid;
+      void grid.ready.then((result) => {
+        if (cancelled) return;
+        setController(result.controller);
+        setApi(result.api);
+        setSession(result.session);
+        setPluginHost(result.pluginHost);
+        setEventStore(result.eventStore);
+      });
     });
     return () => {
       cancelled = true;
-      if (pagedIdb) {
-        void grid.ready.then((result) => result.controller.dispose());
-        setGeneration((g) => g + 1);
+      const grid = built;
+      if (!grid) {
+        teardownRef.current = previous;
+        return;
       }
+      teardownRef.current = previous.then(
+        () => grid.ready.then(
+          (result) => pagedIdb ? result.controller.dispose() : result.controller.releaseResources(),
+          () => void 0
+        )
+      );
     };
-  }, [grid, pagedIdb]);
+  }, [tableKey, disabled, pagedIdb, config.columns, config.columnDefs, config.store]);
   useEffect(() => {
     if (!controller || config.rowData === void 0) return;
-    controller.applyHostRowData(
-      config.rowData,
-      config.columnDefs,
-      config.getRowId
-    );
-  }, [controller, config.rowData, config.columnDefs, config.getRowId]);
+    const { columnDefs, getRowId } = configRef.current;
+    controller.applyHostRowData(config.rowData, columnDefs, getRowId);
+  }, [controller, config.rowData]);
   useEffect(() => {
     if (!controller || !config.columnDefs) return;
     for (const def of flattenColDefOrGroup(config.columnDefs)) {
@@ -7180,7 +7233,7 @@ function useGrid(config) {
       unsubChangelog();
     };
   }, [controller]);
-  if (!grid || !controller || !api || !session || !pluginHost || !controller.getViewState()) {
+  if (!eventStore || !controller || !api || !session || !pluginHost || !controller.getViewState()) {
     return { ready: false };
   }
   return {
@@ -7189,7 +7242,7 @@ function useGrid(config) {
     api,
     session,
     pluginHost,
-    eventStore: grid.eventStore,
+    eventStore,
     store: isPersistentStore(config.store) ? config.store : DEFAULT_MEMORY_STORE,
     tableKey,
     rows: rows ?? controller.getSnapShot("active"),
@@ -7227,12 +7280,6 @@ function assignRef(ref, value) {
 }
 function DataGrid(props) {
   const {
-    columns,
-    rowAccess,
-    rows,
-    actor,
-    store,
-    tableKey,
     apiRef,
     onReady,
     onGridReady,
@@ -7246,8 +7293,6 @@ function DataGrid(props) {
     footer,
     footerRows,
     tableHeight,
-    activeCollection,
-    recordPerPage,
     multiSelectConfig,
     moreDetailComponent,
     virtualization,
@@ -7262,10 +7307,7 @@ function DataGrid(props) {
     themeToggle = true,
     components,
     filterComponents,
-    plugins,
     rowData,
-    columnDefs,
-    getRowId,
     floatingFilter = false,
     loading = false,
     loadingOverlayComponent,
@@ -7279,10 +7321,15 @@ function DataGrid(props) {
     onClipboardPaste,
     columnMenuItems,
     onColumnMenuAction,
-    stateKey,
+    useDependOn,
     pinnedTopRowData,
     pinnedBottomRowData
   } = props;
+  const rootRef = useRef(null);
+  const insideEventRef = useRef(null);
+  const markInsideEvent = useCallback((e) => {
+    insideEventRef.current = e.nativeEvent;
+  }, []);
   const requestedTheme = themeProp ?? themeDefault;
   const requestedKey = JSON.stringify(requestedTheme.params);
   const [preferDark, setPreferDark] = useState(
@@ -7303,22 +7350,8 @@ function DataGrid(props) {
     setPreferDark((value) => !value);
   }, []);
   const result = useGrid({
-    store,
-    tableKey,
-    activeCollection,
-    columns,
-    rows,
-    actor,
-    rowAccess,
-    tableHeight,
-    recordPerPage,
-    rowHeight: resolvedTheme.params.rowHeight,
-    remoteApi,
-    plugins,
-    rowData,
-    columnDefs,
-    getRowId,
-    stateKey
+    ...props,
+    rowHeight: resolvedTheme.params.rowHeight
   });
   useEffect(() => {
     if (!result.ready) return;
@@ -7356,7 +7389,11 @@ function DataGrid(props) {
       }
     };
     const handler = (e) => {
-      if (isGridShortcutKey(e)) {
+      const scope = resolveGridKeyScope(e.target, rootRef.current);
+      if (scope === "other-grid") return;
+      const shortcut = isGridShortcutKey(e);
+      if (scope === "outside" && !shortcut) return;
+      if (shortcut) {
         e.preventDefault();
         e.stopPropagation();
       } else if (shouldSkipGridNavigation(e.target, e.code)) {
@@ -7381,6 +7418,22 @@ function DataGrid(props) {
       window.removeEventListener("keydown", handler, true);
     };
   }, [result.ready, result]);
+  const readyController = result.ready ? result.controller : null;
+  useEffect(() => {
+    if (!readyController || typeof document === "undefined") return;
+    const onDocument = (event) => {
+      window.setTimeout(() => {
+        if (insideEventRef.current === event) return;
+        void readyController.leaveGridFocus();
+      }, 0);
+    };
+    document.addEventListener("focusin", onDocument, true);
+    document.addEventListener("pointerdown", onDocument, true);
+    return () => {
+      document.removeEventListener("focusin", onDocument, true);
+      document.removeEventListener("pointerdown", onDocument, true);
+    };
+  }, [readyController]);
   useGridHostEvents({
     ready: result.ready,
     controller: result.ready ? result.controller : null,
@@ -7467,11 +7520,15 @@ function DataGrid(props) {
       filterComponents,
       columnMenuItems,
       onColumnMenuAction,
+      useDependOn,
       children: /* @__PURE__ */ jsx(
         "div",
         {
+          ref: rootRef,
           className: "pdg-grid erp-table",
           dir,
+          onFocusCapture: markInsideEvent,
+          onPointerDownCapture: markInsideEvent,
           "data-pdg-grid": true,
           "data-erp-table": true,
           "data-erp-theme": themeMode,
@@ -9311,6 +9368,6 @@ function VirtualList({
   );
 }
 
-export { CellRenderer, DEFAULT_CELL_COMPONENTS, DEFAULT_PERFORMANCE_BUDGETS, DataGrid, ERPTable, GRID_REVALIDATE_EVENT, GridHistoryPanel, GridOfflineStatus, GridOverlays, LEGACY_GRID_REVALIDATE_EVENT, TextAreaCell, VirtualList, buildVirtualWindow, checkBudget, highlightIfCurrentSearch, highlightSearchText, injectERPTableStyles, injectGridStyles, isGridShortcutKey, mergeCellComponents, resolveBoundCellNode, resolveCustomCellNode, resolveFilterComponent, resolveGridOverlay, resolveRegisteredCellNode, runBenchmark, shouldSkipGridNavigation, useERPTable, useGrid, useVirtualWindow };
+export { CellRenderer, DEFAULT_CELL_COMPONENTS, DEFAULT_PERFORMANCE_BUDGETS, DataGrid, ERPTable, GRID_REVALIDATE_EVENT, GridHistoryPanel, GridOfflineStatus, GridOverlays, LEGACY_GRID_REVALIDATE_EVENT, TextAreaCell, VirtualList, buildVirtualWindow, checkBudget, highlightIfCurrentSearch, highlightSearchText, injectERPTableStyles, injectGridStyles, isGridShortcutKey, mergeCellComponents, resolveBoundCellNode, resolveCustomCellNode, resolveFilterComponent, resolveGridKeyScope, resolveGridOverlay, resolveRegisteredCellNode, runBenchmark, shouldSkipGridNavigation, useERPTable, useGrid, useVirtualWindow };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map