@wavemaker-ai/react-runtime 1.0.0-rc.324 → 1.0.0-rc.326

package/components/data/table/hooks/useRowExpansion.js

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useRef, useState } from "react";
-import { cleanRowData } from "../utils";
+import { cleanRowData, getRowExpansionConfig } from "../utils";
 const useRowExpansion = ({
   rowExpansionConfig,
   internalDataset
@@ -8,36 +8,48 @@ const useRowExpansion = ({
   const expandedRowsRef = useRef(expandedRows);
   const rowDefInstancesRef = useRef({});
   const pendingRowExpandRef = useRef(/* @__PURE__ */ new Set());
+  const indexExpandedInstances = useCallback(() => {
+    const instances = rowDefInstancesRef.current;
+    Object.keys(instances).forEach((key) => {
+      if (/^\d+$/.test(key)) delete instances[key];
+    });
+    Array.from(expandedRowsRef.current).forEach((rowId, index) => {
+      if (instances[rowId]) instances[index] = instances[rowId];
+    });
+  }, []);
   useEffect(() => {
     expandedRowsRef.current = expandedRows;
-  }, [expandedRows]);
+    indexExpandedInstances();
+  }, [expandedRows, indexExpandedInstances]);
   useEffect(() => {
-    const instances = rowDefInstancesRef.current;
-    Object.keys(instances).forEach((k) => delete instances[k]);
+    rowDefInstancesRef.current = {};
     pendingRowExpandRef.current = /* @__PURE__ */ new Set();
   }, [internalDataset]);
   const registerRowDefInstance = useCallback(
     (rowId, instance, rowData) => {
       rowDefInstancesRef.current[rowId] = instance;
-      if (pendingRowExpandRef.current.has(rowId) && expandedRowsRef.current.has(rowId)) {
+      indexExpandedInstances();
+      if ((rowExpansionConfig == null ? void 0 : rowExpansionConfig.closeothers) || pendingRowExpandRef.current.has(rowId) && expandedRowsRef.current.has(rowId)) {
         pendingRowExpandRef.current.delete(rowId);
         if (rowExpansionConfig == null ? void 0 : rowExpansionConfig.onRowexpand) {
           setTimeout(() => {
             var _a;
             (_a = rowExpansionConfig.onRowexpand) == null ? void 0 : _a.call(rowExpansionConfig, {}, {}, cleanRowData(rowData), instance);
-          }, 500);
+          }, 0);
         }
       }
     },
-    [rowExpansionConfig]
+    [rowExpansionConfig, indexExpandedInstances]
   );
   const toggleRowExpansion = useCallback(
     (rowId, rowData) => {
       var _a, _b;
-      if (!rowExpansionConfig || !rowExpansionConfig.show) return;
+      if (!rowExpansionConfig) return;
+      const rowConfig = getRowExpansionConfig(rowExpansionConfig, rowId, rowData);
+      if (!(rowConfig == null ? void 0 : rowConfig.show)) return;
       const isCurrentlyExpanded = expandedRowsRef.current.has(rowId);
       if (!isCurrentlyExpanded) {
-        if (rowExpansionConfig.onBeforerowexpand) {
+        if (rowConfig.onBeforerowexpand) {
           let defaultPrevented = false;
           const event = {
             preventDefault: () => {
@@ -47,8 +59,8 @@ const useRowExpansion = ({
               return defaultPrevented;
             }
           };
-          (_a = rowExpansionConfig.onBeforerowexpand) == null ? void 0 : _a.call(
-            rowExpansionConfig,
+          (_a = rowConfig.onBeforerowexpand) == null ? void 0 : _a.call(
+            rowConfig,
             event,
             {},
             cleanRowData(rowData),
@@ -58,33 +70,31 @@ const useRowExpansion = ({
         }
         setExpandedRows((prev) => {
           const newExpandedRows = new Set(prev);
-          if (rowExpansionConfig.closeothers) {
+          if (rowConfig.closeothers) {
             newExpandedRows.forEach((otherId) => {
               pendingRowExpandRef.current.delete(otherId);
             });
             newExpandedRows.clear();
           }
           newExpandedRows.add(rowId);
-          if (rowExpansionConfig.renderPartial) {
+          if (rowConfig.renderPartial) {
             pendingRowExpandRef.current.add(rowId);
-          } else {
-            if (rowExpansionConfig.onRowexpand) {
-              setTimeout(() => {
-                var _a2;
-                (_a2 = rowExpansionConfig.onRowexpand) == null ? void 0 : _a2.call(
-                  rowExpansionConfig,
-                  {},
-                  {},
-                  cleanRowData(rowData),
-                  rowDefInstancesRef.current[rowId] || {}
-                );
-              }, 0);
-            }
+          } else if (rowConfig.onRowexpand) {
+            setTimeout(() => {
+              var _a2;
+              (_a2 = rowConfig.onRowexpand) == null ? void 0 : _a2.call(
+                rowConfig,
+                {},
+                {},
+                cleanRowData(rowData),
+                rowDefInstancesRef.current[rowId] || {}
+              );
+            }, 0);
           }
           return newExpandedRows;
         });
       } else {
-        if (rowExpansionConfig.onBeforerowcollapse) {
+        if (rowConfig.onBeforerowcollapse) {
           let defaultPrevented = false;
           const event = {
             preventDefault: () => {
@@ -94,8 +104,8 @@ const useRowExpansion = ({
               return defaultPrevented;
             }
           };
-          (_b = rowExpansionConfig.onBeforerowcollapse) == null ? void 0 : _b.call(
-            rowExpansionConfig,
+          (_b = rowConfig.onBeforerowcollapse) == null ? void 0 : _b.call(
+            rowConfig,
             event,
             {},
             cleanRowData(rowData),
@@ -107,10 +117,10 @@ const useRowExpansion = ({
           const newExpandedRows = new Set(prev);
           newExpandedRows.delete(rowId);
           pendingRowExpandRef.current.delete(rowId);
-          if (rowExpansionConfig.onRowcollapse) {
+          if (rowConfig.onRowcollapse) {
             setTimeout(() => {
               var _a2;
-              (_a2 = rowExpansionConfig.onRowcollapse) == null ? void 0 : _a2.call(rowExpansionConfig, {}, {}, cleanRowData(rowData));
+              (_a2 = rowConfig.onRowcollapse) == null ? void 0 : _a2.call(rowConfig, {}, {}, cleanRowData(rowData));
             }, 0);
           }
           return newExpandedRows;

package/components/data/table/hooks/useRowHandlers.js

@@ -46,7 +46,6 @@ const useRowHandlers = ({
       useRadioSelect,
       useMultiSelect,
       isrowselectable,
-      listener,
       name
     ]
   );

package/components/data/table/hooks/useServerSideSorting.js

@@ -70,7 +70,6 @@ const useServerSideSorting = ({
       onError,
       filterFields,
       logicalOp,
-      listener,
       name
     ]
   );

package/components/data/table/hooks/useTableColumns.js

@@ -39,7 +39,8 @@ import {
   createRowIndexColumn,
   createDataColumns,
   createEditingActionButtons,
-  getActionColumnSize
+  getActionColumnSize,
+  ActionCell
 } from "../utils/columnBuilder";
 import { distributeColumnWidths } from "../utils/columnWidthDistribution";
 import { useResponsiveColumns } from "./useResponsiveColumns";
@@ -210,11 +211,14 @@ const useTableColumns = ({
       const shouldRenderEditableCell = (editmode === "inline" || editmode === "quickedit") && isEditingThisRow && !wmColumn.readonly;
       return /* @__PURE__ */ jsx("span", { "data-col-identifier": wmColumn.field, children: shouldRenderEditableCell ? renderEditableCell(wmColumn, row.original, rowId) : renderDisplayCell(wmColumn, row.original, listener, cellState) });
     },
-    [editmode, isRowEditing, renderEditableCell, cellState, listener]
+    [editmode, isRowEditing, renderEditableCell, cellState]
   );
   const filteredRowActions = useMemo(() => {
     if (editmode === "quickedit") {
-      return filter(rowActions, (action) => action.key === "deleterow" || action.action === "delete");
+      return filter(
+        rowActions,
+        (action) => action.key === "deleterow" || action.action === "delete" || action.key === "updaterow"
+      );
     }
     return rowActions;
   }, [rowActions, editmode]);
@@ -256,7 +260,6 @@ const useTableColumns = ({
       saveEditing,
       cancelEditing,
       deleteRowAction,
-      listener,
       selectionHandlers
     ]
   );
@@ -277,13 +280,15 @@ const useTableColumns = ({
           size: columnSize,
           minSize,
           enableResizing: true,
-          cell: renderActionCell,
+          cell: ActionCell,
           enableSorting: manualActionColumn.sortable !== false,
-          meta: __spreadValues({
+          meta: __spreadProps(__spreadValues({
             textAlign: manualActionColumn.textalignment,
             backgroundColor: manualActionColumn.backgroundcolor,
             className: manualActionColumn.colClass
-          }, manualActionColumn.styles)
+          }, manualActionColumn.styles), {
+            _actions: { renderActionCell }
+          })
         };
       } else if (rowActions.length > 0 && (isDynamicTable || editmode !== "none")) {
         return {
@@ -293,7 +298,10 @@ const useTableColumns = ({
           minSize,
           maxSize: size,
           enableResizing: false,
-          cell: renderActionCell
+          cell: ActionCell,
+          meta: {
+            _actions: { renderActionCell }
+          }
         };
       }
       return null;

package/components/data/table/hooks/useTableData.js

@@ -118,7 +118,6 @@ const useTableData = ({
     deletemessage,
     errormessage,
     isServerSidePagination,
-    listener,
     widgetName
   ]);
   const handleCancelDelete = useCallback(() => {

package/components/data/table/hooks/useTableEdit.js

@@ -586,7 +586,6 @@ const useTableEdit = ({
     cancelEditing,
     resetValidationState,
     incrementSessionKey,
-    listener,
     sessionKey,
     hasRowExpansion,
     expansionPosition

package/components/data/table/index.js

@@ -89,9 +89,14 @@ import {
   saveTableState,
   clearTableState,
   addUniqueRowIds,
-  cleanRowData
+  cleanRowData,
+  getDomHiddenColStyle
 } from "./utils";
 import { hasTableGroups } from "./utils/groupHeaderUtils";
+import {
+  buildExpansionColSpec,
+  getExpansionColumnInsertIndex
+} from "./utils/expansionColumn";
 import { handleNewRowNavigation } from "./utils";
 import {
   TablePanelHeading,
@@ -473,14 +478,7 @@ const WmTableComponent = memo(
       children,
       listener
     });
-    const {
-      wmTableColumns,
-      tableStructure,
-      rowActions,
-      headerActions,
-      footerActions,
-      rowExpansionConfig
-    } = useMemo(() => {
+    const { wmTableColumns, tableStructure, headerActions, footerActions, rowExpansionConfig } = useMemo(() => {
       const allTableActions = parseTableActions(children);
       const headerActions2 = allTableActions.filter((action) => {
         const position = action.position || "footer";
@@ -498,13 +496,13 @@ const WmTableComponent = memo(
       return {
         wmTableColumns: finalColumns,
         tableStructure: structure,
-        rowActions: parseTableRowActions(children),
         tableActions: allTableActions,
         headerActions: headerActions2,
         footerActions: footerActions2,
         rowExpansionConfig: parseTableRowExpansion(children)
       };
     }, [children, internalDataset, isDynamicTable, dynamicColumns]);
+    const rowActions = useMemo(() => parseTableRowActions(children), [children]);
     const [columnsVersion, setColumnsVersion] = useState(0);
     const [columnOverrides, setColumnOverrides] = useState(
       {}
@@ -558,7 +556,7 @@ const WmTableComponent = memo(
       updatemessage,
       errormessage,
       showToast,
-      hasRowExpansion: rowExpansionConfig ? rowExpansionConfig.show : false,
+      hasRowExpansion: rowExpansionConfig ? true : false,
       expansionPosition: rowExpansionConfig ? parseInt(String(rowExpansionConfig.position || "0"), 10) : 0,
       datasource,
       binddataset,
@@ -956,7 +954,7 @@ const WmTableComponent = memo(
           listener.Widgets[name].dataNavigator = paginationWidget;
         }
       },
-      [name, listener]
+      [name]
     );
     const sortInfoForExport = useMemo(() => {
       if (sorting.length > 0) {
@@ -1275,7 +1273,7 @@ const WmTableComponent = memo(
         }
         deleteRecord(row, tableRef.current);
       },
-      [deleteRecord, onBeforerowdelete, listener, name, internalDataset]
+      [deleteRecord, onBeforerowdelete, name, internalDataset]
     );
     const refresh = useCallback(
       async (newData = false) => {
@@ -1420,17 +1418,47 @@ const WmTableComponent = memo(
       const leafHeaderGroup = headerGroups.length ? headerGroups[headerGroups.length - 1] : void 0;
       const leafHeaders = ((leafHeaderGroup == null ? void 0 : leafHeaderGroup.headers) || []).filter((h) => !h.isPlaceholder);
       const base = leafHeaders.map((h) => {
+        const meta = h.column.columnDef.meta;
+        const hiddenColStyle = getDomHiddenColStyle(meta);
         const w = `${h.column.getSize()}px`;
-        return { key: h.column.id, width: w, style: { width: w } };
+        return {
+          key: h.column.id,
+          width: hiddenColStyle ? void 0 : w,
+          style: hiddenColStyle != null ? hiddenColStyle : { width: w },
+          domHidden: !!hiddenColStyle
+        };
       });
+      if (rowExpansionConfig) {
+        const expansionInsertIndex = getExpansionColumnInsertIndex(
+          leafHeaders,
+          rowExpansionConfig,
+          {
+            appendForGroupedTable: !!(tableStructure && hasTableGroups(tableStructure))
+          }
+        );
+        if (expansionInsertIndex >= 0) {
+          base.splice(expansionInsertIndex, 0, __spreadProps(__spreadValues({}, buildExpansionColSpec(rowExpansionConfig.columnwidth)), {
+            domHidden: false
+          }));
+        }
+      }
       return base;
-    }, [table, columnSizing, columnsVersion, showheader, ColClassSignature]);
+    }, [
+      table,
+      columnSizing,
+      columnsVersion,
+      showheader,
+      ColClassSignature,
+      rowExpansionConfig,
+      tableStructure
+    ]);
     return /* @__PURE__ */ jsxs(
       Box,
       __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({
         ref: tableContainerRef,
         hidden: props.hidden,
-        className: `app-grid app-panel panel app-datagrid ${className}`.trim()
+        className: `app-grid app-panel panel app-datagrid ${className}`.trim(),
+        "data-widget-id": props["data-widget-id"]
       }, { name }), { editmode }), { navigation }), { title }), {
         currentpage: table.getState().pagination.pageIndex + 1
       }), {
@@ -1520,7 +1548,7 @@ const WmTableComponent = memo(
                           ),
                           /* @__PURE__ */ jsx("colgroup", { children: colGroupSpec.map((c) => /* @__PURE__ */ jsx("col", { style: c.style, width: c.width }, c.key)) })
                         ] }),
-                        internalDataset.length > 0 && /* @__PURE__ */ jsx(
+                        (internalDataset.length > 0 || !isTableLoading) && /* @__PURE__ */ jsx(
                           TableBodyComponent,
                           {
                             table,
@@ -1547,7 +1575,8 @@ const WmTableComponent = memo(
                             isAddingNewRow,
                             customExpressionColumns: customColumns,
                             customColumnsRevision,
-                            columnsVersion
+                            columnsVersion,
+                            registerRowDefInstance
                           }
                         ),
                         summaryRowEnabled && summaryRowDefs.length > 0 && /* @__PURE__ */ jsx(

package/components/data/table/live-table/index.js

@@ -34,7 +34,6 @@ import Box from "@mui/material/Box";
 import { useWidgetProxy } from "../../../../context/WidgetProvider";
 import withStandalone from "../../../../higherOrder/withStandalone";
 function isWmTableChildType(displayName) {
-  console.log("displayName", displayName);
   return displayName === "WmTable" || displayName === "WmTableStandalone" || displayName === "withStandalone(WmTable)";
 }
 const WmLiveTable = (props) => {

package/components/data/table/props.d.ts

@@ -752,6 +752,10 @@ export interface TableRowProps {
      * Rendering function for content.
      */
     renderPartial?: (props: Record<string, any>, onLoad: () => void, currentItem: any) => ReactNode;
+    /**
+     * Per-row callback from codegen for row-bound attrs (e.g. show, disabled).
+     */
+    tableRowProps?: (rowData: any) => Partial<TableRowProps>;
     /**
      * Children components.
      */

package/components/data/table/utils/buildSelectionColumns.js

@@ -64,13 +64,11 @@ MultiSelectCell.displayName = "MultiSelectCell";
 function MultiSelectHeader({ table, column }) {
   var _a, _b;
   const isAllSelected = table.getIsAllRowsSelected();
-  const isSomeSelected = table.getIsSomeRowsSelected();
   const { handleSelectAll } = (_b = (_a = column.columnDef.meta) == null ? void 0 : _a.selection) != null ? _b : {};
   return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "center", width: "100%" }, children: /* @__PURE__ */ jsx(Box, { className: "app-checkbox checkbox", children: /* @__PURE__ */ jsx(
     Checkbox,
     {
       checked: isAllSelected,
-      indeterminate: isSomeSelected && !isAllSelected,
       onChange: (e) => handleSelectAll == null ? void 0 : handleSelectAll(e.target.checked),
       size: "small",
       inputProps: {

package/components/data/table/utils/columnBuilder.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
-import { ColumnDef } from "@tanstack/react-table";
+import React, { type ReactElement } from "react";
+import { ColumnDef, CellContext } from "@tanstack/react-table";
 import { WmTableColumnProps, ActionButtonConfig } from "../props";
 /**
  * Per-column render config stored in `meta._cell`.
@@ -14,6 +14,20 @@ export interface DataCellMeta {
     wmColumn: WmTableColumnProps;
     renderCell: (wmColumn: WmTableColumnProps, row: any) => React.ReactNode;
 }
+/** Actions-column render config stored in `meta._actions` (namespaced like `_cell`). */
+export interface ActionCellMeta {
+    renderActionCell: (ctx: CellContext<any, unknown>) => React.ReactNode;
+}
+/**
+ * Stable cell renderer for the actions column. Same motivation as DataCell: flexRender
+ * uses `cell` as the component TYPE, so a changing renderActionCell identity would
+ * unmount/remount the row action buttons. Read the renderer from `meta._actions` instead.
+ */
+declare function ActionCell(ctx: CellContext<any, unknown>): ReactElement;
+declare namespace ActionCell {
+    var displayName: string;
+}
+export { ActionCell };
 /**
  * Creates row index column definition
  */

package/components/data/table/utils/columnBuilder.js

@@ -41,6 +41,12 @@ function DataCell(ctx) {
   return /* @__PURE__ */ jsx(Fragment, { children: renderCell(wmColumn, ctx.row) });
 }
 DataCell.displayName = "DataCell";
+function ActionCell(ctx) {
+  var _a;
+  const { renderActionCell } = (_a = ctx.column.columnDef.meta) == null ? void 0 : _a._actions;
+  return /* @__PURE__ */ jsx(Fragment, { children: renderActionCell(ctx) });
+}
+ActionCell.displayName = "ActionCell";
 const createRowIndexColumn = () => ({
   id: "rowIndex",
   header: "S. No.",
@@ -61,6 +67,7 @@ const createDataColumn = (wmColumn, renderCell, index = 0) => {
     columnSize = parseWidth(wmColumn.styles.width);
   }
   const accessorKey = wmColumn.field || wmColumn.name;
+  const isDomHidden = wmColumn.show === false;
   const columnId = (accessorKey == null ? void 0 : accessorKey.replace(/\./g, "_")) || (typeof wmColumn.caption === "string" && wmColumn.caption ? wmColumn.caption : void 0) || `column_${index}`;
   return __spreadProps(__spreadValues({
     id: columnId,
@@ -69,12 +76,10 @@ const createDataColumn = (wmColumn, renderCell, index = 0) => {
     // Supports nested properties like "department.store.employee"
     accessorFn: wmColumn.sortby ? (row) => get(row, wmColumn.sortby || "") : void 0,
     header: wmColumn.caption,
-    size: columnSize,
-    minSize: 50
-  }, columnSize ? {} : { maxSize: 500 }), {
-    // Only set maxSize for auto-sized columns
+    size: isDomHidden ? 0 : columnSize,
+    minSize: isDomHidden ? 0 : 50
+  }, isDomHidden ? { maxSize: 0 } : columnSize ? {} : { maxSize: 500 }), {
     enableResizing: true,
-    // Enable resizing for all data columns
     cell: DataCell,
     enableSorting: wmColumn.sortable,
     // Pass column styles and properties through meta for TableCell styling and filtering
@@ -84,6 +89,7 @@ const createDataColumn = (wmColumn, renderCell, index = 0) => {
       className: wmColumn == null ? void 0 : wmColumn.className,
       colClass: colClassProp
     }, wmColumn.styles), {
+      domHidden: isDomHidden,
       // Include widget types for filter rendering
       widgetType: wmColumn.widgetType,
       editWidgetType: wmColumn.editWidgetType,
@@ -102,9 +108,7 @@ const createDataColumn = (wmColumn, renderCell, index = 0) => {
 const createDataColumns = (wmTableColumns, renderCell) => {
   const columns = [];
   wmTableColumns.forEach((wmColumn, index) => {
-    if (wmColumn.show) {
-      columns.push(createDataColumn(wmColumn, renderCell, index));
-    }
+    columns.push(createDataColumn(wmColumn, renderCell, index));
   });
   return columns;
 };
@@ -186,6 +190,7 @@ const getActionColumnSize = (editmode) => {
   return editmode === "quickedit" ? { size: 80, minSize: 60 } : { size: 100, minSize: 80 };
 };
 export {
+  ActionCell,
   createDataColumn,
   createDataColumns,
   createDefaultColumnProps,

package/components/data/table/utils/columnWidthDistribution.js

@@ -18,7 +18,14 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const NON_DATA_COLUMN_IDS = ["radioSelect", "multiSelect", "rowIndex", "actions"];
+const isDomHiddenColumn = (column) => {
+  var _a;
+  return !!((_a = column.meta) == null ? void 0 : _a.domHidden);
+};
 const isDataColumn = (column) => {
+  if (isDomHiddenColumn(column)) {
+    return false;
+  }
   return !NON_DATA_COLUMN_IDS.includes(column.id || "");
 };
 const hasExplicitWidth = (column) => {
@@ -31,6 +38,9 @@ const distributeColumnWidths = (columns, tableWidth) => {
   let usedWidth = 0;
   let dataColumnsNeedingWidth = 0;
   columns.forEach((column) => {
+    if (isDomHiddenColumn(column)) {
+      return;
+    }
     if (!isDataColumn(column)) {
       const size = column.size || getDefaultColumnSize(column.id || "");
       usedWidth += size;

package/components/data/table/utils/constants.d.ts

@@ -45,8 +45,4 @@ export declare const INTERACTIVE_CLASSES: readonly ["MuiInputBase", "MuiSelect",
 export declare const INTERACTIVE_ROLES: readonly ["button", "textbox", "combobox", "listbox"];
 export declare const INTERACTIVE_DATA_ROLES: readonly ["input", "select", "date", "time", "color", "editor", "checkbox", "radio", "slider", "chips", "rating"];
 export declare const INTERACTIVE_TAG_NAMES: readonly ["INPUT", "BUTTON", "SELECT", "TEXTAREA", "A", "LABEL"];
-export declare const DYNAMIC_COLUMNS_CONFIG: {
-    readonly maxColumns: 20;
-    readonly sampleSize: 3;
-};
 export declare const UNSUPPORTED_STATE_PERSISTENCE_TYPES: readonly string[];

package/components/data/table/utils/constants.js

@@ -112,19 +112,12 @@ const INTERACTIVE_TAG_NAMES = [
   "A",
   "LABEL"
 ];
-const DYNAMIC_COLUMNS_CONFIG = {
-  maxColumns: 20,
-  // Maximum number of columns to generate from data (matching Angular behavior)
-  sampleSize: 3
-  // Number of rows to sample for column detection
-};
 const UNSUPPORTED_STATE_PERSISTENCE_TYPES = [
   "Scroll",
   "On-Demand",
   "Inline"
 ];
 export {
-  DYNAMIC_COLUMNS_CONFIG,
   INTERACTIVE_CLASSES,
   INTERACTIVE_DATA_ROLES,
   INTERACTIVE_ROLES,

package/components/data/table/utils/dynamic-columns.d.ts

@@ -25,7 +25,7 @@ export interface PreparedFieldTerminal {
  *
  * Uses lodash `pickBy` to drop internal keys in one pass per object; recursion stays shallow.
  */
-export declare const prepareFieldsFromMergedRow: (mergedRow: Record<string, any>, upperBound?: number) => PreparedFieldTerminal[];
+export declare const prepareFieldsFromMergedRow: (mergedRow: Record<string, any>) => PreparedFieldTerminal[];
 /**
  * Generate column definitions from data array.
  * Uses Angular-style nested flattening (prepareFieldDefs) so dynamic tables and

package/components/data/table/utils/dynamic-columns.js

@@ -21,7 +21,6 @@ import isArray from "lodash-es/isArray";
 import pickBy from "lodash-es/pickBy";
 import startCase from "lodash-es/startCase";
 import { createDefaultColumnProps } from "./columnBuilder";
-import { DYNAMIC_COLUMNS_CONFIG } from "./constants";
 import { INTERNAL_PROPERTIES } from "./index";
 const INTERNAL_FIELD_PATTERNS = [
   "_wm",
@@ -93,11 +92,9 @@ function relatedFieldsFromKey(rawKey) {
 function isLeafColumnValue(value) {
   return value === null || value === void 0 || typeof value !== "object" || value instanceof Date || isArray(value) && !value[0];
 }
-const prepareFieldsFromMergedRow = (mergedRow, upperBound = DYNAMIC_COLUMNS_CONFIG.maxColumns) => {
+const prepareFieldsFromMergedRow = (mergedRow) => {
   const terminals = [];
-  let columnCount = 0;
   const pushTerminal = (fieldPath, relatedTable, relatedField) => {
-    if (columnCount >= upperBound) return;
     const displayName = displayNameForFieldPath(fieldPath);
     terminals.push({
       displayName,
@@ -106,14 +103,12 @@ const prepareFieldsFromMergedRow = (mergedRow, upperBound = DYNAMIC_COLUMNS_CONF
       relatedTable,
       relatedField: relatedField != null ? relatedField : displayName
     });
-    columnCount += 1;
   };
   const pushFieldDef = (node, prefix, depth) => {
-    if (columnCount >= upperBound || depth > MAX_FIELD_DEPTH || node == null) return;
+    if (depth > MAX_FIELD_DEPTH || node == null) return;
     if (!isPlainRecord(node)) return;
     const visible = pickBy(node, (_v, k) => !isInternalField(String(k)));
     forEach(visible, (value, rawKey) => {
-      if (columnCount >= upperBound) return;
       const path = prefix ? `${prefix}.${rawKey}` : rawKey;
       const rel = relatedFieldsFromKey(rawKey);
       if (isLeafColumnValue(value)) {
@@ -155,7 +150,7 @@ const generateColumnsFromData = (data) => {
   if (!merged) {
     return [];
   }
-  const terminals = prepareFieldsFromMergedRow(merged, DYNAMIC_COLUMNS_CONFIG.maxColumns);
+  const terminals = prepareFieldsFromMergedRow(merged);
   if (terminals.length === 0) {
     return [];
   }

package/components/data/table/utils/expansionColumn.d.ts

@@ -0,0 +1,23 @@
+import type { CSSProperties } from "react";
+/** Minimal header shape for expansion insert-index calculation (TanStack Header-compatible). */
+export type ExpansionColumnHeaderLike = {
+    id: string;
+    column: {
+        id: string;
+        columnDef?: unknown;
+    };
+};
+/**
+ * Index at which the row-expansion `<th>` / `<td>` / `<col>` is inserted.
+ * Mirrors Angular datatable.js preparedHeaderData row-expansion placement.
+ */
+export declare function getExpansionColumnInsertIndex(headers: ReadonlyArray<ExpansionColumnHeaderLike>, rowExpansionConfig: {
+    position?: string | number;
+} | null | undefined, options?: {
+    appendForGroupedTable?: boolean;
+}): number;
+export declare function buildExpansionColSpec(columnwidth?: string): {
+    key: string;
+    width: string;
+    style: CSSProperties;
+};