@wavemaker-ai/react-runtime 1.0.0-rc.647655 → 1.0.0-rc.647684

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

@@ -45,7 +45,7 @@ import {
 import { distributeColumnWidths } from "../utils/columnWidthDistribution";
 import { useResponsiveColumns } from "./useResponsiveColumns";
 import WmTableRowAction from "../table-row-action";
-const handleActionSelection = (rowId, rowData, handlers) => {
+const handleActionSelection = (rowId, rowData, handlers, event) => {
   const {
     useMultiSelect,
     handleMultiSelection,
@@ -55,9 +55,9 @@ const handleActionSelection = (rowId, rowData, handlers) => {
   } = handlers;
   if (useMultiSelect && handleMultiSelection && isRowSelected) {
     const currentlySelected = isRowSelected(rowId);
-    handleMultiSelection(rowId, rowData, !currentlySelected);
+    handleMultiSelection(rowId, rowData, !currentlySelected, event);
   } else if (useRadioSelect && handleRadioSelection) {
-    handleRadioSelection(rowId, rowData);
+    handleRadioSelection(rowId, rowData, event);
   }
 };
 const createActionClickHandler = (rowData, rowId, handlers, actionOnClick) => {
@@ -65,7 +65,7 @@ const createActionClickHandler = (rowData, rowId, handlers, actionOnClick) => {
     if (handlers.handleRowClick && event) {
       handlers.handleRowClick(event, rowData, rowId);
     }
-    handleActionSelection(rowId, rowData, handlers);
+    handleActionSelection(rowId, rowData, handlers, event);
     actionOnClick == null ? void 0 : actionOnClick(event, widget, newVal);
   };
 };
@@ -123,7 +123,7 @@ const EditingActionButtons = React.memo(
         const isDeleteButton = button.key === "delete-edit";
         if (isDeleteButton && event) {
           (_a = selectionHandlers.handleRowClick) == null ? void 0 : _a.call(selectionHandlers, event, rowData, rowId);
-          handleActionSelection(rowId, rowData, selectionHandlers);
+          handleActionSelection(rowId, rowData, selectionHandlers, event);
         }
         switch (button.key) {
           case "save-edit":

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

@@ -1,10 +1,23 @@
-import { useState, useCallback } from "react";
+import { useState, useCallback, useEffect, useRef } from "react";
 const useTableState = ({
   editMode = "none",
   radioselect = false,
   multiselect = false
 }) => {
   const [activeRowIds, setActiveRowIds] = useState([]);
+  const prevMultiselectRef = useRef(multiselect);
+  const prevRadioselectRef = useRef(radioselect);
+  useEffect(() => {
+    const prevMultiselect = prevMultiselectRef.current;
+    const prevRadioselect = prevRadioselectRef.current;
+    prevMultiselectRef.current = multiselect;
+    prevRadioselectRef.current = radioselect;
+    if (prevMultiselect && !multiselect) {
+      setActiveRowIds([]);
+    } else if (prevRadioselect && !radioselect && !multiselect) {
+      setActiveRowIds([]);
+    }
+  }, [multiselect, radioselect]);
   const handleRowActiveClick = useCallback(
     (rowId, isSelectionHandled, isEditingOrAdding) => {
       if (isEditingOrAdding) {
@@ -39,7 +52,6 @@ const useTableState = ({
       setActiveRowIds([]);
     }
   }, []);
-  const activeRowId = activeRowIds && activeRowIds.length > 0 ? activeRowIds[0] : null;
   return {
     activeRowIds,
     setActiveRow,

package/components/data/table/index.js

@@ -82,6 +82,7 @@ import {
   parseTableRowActions,
   parseTableActions,
   parseTableRowExpansion,
+  isRowExpansionVisible,
   getSpacingClasses,
   TABLE_CSS_CLASSES,
   TABLE_MESSAGES,
@@ -201,7 +202,8 @@ const WmTableComponent = memo(
       exportdatasize,
       onBeforeexport,
       onAfterexport,
-      styles
+      styles,
+      viewParent
     } = _c, rest = __objRest(_c, [
       "name",
       "dataset",
@@ -282,7 +284,8 @@ const WmTableComponent = memo(
       "exportdatasize",
       "onBeforeexport",
       "onAfterexport",
-      "styles"
+      "styles",
+      "viewParent"
     ]);
     const effectiveStorageKey = useMemo(
       () => name + ((listener == null ? void 0 : listener.partialName) ? `__${listener == null ? void 0 : listener.partialName}` : ""),
@@ -461,6 +464,8 @@ const WmTableComponent = memo(
       onRowdeselect,
       listener,
       navigation,
+      viewParent,
+      widgetRegistrationKey,
       onSyncSelectedItems
     });
     const { activeRowIds, setActiveRow, handleRowActiveClick, isRowActive } = useTableState({
@@ -493,15 +498,20 @@ const WmTableComponent = memo(
       const staticColumns = parseTableColumns(children, internalDataset);
       const hasGroups = structure.some((item) => "isGroup" in item && item.isGroup);
       const finalColumns = hasGroups && flatColumns.length > 0 ? flatColumns : staticColumns.length > 0 ? staticColumns : isDynamicTable && dynamicColumns.length > 0 ? dynamicColumns : flatColumns;
+      const parsedExpansion = parseTableRowExpansion(children);
       return {
         wmTableColumns: finalColumns,
         tableStructure: structure,
         tableActions: allTableActions,
         headerActions: headerActions2,
         footerActions: footerActions2,
-        rowExpansionConfig: parseTableRowExpansion(children)
+        rowExpansionConfig: parsedExpansion
       };
     }, [children, internalDataset, isDynamicTable, dynamicColumns]);
+    const visibleRowExpansionConfig = useMemo(
+      () => isRowExpansionVisible(rowExpansionConfig, internalDataset) ? rowExpansionConfig : null,
+      [rowExpansionConfig, internalDataset]
+    );
     const rowActions = useMemo(() => parseTableRowActions(children), [children]);
     const [columnsVersion, setColumnsVersion] = useState(0);
     const [columnOverrides, setColumnOverrides] = useState(
@@ -556,8 +566,8 @@ const WmTableComponent = memo(
       updatemessage,
       errormessage,
       showToast,
-      hasRowExpansion: rowExpansionConfig ? true : false,
-      expansionPosition: rowExpansionConfig ? parseInt(String(rowExpansionConfig.position || "0"), 10) : 0,
+      hasRowExpansion: visibleRowExpansionConfig ? true : false,
+      expansionPosition: visibleRowExpansionConfig ? parseInt(String(visibleRowExpansionConfig.position || "0"), 10) : 0,
       datasource,
       binddataset,
       onSuccess,
@@ -580,7 +590,9 @@ const WmTableComponent = memo(
       useMultiSelect,
       isrowselectable,
       listener,
-      name
+      viewParent,
+      name,
+      widgetRegistrationKey
     });
     useEffect(() => {
       const currentPage = paginationState.pageIndex;
@@ -766,8 +778,8 @@ const WmTableComponent = memo(
       if (name && (listener == null ? void 0 : listener.Widgets[name]) && tableContainerRef.current) {
         listener.Widgets[name].nativeElement = tableContainerRef.current;
       }
-      const data = internalDataset;
-      onDatarender((_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name], { $data: data, data });
+      const data = internalDataset && internalDataset.length > 0 ? internalDataset : table.getRowModel().rows.map((row) => row.original) || [];
+      onDatarender((_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name], data);
     }, [onDatarender, name]);
     columnsStateRef.current = columns;
     const columnsForTable = useMemo(() => {
@@ -1344,23 +1356,33 @@ const WmTableComponent = memo(
       selectPageSize,
       rowDefInstances
     };
-    syncSelectedItemsImplRef.current = (newSelectedIds) => {
+    const getRowId = (row) => row._wmTableRowId || String(row.id);
+    const pushSelectedItemsToWidget = (selectedIds) => {
       if (!(listener == null ? void 0 : listener.onChange)) return;
-      const getRowId = (row) => row._wmTableRowId || String(row.id);
       const selectedRows = internalDataset.filter(
-        (row) => newSelectedIds.includes(getRowId(row))
+        (row) => selectedIds.includes(getRowId(row))
       );
       const selectedItems = cleanRowData(selectedRows);
-      if (!isEqual(prevSelectedRow.current, selectedItems)) {
-        prevSelectedRow.current = selectedItems;
-        if (tableApisRegistered.current) {
-          listener.onChange(widgetRegistrationKey, { selectedItems });
-        } else {
-          tableApisRegistered.current = true;
-          listener.onChange(widgetRegistrationKey, __spreadProps(__spreadValues({}, tableApis), { selectedItems }));
-        }
+      if (selectedIds.length === 0) {
+        prevSelectedRow.current = null;
       }
+      if (isEqual(prevSelectedRow.current, selectedItems)) {
+        return;
+      }
+      prevSelectedRow.current = selectedItems;
+      const selectionPayload = {
+        selectedItems,
+        selecteditem: selectedItems,
+        selectedItem: selectedItems.length === 1 ? selectedItems[0] : selectedItems
+      };
+      if (tableApisRegistered.current) {
+        listener.onChange(widgetRegistrationKey, selectionPayload);
+        return;
+      }
+      tableApisRegistered.current = true;
+      listener.onChange(widgetRegistrationKey, __spreadValues(__spreadValues({}, tableApis), selectionPayload));
     };
+    syncSelectedItemsImplRef.current = pushSelectedItemsToWidget;
     useEffect(() => {
       var _a2, _b2, _c2;
       if (parentForm && name && ((_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[parentForm])) {
@@ -1384,32 +1406,14 @@ const WmTableComponent = memo(
         }
       }
     }, [parentForm, parentFormColumns]);
-    const updateSelectedItem = () => {
-      if (!(listener == null ? void 0 : listener.onChange)) return;
-      const getRowId = (row) => row._wmTableRowId || String(row.id);
-      let selectedRows = [];
-      if ((useRadioSelect || useMultiSelect) && selectedRowIds.length > 0) {
-        selectedRows = internalDataset.filter((row) => selectedRowIds.includes(getRowId(row)));
-      } else if (activeRowIds.length > 0) {
-        selectedRows = internalDataset.filter(
-          (row) => activeRowIds.includes(getRowId(row))
-        );
-      }
-      const cleanedRows = cleanRowData(selectedRows);
-      const selectedItems = cleanedRows.length > 0 ? cleanedRows : [];
-      if (!isEqual(prevSelectedRow.current, selectedItems)) {
-        prevSelectedRow.current = selectedItems;
-        if (tableApisRegistered.current) {
-          listener.onChange(widgetRegistrationKey, { selectedItems });
-          return;
-        }
-        tableApisRegistered.current = true;
-        listener.onChange(widgetRegistrationKey, __spreadProps(__spreadValues({}, tableApis), { selectedItems }));
-      }
-    };
     useEffect(() => {
-      updateSelectedItem();
-    }, [activeRowIds, selectedRowIds, useRadioSelect, useMultiSelect, internalDataset, name]);
+      if (!useRadioSelect && !useMultiSelect) return;
+      pushSelectedItemsToWidget(selectedRowIds);
+    }, [internalDataset, selectedRowIds, useRadioSelect, useMultiSelect]);
+    useEffect(() => {
+      if (useRadioSelect || useMultiSelect) return;
+      pushSelectedItemsToWidget(activeRowIds != null ? activeRowIds : []);
+    }, [activeRowIds, useRadioSelect, useMultiSelect]);
     const isTableLoading = useMemo(() => {
       return loading && navigation !== "On-Demand" && internalDataset.length === 0;
     }, [loading, navigation, internalDataset.length]);
@@ -1428,16 +1432,16 @@ const WmTableComponent = memo(
           domHidden: !!hiddenColStyle
         };
       });
-      if (rowExpansionConfig) {
+      if (visibleRowExpansionConfig) {
         const expansionInsertIndex = getExpansionColumnInsertIndex(
           leafHeaders,
-          rowExpansionConfig,
+          visibleRowExpansionConfig,
           {
             appendForGroupedTable: !!(tableStructure && hasTableGroups(tableStructure))
           }
         );
         if (expansionInsertIndex >= 0) {
-          base.splice(expansionInsertIndex, 0, __spreadProps(__spreadValues({}, buildExpansionColSpec(rowExpansionConfig.columnwidth)), {
+          base.splice(expansionInsertIndex, 0, __spreadProps(__spreadValues({}, buildExpansionColSpec(visibleRowExpansionConfig.columnwidth)), {
             domHidden: false
           }));
         }
@@ -1449,7 +1453,7 @@ const WmTableComponent = memo(
       columnsVersion,
       showheader,
       ColClassSignature,
-      rowExpansionConfig,
+      visibleRowExpansionConfig,
       tableStructure
     ]);
     return /* @__PURE__ */ jsxs(
@@ -1532,7 +1536,7 @@ const WmTableComponent = memo(
                               sorting,
                               columnSizing,
                               rowSelection,
-                              rowExpansionConfig,
+                              rowExpansionConfig: visibleRowExpansionConfig,
                               columnsVersion,
                               filterMode: filtermode,
                               columnFilters,
@@ -1562,7 +1566,7 @@ const WmTableComponent = memo(
                             nodatamessage,
                             loadingdatamsg,
                             isLoading: datasource == null ? void 0 : datasource.loading,
-                            rowExpansionConfig,
+                            rowExpansionConfig: visibleRowExpansionConfig,
                             expandedRows,
                             toggleRowExpansion: handleToggleRowExpansion,
                             isRowExpanded,

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

@@ -942,9 +942,9 @@ export interface BuildSelectionColumnsProps {
     useMultiSelect: boolean;
     /** @deprecated Header now reads from table.getIsAllRowsSelected() — no longer used internally. */
     selectedRowIds?: string[];
-    handleRadioSelection: (rowId: string, rowData?: any) => void;
-    handleMultiSelection: (rowId: string, rowData: any, isSelected: boolean) => void;
-    handleSelectAll: (isSelected: boolean) => void;
+    handleRadioSelection: (rowId: string, rowData?: any, event?: any) => void;
+    handleMultiSelection: (rowId: string, rowData: any, isSelected: boolean, event?: any) => void;
+    handleSelectAll: (isSelected: boolean, event?: any) => void;
     /** @deprecated Header now reads from table.getIsAllRowsSelected() — no longer used internally. */
     internalDataset?: any[];
     radioselecttitle?: string;
@@ -1056,8 +1056,8 @@ export interface UseTableColumnsProps {
     cellState?: CellStateReturn;
     isResizing?: boolean;
     handleRowClick?: (event: React.MouseEvent, rowData: any, rowId: string) => void;
-    handleRadioSelection?: (rowId: string, rowData: any) => void;
-    handleMultiSelection?: (rowId: string, rowData: any, checked: boolean) => void;
+    handleRadioSelection?: (rowId: string, rowData: any, event?: any) => void;
+    handleMultiSelection?: (rowId: string, rowData: any, checked: boolean, event?: any) => void;
     useRadioSelect?: boolean;
     useMultiSelect?: boolean;
     isRowSelected?: (rowId: string) => boolean;
@@ -1113,15 +1113,17 @@ export interface UseRowSelectionProps {
     onRowdeselect?: (event: any, widget: any, row: any) => void;
     listener?: any;
     navigation?: string;
+    viewParent?: any;
+    widgetRegistrationKey?: string;
     onSyncSelectedItems?: (selectedIds: string[]) => void;
 }
 export interface UseRowSelectionReturn {
     selectedRowIds: string[];
     useMultiSelect: boolean;
     useRadioSelect: boolean;
-    handleRadioSelection: (rowId: string, rowData?: any) => void;
-    handleMultiSelection: (rowId: string, rowData: any, isSelected: boolean) => void;
-    handleSelectAll: (isSelected: boolean) => void;
+    handleRadioSelection: (rowId: string, rowData?: any, event?: any) => void;
+    handleMultiSelection: (rowId: string, rowData: any, isSelected: boolean, event?: any) => void;
+    handleSelectAll: (isSelected: boolean, event?: any) => void;
     handleRowSelectionClick: (event: MouseEvent, rowId: string, rowData: any) => boolean;
     isRowSelected: (rowId: string) => boolean;
     isInteractiveElement: (event: MouseEvent) => boolean;
@@ -1261,7 +1263,9 @@ export interface UseRowHandlersProps {
     useMultiSelect?: boolean;
     isrowselectable?: boolean;
     listener?: any;
+    viewParent?: any;
     name: string;
+    widgetRegistrationKey?: string;
 }
 export interface UseRowHandlersReturn {
     handleRowClick: (event: MouseEvent, rowData: any, rowId: string) => void;

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

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Box, Radio, Checkbox, FormControlLabel, Tooltip } from "@mui/material";
+import { Box, Radio, FormControlLabel, Tooltip } from "@mui/material";
 import { TABLE_MESSAGES } from "./constants";
 const getSelectionMeta = (ctx) => {
   var _a, _b, _c, _d;
@@ -17,7 +17,7 @@ function RadioSelectCell(ctx) {
         Radio,
         {
           checked: isSelected,
-          onChange: () => handleRadioSelection == null ? void 0 : handleRadioSelection(rowId, row.original),
+          onChange: (e) => handleRadioSelection == null ? void 0 : handleRadioSelection(rowId, row.original, e),
           value: rowId,
           name: `wmRadioselect-${tableName != null ? tableName : "table"}`,
           inputProps: {
@@ -38,25 +38,24 @@ function MultiSelectCell(ctx) {
   const rowId = row.id;
   const isSelected = row.getIsSelected();
   const { handleMultiSelection, multiselecttitle, multiselectarialabel } = getSelectionMeta(ctx);
-  return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", justifyContent: "center" }, children: [
-    /* @__PURE__ */ jsx(Tooltip, { title: multiselecttitle != null ? multiselecttitle : "", placement: "top", children: /* @__PURE__ */ jsx(Box, { className: "app-checkbox checkbox", children: /* @__PURE__ */ jsx(
-      Checkbox,
-      {
-        checked: isSelected,
-        onChange: (e) => handleMultiSelection == null ? void 0 : handleMultiSelection(rowId, row.original, e.target.checked),
-        value: rowId,
-        name: "gridMultiSelect",
-        inputProps: {
-          "aria-label": multiselectarialabel,
+  return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex" }, children: [
+    /* @__PURE__ */ jsx(Tooltip, { title: multiselecttitle != null ? multiselecttitle : "", placement: "top", children: /* @__PURE__ */ jsx(Box, { className: "app-checkbox checkbox", children: /* @__PURE__ */ jsxs(Box, { component: "label", className: isSelected ? "" : "unchecked", children: [
+      /* @__PURE__ */ jsx(Box, { component: "span", className: "sr-only", "aria-live": "assertive", children: "Select row" }),
+      /* @__PURE__ */ jsx(
+        Box,
+        {
+          component: "input",
+          type: "checkbox",
           role: "checkbox",
-          "aria-live": "assertive"
-        },
-        size: "small",
-        sx: {
-          padding: 0
+          checked: isSelected,
+          onChange: (e) => handleMultiSelection == null ? void 0 : handleMultiSelection(rowId, row.original, e.target.checked, e),
+          value: rowId,
+          name: "gridMultiSelect",
+          "aria-label": multiselectarialabel
         }
-      }
-    ) }) }),
+      ),
+      /* @__PURE__ */ jsx(Box, { component: "span", className: "caption" })
+    ] }) }) }),
     isSelected ? /* @__PURE__ */ jsx("span", { className: "sr-only", "aria-live": "assertive", children: "Row Selected" }) : /* @__PURE__ */ jsx("span", { className: "sr-only", "aria-live": "assertive", children: "Row Deselected" })
   ] });
 }
@@ -65,20 +64,21 @@ function MultiSelectHeader({ table, column }) {
   var _a, _b;
   const isAllSelected = table.getIsAllRowsSelected();
   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,
-      onChange: (e) => handleSelectAll == null ? void 0 : handleSelectAll(e.target.checked),
-      size: "small",
-      inputProps: {
+  return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", width: "100%" }, children: /* @__PURE__ */ jsx(Box, { className: "app-checkbox checkbox", children: /* @__PURE__ */ jsxs(Box, { component: "label", className: isAllSelected ? "" : "unchecked", children: [
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: "input",
+        type: "checkbox",
+        role: "checkbox",
+        checked: isAllSelected,
+        onChange: (e) => handleSelectAll == null ? void 0 : handleSelectAll(e.target.checked, e),
+        name: "gridMultiSelectAll",
         "aria-label": "Select all rows"
-      },
-      sx: {
-        padding: 0
       }
-    }
-  ) }) });
+    ),
+    /* @__PURE__ */ jsx(Box, { component: "span", className: "caption" })
+  ] }) }) });
 }
 MultiSelectHeader.displayName = "MultiSelectHeader";
 const buildSelectionColumns = ({

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

@@ -62,7 +62,7 @@ const createDataColumn = (wmColumn, renderCell, index = 0) => {
   const colClassProp = (_a = wmColumn.colClass) != null ? _a : wmColumn["col-class"];
   let columnSize;
   if (wmColumn.width) {
-    columnSize = parseInt(wmColumn.width);
+    columnSize = parseWidth(wmColumn.width);
   } else if ((_b = wmColumn.styles) == null ? void 0 : _b.width) {
     columnSize = parseWidth(wmColumn.styles.width);
   }

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

@@ -7,7 +7,8 @@ export type EditWidgetType = FormWidgetType;
  * Angular behavior: when a dataset is a non-array object (e.g. a REST API response
  * like { users: [...], total: 100 }), return the first array-valued property as the
  * actual row data.  If the value is already an array it is returned as-is; if no
- * array property is found (e.g. a params snapshot) an empty array is returned.
+ * array property is found, the object itself is a single record (e.g. a get-by-id
+ * service response) and is wrapped as a one-row array.
  */
 export declare const extractDataArray: (dataset: any) => any[];
 /**
@@ -48,6 +49,13 @@ export declare const parseTableRowActions: (children: React.ReactNode) => WmTabl
 export declare const parseTableActions: (children: React.ReactNode) => WmTableActionProps[];
 /** Resolve row-bound expansion props. Uses precomputed map first, then tableRowProps(rowData) fallback. */
 export declare const getRowExpansionConfig: (config: WmTableRowProps | null, rowId: string, rowData?: any) => WmTableRowProps | null;
+/**
+ * Whether the expansion column should be reserved in the table layout.
+ * When tableRowProps gates show per row (e.g. hierarchy children.length), hide the
+ * column entirely if no current row would show an expand control — avoids empty
+ * row-expansion-cell spacers for leaf-only datasets.
+ */
+export declare const isRowExpansionVisible: (config: WmTableRowProps | null | undefined, dataset: any[] | undefined) => boolean;
 export declare const parseTableRowExpansion: (children: React.ReactNode) => WmTableRowProps | null;
 export declare const isEditAction: (actionKey: string) => boolean;
 export declare const isDeleteAction: (actionKey: string) => boolean;

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

@@ -70,12 +70,26 @@ const hashString = (str, index) => {
   }
   return `row_${Math.abs(hash)}_${index}`;
 };
+const safeStringify = (value) => {
+  const seen = /* @__PURE__ */ new WeakSet();
+  try {
+    return JSON.stringify(value, (_key, val) => {
+      if (typeof val === "object" && val !== null) {
+        if (seen.has(val)) return "[Circular]";
+        seen.add(val);
+      }
+      return val;
+    });
+  } catch (e) {
+    return String(value);
+  }
+};
 const generateDeterministicHash = (obj, index) => {
   const hashSource = index.toString() + (isObject(obj) ? transform(
     omit(obj, "_wmTableRowId"),
     (result, value, key) => {
       if (!isNil(value)) {
-        result.push(`${key}:${isObject(value) ? JSON.stringify(value) : String(value)}`);
+        result.push(`${key}:${isObject(value) ? safeStringify(value) : String(value)}`);
       }
     },
     []
@@ -86,7 +100,7 @@ const extractDataArray = (dataset) => {
   if (isArray(dataset)) return dataset;
   if (dataset !== null && dataset !== void 0 && typeof dataset === "object") {
     const firstArray = Object.values(dataset).find((v) => isArray(v));
-    return firstArray != null ? firstArray : [];
+    return firstArray != null ? firstArray : [dataset];
   }
   return [];
 };
@@ -351,6 +365,19 @@ const getRowExpansionConfig = (config, rowId, rowData) => {
   const overrides = typeof config.tableRowProps === "function" && rowData !== void 0 ? config.tableRowProps(rowData) : {};
   return __spreadValues(__spreadValues({}, config), overrides);
 };
+const isRowExpansionVisible = (config, dataset) => {
+  if (!config) return false;
+  if (typeof config.tableRowProps === "function") {
+    if (!Array.isArray(dataset) || dataset.length === 0) return false;
+    return dataset.some((row) => {
+      var _a;
+      const overrides = ((_a = config.tableRowProps) == null ? void 0 : _a.call(config, row)) || {};
+      const show = overrides.show !== void 0 ? overrides.show : config.show;
+      return show !== false;
+    });
+  }
+  return config.show !== false;
+};
 const parseTableRowExpansion = (children) => {
   let rowExpansionConfig = null;
   React.Children.forEach(children, (child) => {
@@ -714,6 +741,7 @@ export {
   isDeleteAction,
   isEditAction,
   isInteractiveElement,
+  isRowExpansionVisible,
   parseTableActions,
   parseTableColumns,
   parseTableRowActions,

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

@@ -11,6 +11,13 @@ export declare const hasInteractiveAttributes: (element: HTMLElement) => boolean
  * Check if element or its ancestors are interactive
  */
 export declare const isInteractiveElement: (event: React.MouseEvent) => boolean;
+export declare const toNativeEvent: (event: any) => any;
+export declare const createSelectionEventStub: () => any;
+/**
+ * Widget passed to user callbacks must come from the page proxy (viewParent), which
+ * listener.onChange updates synchronously. listener.Widgets lags one React commit behind.
+ */
+export declare const getWidgetForCallback: (listener: any | undefined, viewParent: any | undefined, widgetKey: string) => any;
 /**
  * Get row IDs from dataset
  */

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

@@ -47,6 +47,30 @@ const isInteractiveElement = (event) => {
   }
   return false;
 };
+const toNativeEvent = (event) => {
+  var _a;
+  return (_a = event == null ? void 0 : event.nativeEvent) != null ? _a : event;
+};
+const createSelectionEventStub = () => ({
+  target: {
+    closest: () => null,
+    matches: () => false,
+    querySelector: () => null
+  },
+  currentTarget: null,
+  preventDefault: () => {
+  },
+  stopPropagation: () => {
+  },
+  stopImmediatePropagation: () => {
+  },
+  isDefaultPrevented: () => false,
+  isPropagationStopped: () => false
+});
+const getWidgetForCallback = (listener, viewParent, widgetKey) => {
+  var _a, _b, _c;
+  return (_c = (_a = viewParent == null ? void 0 : viewParent.Widgets) == null ? void 0 : _a[widgetKey]) != null ? _c : (_b = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _b[widgetKey];
+};
 const getRowIdsFromDataset = (dataset) => {
   return dataset.map((row) => row._wmTableRowId || String(row.id));
 };
@@ -102,10 +126,13 @@ const selectionStateHelpers = {
   }
 };
 export {
+  createSelectionEventStub,
   getRowIdsFromDataset,
+  getWidgetForCallback,
   hasInteractiveAttributes,
   hasInteractiveClass,
   isInteractiveElement,
   rowExistsInDataset,
-  selectionStateHelpers
+  selectionStateHelpers,
+  toNativeEvent
 };

package/components/dialogs/dialog-actions/index.js

@@ -1,9 +1,18 @@
 import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
 import DialogActions from "@mui/material/DialogActions";
 import withBaseWrapper from "../../../higherOrder/withBaseWrapper";
 const WmDialogFooter = (props) => {
-  const { children } = props;
-  return /* @__PURE__ */ jsx(DialogActions, { className: "app-dialog-footer modal-footer", children });
+  const { children, className, styles, hidden } = props;
+  return /* @__PURE__ */ jsx(
+    DialogActions,
+    {
+      className: clsx("app-dialog-footer modal-footer", className),
+      style: styles,
+      hidden: hidden != null ? hidden : false,
+      children
+    }
+  );
 };
 WmDialogFooter.displayName = "WmDialogFooter";
 var dialog_actions_default = withBaseWrapper(WmDialogFooter);

package/components/dialogs/dialog-header/index.js

@@ -38,7 +38,7 @@ const WmDialogHeader = (props) => {
             variant,
             id: titleid,
             component: variant,
-            sx: { display: "flex", alignItems: "center" },
+            sx: { display: "flex", alignItems: "center", fontWeight: "bold" },
             className: "app-dialog-title modal-title",
             children: [
               isDialog ? iconclass && iconclass.trim() !== "" || iconurl && iconurl !== "" ? /* @__PURE__ */ jsx(