@ai-matrx/design-system 0.21.3 → 0.21.4

package/dist/data-table/index.d.cts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ReactNode } from 'react';
-import { g as MatrxDataTableProps, h as TableViewSnapshot } from '../types-BarjBFyG.cjs';
-export { A as AnyOfColumnSearch, i as CellEditType, j as CellEditsMap, e as ColumnFilterKind, a as ColumnFilterValue, C as ColumnFiltersState, M as MatrxColumnDef, f as MatrxDataTableCopyConfig, c as MatrxDataTableDensity, k as MatrxDataTableDetailConfig, l as MatrxDataTableEditConfig, m as MatrxDataTableEmptyState, n as MatrxDataTableFilterUi, o as MatrxDataTableHierarchyConfig, p as MatrxDataTableHierarchyMove, q as MatrxDataTableMobileCardControls, r as MatrxDataTableQueryControl, d as MatrxDataTableQueryState, s as MatrxDataTableRecordControls, t as MatrxDataTableSelectionConfig, u as MatrxDataTableSourceProcessing, v as MatrxDataTableToolbar, w as MatrxDataTableUrlStateConfig, x as MatrxDataTableWindowConfig, y as MatrxTablePagination, z as SortDirection, S as SortState, b as TableSavedViewsProps, T as TableSearchMatchMode, B as TableViewQuery, D as TextFilterMode, E as ToolbarFacet } from '../types-BarjBFyG.cjs';
+import { h as MatrxDataTableProps, i as TableViewSnapshot, c as MatrxDataTableRecordControls } from '../types-DRusLYrU.cjs';
+export { A as AnyOfColumnSearch, j as CellEditType, k as CellEditsMap, f as ColumnFilterKind, a as ColumnFilterValue, C as ColumnFiltersState, M as MatrxColumnDef, l as MatrxDataTableContextMenuConfig, g as MatrxDataTableCopyConfig, d as MatrxDataTableDensity, m as MatrxDataTableDetailConfig, n as MatrxDataTableEditConfig, o as MatrxDataTableEmptyState, p as MatrxDataTableFilterUi, q as MatrxDataTableHierarchyConfig, r as MatrxDataTableHierarchyMove, s as MatrxDataTableMobileCardControls, t as MatrxDataTableQueryControl, e as MatrxDataTableQueryState, u as MatrxDataTableSelectionConfig, v as MatrxDataTableSourceProcessing, w as MatrxDataTableToolbar, x as MatrxDataTableUrlStateConfig, y as MatrxDataTableWindowConfig, z as MatrxTablePagination, B as SortDirection, S as SortState, b as TableSavedViewsProps, T as TableSearchMatchMode, D as TableViewQuery, E as TextFilterMode, F as ToolbarFacet } from '../types-DRusLYrU.cjs';
 export { MatrxDataTableHost, MatrxDataTableProvider, MatrxTableRowAlchemy, TableDoors, TableEntityRefProps, TableLinkProps, TablePeekProps, TableSidePanelProps, TableToolbarActionProps, TableWindowPanelProps, useMatrxDataTableHost, useMatrxTableRowAlchemy } from './host.cjs';
 import { CopyControlProps } from './copy-types.cjs';
 export { AgentPayloadInput } from './copy-types.cjs';
@@ -71,9 +71,10 @@ declare function SavedViewsControl({ views, activeId, loading, error, dirty, onS
 declare function parseTableViewSnapshot(raw: unknown): TableViewSnapshot | null;
 
 /** Keeps Alchemy mounted beside row actions, never inside a transient host popup. */
-declare function MatrxTableRowAlchemyProvider({ copy, placement, children }: {
+declare function MatrxTableRowAlchemyProvider({ copy, placement, controls, children }: {
     copy: CopyControlProps;
     placement: "inline" | "menu";
+    controls: MatrxDataTableRecordControls;
     children: ReactNode;
 }): React.JSX.Element;
 
@@ -95,4 +96,4 @@ interface TableViewTabsProps {
 /** One shared tab strip; hosts may own URL state without copying its UI. */
 declare function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related }: TableViewTabsProps): React.JSX.Element;
 
-export { MatrxDataTable, MatrxDataTableProps, MatrxTableRowAlchemyProvider, SavedViewsControl, type SavedViewsControlProps, TableTitleRow, type TableTitleRowProps, TableViewSnapshot, type TableViewTab, TableViewTabs, type TableViewTabsProps, parseTableViewSnapshot };
+export { MatrxDataTable, MatrxDataTableProps, MatrxDataTableRecordControls, MatrxTableRowAlchemyProvider, SavedViewsControl, type SavedViewsControlProps, TableTitleRow, type TableTitleRowProps, TableViewSnapshot, type TableViewTab, TableViewTabs, type TableViewTabsProps, parseTableViewSnapshot };

package/dist/data-table/index.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ReactNode } from 'react';
-import { g as MatrxDataTableProps, h as TableViewSnapshot } from '../types-JFlsIv-0.js';
-export { A as AnyOfColumnSearch, i as CellEditType, j as CellEditsMap, e as ColumnFilterKind, a as ColumnFilterValue, C as ColumnFiltersState, M as MatrxColumnDef, f as MatrxDataTableCopyConfig, c as MatrxDataTableDensity, k as MatrxDataTableDetailConfig, l as MatrxDataTableEditConfig, m as MatrxDataTableEmptyState, n as MatrxDataTableFilterUi, o as MatrxDataTableHierarchyConfig, p as MatrxDataTableHierarchyMove, q as MatrxDataTableMobileCardControls, r as MatrxDataTableQueryControl, d as MatrxDataTableQueryState, s as MatrxDataTableRecordControls, t as MatrxDataTableSelectionConfig, u as MatrxDataTableSourceProcessing, v as MatrxDataTableToolbar, w as MatrxDataTableUrlStateConfig, x as MatrxDataTableWindowConfig, y as MatrxTablePagination, z as SortDirection, S as SortState, b as TableSavedViewsProps, T as TableSearchMatchMode, B as TableViewQuery, D as TextFilterMode, E as ToolbarFacet } from '../types-JFlsIv-0.js';
+import { h as MatrxDataTableProps, i as TableViewSnapshot, c as MatrxDataTableRecordControls } from '../types-CbGNfo7r.js';
+export { A as AnyOfColumnSearch, j as CellEditType, k as CellEditsMap, f as ColumnFilterKind, a as ColumnFilterValue, C as ColumnFiltersState, M as MatrxColumnDef, l as MatrxDataTableContextMenuConfig, g as MatrxDataTableCopyConfig, d as MatrxDataTableDensity, m as MatrxDataTableDetailConfig, n as MatrxDataTableEditConfig, o as MatrxDataTableEmptyState, p as MatrxDataTableFilterUi, q as MatrxDataTableHierarchyConfig, r as MatrxDataTableHierarchyMove, s as MatrxDataTableMobileCardControls, t as MatrxDataTableQueryControl, e as MatrxDataTableQueryState, u as MatrxDataTableSelectionConfig, v as MatrxDataTableSourceProcessing, w as MatrxDataTableToolbar, x as MatrxDataTableUrlStateConfig, y as MatrxDataTableWindowConfig, z as MatrxTablePagination, B as SortDirection, S as SortState, b as TableSavedViewsProps, T as TableSearchMatchMode, D as TableViewQuery, E as TextFilterMode, F as ToolbarFacet } from '../types-CbGNfo7r.js';
 export { MatrxDataTableHost, MatrxDataTableProvider, MatrxTableRowAlchemy, TableDoors, TableEntityRefProps, TableLinkProps, TablePeekProps, TableSidePanelProps, TableToolbarActionProps, TableWindowPanelProps, useMatrxDataTableHost, useMatrxTableRowAlchemy } from './host.js';
 import { CopyControlProps } from './copy-types.js';
 export { AgentPayloadInput } from './copy-types.js';
@@ -71,9 +71,10 @@ declare function SavedViewsControl({ views, activeId, loading, error, dirty, onS
 declare function parseTableViewSnapshot(raw: unknown): TableViewSnapshot | null;
 
 /** Keeps Alchemy mounted beside row actions, never inside a transient host popup. */
-declare function MatrxTableRowAlchemyProvider({ copy, placement, children }: {
+declare function MatrxTableRowAlchemyProvider({ copy, placement, controls, children }: {
     copy: CopyControlProps;
     placement: "inline" | "menu";
+    controls: MatrxDataTableRecordControls;
     children: ReactNode;
 }): React.JSX.Element;
 
@@ -95,4 +96,4 @@ interface TableViewTabsProps {
 /** One shared tab strip; hosts may own URL state without copying its UI. */
 declare function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related }: TableViewTabsProps): React.JSX.Element;
 
-export { MatrxDataTable, MatrxDataTableProps, MatrxTableRowAlchemyProvider, SavedViewsControl, type SavedViewsControlProps, TableTitleRow, type TableTitleRowProps, TableViewSnapshot, type TableViewTab, TableViewTabs, type TableViewTabsProps, parseTableViewSnapshot };
+export { MatrxDataTable, MatrxDataTableProps, MatrxDataTableRecordControls, MatrxTableRowAlchemyProvider, SavedViewsControl, type SavedViewsControlProps, TableTitleRow, type TableTitleRowProps, TableViewSnapshot, type TableViewTab, TableViewTabs, type TableViewTabsProps, parseTableViewSnapshot };

package/dist/data-table/index.js

@@ -6,11 +6,11 @@ import {
   Fragment as Fragment6,
   isValidElement as isValidElement2,
   useCallback as useCallback6,
-  useEffect as useEffect14,
+  useEffect as useEffect15,
   useId as useId2,
   useLayoutEffect as useLayoutEffect2,
   useMemo as useMemo7,
-  useRef as useRef12,
+  useRef as useRef13,
   useState as useState21
 } from "react";
 import {
@@ -1886,6 +1886,12 @@ function MatrxTableRowAlchemyScope({ value, children }) {
 function useMatrxTableRowAlchemy() {
   return useContext4(RowAlchemyContext);
 }
+var ROW_CONTROLS_SLOT = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.table-row-controls-context");
+var rowControlsRegistry = globalThis;
+var RowControlsContext = rowControlsRegistry[ROW_CONTROLS_SLOT] ??= createContext4(null);
+function MatrxTableRowControlsScope({ value, children }) {
+  return /* @__PURE__ */ jsx18(RowControlsContext.Provider, { value, children });
+}
 
 // src/data-table/useTableNotice.tsx
 import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
@@ -5592,7 +5598,7 @@ import {
 // src/data-table/RowAlchemyLauncher.tsx
 import { useEffect as useEffect8, useRef as useRef9, useState as useState13 } from "react";
 import { jsx as jsx29, jsxs as jsxs20 } from "react/jsx-runtime";
-function MatrxTableRowAlchemyProvider({ copy, placement, children }) {
+function MatrxTableRowAlchemyProvider({ copy, placement, controls, children }) {
   const controller = useRef9(null);
   const { CopyControls } = useMatrxDataTableHost();
   const [active, setActive] = useState13(false);
@@ -5609,6 +5615,7 @@ function MatrxTableRowAlchemyProvider({ copy, placement, children }) {
   }, [active, placement]);
   const value = {
     copy,
+    controls,
     placement,
     ready: active,
     activate: () => setActive(true),
@@ -7442,7 +7449,7 @@ function DirtySavePill({
 }
 
 // src/data-table/EditableTableCell.tsx
-import { useState as useState19 } from "react";
+import { useEffect as useEffect14, useRef as useRef12, useState as useState19 } from "react";
 import { jsx as jsx38, jsxs as jsxs28 } from "react/jsx-runtime";
 function CellEditShell({
   href,
@@ -7489,9 +7496,13 @@ function EditableTableCell({
   onCommit,
   className,
   href,
-  editTrigger = "click"
+  editTrigger = "click",
+  editRequest
 }) {
   const [open, setOpen] = useState19(false);
+  useEffect14(() => {
+    if (editRequest !== void 0) setOpen(true);
+  }, [editRequest]);
   const usePencil = Boolean(href) || editTrigger === "pencil";
   if (editType === "string") {
     return /* @__PURE__ */ jsx38(
@@ -7503,7 +7514,8 @@ function EditableTableCell({
         onCommit,
         ...className === void 0 ? {} : { className },
         ...href === void 0 ? {} : { href },
-        usePencil
+        usePencil,
+        ...editRequest === void 0 ? {} : { editRequest }
       }
     );
   }
@@ -7578,10 +7590,18 @@ function InlineStringEditor({
   onCommit,
   className,
   href,
-  usePencil
+  usePencil,
+  editRequest
 }) {
   const [editing, setEditing] = useState19(false);
   const [draft, setDraft] = useState19(value);
+  const handledEditRequest = useRef12(void 0);
+  useEffect14(() => {
+    if (editRequest === void 0 || handledEditRequest.current === editRequest) return;
+    handledEditRequest.current = editRequest;
+    setDraft(value);
+    setEditing(true);
+  }, [editRequest, value]);
   if (!editing) {
     if (usePencil) {
       return /* @__PURE__ */ jsx38(
@@ -8505,7 +8525,7 @@ function MatrxDataTableWithUrlState({
     ...urlState.history === void 0 ? {} : { history: urlState.history },
     ...urlState.textHistory === void 0 ? {} : { textHistory: urlState.textHistory }
   });
-  useEffect14(() => {
+  useEffect15(() => {
     if (activeUrlTableIds.has(urlState.id)) {
       throw new Error(
         `Duplicate MatrxDataTable urlState.id "${urlState.id}" on one page. Give every table a unique stable id.`
@@ -8575,6 +8595,9 @@ function MatrxDataTableWithUrlState({
   );
 }
 var COLUMN_REORDER_ACTIVATION_DISTANCE = 6;
+function TableContextPassthrough({ children }) {
+  return /* @__PURE__ */ jsx41(Fragment7, { children });
+}
 function MatrxDataTableCore({
   data: suppliedData,
   columns,
@@ -8601,6 +8624,7 @@ function MatrxDataTableCore({
   detail,
   window: windowConfig,
   copy,
+  contextMenu,
   rowCopyPlacement = "inline",
   edit,
   hierarchy,
@@ -8630,12 +8654,13 @@ function MatrxDataTableCore({
 }) {
   const appendQuery = query?.mode === "controlled-append" ? query : null;
   const appendQueryKey = appendQuery?.pagination.queryKey ?? null;
-  const committedAppendQueryKey = useRef12(appendQueryKey);
+  const committedAppendQueryKey = useRef13(appendQueryKey);
   const appendSourceChanged = appendQuery !== null && committedAppendQueryKey.current !== appendQueryKey;
   const data = appendQuery ? appendQuery.pagination.rows : suppliedData;
   const isLoading = appendQuery ? appendQuery.pagination.loading : suppliedLoading;
   const isFetching = appendQuery ? appendQuery.pagination.isFetchingNextPage : suppliedFetching;
   const host = useMatrxDataTableHost();
+  const ContextMenuBoundary = host.ContextMenuBoundary ?? TableContextPassthrough;
   const resolvedDensity = density ?? host.defaultDensity ?? "normal";
   const SavedViews = host.SavedViews;
   const Link = host.Link ?? DefaultTableLink;
@@ -8644,7 +8669,7 @@ function MatrxDataTableCore({
   const [savedViewError, setSavedViewError] = useState21(null);
   const [toolbarActionError, setToolbarActionError] = useState21(null);
   const [toolbarActionPending, setToolbarActionPending] = useState21({ refresh: false, add: false });
-  const toolbarActionPendingRef = useRef12({ refresh: false, add: false });
+  const toolbarActionPendingRef = useRef13({ refresh: false, add: false });
   const CHECKBOX_TAP_AREA = "h-4 w-4 touch-manipulation";
   const mobileCardsClass = mobileCardsBreakpoint === "lg" ? "lg:hidden" : "sm:hidden";
   const tableWithCardsClass = mobileCardsBreakpoint === "lg" ? "max-lg:hidden" : "max-sm:hidden";
@@ -8782,8 +8807,10 @@ function MatrxDataTableCore({
   const [windowRowSnapshot, setWindowRowSnapshot] = useState21(null);
   const editScopeKey = appendQueryKey === null ? "\0local" : `append:${appendQueryKey}`;
   const [editsByScope, setEditsByScope] = useState21({});
-  const editRevisionRef = useRef12({});
+  const editRevisionRef = useRef13({});
   const [savingByScope, setSavingByScope] = useState21({});
+  const savingScopesRef = useRef13(/* @__PURE__ */ new Set());
+  const [editRequest, setEditRequest] = useState21(null);
   const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = useState21(false);
   const edits = editsByScope[editScopeKey]?.values ?? {};
   const saving = (savingByScope[editScopeKey] ?? 0) > 0;
@@ -8851,7 +8878,7 @@ function MatrxDataTableCore({
     rows: Object.entries(draft.values).map(([rowId, columns2]) => ({ rowId, columns: columns2 }))
   }));
   const selection = appendSourceChanged && selectionConfig ? { ...selectionConfig, selectedIds: [] } : selectionConfig;
-  useEffect14(() => {
+  useEffect15(() => {
     const previous = committedAppendQueryKey.current;
     committedAppendQueryKey.current = appendQueryKey;
     if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
@@ -8869,13 +8896,13 @@ function MatrxDataTableCore({
     onWindowRowIdChange,
     selectionConfig
   ]);
-  const scrollRef = useRef12(null);
-  const tableRef = useRef12(null);
-  const tableHeaderRef = useRef12(null);
-  const cardsScrollRef = useRef12(null);
+  const scrollRef = useRef13(null);
+  const tableRef = useRef13(null);
+  const tableHeaderRef = useRef13(null);
+  const cardsScrollRef = useRef13(null);
   const [documentStickyHeader, setDocumentStickyHeader] = useState21(false);
-  const documentStickyHeaderRef = useRef12(false);
-  const previousAppendKeyForScrollReset = useRef12(appendQueryKey);
+  const documentStickyHeaderRef = useRef13(false);
+  const previousAppendKeyForScrollReset = useRef13(appendQueryKey);
   useLayoutEffect2(() => {
     const previous = previousAppendKeyForScrollReset.current;
     previousAppendKeyForScrollReset.current = appendQueryKey;
@@ -8901,7 +8928,7 @@ function MatrxDataTableCore({
     ...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.thresholdPx !== void 0 ? { thresholdPx: appendScrollPolicy.thresholdPx } : {},
     ...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.intentTimeoutMs !== void 0 ? { intentTimeoutMs: appendScrollPolicy.intentTimeoutMs } : {}
   });
-  const rootRef = useRef12(null);
+  const rootRef = useRef13(null);
   useClippedContentGuard(rootRef, {
     label: typeof copy === "object" && copy.listLabel ? `Table: ${copy.listLabel}` : "MatrxDataTable"
   });
@@ -8921,7 +8948,7 @@ function MatrxDataTableCore({
       behavior: "smooth"
     });
   };
-  useEffect14(() => {
+  useEffect15(() => {
     updateScrollHint();
     window.addEventListener("resize", updateScrollHint);
     const el = scrollRef.current;
@@ -9003,18 +9030,18 @@ function MatrxDataTableCore({
     () => normalizeColumnWidthsForColumns(columnState?.widths, columns)
   );
   const [fixedTableGeometry, setFixedTableGeometry] = useState21(null);
-  const knownColumnIds = useRef12(new Set(columns.map(columnId)));
-  const draggedColumnId = useRef12(null);
-  const columnDragActive = useRef12(false);
-  const columnDragRaf = useRef12(null);
-  const columnDragScrollDirection = useRef12(0);
+  const knownColumnIds = useRef13(new Set(columns.map(columnId)));
+  const draggedColumnId = useRef13(null);
+  const columnDragActive = useRef13(false);
+  const columnDragRaf = useRef13(null);
+  const columnDragScrollDirection = useRef13(0);
   const [columnDragPreview, setColumnDragPreview] = useState21(null);
   const stopColumnDragScroll = useCallback6(() => {
     if (columnDragRaf.current !== null) cancelAnimationFrame(columnDragRaf.current);
     columnDragRaf.current = null;
     columnDragScrollDirection.current = 0;
   }, []);
-  useEffect14(() => () => {
+  useEffect15(() => () => {
     columnDragActive.current = false;
     stopColumnDragScroll();
   }, [stopColumnDragScroll]);
@@ -9062,7 +9089,7 @@ function MatrxDataTableCore({
     () => normalizeColumnWidthsForColumns(columnState?.widths ?? columnWidths, columns),
     [columns, columnState?.widths, columnWidths]
   );
-  const resizeGestureSnapshotRef = useRef12(null);
+  const resizeGestureSnapshotRef = useRef13(null);
   const measureVisibleColumnWidths = useCallback6(() => {
     const measured = {};
     const headers = tableRef.current ? Array.from(tableRef.current.querySelectorAll(
@@ -9135,7 +9162,7 @@ function MatrxDataTableCore({
     }
     setColumnWidths(normalized);
   }, [columnIds, columnState, columns, measureFixedTableGeometry, measureVisibleColumnWidths]);
-  useEffect14(() => {
+  useEffect15(() => {
     const ids = columns.map(columnId);
     if (columnState) return;
     const previousIds = knownColumnIds.current;
@@ -9205,6 +9232,7 @@ function MatrxDataTableCore({
     [visibleColumns]
   );
   const tableCopySourceNamespace = useId2();
+  const tableContextMenuInstanceId = useId2();
   const tableDndContextId = useId2();
   const defaultCopyTitle = toolbar?.title || "Table";
   const defaultCopy = useMemo7(() => ({
@@ -9320,8 +9348,8 @@ function MatrxDataTableCore({
     intelligentSearchEnabled,
     searchScope
   ]);
-  const lastNotifiedViewRows = useRef12(null);
-  useEffect14(() => {
+  const lastNotifiedViewRows = useRef13(null);
+  useEffect15(() => {
     if (!onViewChange) {
       lastNotifiedViewRows.current = null;
       return;
@@ -9330,7 +9358,7 @@ function MatrxDataTableCore({
     lastNotifiedViewRows.current = processed;
     if (changed) onViewChange(processed);
   }, [processed, onViewChange]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (controlledQuery) return;
     setInternalPage(1);
   }, [
@@ -9382,7 +9410,7 @@ function MatrxDataTableCore({
     const start = (safePage - 1) * effectivePageSize;
     return processed.slice(start, start + effectivePageSize);
   }, [processed, safePage, effectivePageSize, pageSize, remoteQuery, hidePagination, localProgressiveEnabled, progressiveRows.rows]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!controlledQuery || controlledQuery.state.page === safePage) return;
     emitControlledQueryChange({ page: safePage });
   }, [controlledQuery, emitControlledQueryChange, safePage]);
@@ -9406,13 +9434,15 @@ function MatrxDataTableCore({
   const showToolbarCopy = effectiveCopy !== void 0 && effectiveCopy.showToolbar !== false;
   const renderRowActions = (row, controls) => {
     const actions = rowActions?.(row, controls);
-    if (!effectiveCopy || !showRowCopy) return actions;
+    const scopedActions = /* @__PURE__ */ jsx41(MatrxTableRowControlsScope, { value: controls, children: actions });
+    if (!effectiveCopy || !showRowCopy) return scopedActions;
     return /* @__PURE__ */ jsx41(
       MatrxTableRowAlchemyProvider,
       {
         copy: tableRowCopyProps(effectiveCopy, row, `${tableCopySourceNamespace}:row:${getRowId(row)}`, copy === void 0 ? declaredVisibleCopyColumns : void 0),
         placement: rowCopyInMenu ? "menu" : "inline",
-        children: actions
+        controls,
+        children: scopedActions
       }
     );
   };
@@ -9529,6 +9559,37 @@ function MatrxDataTableCore({
       return next;
     });
   };
+  const beginRowEdit = (row) => {
+    const column = visibleColumns.find(
+      (candidate) => candidate.editable && (candidate.editableIf?.(row) ?? true)
+    );
+    if (!column) return;
+    const field = column.accessorKey ? String(column.accessorKey) : columnId(column);
+    setEditRequest((current) => ({
+      rowId: getRowId(row),
+      field,
+      nonce: (current?.nonce ?? 0) + 1
+    }));
+  };
+  const buildRecordControls = (row) => {
+    const rowId = getRowId(row);
+    const pending = edits[rowId];
+    return {
+      closeDetail: () => setSelectedId(null),
+      openDetail: () => openDetail(row),
+      openWindow: () => openWindow(row),
+      closeWindow,
+      hasPendingEdits: Boolean(pending),
+      discardPendingEdits: () => discardRowEdits(rowId),
+      ...pending ? { cancelEdits: () => discardRowEdits(rowId) } : {},
+      ...pending && edit?.onSave && !edit.autoSave && !saving ? {
+        saveEdits: () => handleSaveEdits(rowId)
+      } : {},
+      ...editEnabled && visibleColumns.some(
+        (column) => column.editable && (column.editableIf?.(row) ?? true)
+      ) ? { beginEdit: () => beginRowEdit(row) } : {}
+    };
+  };
   const hierarchyRows = hierarchy?.rows ?? data;
   const hierarchyGetParentId = hierarchy?.getParentId;
   const hierarchyIndex = useMemo7(() => {
@@ -9700,15 +9761,18 @@ function MatrxDataTableCore({
     }
     setDraggedRowId(null);
   };
-  const handleSaveEdits = async () => {
+  const handleSaveEdits = async (rowId) => {
     if (!edit?.onSave || changeCount === 0) return;
     const scope = editScopeKey;
+    if (savingScopesRef.current.has(scope)) return;
     const draft = editsByScope[scope];
     if (!draft) return;
-    const values = draft.values;
-    const revisions = draft.revisions;
+    const values = rowId ? draft.values[rowId] ? { [rowId]: draft.values[rowId] } : {} : draft.values;
+    if (Object.keys(values).length === 0) return;
+    const revisions = rowId ? draft.revisions[rowId] ? { [rowId]: draft.revisions[rowId] } : {} : draft.revisions;
     const rows = appendQueryKey === null ? data : draft.rows;
     const save = edit.onSave;
+    savingScopesRef.current.add(scope);
     startSaving(scope);
     try {
       await Promise.resolve().then(() => save(values, rows));
@@ -9716,16 +9780,16 @@ function MatrxDataTableCore({
         const currentDraft = current[scope];
         if (!currentDraft) return current;
         const nextValues = {};
-        for (const [rowId, rowValues] of Object.entries(currentDraft.values)) {
-          const savedRow = values[rowId];
-          const savedRevisions = revisions[rowId];
-          const currentRevisions = currentDraft.revisions[rowId];
+        for (const [rowId2, rowValues] of Object.entries(currentDraft.values)) {
+          const savedRow = values[rowId2];
+          const savedRevisions = revisions[rowId2];
+          const currentRevisions = currentDraft.revisions[rowId2];
           const remaining = Object.fromEntries(
             Object.entries(rowValues).filter(
               ([field]) => !Object.hasOwn(savedRow ?? {}, field) || currentRevisions?.[field] !== savedRevisions?.[field]
             )
           );
-          if (Object.keys(remaining).length > 0) nextValues[rowId] = remaining;
+          if (Object.keys(remaining).length > 0) nextValues[rowId2] = remaining;
         }
         return { ...current, [scope]: { ...currentDraft, values: nextValues } };
       });
@@ -9735,6 +9799,7 @@ function MatrxDataTableCore({
         `Couldn't save: ${e instanceof Error ? e.message : String(e)}`
       );
     } finally {
+      savingScopesRef.current.delete(scope);
       finishSaving(scope);
     }
   };
@@ -9742,6 +9807,17 @@ function MatrxDataTableCore({
     setEdits({});
     edit?.onCancel?.();
   };
+  useEffect15(() => {
+    if (!host.rowContextRegistry || !contextMenu && !host.createDefaultRowContext) return;
+    return host.rowContextRegistry.register(tableContextMenuInstanceId, (rowId) => {
+      const row = data.find((candidate) => getRowId(candidate) === rowId);
+      if (!row) return null;
+      const pending = edits[rowId];
+      const displayRow = applyRowEdits(row, pending);
+      const controls = buildRecordControls(displayRow);
+      return contextMenu?.resolveRowContext(displayRow, controls) ?? host.createDefaultRowContext?.(displayRow, controls) ?? null;
+    });
+  }, [buildRecordControls, contextMenu, data, getRowId, host.createDefaultRowContext, host.rowContextRegistry, tableContextMenuInstanceId]);
   const showActionsCol = windowEnabled || Boolean(rowActions) || showInlineRowCopy;
   const selectedIdSet = useMemo7(
     () => new Set(selection?.selectedIds ?? []),
@@ -9759,7 +9835,7 @@ function MatrxDataTableCore({
     () => data.filter((row) => selectedIdSet.has(getRowId(row))),
     [data, selectedIdSet, getRowId]
   );
-  const lastToggledIndex = useRef12(null);
+  const lastToggledIndex = useRef13(null);
   const setSelectedIds = (next) => selection?.onSelectedIdsChange([...next]);
   const toggleRowSelected = (index, shiftKey) => {
     if (!selection) return;
@@ -9822,7 +9898,8 @@ function MatrxDataTableCore({
           dirty: Boolean(rowEdits && field in rowEdits),
           onCommit: (next) => commitCell(id, field, next),
           ...href === void 0 ? {} : { href },
-          ...col.editTrigger === void 0 ? {} : { editTrigger: col.editTrigger }
+          ...col.editTrigger === void 0 ? {} : { editTrigger: col.editTrigger },
+          ...editRequest?.rowId === id && editRequest.field === field ? { editRequest: editRequest.nonce } : {}
         }
       );
     }
@@ -9932,7 +10009,7 @@ function MatrxDataTableCore({
     },
     [columns, commitColumnState, commitColumnWidths, controlledQuery, intelligentSearchEnabled, intelligentSearchScopes, toolbar]
   );
-  return /* @__PURE__ */ jsx41(TooltipProvider, { children: /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsx41(TooltipProvider, { children: /* @__PURE__ */ jsx41(ContextMenuBoundary, { label: tableId ?? "Data table", children: /* @__PURE__ */ jsxs31(
     DndContext,
     {
       id: tableDndContextId,
@@ -10030,6 +10107,7 @@ function MatrxDataTableCore({
           {
             ref: rootRef,
             "data-matrx-table": true,
+            "data-matrx-table-id": tableContextMenuInstanceId,
             "data-matrx-table-implementation": "@ai-matrx/design-system",
             "data-matrx-table-density": resolvedDensity,
             "data-url-state-table": urlState?.id,
@@ -10416,7 +10494,7 @@ function MatrxDataTableCore({
                           const id = getRowId(row);
                           const displayRow = applyRowEdits(row, edits[id]);
                           const selectable = selection?.isRowSelectable?.(row) ?? Boolean(selection);
-                          return /* @__PURE__ */ jsx41(Fragment6, { children: mobileCards(displayRow, index, {
+                          return /* @__PURE__ */ jsx41("div", { "data-row-id": id, className: "contents", children: mobileCards(displayRow, index, {
                             renderCell: (columnKey) => {
                               const column = columns.find((candidate) => columnId(candidate) === columnKey);
                               return column ? renderRecordCell(row, column, index) : null;
@@ -10449,14 +10527,7 @@ function MatrxDataTableCore({
                                       ...copy === void 0 ? { defaultColumns: declaredVisibleCopyColumns } : {}
                                     }
                                   ) : null,
-                                  renderRowActions(displayRow, {
-                                    closeDetail: () => setSelectedId(null),
-                                    openDetail: () => openDetail(displayRow),
-                                    openWindow: () => openWindow(displayRow),
-                                    closeWindow,
-                                    hasPendingEdits: Boolean(edits[id]),
-                                    discardPendingEdits: () => discardRowEdits(id)
-                                  })
+                                  renderRowActions(displayRow, buildRecordControls(displayRow))
                                 ]
                               }
                             ) : null
@@ -10852,14 +10923,7 @@ function MatrxDataTableCore({
                                                       ...copy === void 0 ? { defaultColumns: declaredVisibleCopyColumns } : {}
                                                     }
                                                   ) : null,
-                                                  renderRowActions(displayRow, {
-                                                    closeDetail: () => setSelectedId(null),
-                                                    openDetail: () => openDetail(displayRow),
-                                                    openWindow: () => openWindow(displayRow),
-                                                    closeWindow,
-                                                    hasPendingEdits: Boolean(rowEdits),
-                                                    discardPendingEdits: () => discardRowEdits(id)
-                                                  }),
+                                                  renderRowActions(displayRow, buildRecordControls(displayRow)),
                                                   windowEnabled ? /* @__PURE__ */ jsxs31(Tooltip, { children: [
                                                     /* @__PURE__ */ jsx41(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx41(
                                                       Button,
@@ -11347,7 +11411,7 @@ function MatrxDataTableCore({
         ) : null })
       ]
     }
-  ) });
+  ) }) });
 }
 function HierarchyDragHandle({
   id,