@wavemaker-ai/react-runtime 1.0.0-rc.330 → 1.0.0-rc.334

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/useTableData.js

@@ -59,8 +59,13 @@ const useTableData = ({
   widgetName
 }) => {
   const rowIdCacheRef = useRef([]);
+  const rawDatasetRef = useRef(void 0);
+  const processedDatasetRef = useRef([]);
   const processedDataset = useMemo(() => {
     const extracted = extractDataArray(dataset);
+    if (isEqual(rawDatasetRef.current, extracted)) {
+      return processedDatasetRef.current;
+    }
     const cachedIds = rowIdCacheRef.current;
     const prestamped = extracted.map((item, i) => {
       if (!item || typeof item !== "object" || item._wmTableRowId || item.id || item.ID || item.Id || !cachedIds[i]) {
@@ -70,8 +75,11 @@ const useTableData = ({
     });
     const withIds = addUniqueRowIds(prestamped);
     rowIdCacheRef.current = withIds.map((r) => r == null ? void 0 : r._wmTableRowId);
-    return removeEmptyRecords(withIds);
-  }, [dataset]);
+    const result = removeEmptyRecords(withIds);
+    rawDatasetRef.current = extracted;
+    processedDatasetRef.current = result;
+    return result;
+  }, [dataset, dataset == null ? void 0 : dataset.length]);
   const [internalDataset, setInternalDataset] = useState(processedDataset);
   useEffect(() => {
     if (!isEqual(internalDataset, processedDataset)) {

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

@@ -102,6 +102,7 @@ declare const WmTableStandalone: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -245,6 +246,7 @@ declare const WmTable: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/data/table/index.js

@@ -638,9 +638,10 @@ const WmTableComponent = memo(
         if (onSort && newSorting.length > 0) {
           const sortData = {
             field: newSorting[0].id,
-            direction: newSorting[0].desc ? "desc" : "asc"
+            direction: newSorting[0].desc ? "desc" : "asc",
+            sortDirection: newSorting[0].desc ? "desc" : "asc"
           };
-          onSort(null, (_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name], sortData);
+          onSort(null, (_a2 = viewParent == null ? void 0 : viewParent.Widgets) == null ? void 0 : _a2[name], sortData);
         }
       },
       [sorting, name]
@@ -778,8 +779,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 = viewParent == null ? void 0 : viewParent.Widgets) == null ? void 0 : _a2[name], data);
     }, [onDatarender, name]);
     columnsStateRef.current = columns;
     const columnsForTable = useMemo(() => {
@@ -944,7 +945,7 @@ const WmTableComponent = memo(
       listener,
       name
     });
-    const { showPanelHeading, showPagination } = usePanelStructure({
+    const { showPanelHeading, showPagination, showFooter } = usePanelStructure({
       title,
       subheading,
       iconclass,
@@ -1026,7 +1027,8 @@ const WmTableComponent = memo(
         const firstSort = sorting[0];
         return {
           field: firstSort.id,
-          direction: firstSort.desc ? "desc" : "asc"
+          direction: firstSort.desc ? "desc" : "asc",
+          sortDirection: firstSort.desc ? "desc" : "asc"
         };
       }
       return void 0;
@@ -1118,8 +1120,8 @@ const WmTableComponent = memo(
           });
           if (onBeforedatarender) {
             onBeforedatarender(
-              (_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name],
-              // widget reference
+              (_a2 = viewParent == null ? void 0 : viewParent.Widgets) == null ? void 0 : _a2[name],
+              // widget reference (reactive proxy, not raw listener)
               data,
               // data
               columnsProxy
@@ -1133,10 +1135,9 @@ const WmTableComponent = memo(
             } else {
               queueOnDatarenderAfterPaint();
             }
-            const nextRows = internalDataset.map(
-              (r) => typeof r === "object" && r !== null ? __spreadValues({}, r) : r
+            setInternalDataset(
+              (prev) => prev.map((r) => typeof r === "object" && r !== null ? __spreadValues({}, r) : r)
             );
-            setInternalDataset(nextRows);
           } else if (onDatarender) {
             queueOnDatarenderAfterPaint();
           }
@@ -1275,7 +1276,7 @@ const WmTableComponent = memo(
           const rowIndex = internalDataset.findIndex(
             (r) => r._wmTableRowId === row._wmTableRowId || r.id !== void 0 && r.id === row.id
           );
-          const result = await onBeforerowdelete(event, (_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name], cleanedRow, {
+          const result = await onBeforerowdelete(event, (_a2 = viewParent == null ? void 0 : viewParent.Widgets) == null ? void 0 : _a2[name], cleanedRow, {
             rowIndex,
             data: cleanedRow
           });
@@ -1339,7 +1340,7 @@ const WmTableComponent = memo(
             showToast("Failed to refresh table data", "Error");
           }
           if (onError) {
-            onError(null, (_b2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _b2[name], error, "refresh");
+            onError(null, (_b2 = viewParent == null ? void 0 : viewParent.Widgets) == null ? void 0 : _b2[name], error, "refresh");
           }
         }
       },
@@ -1601,7 +1602,7 @@ const WmTableComponent = memo(
               }
             ) }) })
           ] }),
-          /* @__PURE__ */ jsxs(Box, { className: "panel-footer clearfix", children: [
+          showFooter && /* @__PURE__ */ jsxs(Box, { className: "panel-footer clearfix", children: [
             showPagination && /* @__PURE__ */ jsx(Box, { className: "app-datagrid-paginator", children: /* @__PURE__ */ jsx(
               WmPagination,
               {

package/components/data/table/live-table/index.d.ts

@@ -35,6 +35,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

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;
@@ -1095,6 +1095,7 @@ export interface UsePanelStructureProps {
 export interface UsePanelStructureReturn {
     showPanelHeading: boolean;
     showPagination: boolean;
+    showFooter: boolean;
 }
 export interface UseRowSelectionProps {
     radioselect?: boolean;
@@ -1121,9 +1122,9 @@ 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;

package/components/data/table/table-action/index.d.ts

@@ -21,6 +21,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/data/table/table-column/index.d.ts

@@ -21,6 +21,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/data/table/table-row/index.d.ts

@@ -21,6 +21,7 @@ declare const _default: React.ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/data/table/table-row-action/index.d.ts

@@ -29,6 +29,7 @@ export declare const WmTableRowAction: React.FC<{
     margin?: string;
     width?: number | string;
     height?: number | string;
+    class?: string;
     conditionalstyle?: React.CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

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, Tooltip } from "@mui/material";
 import { TABLE_MESSAGES } from "./constants";
 const getSelectionMeta = (ctx) => {
   var _a, _b, _c, _d;
@@ -10,27 +10,22 @@ function RadioSelectCell(ctx) {
   const rowId = row.id;
   const isSelected = row.getIsSelected();
   const { handleRadioSelection, radioselecttitle, radioselectarialabel, tableName } = getSelectionMeta(ctx);
-  return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsx(Tooltip, { title: radioselecttitle != null ? radioselecttitle : "", placement: "top", children: /* @__PURE__ */ jsx(Box, { className: "radio app-radio", children: /* @__PURE__ */ jsx(
-    FormControlLabel,
-    {
-      control: /* @__PURE__ */ jsx(
-        Radio,
-        {
-          checked: isSelected,
-          onChange: () => handleRadioSelection == null ? void 0 : handleRadioSelection(rowId, row.original),
-          value: rowId,
-          name: `wmRadioselect-${tableName != null ? tableName : "table"}`,
-          inputProps: {
-            "aria-label": radioselectarialabel
-          },
-          rowselectinput: "",
-          size: "small"
-        }
-      ),
-      label: "",
-      className: "caption"
-    }
-  ) }) }) });
+  return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsx(Tooltip, { title: radioselecttitle != null ? radioselecttitle : "", placement: "top", children: /* @__PURE__ */ jsx(Box, { className: "radio app-radio", children: /* @__PURE__ */ jsxs(Box, { component: "label", children: [
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: "input",
+        type: "radio",
+        checked: isSelected,
+        onChange: (e) => handleRadioSelection == null ? void 0 : handleRadioSelection(rowId, row.original, e),
+        value: rowId,
+        name: `wmRadioselect-${tableName != null ? tableName : "table"}`,
+        "aria-label": radioselectarialabel,
+        rowselectinput: ""
+      }
+    ),
+    /* @__PURE__ */ jsx(Box, { component: "span", className: "caption" })
+  ] }) }) }) });
 }
 RadioSelectCell.displayName = "RadioSelectCell";
 function MultiSelectCell(ctx) {
@@ -39,24 +34,23 @@ function MultiSelectCell(ctx) {
   const isSelected = row.getIsSelected();
   const { handleMultiSelection, multiselecttitle, multiselectarialabel } = getSelectionMeta(ctx);
   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__ */ 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,
+    /* @__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 +59,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", 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/crud-handlers.js

@@ -23,6 +23,7 @@ import findIndex from "lodash-es/findIndex";
 import slice from "lodash-es/slice";
 import forEach from "lodash-es/forEach";
 import some from "lodash-es/some";
+import { addUniqueRowIds } from "./index";
 import { DataSource } from "../../types";
 const getDatasourceInfo = async (datasource) => {
   var _a, _b;
@@ -56,7 +57,8 @@ const createCompleteRecord = (editingData, wmTableColumns, serverResponse) => {
       completeRecord[column.field] = (_b = (_a = editingData[column.field]) != null ? _a : column.defaultvalue) != null ? _b : "";
     }
   });
-  return __spreadProps(__spreadValues(__spreadValues({}, completeRecord), serverResponse), { _wmTableRowId: uniqueId("new_row_") });
+  const record = __spreadProps(__spreadValues(__spreadValues({}, completeRecord), serverResponse), { _wmTableRowId: uniqueId("new_row_") });
+  return addUniqueRowIds([record])[0];
 };
 const hasValidData = (record) => some(record, (value) => value !== void 0 && value !== null && value !== "");
 const updateDataset = (isNewRow, rowId, editingData, wmTableColumns, serverResponse, options) => {

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

@@ -47,7 +47,7 @@ function buildExpansionColSpec(columnwidth) {
   return {
     key: "row-expansion",
     width: w,
-    style: { width: w }
+    style: { width: w, minWidth: w, maxWidth: w }
   };
 }
 export {

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

@@ -51,9 +51,16 @@ export declare const parseTableActions: (children: React.ReactNode) => WmTableAc
 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.
+ *
+ * This is a STRUCTURAL check, matching Angular's datatable: the row-expansion
+ * column is part of the table layout whenever a row-expansion config exists and
+ * is not statically disabled. Per-row `show` (e.g. a hierarchy `children.length`
+ * gate via `tableRowProps`) only controls whether the toggle *button* renders
+ * inside the cell — see RowExpansionButton — never whether the column exists.
+ *
+ * Collapsing the column when no current row happens to be expandable would
+ * desynchronise header/body/colgroup cell counts and shift every data column by
+ * one for leaf-only datasets (e.g. nested child tables in a hierarchy).
  */
 export declare const isRowExpansionVisible: (config: WmTableRowProps | null | undefined, dataset: any[] | undefined) => boolean;
 export declare const parseTableRowExpansion: (children: React.ReactNode) => WmTableRowProps | null;

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)}`);
       }
     },
     []
@@ -355,12 +369,7 @@ 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 true;
   }
   return config.show !== false;
 };
@@ -490,9 +499,11 @@ const shouldShowPagination = ({
   datasource,
   showrecordcount = false
 }) => {
-  var _a;
+  var _a, _b, _c;
   if (!shownavigation) return false;
-  if (((_a = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _a.totalElements) > 0) return true;
+  const hasRecords = size(internalDataset) > 0 || ((_a = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _a.totalElements) > 0 || Boolean((_b = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _b.next);
+  if (!hasRecords) return false;
+  if (((_c = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _c.totalElements) > pagesize) return true;
   if (allowpagesizechange) return true;
   if (showrecordcount) return true;
   return onDemandLoad || size(internalDataset) > pagesize;

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

@@ -7,10 +7,24 @@ export declare const hasInteractiveClass: (element: HTMLElement) => boolean;
  * Check if an element has interactive attributes
  */
 export declare const hasInteractiveAttributes: (element: HTMLElement) => boolean;
+/** The name datatable.js and the React table use for a row's multiselect checkbox. */
+export declare const MULTI_SELECT_INPUT_NAME = "gridMultiSelect";
+/**
+ * True when the clicked row's selection checkbox has been renamed away from
+ * `gridMultiSelect`.
+ *
+ * Mirrors the Angular datatable, whose toggleRowSelection only ever acts on
+ * `input[name="gridMultiSelect"]`, so application code that renames the input
+ * (e.g. to "gridMultiSelectDisable") opts that row out of click selection.
+ * Rows without a selection checkbox are never treated as renamed.
+ */
+export declare const isSelectionCheckboxRenamed: (event: React.MouseEvent) => 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.

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

@@ -33,6 +33,14 @@ const hasInteractiveAttributes = (element) => {
   }
   return false;
 };
+const MULTI_SELECT_INPUT_NAME = "gridMultiSelect";
+const isSelectionCheckboxRenamed = (event) => {
+  var _a, _b;
+  const target = event == null ? void 0 : event.target;
+  const row = (_a = target == null ? void 0 : target.closest) == null ? void 0 : _a.call(target, "tr");
+  const checkbox = (_b = row == null ? void 0 : row.querySelector) == null ? void 0 : _b.call(row, 'input[type="checkbox"]');
+  return !!checkbox && checkbox.getAttribute("name") !== MULTI_SELECT_INPUT_NAME;
+};
 const isInteractiveElement = (event) => {
   const target = event.target;
   if (INTERACTIVE_TAG_NAMES.includes(target.tagName)) {
@@ -47,6 +55,26 @@ 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];
@@ -106,11 +134,15 @@ const selectionStateHelpers = {
   }
 };
 export {
+  MULTI_SELECT_INPUT_NAME,
+  createSelectionEventStub,
   getRowIdsFromDataset,
   getWidgetForCallback,
   hasInteractiveAttributes,
   hasInteractiveClass,
   isInteractiveElement,
+  isSelectionCheckboxRenamed,
   rowExistsInDataset,
-  selectionStateHelpers
+  selectionStateHelpers,
+  toNativeEvent
 };

package/components/dialogs/alert-dialog/index.d.ts

@@ -29,6 +29,7 @@ declare const WmAlertDialogStandalone: {
         width?: number | string;
         height?: number | string;
         className?: string;
+        class?: string;
         conditionalstyle?: React.CSSProperties;
         conditionalclass?: string;
         showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -115,6 +116,7 @@ declare const _default: {
         width?: number | string;
         height?: number | string;
         className?: string;
+        class?: string;
         conditionalstyle?: React.CSSProperties;
         conditionalclass?: string;
         showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/dialogs/confirm-dialog/index.d.ts

@@ -30,6 +30,7 @@ declare const WmConfirmDialogStandalone: {
         width?: number | string;
         height?: number | string;
         className?: string;
+        class?: string;
         conditionalstyle?: React.CSSProperties;
         conditionalclass?: string;
         showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -117,6 +118,7 @@ declare const _default: {
         width?: number | string;
         height?: number | string;
         className?: string;
+        class?: string;
         conditionalstyle?: React.CSSProperties;
         conditionalclass?: string;
         showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/dialogs/dialog/index.d.ts

@@ -34,6 +34,7 @@ declare const WmDialogStandalone: {
         width?: number | string;
         height?: number | string;
         className?: string;
+        class?: string;
         conditionalstyle?: import("react").CSSProperties;
         conditionalclass?: string;
         showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];
@@ -127,6 +128,7 @@ declare const _default: {
         width?: number | string;
         height?: number | string;
         className?: string;
+        class?: string;
         conditionalstyle?: import("react").CSSProperties;
         conditionalclass?: string;
         showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];

package/components/dialogs/dialog-actions/index.d.ts

@@ -24,6 +24,7 @@ declare const _default: import("react").ComponentType<{
     width?: number | string;
     height?: number | string;
     className?: string;
+    class?: string;
     conditionalstyle?: import("react").CSSProperties;
     conditionalclass?: string;
     showindevice?: ("xs" | "sm" | "md" | "lg" | "all")[];