@itwin/itwinui-react 3.15.4 → 3.15.5

package/esm/core/Table/Table.js

@@ -53,6 +53,7 @@ let singleRowSelectedAction = 'singleRowSelected';
 let shiftRowSelectedAction = 'shiftRowSelected';
 export const tableResizeStartAction = 'tableResizeStart';
 let tableResizeEndAction = 'tableResizeEnd';
+let iuiId = Symbol('iui-id');
 let flattenColumns = (columns) => {
   let flatColumns = [];
   columns.forEach((column) => {
@@ -105,6 +106,7 @@ export const Table = (props) => {
     headerProps,
     bodyProps,
     emptyTableContentProps,
+    getRowId,
     ...rest
   } = props;
   useGlobals();
@@ -240,16 +242,30 @@ export const Table = (props) => {
       ),
     [data, getSubRows],
   );
-  let [rowHasParent] = React.useState(() => new WeakSet());
   let getSubRowsWithSubComponents = React.useCallback(
-    (originalRow) => {
-      if (!rowHasParent.has(originalRow)) {
-        rowHasParent.add(originalRow);
-        return [originalRow];
-      }
-      return originalRow.subRows || [];
+    (originalRow, relativeIndex) => {
+      if (originalRow[iuiId]) return [];
+      if (originalRow.subRows) return originalRow.subRows;
+      return [
+        {
+          [iuiId]: `subcomponent-${relativeIndex}`,
+          ...originalRow,
+        },
+      ];
+    },
+    [],
+  );
+  let getRowIdWithSubComponents = React.useCallback(
+    (originalRow, relativeIndex, parent) => {
+      let defaultRowId = parent
+        ? `${parent.id}.${relativeIndex}`
+        : `${relativeIndex}`;
+      let rowIdFromUser = getRowId?.(originalRow, relativeIndex, parent);
+      if (void 0 !== rowIdFromUser && originalRow[iuiId])
+        return `${rowIdFromUser}-${defaultRowId}`;
+      return rowIdFromUser ?? defaultRowId;
     },
-    [rowHasParent],
+    [getRowId],
   );
   let instance = useTable(
     {
@@ -269,6 +285,7 @@ export const Table = (props) => {
         ...props.initialState,
       },
       columnResizeMode,
+      getRowId: subComponent ? getRowIdWithSubComponents : getRowId,
     },
     useFlexLayout,
     useResizeColumns(ownerDocument),
@@ -461,51 +478,52 @@ export const Table = (props) => {
     (index, virtualItem, virtualizer) => {
       let row = page[index];
       prepareRow(row);
-      if (row.subRows.length > 0 || !subComponent)
-        return React.createElement(TableRowMemoized, {
-          row: row,
-          rowProps: rowProps,
-          isLast: index === page.length - 1,
-          onRowInViewport: onRowInViewportRef,
-          onBottomReached: onBottomReachedRef,
-          intersectionMargin: intersectionMargin,
-          state: state,
-          key: row.getRowProps().key,
-          onClick: onRowClickHandler,
-          subComponent: subComponent,
-          isDisabled: !!isRowDisabled?.(row.original),
-          tableHasSubRows: hasAnySubRows,
-          tableInstance: instance,
-          expanderCell: expanderCell,
-          scrollContainerRef: tableRef.current,
-          tableRowRef: enableVirtualization ? void 0 : tableRowRef(row),
-          density: density,
-          virtualItem: virtualItem,
-          virtualizer: virtualizer,
-        });
-      return React.createElement(
-        TableExpandableContentMemoized,
-        {
-          key: row.getRowProps().key,
-          virtualItem: virtualItem,
-          ref: enableVirtualization
-            ? virtualizer?.measureElement
-            : tableRowRef(row),
-          isDisabled: !!isRowDisabled?.(row.original),
-        },
-        subComponent(row),
-      );
+      let isRowASubComponent = !!row.original[iuiId] && !!subComponent;
+      if (isRowASubComponent)
+        return React.createElement(
+          TableExpandableContentMemoized,
+          {
+            key: row.getRowProps().key,
+            virtualItem: virtualItem,
+            ref: enableVirtualization
+              ? virtualizer?.measureElement
+              : tableRowRef(row),
+            isDisabled: !!isRowDisabled?.(row.original),
+          },
+          subComponent(row),
+        );
+      return React.createElement(TableRowMemoized, {
+        row: row,
+        rowProps: rowProps,
+        isLast: index === page.length - 1,
+        onRowInViewport: onRowInViewportRef,
+        onBottomReached: onBottomReachedRef,
+        intersectionMargin: intersectionMargin,
+        state: state,
+        key: row.getRowProps().key,
+        onClick: onRowClickHandler,
+        subComponent: subComponent,
+        isDisabled: !!isRowDisabled?.(row.original),
+        tableHasSubRows: hasAnySubRows,
+        tableInstance: instance,
+        expanderCell: expanderCell,
+        scrollContainerRef: tableRef.current,
+        tableRowRef: enableVirtualization ? void 0 : tableRowRef(row),
+        density: density,
+        virtualItem: virtualItem,
+        virtualizer: virtualizer,
+      });
     },
     [
       page,
       prepareRow,
+      subComponent,
       rowProps,
       onRowInViewportRef,
       onBottomReachedRef,
       intersectionMargin,
       state,
       onRowClickHandler,
-      subComponent,
       isRowDisabled,
       hasAnySubRows,
       instance,

package/esm/styles.js

@@ -1,4 +1,4 @@
-const t = '3.15.4';
+const t = '3.15.5';
 const u = new Proxy(
   {},
   {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/itwinui-react",
-  "version": "3.15.4",
+  "version": "3.15.5",
   "author": "Bentley Systems",
   "license": "MIT",
   "type": "module",