material-react-table 0.34.1 → 0.35.2

package/dist/esm/menus/MRT_ShowHideColumnsMenuItems.d.ts

@@ -3,10 +3,10 @@ import type { MRT_Column, MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> {
     allColumns: MRT_Column<TData>[];
     column: MRT_Column<TData>;
-    currentHoveredColumn: MRT_Column<TData> | null;
+    hoveredColumn: MRT_Column<TData> | null;
     isSubMenu?: boolean;
-    setCurrentHoveredColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
+    setHoveredColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
     table: MRT_TableInstance<TData>;
 }
-export declare const MRT_ShowHideColumnsMenuItems: <TData extends Record<string, any> = {}>({ allColumns, currentHoveredColumn, setCurrentHoveredColumn, column, isSubMenu, table, }: Props<TData>) => JSX.Element;
+export declare const MRT_ShowHideColumnsMenuItems: <TData extends Record<string, any> = {}>({ allColumns, hoveredColumn, setHoveredColumn, column, isSubMenu, table, }: Props<TData>) => JSX.Element;
 export {};

package/dist/index.d.ts

@@ -226,40 +226,40 @@ declare type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<Ta
         tableId: string;
         localization: MRT_Localization;
     };
-    setCurrentDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
-    setCurrentDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
-    setCurrentEditingCell: Dispatch<SetStateAction<MRT_Cell | null>>;
-    setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row | null>>;
     setColumnFilterFns: Dispatch<SetStateAction<{
         [key: string]: MRT_FilterOption;
     }>>;
+    setDensity: Dispatch<SetStateAction<'comfortable' | 'compact' | 'spacious'>>;
+    setDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
+    setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
+    setEditingCell: Dispatch<SetStateAction<MRT_Cell | null>>;
+    setEditingRow: Dispatch<SetStateAction<MRT_Row | null>>;
     setGlobalFilterFn: Dispatch<SetStateAction<MRT_FilterOption>>;
-    setCurrentHoveredColumn: Dispatch<SetStateAction<MRT_Column<TData> | {
+    setHoveredColumn: Dispatch<SetStateAction<MRT_Column<TData> | {
         id: string;
     } | null>>;
-    setCurrentHoveredRow: Dispatch<SetStateAction<MRT_Row<TData> | {
+    setHoveredRow: Dispatch<SetStateAction<MRT_Row<TData> | {
         id: string;
     } | null>>;
-    setDensity: Dispatch<SetStateAction<'comfortable' | 'compact' | 'spacious'>>;
     setIsFullScreen: Dispatch<SetStateAction<boolean>>;
     setShowAlertBanner: Dispatch<SetStateAction<boolean>>;
     setShowFilters: Dispatch<SetStateAction<boolean>>;
     setShowGlobalFilter: Dispatch<SetStateAction<boolean>>;
 };
 declare type MRT_TableState<TData extends Record<string, any> = {}> = TableState & {
-    currentDraggingColumn: MRT_Column<TData> | null;
-    currentDraggingRow: MRT_Row<TData> | null;
-    currentEditingCell: MRT_Cell<TData> | null;
-    currentEditingRow: MRT_Row<TData> | null;
     columnFilterFns: Record<string, MRT_FilterOption>;
-    globalFilterFn: Record<string, MRT_FilterOption>;
-    currentHoveredColumn: MRT_Column<TData> | {
+    density: 'comfortable' | 'compact' | 'spacious';
+    draggingColumn: MRT_Column<TData> | null;
+    draggingRow: MRT_Row<TData> | null;
+    editingCell: MRT_Cell<TData> | null;
+    editingRow: MRT_Row<TData> | null;
+    globalFilterFn: MRT_FilterOption;
+    hoveredColumn: MRT_Column<TData> | {
         id: string;
     } | null;
-    currentHoveredRow: MRT_Row<TData> | {
+    hoveredRow: MRT_Row<TData> | {
         id: string;
     } | null;
-    density: 'comfortable' | 'compact' | 'spacious';
     isFullScreen: boolean;
     isLoading: boolean;
     showAlertBanner: boolean;
@@ -389,15 +389,17 @@ declare type MRT_ColumnDef<TData extends Record<string, any> = {}> = Omit<Column
         table: MRT_TableInstance<TData>;
         column: MRT_Column<TData>;
     }) => TableCellProps);
-    onCellEditBlur?: ({ cell, event, table, }: {
+    onCellEditBlur?: ({ cell, event, table, value, }: {
         event: FocusEvent<HTMLInputElement>;
         cell: MRT_Cell<TData>;
         table: MRT_TableInstance<TData>;
+        value: string;
     }) => void;
-    onCellEditChange?: ({ cell, event, table, }: {
+    onCellEditChange?: ({ cell, event, table, value, }: {
         event: ChangeEvent<HTMLInputElement>;
         cell: MRT_Cell<TData>;
         table: MRT_TableInstance<TData>;
+        value: string;
     }) => void;
     sortingFn?: MRT_SortingFn;
 };
@@ -422,7 +424,7 @@ declare type MRT_Row<TData extends Record<string, any> = {}> = Omit<Row<TData>,
     getAllCells: () => MRT_Cell<TData>[];
     getVisibleCells: () => MRT_Cell<TData>[];
     subRows?: MRT_Row<TData>[];
-    _valuesCache?: TData;
+    _valuesCache: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
 };
 declare type MRT_Cell<TData extends Record<string, any> = {}> = Omit<Cell<TData, unknown>, 'column' | 'row'> & {
     column: MRT_Column<TData>;
@@ -589,15 +591,17 @@ declare type MaterialReactTableProps<TData extends Record<string, any> = {}> = O
     muiTableTopToolbarProps?: ToolbarProps | (({ table }: {
         table: MRT_TableInstance<TData>;
     }) => ToolbarProps);
-    onCellEditBlur?: ({ cell, event, table, }: {
+    onCellEditBlur?: ({ cell, event, table, value, }: {
         event: FocusEvent<HTMLInputElement>;
         cell: MRT_Cell<TData>;
         table: MRT_TableInstance<TData>;
+        value: string;
     }) => void;
-    onCellEditChange?: ({ cell, event, table, }: {
+    onCellEditChange?: ({ cell, event, table, value, }: {
         event: ChangeEvent<HTMLInputElement>;
         cell: MRT_Cell<TData>;
         table: MRT_TableInstance<TData>;
+        value: string;
     }) => void;
     onColumnDrop?: ({ event, draggedColumn, targetColumn, }: {
         event: DragEvent<HTMLButtonElement>;
@@ -606,21 +610,22 @@ declare type MaterialReactTableProps<TData extends Record<string, any> = {}> = O
             id: string;
         } | null;
     }) => void;
-    onCurrentDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
-    onCurrentDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-    onCurrentEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
-    onCurrentEditingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-    onCurrentFilterFnsChange?: OnChangeFn<{
-        [key: string]: MRT_FilterOption;
-    }>;
-    onCurrentGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
-    onCurrentHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
-    onCurrentHoveredRowChange?: OnChangeFn<MRT_Row<TData> | null>;
     onDensityChange?: OnChangeFn<boolean>;
-    onEditRowSubmit?: ({ row, table, }: {
+    onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
+    onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
+    onEditingRowSave?: ({ row, table, values, }: {
         row: MRT_Row<TData>;
         table: MRT_TableInstance<TData>;
+        values: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
     }) => Promise<void> | void;
+    onEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
+    onEditingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
+    onFilterFnsChange?: OnChangeFn<{
+        [key: string]: MRT_FilterOption;
+    }>;
+    onGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
+    onHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
+    onHoveredRowChange?: OnChangeFn<MRT_Row<TData> | null>;
     onIsFullScreenChange?: OnChangeFn<boolean>;
     onRowDrop?: ({ event, draggedRow, targetRow, }: {
         event: DragEvent<HTMLButtonElement>;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.34.1",
+  "version": "0.35.2",
   "license": "MIT",
   "name": "material-react-table",
   "description": "A fully featured Material UI V5 implementation of TanStack React Table V8, written from the ground up in TypeScript.",
@@ -53,13 +53,13 @@
     "@babel/preset-react": "^7.18.6",
     "@emotion/react": "^11.10.0",
     "@emotion/styled": "^11.10.0",
-    "@faker-js/faker": "^7.3.0",
+    "@faker-js/faker": "^7.4.0",
     "@mui/icons-material": "^5.8.4",
     "@mui/material": "^5.10.0",
     "@rollup/plugin-babel": "^5.3.1",
     "@rollup/plugin-node-resolve": "^13.3.0",
     "@rollup/plugin-typescript": "^8.3.4",
-    "@size-limit/preset-small-lib": "^8.0.0",
+    "@size-limit/preset-small-lib": "^8.0.1",
     "@storybook/addon-a11y": "^6.5.10",
     "@storybook/addon-actions": "^6.5.10",
     "@storybook/addon-essentials": "^6.5.10",
@@ -78,10 +78,10 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-is": "^18.2.0",
-    "rollup": "^2.77.2",
+    "rollup": "^2.77.3",
     "rollup-plugin-dts": "^4.2.2",
     "rollup-plugin-peer-deps-external": "^2.2.4",
-    "size-limit": "^8.0.0",
+    "size-limit": "^8.0.1",
     "storybook-dark-mode": "^1.1.0",
     "tslib": "^2.4.0",
     "typescript": "^4.7.4"

package/src/MaterialReactTable.tsx

@@ -96,23 +96,21 @@ export type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<
     tableId: string;
     localization: MRT_Localization;
   };
-  setCurrentDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
-  setCurrentDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
-  setCurrentEditingCell: Dispatch<SetStateAction<MRT_Cell | null>>;
-  setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row | null>>;
   setColumnFilterFns: Dispatch<
-    SetStateAction<{
-      [key: string]: MRT_FilterOption;
-    }>
+    SetStateAction<{ [key: string]: MRT_FilterOption }>
   >;
+  setDensity: Dispatch<SetStateAction<'comfortable' | 'compact' | 'spacious'>>;
+  setDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
+  setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
+  setEditingCell: Dispatch<SetStateAction<MRT_Cell | null>>;
+  setEditingRow: Dispatch<SetStateAction<MRT_Row | null>>;
   setGlobalFilterFn: Dispatch<SetStateAction<MRT_FilterOption>>;
-  setCurrentHoveredColumn: Dispatch<
+  setHoveredColumn: Dispatch<
     SetStateAction<MRT_Column<TData> | { id: string } | null>
   >;
-  setCurrentHoveredRow: Dispatch<
+  setHoveredRow: Dispatch<
     SetStateAction<MRT_Row<TData> | { id: string } | null>
   >;
-  setDensity: Dispatch<SetStateAction<'comfortable' | 'compact' | 'spacious'>>;
   setIsFullScreen: Dispatch<SetStateAction<boolean>>;
   setShowAlertBanner: Dispatch<SetStateAction<boolean>>;
   setShowFilters: Dispatch<SetStateAction<boolean>>;
@@ -121,15 +119,15 @@ export type MRT_TableInstance<TData extends Record<string, any> = {}> = Omit<
 
 export type MRT_TableState<TData extends Record<string, any> = {}> =
   TableState & {
-    currentDraggingColumn: MRT_Column<TData> | null;
-    currentDraggingRow: MRT_Row<TData> | null;
-    currentEditingCell: MRT_Cell<TData> | null;
-    currentEditingRow: MRT_Row<TData> | null;
     columnFilterFns: Record<string, MRT_FilterOption>;
-    globalFilterFn: Record<string, MRT_FilterOption>;
-    currentHoveredColumn: MRT_Column<TData> | { id: string } | null;
-    currentHoveredRow: MRT_Row<TData> | { id: string } | null;
     density: 'comfortable' | 'compact' | 'spacious';
+    draggingColumn: MRT_Column<TData> | null;
+    draggingRow: MRT_Row<TData> | null;
+    editingCell: MRT_Cell<TData> | null;
+    editingRow: MRT_Row<TData> | null;
+    globalFilterFn: MRT_FilterOption;
+    hoveredColumn: MRT_Column<TData> | { id: string } | null;
+    hoveredRow: MRT_Row<TData> | { id: string } | null;
     isFullScreen: boolean;
     isLoading: boolean;
     showAlertBanner: boolean;
@@ -340,19 +338,23 @@ export type MRT_ColumnDef<TData extends Record<string, any> = {}> = Omit<
     cell,
     event,
     table,
+    value,
   }: {
     event: FocusEvent<HTMLInputElement>;
     cell: MRT_Cell<TData>;
     table: MRT_TableInstance<TData>;
+    value: string;
   }) => void;
   onCellEditChange?: ({
     cell,
     event,
     table,
+    value,
   }: {
     event: ChangeEvent<HTMLInputElement>;
     cell: MRT_Cell<TData>;
     table: MRT_TableInstance<TData>;
+    value: string;
   }) => void;
   sortingFn?: MRT_SortingFn;
 };
@@ -397,7 +399,7 @@ export type MRT_Row<TData extends Record<string, any> = {}> = Omit<
   getAllCells: () => MRT_Cell<TData>[];
   getVisibleCells: () => MRT_Cell<TData>[];
   subRows?: MRT_Row<TData>[];
-  _valuesCache?: TData;
+  _valuesCache: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
 };
 
 export type MRT_Cell<TData extends Record<string, any> = {}> = Omit<
@@ -695,19 +697,23 @@ export type MaterialReactTableProps<TData extends Record<string, any> = {}> =
       cell,
       event,
       table,
+      value,
     }: {
       event: FocusEvent<HTMLInputElement>;
       cell: MRT_Cell<TData>;
       table: MRT_TableInstance<TData>;
+      value: string;
     }) => void;
     onCellEditChange?: ({
       cell,
       event,
       table,
+      value,
     }: {
       event: ChangeEvent<HTMLInputElement>;
       cell: MRT_Cell<TData>;
       table: MRT_TableInstance<TData>;
+      value: string;
     }) => void;
     onColumnDrop?: ({
       event,
@@ -718,22 +724,24 @@ export type MaterialReactTableProps<TData extends Record<string, any> = {}> =
       draggedColumn: MRT_Column<TData>;
       targetColumn: MRT_Column<TData> | { id: string } | null;
     }) => void;
-    onCurrentDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
-    onCurrentDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-    onCurrentEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
-    onCurrentEditingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
-    onCurrentFilterFnsChange?: OnChangeFn<{ [key: string]: MRT_FilterOption }>;
-    onCurrentGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
-    onCurrentHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
-    onCurrentHoveredRowChange?: OnChangeFn<MRT_Row<TData> | null>;
     onDensityChange?: OnChangeFn<boolean>;
-    onEditRowSubmit?: ({
+    onDraggingColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
+    onDraggingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
+    onEditingRowSave?: ({
       row,
       table,
+      values,
     }: {
       row: MRT_Row<TData>;
       table: MRT_TableInstance<TData>;
+      values: Record<LiteralUnion<string & DeepKeys<TData>>, any>;
     }) => Promise<void> | void;
+    onEditingCellChange?: OnChangeFn<MRT_Cell<TData> | null>;
+    onEditingRowChange?: OnChangeFn<MRT_Row<TData> | null>;
+    onFilterFnsChange?: OnChangeFn<{ [key: string]: MRT_FilterOption }>;
+    onGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
+    onHoveredColumnChange?: OnChangeFn<MRT_Column<TData> | null>;
+    onHoveredRowChange?: OnChangeFn<MRT_Row<TData> | null>;
     onIsFullScreenChange?: OnChangeFn<boolean>;
     onRowDrop?: ({
       event,

package/src/body/MRT_TableBodyCell.tsx

@@ -50,14 +50,14 @@ export const MRT_TableBodyCell: FC<Props> = ({
       rowNumberMode,
       tableId,
     },
-    setCurrentEditingCell,
-    setCurrentHoveredColumn,
+    setEditingCell,
+    setHoveredColumn,
   } = table;
   const {
-    currentDraggingColumn,
-    currentEditingCell,
-    currentEditingRow,
-    currentHoveredColumn,
+    draggingColumn,
+    editingCell,
+    editingRow,
+    hoveredColumn,
     density,
     isLoading,
     showSkeletons,
@@ -88,8 +88,8 @@ export const MRT_TableBodyCell: FC<Props> = ({
   const isEditing =
     isEditable &&
     (editingMode === 'table' ||
-      currentEditingRow?.id === row.id ||
-      currentEditingCell?.id === cell.id);
+      editingRow?.id === row.id ||
+      editingCell?.id === cell.id);
 
   const [skeletonWidth, setSkeletonWidth] = useState(0);
   useEffect(
@@ -113,7 +113,7 @@ export const MRT_TableBodyCell: FC<Props> = ({
       columnDef.enableEditing !== false &&
       editingMode === 'cell'
     ) {
-      setCurrentEditingCell(cell);
+      setEditingCell(cell);
       setTimeout(() => {
         const textField = document.getElementById(
           `mrt-${tableId}-edit-cell-text-field-${cell.id}`,
@@ -144,20 +144,20 @@ export const MRT_TableBodyCell: FC<Props> = ({
   };
 
   const handleDragEnter = (_e: DragEvent) => {
-    if (enableGrouping && currentHoveredColumn?.id === 'drop-zone') {
-      setCurrentHoveredColumn(null);
+    if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
+      setHoveredColumn(null);
     }
-    if (enableColumnOrdering && currentDraggingColumn) {
-      setCurrentHoveredColumn(
+    if (enableColumnOrdering && draggingColumn) {
+      setHoveredColumn(
         columnDef.enableColumnOrdering !== false ? column : null,
       );
     }
   };
 
   const draggingBorder =
-    currentDraggingColumn?.id === column.id
+    draggingColumn?.id === column.id
       ? `1px dashed ${theme.palette.text.secondary}`
-      : currentHoveredColumn?.id === column.id
+      : hoveredColumn?.id === column.id
       ? `2px dashed ${theme.palette.primary.main}`
       : undefined;
 
@@ -197,8 +197,7 @@ export const MRT_TableBodyCell: FC<Props> = ({
             ? `${column.getStart('left')}px`
             : undefined,
         opacity:
-          currentDraggingColumn?.id === column.id ||
-          currentHoveredColumn?.id === column.id
+          draggingColumn?.id === column.id || hoveredColumn?.id === column.id
             ? 0.5
             : 1,
         overflow: 'hidden',
@@ -232,7 +231,7 @@ export const MRT_TableBodyCell: FC<Props> = ({
         transition: 'all 0.2s ease-in-out',
         whiteSpace: density === 'compact' ? 'nowrap' : 'normal',
         zIndex:
-          currentDraggingColumn?.id === column.id
+          draggingColumn?.id === column.id
             ? 2
             : column.getIsPinned()
             ? 1

package/src/body/MRT_TableBodyRow.tsx

@@ -16,9 +16,9 @@ export const MRT_TableBodyRow: FC<Props> = ({ row, rowIndex, table }) => {
     getIsSomeColumnsPinned,
     getState,
     options: { enableRowOrdering, muiTableBodyRowProps, renderDetailPanel },
-    setCurrentHoveredRow,
+    setHoveredRow,
   } = table;
-  const { currentDraggingRow, currentHoveredRow } = getState();
+  const { draggingRow, hoveredRow } = getState();
 
   const tableRowProps =
     muiTableBodyRowProps instanceof Function
@@ -26,17 +26,17 @@ export const MRT_TableBodyRow: FC<Props> = ({ row, rowIndex, table }) => {
       : muiTableBodyRowProps;
 
   const handleDragEnter = (_e: DragEvent) => {
-    if (enableRowOrdering && currentDraggingRow) {
-      setCurrentHoveredRow(row);
+    if (enableRowOrdering && draggingRow) {
+      setHoveredRow(row);
     }
   };
 
   const rowRef = useRef<HTMLTableRowElement>(null);
 
   const draggingBorder =
-    currentDraggingRow?.id === row.id
+    draggingRow?.id === row.id
       ? `1px dashed ${theme.palette.text.secondary}`
-      : currentHoveredRow?.id === row.id
+      : hoveredRow?.id === row.id
       ? `2px dashed ${theme.palette.primary.main}`
       : undefined;
 
@@ -57,10 +57,7 @@ export const MRT_TableBodyRow: FC<Props> = ({ row, rowIndex, table }) => {
         sx={(theme) => ({
           backgroundColor: lighten(theme.palette.background.default, 0.06),
           opacity:
-            currentDraggingRow?.id === row.id ||
-            currentHoveredRow?.id === row.id
-              ? 0.5
-              : 1,
+            draggingRow?.id === row.id || hoveredRow?.id === row.id ? 0.5 : 1,
           transition: 'all 0.2s ease-in-out',
           '&:hover td': {
             backgroundColor:

package/src/body/MRT_TableBodyRowGrabHandle.tsx

@@ -24,17 +24,17 @@ export const MRT_TableBodyRowGrabHandle: FC<Props> = ({
 
   const handleDragStart = (e: DragEvent<HTMLButtonElement>) => {
     e.dataTransfer.setDragImage(rowRef.current as HTMLElement, 0, 0);
-    table.setCurrentDraggingRow(cell.row as any);
+    table.setDraggingRow(cell.row as any);
   };
 
   const handleDragEnd = (event: DragEvent<HTMLButtonElement>) => {
     onRowDrop?.({
       event,
-      draggedRow: table.getState().currentDraggingRow as any,
-      targetRow: table.getState().currentHoveredRow as any,
+      draggedRow: table.getState().draggingRow as any,
+      targetRow: table.getState().hoveredRow as any,
     });
-    table.setCurrentDraggingRow(null);
-    table.setCurrentHoveredRow(null);
+    table.setDraggingRow(null);
+    table.setHoveredRow(null);
   };
 
   return (

package/src/buttons/MRT_EditActionButtons.tsx

@@ -13,20 +13,24 @@ export const MRT_EditActionButtons: FC<Props> = ({ row, table }) => {
     options: {
       icons: { CancelIcon, SaveIcon },
       localization,
-      onEditRowSubmit,
+      onEditingRowSave,
     },
-    setCurrentEditingRow,
+    setEditingRow,
   } = table;
-  const { currentEditingRow } = getState();
+  const { editingRow } = getState();
 
   const handleCancel = () => {
-    row._valuesCache = row.original ?? {};
-    setCurrentEditingRow(null);
+    row._valuesCache = { ...row.original };
+    setEditingRow(null);
   };
 
   const handleSave = () => {
-    onEditRowSubmit?.({ row: currentEditingRow ?? row, table });
-    setCurrentEditingRow(null);
+    onEditingRowSave?.({
+      row: editingRow ?? row,
+      table,
+      values: editingRow?._valuesCache ?? { ...row.original },
+    });
+    setEditingRow(null);
   };
 
   return (

package/src/buttons/MRT_ToggleRowActionMenuButton.tsx

@@ -30,10 +30,10 @@ export const MRT_ToggleRowActionMenuButton: FC<Props> = ({ row, table }) => {
       renderRowActionMenuItems,
       renderRowActions,
     },
-    setCurrentEditingRow,
+    setEditingRow,
   } = table;
 
-  const { currentEditingRow } = getState();
+  const { editingRow } = getState();
 
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
 
@@ -44,7 +44,7 @@ export const MRT_ToggleRowActionMenuButton: FC<Props> = ({ row, table }) => {
   };
 
   const handleStartEditMode = () => {
-    setCurrentEditingRow({ ...row });
+    setEditingRow({ ...row });
     setAnchorEl(null);
   };
 
@@ -52,7 +52,7 @@ export const MRT_ToggleRowActionMenuButton: FC<Props> = ({ row, table }) => {
     <>
       {renderRowActions ? (
         <>{renderRowActions({ row, table })}</>
-      ) : row.id === currentEditingRow?.id ? (
+      ) : row.id === editingRow?.id ? (
         <MRT_EditActionButtons row={row} table={table} />
       ) : !renderRowActionMenuItems && enableEditing ? (
         <Tooltip placement="right" arrow title={localization.edit}>

package/src/head/MRT_TableHeadCell.tsx

@@ -26,14 +26,10 @@ export const MRT_TableHeadCell: FC<Props> = ({ header, table }) => {
       enableMultiSort,
       muiTableHeadCellProps,
     },
-    setCurrentHoveredColumn,
+    setHoveredColumn,
   } = table;
-  const {
-    density,
-    currentDraggingColumn,
-    currentHoveredColumn,
-    showColumnFilters,
-  } = getState();
+  const { density, draggingColumn, hoveredColumn, showColumnFilters } =
+    getState();
   const { column } = header;
   const { columnDef } = column;
   const { columnDefType } = columnDef;
@@ -71,20 +67,20 @@ export const MRT_TableHeadCell: FC<Props> = ({ header, table }) => {
   };
 
   const handleDragEnter = (_e: DragEvent) => {
-    if (enableGrouping && currentHoveredColumn?.id === 'drop-zone') {
-      setCurrentHoveredColumn(null);
+    if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
+      setHoveredColumn(null);
     }
-    if (enableColumnOrdering && currentDraggingColumn) {
-      setCurrentHoveredColumn(
+    if (enableColumnOrdering && draggingColumn) {
+      setHoveredColumn(
         columnDef.enableColumnOrdering !== false ? column : null,
       );
     }
   };
 
   const draggingBorder =
-    currentDraggingColumn?.id === column.id
+    draggingColumn?.id === column.id
       ? `1px dashed ${theme.palette.text.secondary}`
-      : currentHoveredColumn?.id === column.id
+      : hoveredColumn?.id === column.id
       ? `2px dashed ${theme.palette.primary.main}`
       : undefined;
 
@@ -131,8 +127,7 @@ export const MRT_TableHeadCell: FC<Props> = ({ header, table }) => {
             : undefined,
         overflow: 'visible',
         opacity:
-          currentDraggingColumn?.id === column.id ||
-          currentHoveredColumn?.id === column.id
+          draggingColumn?.id === column.id || hoveredColumn?.id === column.id
             ? 0.5
             : 1,
         p:
@@ -169,7 +164,7 @@ export const MRT_TableHeadCell: FC<Props> = ({ header, table }) => {
         userSelect: enableMultiSort && column.getCanSort() ? 'none' : undefined,
         verticalAlign: 'top',
         zIndex:
-          column.getIsResizing() || currentDraggingColumn?.id === column.id
+          column.getIsResizing() || draggingColumn?.id === column.id
             ? 3
             : column.getIsPinned() && columnDefType !== 'group'
             ? 2