@ceed/cds 1.31.2-next.1 → 1.31.2-next.3

package/dist/index.cjs

@@ -3600,12 +3600,13 @@ var BodyCell = (props) => {
     [props.editMode, isCellEditable, params]
   );
   const propsComponentProps = "componentProps" in props ? props.componentProps : null;
+  const hasComponentProps = "componentProps" in props;
   const componentProps = (0, import_react24.useMemo)(
     () => ({
-      ..."componentProps" in props && (typeof propsComponentProps === "function" ? propsComponentProps(params) : propsComponentProps || {}),
+      ...hasComponentProps && (typeof propsComponentProps === "function" ? propsComponentProps(params) : propsComponentProps || {}),
       size: "sm"
     }),
-    [props, propsComponentProps, params]
+    [hasComponentProps, propsComponentProps, params]
   );
   const editModeComponentProps = (0, import_react24.useMemo)(
     () => ({
@@ -3669,9 +3670,11 @@ var BodyCell = (props) => {
     }),
     [params, row, field, value, componentProps, type, onCellEditStop, onCellEditStart]
   );
+  const MemoizedRenderEditCell = (0, import_react24.useMemo)(() => renderEditCell ? (0, import_react24.memo)(renderEditCell) : null, [renderEditCell]);
+  const MemoizedRenderCell = (0, import_react24.useMemo)(() => renderCell ? (0, import_react24.memo)(renderCell) : null, [renderCell]);
   const EditModeComponent = (0, import_react24.useMemo)(() => {
-    if (renderEditCell) {
-      return (0, import_react24.createElement)((0, import_react24.memo)(renderEditCell), params);
+    if (MemoizedRenderEditCell) {
+      return (0, import_react24.createElement)(MemoizedRenderEditCell, params);
     }
     return {
       date: /* @__PURE__ */ import_react24.default.createElement(DatePicker_default, { value, ...editModeComponentProps }),
@@ -3702,11 +3705,11 @@ var BodyCell = (props) => {
         }
       )
     }[type || "text"];
-  }, [value, editModeComponentProps, type, renderEditCell, params]);
+  }, [value, editModeComponentProps, type, MemoizedRenderEditCell, params]);
   const linkComponentFromProps = props.component;
   const ReadModeComponent = (0, import_react24.useMemo)(() => {
-    if (renderCell) {
-      return (0, import_react24.createElement)((0, import_react24.memo)(renderCell), params);
+    if (MemoizedRenderCell) {
+      return (0, import_react24.createElement)(MemoizedRenderCell, params);
     }
     const innerText = value;
     const typedComponent = {
@@ -3716,7 +3719,7 @@ var BodyCell = (props) => {
       })
     }[type || "text"];
     return typedComponent || innerText;
-  }, [value, renderCell, params, type, componentProps, linkComponentFromProps]);
+  }, [value, MemoizedRenderCell, params, type, componentProps, linkComponentFromProps]);
   const getActions = props.getActions;
   const CellComponent = (0, import_react24.useMemo)(() => {
     if (type === "actions") {
@@ -3797,7 +3800,9 @@ var VirtualizedTableRow = (0, import_react24.memo)(StyledTableRow2, (prevProps,
   prevProps["data-row-id"] === nextProps["data-row-id"] && // @ts-ignore
   prevProps["data-index"] === nextProps["data-index"] && prevProps.tabIndex === nextProps.tabIndex && prevProps["aria-checked"] === nextProps["aria-checked"] && // Track column structure changes (e.g. isCellEditable toggled, columns added/removed)
   // @ts-ignore
-  prevProps["data-columns-key"] === nextProps["data-columns-key"];
+  prevProps["data-columns-key"] === nextProps["data-columns-key"] && // Track row data changes — ensures re-render when row object reference changes (e.g. after refetch)
+  // @ts-ignore
+  prevProps["data-row-key"] === nextProps["data-row-key"];
 });
 
 // src/components/DataTable/hooks.ts
@@ -4504,13 +4509,13 @@ Pagination.displayName = "Pagination";
 var Pagination_default = Pagination;
 
 // src/components/DataTable/DataTable.tsx
-var _columnsVersionCache = /* @__PURE__ */ new WeakMap();
-var _columnsVersionCounter = 0;
-function getColumnsVersion(columns) {
-  if (!_columnsVersionCache.has(columns)) {
-    _columnsVersionCache.set(columns, ++_columnsVersionCounter);
+var _objectVersionCache = /* @__PURE__ */ new WeakMap();
+var _objectVersionCounter = 0;
+function getObjectVersion(obj) {
+  if (!_objectVersionCache.has(obj)) {
+    _objectVersionCache.set(obj, ++_objectVersionCounter);
   }
-  return _columnsVersionCache.get(columns);
+  return _objectVersionCache.get(obj);
 }
 var EMPTY_CHECKBOX_PROPS = {};
 function Component(props, apiRef) {
@@ -4608,7 +4613,7 @@ function Component(props, apiRef) {
     overscan: 10
   });
   const paginationModel = (0, import_react28.useMemo)(() => ({ page, pageSize }), [page, pageSize]);
-  const columnsKey = getColumnsVersion(columns);
+  const columnsKey = getObjectVersion(columns);
   const headerCheckboxElement = (0, import_react28.useMemo)(
     () => /* @__PURE__ */ import_react28.default.createElement(
       RenderCheckbox,
@@ -4932,6 +4937,7 @@ function Component(props, apiRef) {
               key: virtualizedRow.key,
               "data-row-id": rowId,
               "data-index": rowIndex,
+              "data-row-key": getObjectVersion(row),
               "data-columns-key": columnsKey,
               "aria-rowindex": rowIndex + 1,
               role: checkboxSelection && !disableSelectionOnClick ? "checkbox" : void 0,

package/dist/index.js

@@ -3483,12 +3483,13 @@ var BodyCell = (props) => {
     [props.editMode, isCellEditable, params]
   );
   const propsComponentProps = "componentProps" in props ? props.componentProps : null;
+  const hasComponentProps = "componentProps" in props;
   const componentProps = useMemo8(
     () => ({
-      ..."componentProps" in props && (typeof propsComponentProps === "function" ? propsComponentProps(params) : propsComponentProps || {}),
+      ...hasComponentProps && (typeof propsComponentProps === "function" ? propsComponentProps(params) : propsComponentProps || {}),
       size: "sm"
     }),
-    [props, propsComponentProps, params]
+    [hasComponentProps, propsComponentProps, params]
   );
   const editModeComponentProps = useMemo8(
     () => ({
@@ -3552,9 +3553,11 @@ var BodyCell = (props) => {
     }),
     [params, row, field, value, componentProps, type, onCellEditStop, onCellEditStart]
   );
+  const MemoizedRenderEditCell = useMemo8(() => renderEditCell ? memo(renderEditCell) : null, [renderEditCell]);
+  const MemoizedRenderCell = useMemo8(() => renderCell ? memo(renderCell) : null, [renderCell]);
   const EditModeComponent = useMemo8(() => {
-    if (renderEditCell) {
-      return createElement(memo(renderEditCell), params);
+    if (MemoizedRenderEditCell) {
+      return createElement(MemoizedRenderEditCell, params);
     }
     return {
       date: /* @__PURE__ */ React22.createElement(DatePicker_default, { value, ...editModeComponentProps }),
@@ -3585,11 +3588,11 @@ var BodyCell = (props) => {
         }
       )
     }[type || "text"];
-  }, [value, editModeComponentProps, type, renderEditCell, params]);
+  }, [value, editModeComponentProps, type, MemoizedRenderEditCell, params]);
   const linkComponentFromProps = props.component;
   const ReadModeComponent = useMemo8(() => {
-    if (renderCell) {
-      return createElement(memo(renderCell), params);
+    if (MemoizedRenderCell) {
+      return createElement(MemoizedRenderCell, params);
     }
     const innerText = value;
     const typedComponent = {
@@ -3599,7 +3602,7 @@ var BodyCell = (props) => {
       })
     }[type || "text"];
     return typedComponent || innerText;
-  }, [value, renderCell, params, type, componentProps, linkComponentFromProps]);
+  }, [value, MemoizedRenderCell, params, type, componentProps, linkComponentFromProps]);
   const getActions = props.getActions;
   const CellComponent = useMemo8(() => {
     if (type === "actions") {
@@ -3680,7 +3683,9 @@ var VirtualizedTableRow = memo(StyledTableRow2, (prevProps, nextProps) => {
   prevProps["data-row-id"] === nextProps["data-row-id"] && // @ts-ignore
   prevProps["data-index"] === nextProps["data-index"] && prevProps.tabIndex === nextProps.tabIndex && prevProps["aria-checked"] === nextProps["aria-checked"] && // Track column structure changes (e.g. isCellEditable toggled, columns added/removed)
   // @ts-ignore
-  prevProps["data-columns-key"] === nextProps["data-columns-key"];
+  prevProps["data-columns-key"] === nextProps["data-columns-key"] && // Track row data changes — ensures re-render when row object reference changes (e.g. after refetch)
+  // @ts-ignore
+  prevProps["data-row-key"] === nextProps["data-row-key"];
 });
 
 // src/components/DataTable/hooks.ts
@@ -4387,13 +4392,13 @@ Pagination.displayName = "Pagination";
 var Pagination_default = Pagination;
 
 // src/components/DataTable/DataTable.tsx
-var _columnsVersionCache = /* @__PURE__ */ new WeakMap();
-var _columnsVersionCounter = 0;
-function getColumnsVersion(columns) {
-  if (!_columnsVersionCache.has(columns)) {
-    _columnsVersionCache.set(columns, ++_columnsVersionCounter);
+var _objectVersionCache = /* @__PURE__ */ new WeakMap();
+var _objectVersionCounter = 0;
+function getObjectVersion(obj) {
+  if (!_objectVersionCache.has(obj)) {
+    _objectVersionCache.set(obj, ++_objectVersionCounter);
   }
-  return _columnsVersionCache.get(columns);
+  return _objectVersionCache.get(obj);
 }
 var EMPTY_CHECKBOX_PROPS = {};
 function Component(props, apiRef) {
@@ -4491,7 +4496,7 @@ function Component(props, apiRef) {
     overscan: 10
   });
   const paginationModel = useMemo10(() => ({ page, pageSize }), [page, pageSize]);
-  const columnsKey = getColumnsVersion(columns);
+  const columnsKey = getObjectVersion(columns);
   const headerCheckboxElement = useMemo10(
     () => /* @__PURE__ */ React25.createElement(
       RenderCheckbox,
@@ -4815,6 +4820,7 @@ function Component(props, apiRef) {
               key: virtualizedRow.key,
               "data-row-id": rowId,
               "data-index": rowIndex,
+              "data-row-key": getObjectVersion(row),
               "data-columns-key": columnsKey,
               "aria-rowindex": rowIndex + 1,
               role: checkboxSelection && !disableSelectionOnClick ? "checkbox" : void 0,