@wavemaker-ai/react-runtime 1.0.0-next.27766

package/components/data/table/index.js

@@ -0,0 +1,1734 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import React, {
+  memo,
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useState,
+  useRef
+} from "react";
+import {
+  WmSkeleton,
+  SKELETON_REGISTRY,
+  useShouldShowSkeleton
+} from "../../common/wm-skeleton";
+import {
+  useReactTable,
+  getCoreRowModel,
+  getPaginationRowModel,
+  getSortedRowModel
+} from "@tanstack/react-table";
+import { Box, Table } from "@mui/material";
+import { uniqueId, find, isEqual } from "lodash-es";
+import withBaseWrapper from "../../../higherOrder/withBaseWrapper";
+import WmPagination from "../pagination";
+import {
+  useTableData,
+  useFormWidget,
+  usePanelStructure,
+  useTableEdit,
+  useTableColumns,
+  useRowSelection,
+  useTableState,
+  useCellState,
+  useRowHandlers,
+  usePaginationState,
+  useTableInitialization,
+  useRowExpansion,
+  useServerSideSorting,
+  useTableEffects,
+  useTableStateManager,
+  useTableFilter,
+  useDynamicColumns,
+  useCustomExpressionColumns
+} from "./hooks";
+import {
+  parseTableColumns,
+  parseTableStructureWithGroups,
+  flattenTableStructure,
+  parseTableRowActions,
+  parseTableActions,
+  parseTableRowExpansion,
+  getSpacingClasses,
+  TABLE_CSS_CLASSES,
+  TABLE_MESSAGES,
+  getTableState,
+  saveTableState,
+  clearTableState,
+  addUniqueRowIds,
+  cleanRowData,
+  getDomHiddenColStyle
+} from "./utils";
+import { hasTableGroups } from "./utils/groupHeaderUtils";
+import {
+  buildExpansionColSpec,
+  getExpansionColumnInsertIndex
+} from "./utils/expansionColumn";
+import { handleNewRowNavigation } from "./utils";
+import {
+  TablePanelHeading,
+  TableFooterActions,
+  TableBodyComponent,
+  TableHeaderComponent,
+  GlobalSearchFilter,
+  SummaryRowFooter
+} from "./components";
+import { buildSelectionColumns } from "./utils/buildSelectionColumns";
+import LoadingComponent from "../pagination/components/LoadingComponent";
+import { createColumnsProxy } from "./utils/columnProxy";
+import { useDataSourceSubscription } from "../../../hooks/useDataSourceSubscription";
+import { refreshDataSource } from "./utils/crud-handlers";
+import { DataSource } from "../types";
+import { EditedRowsProvider } from "./hooks/use-edited-rows";
+import {
+  subscribeToScriptPageSizeBroadcast,
+  broadcastScriptPageSize
+} from "./utils/script-page-size-broadcast";
+import withStandalone from "../../../higherOrder/withStandalone";
+const WmTableComponent = memo(
+  (props) => {
+    var _a, _b, _d, _e, _f, _g, _h, _i;
+    const _c = props, {
+      name,
+      dataset = [],
+      navigation = "Basic",
+      children,
+      listener,
+      pagesize = 5,
+      navigationalign = "left",
+      showrecordcount = false,
+      maxsize = 5,
+      boundarylinks = false,
+      allowpagesizechange = false,
+      pagesizeoptions = "5,10,20,50,100",
+      formposition = "bottom",
+      editmode = "none",
+      spacing = "normal",
+      title,
+      subheading,
+      iconclass,
+      iconurl,
+      exportOptions = [],
+      shownavigation = true,
+      onDemandLoad = false,
+      showrowindex = false,
+      showheader = true,
+      enablesort = true,
+      enablecolumnselection = false,
+      onColumnselect,
+      onColumndeselect,
+      radioselect = false,
+      radioselecttitle = "",
+      radioselectarialabel = (_a = TABLE_MESSAGES) == null ? void 0 : _a.radioSelectAriaLabel,
+      multiselect = false,
+      multiselecttitle = "",
+      multiselectarialabel = (_b = TABLE_MESSAGES) == null ? void 0 : _b.multiSelectAriaLabel,
+      gridfirstrowselect = false,
+      isrowselectable = false,
+      rowClass = "",
+      deleteoktext = TABLE_MESSAGES.deleteOkText,
+      deletecanceltext = TABLE_MESSAGES.deleteCancelText,
+      confirmdelete = TABLE_MESSAGES.deleteConfirmMessage,
+      errormessage = TABLE_MESSAGES.operationError,
+      nodatamessage = TABLE_MESSAGES.noDataMessage,
+      loadingdatamsg = TABLE_MESSAGES.loadingMessage,
+      insertmessage = TABLE_MESSAGES.insertSuccess,
+      updatemessage = TABLE_MESSAGES.updateSuccess,
+      deletemessage = TABLE_MESSAGES.deleteSuccess,
+      ondemandmessage = "Load More",
+      viewlessmessage = "View Less",
+      showviewlessbutton = false,
+      onRowDelete,
+      onRowUpdate,
+      datasource,
+      binddataset,
+      onSuccess,
+      onError,
+      onRowinsert,
+      onRowupdate,
+      onRowdelete,
+      onRowclick,
+      onSort,
+      onBeforerowdelete,
+      onBeforefilter,
+      onHeaderclick,
+      onRowselect,
+      onRowdeselect,
+      onSetrecord,
+      statehandler,
+      formName,
+      parentForm,
+      filtermode,
+      filteronkeypress = false,
+      searchlabel = "Search",
+      onBeforedatarender,
+      onDatarender,
+      className,
+      exportformat,
+      exportdatasize,
+      onBeforeexport,
+      onAfterexport,
+      styles
+    } = _c, rest = __objRest(_c, [
+      "name",
+      "dataset",
+      "navigation",
+      "children",
+      "listener",
+      "pagesize",
+      "navigationalign",
+      "showrecordcount",
+      "maxsize",
+      "boundarylinks",
+      "allowpagesizechange",
+      "pagesizeoptions",
+      "formposition",
+      "editmode",
+      "spacing",
+      "title",
+      "subheading",
+      "iconclass",
+      "iconurl",
+      "exportOptions",
+      "shownavigation",
+      "onDemandLoad",
+      "showrowindex",
+      "showheader",
+      "enablesort",
+      "enablecolumnselection",
+      "onColumnselect",
+      "onColumndeselect",
+      "radioselect",
+      "radioselecttitle",
+      "radioselectarialabel",
+      "multiselect",
+      "multiselecttitle",
+      "multiselectarialabel",
+      "gridfirstrowselect",
+      "isrowselectable",
+      "rowClass",
+      "deleteoktext",
+      "deletecanceltext",
+      "confirmdelete",
+      "errormessage",
+      "nodatamessage",
+      "loadingdatamsg",
+      "insertmessage",
+      "updatemessage",
+      "deletemessage",
+      "ondemandmessage",
+      "viewlessmessage",
+      "showviewlessbutton",
+      "onRowDelete",
+      "onRowUpdate",
+      "datasource",
+      "binddataset",
+      "onSuccess",
+      "onError",
+      "onRowinsert",
+      "onRowupdate",
+      "onRowdelete",
+      "onRowclick",
+      "onSort",
+      "onBeforerowdelete",
+      "onBeforefilter",
+      "onHeaderclick",
+      "onRowselect",
+      "onRowdeselect",
+      "onSetrecord",
+      "statehandler",
+      "formName",
+      "parentForm",
+      "filtermode",
+      "filteronkeypress",
+      "searchlabel",
+      "onBeforedatarender",
+      "onDatarender",
+      "className",
+      "exportformat",
+      "exportdatasize",
+      "onBeforeexport",
+      "onAfterexport",
+      "styles"
+    ]);
+    const effectiveStorageKey = useMemo(
+      () => name + ((listener == null ? void 0 : listener.partialName) ? `__${listener == null ? void 0 : listener.partialName}` : ""),
+      [name, listener == null ? void 0 : listener.partialName]
+    );
+    const widgetRegistrationKey = props["item-id"] || name;
+    const listenerRef = useRef(listener);
+    listenerRef.current = listener;
+    const loading = (datasource == null ? void 0 : datasource.loading) || false;
+    const prevDatasetRef = useRef(dataset);
+    const prevSelectedRow = useRef(null);
+    const tableApisRegistered = useRef(false);
+    const [accumulatedData, setAccumulatedData] = useState([]);
+    const handleAccumulatedDataUpdate = useCallback((data) => {
+      setAccumulatedData((prevData) => {
+        if (prevData.length !== data.length) {
+          return data;
+        }
+        return prevData;
+      });
+    }, []);
+    useEffect(() => {
+      if (navigation !== "Scroll" && navigation !== "On-Demand") {
+        setAccumulatedData([]);
+      }
+    }, [navigation]);
+    const notifyApp = (_d = listener == null ? void 0 : listener.App) == null ? void 0 : _d.notifyApp;
+    const showToast = useCallback(
+      (message, type) => {
+        if (notifyApp) {
+          notifyApp(message, type);
+        }
+      },
+      [notifyApp]
+    );
+    const isServerSidePagination = useCallback(() => {
+      if (navigation === "None") {
+        return false;
+      }
+      return !!(datasource && datasource.execute && datasource.execute(DataSource.Operation.IS_PAGEABLE));
+    }, [datasource, navigation]);
+    const effectiveStateHandler = navigation === "Scroll" ? "none" : statehandler;
+    useDataSourceSubscription({
+      datasource,
+      statehandler: effectiveStateHandler,
+      name,
+      widgetType: "table",
+      onPageRestored: () => {
+      }
+    });
+    const { internalDataset, setInternalDataset, deleteRecord, renderConfirmDialog } = useTableData(
+      {
+        dataset,
+        onRowDelete,
+        deleteoktext,
+        deletecanceltext,
+        confirmdelete,
+        deletemessage,
+        errormessage,
+        showToast,
+        datasource,
+        binddataset,
+        onSuccess,
+        onError,
+        onRowdelete,
+        isServerSidePagination: isServerSidePagination(),
+        listener,
+        widgetName: name
+      }
+    );
+    const { renderFormWidget } = useFormWidget({
+      listener
+    });
+    const cellState = useCellState(name);
+    const syncSelectedItemsImplRef = useRef(null);
+    const onSyncSelectedItems = useCallback(
+      (ids) => {
+        var _a2;
+        return (_a2 = syncSelectedItemsImplRef.current) == null ? void 0 : _a2.call(syncSelectedItemsImplRef, ids);
+      },
+      []
+    );
+    const {
+      initialPage,
+      initialPageSize,
+      initialActualPageSize,
+      initialSearchState,
+      initialSortState
+    } = useMemo(() => {
+      var _a2;
+      if (navigation === "Scroll") {
+        return {
+          initialPage: 1,
+          initialPageSize: pagesize,
+          initialActualPageSize: void 0,
+          initialSearchState: void 0,
+          initialSortState: void 0
+        };
+      }
+      const persisted = getTableState(name, effectiveStateHandler);
+      const sortedPageSizeOptions = (pagesizeoptions || "").split(",").map((v) => Number(v.trim())).filter((n) => !Number.isNaN(n)).sort((a, b) => a - b);
+      const hasExplicitPersistedPageSize = persisted != null && persisted.pagesize !== void 0 && persisted.pagesize !== null;
+      const defaultPageSizeFromOptions = allowpagesizechange && sortedPageSizeOptions.length > 0 && !hasExplicitPersistedPageSize ? sortedPageSizeOptions[0] : 20;
+      let actualPageSize;
+      if ((persisted == null ? void 0 : persisted.actualpagesize) !== void 0) {
+        actualPageSize = persisted.actualpagesize;
+      } else if ((_a2 = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _a2.size) {
+        actualPageSize = datasource.pagination.size;
+      } else if (datasource == null ? void 0 : datasource.maxResults) {
+        actualPageSize = datasource.maxResults;
+      }
+      if (persisted) {
+        const hasActiveFilter = persisted.search && persisted.search.length > 0;
+        const restoredPage = hasActiveFilter ? 1 : persisted.pagination || 1;
+        const persistedPageSize = hasExplicitPersistedPageSize ? persisted.pagesize : defaultPageSizeFromOptions != null ? defaultPageSizeFromOptions : pagesize;
+        if (isServerSidePagination() && datasource && datasource.maxResults !== void 0 && hasExplicitPersistedPageSize) {
+          datasource.maxResults = persistedPageSize;
+        }
+        return {
+          initialPage: restoredPage,
+          initialPageSize: persistedPageSize,
+          initialActualPageSize: actualPageSize,
+          initialSearchState: persisted.search || void 0,
+          initialSortState: persisted.sort || void 0
+        };
+      }
+      const initialPageSize2 = allowpagesizechange ? defaultPageSizeFromOptions != null ? defaultPageSizeFromOptions : actualPageSize : pagesize;
+      return {
+        initialPage: 1,
+        initialPageSize: initialPageSize2,
+        initialActualPageSize: pagesize,
+        initialSearchState: void 0,
+        initialSortState: void 0
+      };
+    }, [name, effectiveStateHandler, pagesize, isServerSidePagination(), datasource, navigation]);
+    const tableRef = React.useRef(null);
+    const tableContainerRef = React.useRef(null);
+    const prevPageIndexRef = useRef(-1);
+    const {
+      paginationState,
+      setPaginationState,
+      handlePaginationChange,
+      handlePageSizeChange: handlePageSizeChangeBase
+    } = usePaginationState({
+      initialPage,
+      initialPageSize,
+      editmode,
+      internalDataset,
+      datasource,
+      isServerSidePagination: isServerSidePagination()
+    });
+    const effectiveMultiselect = multiselect;
+    const {
+      selectedRowIds,
+      useMultiSelect,
+      useRadioSelect,
+      handleRadioSelection,
+      handleMultiSelection,
+      handleSelectAll,
+      handleRowSelectionClick,
+      isRowSelected
+    } = useRowSelection({
+      radioselect,
+      multiselect: effectiveMultiselect,
+      gridfirstrowselect,
+      internalDataset,
+      cellState,
+      name,
+      statehandler: effectiveStateHandler,
+      initialActualPageSize,
+      getTableState: () => tableRef.current ? {
+        currentPage: tableRef.current.getState().pagination.pageIndex + 1,
+        currentPageSize: tableRef.current.getState().pagination.pageSize
+      } : { currentPage: 1, currentPageSize: initialPageSize },
+      onRowselect,
+      onRowdeselect,
+      listener,
+      navigation,
+      onSyncSelectedItems
+    });
+    const { activeRowIds, setActiveRow, handleRowActiveClick, isRowActive } = useTableState({
+      editMode: editmode,
+      radioselect,
+      multiselect: effectiveMultiselect
+    });
+    useEffect(() => {
+      if (useRadioSelect || useMultiSelect) {
+        setActiveRow(selectedRowIds);
+      }
+    }, [selectedRowIds, useRadioSelect, useMultiSelect, setActiveRow]);
+    const { dynamicColumns, isDynamicTable } = useDynamicColumns({
+      dataset: dataset || [],
+      children,
+      listener
+    });
+    const { wmTableColumns, tableStructure, headerActions, footerActions, rowExpansionConfig } = useMemo(() => {
+      const allTableActions = parseTableActions(children);
+      const headerActions2 = allTableActions.filter((action) => {
+        const position = action.position || "footer";
+        return position === "header" || position.includes("header");
+      });
+      const footerActions2 = allTableActions.filter((action) => {
+        const position = action.position || "footer";
+        return position === "footer" || position.includes("footer") || !action.position;
+      });
+      const structure = parseTableStructureWithGroups(children);
+      const flatColumns = flattenTableStructure(structure);
+      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;
+      return {
+        wmTableColumns: finalColumns,
+        tableStructure: structure,
+        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(
+      {}
+    );
+    const applyOverride = useCallback((field, key, value) => {
+      setColumnOverrides((prev) => __spreadProps(__spreadValues({}, prev), {
+        [field]: __spreadProps(__spreadValues({}, prev[field] || {}), { [key]: value })
+      }));
+    }, []);
+    const wmTableColumnsWithOverrides = useMemo(
+      () => wmTableColumns.map((col) => {
+        const f = col == null ? void 0 : col.field;
+        if (!f) return col;
+        const o = columnOverrides[f];
+        if (!o || Object.keys(o).length === 0) return col;
+        return __spreadValues(__spreadValues({}, col), o);
+      }),
+      [wmTableColumns, columnOverrides]
+    );
+    const {
+      editingRowId,
+      isRowEditing,
+      startEditing,
+      cancelEditing,
+      saveEditing,
+      renderEditableCell,
+      isAddingNewRow,
+      handleAddNewRowClick,
+      renderAddNewRow,
+      handleRowClick: handleTableEditRowClick,
+      handleKeyDown: handleTableEditKeyDown
+    } = useTableEdit({
+      editMode: editmode,
+      internalDataset,
+      setInternalDataset,
+      wmTableColumns: wmTableColumnsWithOverrides,
+      cellState,
+      renderFormWidget,
+      listener,
+      onRowUpdate,
+      onRowDelete,
+      onNewRowAdded: (newRecord) => {
+        handleNewRowNavigation(tableRef, newRecord, internalDataset);
+      },
+      showrowindex,
+      radioselect,
+      multiselect: effectiveMultiselect,
+      rowActions,
+      formposition,
+      insertmessage,
+      updatemessage,
+      errormessage,
+      showToast,
+      hasRowExpansion: rowExpansionConfig ? true : false,
+      expansionPosition: rowExpansionConfig ? parseInt(String(rowExpansionConfig.position || "0"), 10) : 0,
+      datasource,
+      binddataset,
+      onSuccess,
+      onError,
+      onRowinsert,
+      onRowupdate,
+      onRowdelete,
+      tableRef,
+      isServerSidePagination: isServerSidePagination(),
+      tableName: name
+    });
+    const { handleRowClick } = useRowHandlers({
+      editingRowId,
+      isAddingNewRow,
+      handleRowSelectionClick,
+      handleTableEditRowClick,
+      handleRowActiveClick,
+      onRowclick,
+      useRadioSelect,
+      useMultiSelect,
+      isrowselectable,
+      listener,
+      name
+    });
+    useEffect(() => {
+      const currentPage = paginationState.pageIndex;
+      if (prevPageIndexRef.current !== -1 && currentPage !== prevPageIndexRef.current && isAddingNewRow) {
+        cancelEditing();
+      }
+    }, [paginationState.pageIndex, isAddingNewRow, cancelEditing]);
+    const [sorting, setSorting] = useState(() => {
+      if (initialSortState) {
+        return [
+          {
+            id: initialSortState.field,
+            desc: initialSortState.direction === "desc"
+          }
+        ];
+      }
+      return [];
+    });
+    const [columnSizing, setColumnSizing] = useState({});
+    const [isResizing, setIsResizing] = useState(false);
+    const handleColumnSelect = useCallback(
+      (event, columnId, colDef, columnData) => {
+        if (onColumnselect) {
+          onColumnselect(event, { field: columnId, colDef, data: columnData });
+        }
+      },
+      [onColumnselect]
+    );
+    const handleColumnDeselect = useCallback(
+      (event, columnId, colDef, columnData) => {
+        if (onColumndeselect) {
+          onColumndeselect(event, { field: columnId, colDef, data: columnData });
+        }
+      },
+      [onColumndeselect]
+    );
+    const handleSortingChange = useCallback(
+      (updaterOrValue) => {
+        var _a2;
+        const newSorting = typeof updaterOrValue === "function" ? updaterOrValue(sorting) : updaterOrValue;
+        setSorting(updaterOrValue);
+        setPaginationState((prev) => __spreadProps(__spreadValues({}, prev), { pageIndex: 0 }));
+        if (onSort && newSorting.length > 0) {
+          const sortData = {
+            field: newSorting[0].id,
+            direction: newSorting[0].desc ? "desc" : "asc"
+          };
+          onSort(null, (_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name], sortData);
+        }
+      },
+      [sorting, name]
+    );
+    const {
+      expandedRows,
+      toggleRowExpansion,
+      isRowExpanded,
+      registerRowDefInstance,
+      rowDefInstances
+    } = useRowExpansion({
+      rowExpansionConfig,
+      internalDataset
+    });
+    const handleToggleRowExpansion = useCallback(
+      (rowId, rowData) => {
+        if (listener == null ? void 0 : listener.onChange) {
+          const selecteditem = cleanRowData(rowData);
+          if (!isEqual(prevSelectedRow.current, selecteditem)) {
+            prevSelectedRow.current = selecteditem;
+            listener.onChange(widgetRegistrationKey, { selecteditem });
+          }
+        }
+        setTimeout(() => toggleRowExpansion(rowId, rowData), 0);
+      },
+      [name]
+    );
+    const { columns: baseColumns } = useTableColumns({
+      wmTableColumns: wmTableColumnsWithOverrides,
+      columnsVersion,
+      rowActions,
+      listener,
+      deleteRecord: (rowData) => deleteRecord(rowData, tableRef.current),
+      showrowindex,
+      editmode,
+      isDynamicTable,
+      renderEditableCell,
+      isRowEditing,
+      startEditing,
+      cancelEditing,
+      saveEditing,
+      editingRowId,
+      cellState,
+      isResizing,
+      handleRowClick,
+      handleRadioSelection,
+      handleMultiSelection,
+      useRadioSelect,
+      useMultiSelect,
+      isRowSelected
+    });
+    const columns = useMemo(() => {
+      const selectionColumn = buildSelectionColumns({
+        useRadioSelect,
+        useMultiSelect,
+        handleRadioSelection,
+        handleMultiSelection,
+        handleSelectAll,
+        radioselecttitle,
+        radioselectarialabel,
+        multiselecttitle,
+        multiselectarialabel,
+        tableName: name
+      });
+      if (selectionColumn) {
+        return [selectionColumn, ...baseColumns];
+      }
+      return baseColumns;
+    }, [
+      baseColumns,
+      useRadioSelect,
+      useMultiSelect,
+      handleRadioSelection,
+      handleMultiSelection,
+      handleSelectAll,
+      radioselecttitle,
+      radioselectarialabel,
+      multiselecttitle,
+      multiselectarialabel,
+      name
+    ]);
+    const columnsStateRef = useRef(columns);
+    const parentFormColumns = ((_f = (_e = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _e[parentForm]) == null ? void 0 : _f.dataoutput) || {};
+    const [summaryRowDefs, setSummaryRowDefs] = useState([]);
+    const [summaryRowEnabled, setSummaryRowEnabled] = useState(false);
+    const [summaryRowDefObjects, setSummaryRowDefObjects] = useState([]);
+    const [summaryRowColumnShow, setSummaryRowColumnShow] = useState({});
+    const setSummaryRowDef = useCallback(
+      (columnKey, data, rowIndex, refresh2, show) => {
+        setSummaryRowDefs((prev) => {
+          const newDefs = [...prev];
+          newDefs[rowIndex] = __spreadProps(__spreadValues({}, newDefs[rowIndex]), { [columnKey]: data });
+          return newDefs;
+        });
+        setSummaryRowDefObjects((prev) => {
+          const newObjs = [...prev];
+          newObjs[rowIndex] = __spreadProps(__spreadValues({}, newObjs[rowIndex]), { [columnKey]: data });
+          return newObjs;
+        });
+        if (show !== void 0) {
+          setSummaryRowColumnShow((prev) => {
+            const newShow = __spreadValues({}, prev);
+            if (!newShow[rowIndex]) {
+              newShow[rowIndex] = {};
+            }
+            newShow[rowIndex] = __spreadProps(__spreadValues({}, newShow[rowIndex]), { [columnKey]: show });
+            return newShow;
+          });
+        }
+        setSummaryRowEnabled(true);
+      },
+      []
+    );
+    const columnsProxy = useMemo(
+      () => createColumnsProxy(wmTableColumns, applyOverride, setColumnsVersion, setSummaryRowDef),
+      [wmTableColumns, applyOverride, setColumnsVersion, setSummaryRowDef]
+    );
+    const {
+      customColumns,
+      customColumnsRevision,
+      customExpressionSignature,
+      mergeParsedCustomColumns
+    } = useCustomExpressionColumns({
+      columnSource: columnsProxy,
+      listenerRef
+    });
+    const [pendingDatarender, setPendingDatarender] = useState(false);
+    const queueOnDatarenderAfterPaint = useCallback(() => {
+      if (!onDatarender) return;
+      setPendingDatarender(true);
+    }, [onDatarender]);
+    const invokeOnDatarender = useCallback(() => {
+      var _a2;
+      if (!onDatarender) return;
+      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 });
+    }, [onDatarender, name]);
+    columnsStateRef.current = columns;
+    const columnsForTable = useMemo(() => {
+      const base = columnsStateRef.current || [];
+      return base.map((col) => {
+        const field = col.accessorKey || col.id;
+        const override = field ? columnOverrides[field] || {} : {};
+        return __spreadValues(__spreadValues(__spreadValues({}, col), override), Object.keys(override).length > 0 ? { meta: __spreadValues(__spreadValues({}, col.meta), override) } : {});
+      });
+    }, [columns, columnOverrides, columnsVersion]);
+    const ColClassSignature = useMemo(() => {
+      try {
+        return (columnsForTable || []).map((col) => {
+          const m = col == null ? void 0 : col.meta;
+          return [m == null ? void 0 : m.className, m == null ? void 0 : m.colClass].map((v) => String(v != null ? v : "")).join(":");
+        }).join("|");
+      } catch (e) {
+        return "";
+      }
+    }, [columnsForTable]);
+    const {
+      globalFilter,
+      setGlobalFilter: setGlobalFilterOriginal,
+      globalSearchColumn,
+      setGlobalSearchColumn,
+      columnFilters,
+      setColumnFilter: setColumnFilterOriginal,
+      filteredData,
+      getFilterFields,
+      transformFilterFields
+    } = useTableFilter({
+      filterMode: filtermode,
+      columns: columnsForTable,
+      dataset: (navigation === "Scroll" || navigation === "On-Demand") && accumulatedData.length > 0 ? accumulatedData : internalDataset,
+      initialSearchState
+    });
+    const setGlobalFilter = useCallback(
+      (value) => {
+        setGlobalFilterOriginal(value);
+        setPaginationState((prev) => __spreadProps(__spreadValues({}, prev), { pageIndex: 0 }));
+      },
+      [setGlobalFilterOriginal]
+    );
+    const setColumnFilter = useCallback(
+      (columnId, value, matchMode) => {
+        setColumnFilterOriginal(columnId, value, matchMode);
+        setPaginationState((prev) => __spreadProps(__spreadValues({}, prev), { pageIndex: 0 }));
+      },
+      [setColumnFilterOriginal]
+    );
+    const resizeTimeoutRef = useRef(null);
+    const handleColumnSizingChange = useCallback(
+      (updaterOrValue) => {
+        setIsResizing((prev) => {
+          if (!prev) return true;
+          return prev;
+        });
+        setColumnSizing(updaterOrValue);
+        if (resizeTimeoutRef.current) {
+          clearTimeout(resizeTimeoutRef.current);
+        }
+        resizeTimeoutRef.current = setTimeout(() => {
+          setIsResizing(false);
+        }, 150);
+      },
+      []
+    );
+    const rowSelection = useMemo(() => {
+      const selection = {};
+      selectedRowIds.forEach((id) => {
+        selection[id] = true;
+      });
+      return selection;
+    }, [selectedRowIds]);
+    const isServerSideSorting = isServerSidePagination();
+    const tableData = useMemo(() => {
+      if ((navigation === "Scroll" || navigation === "On-Demand") && accumulatedData.length > 0) {
+        return filtermode && !isServerSidePagination() ? filteredData : accumulatedData;
+      }
+      return filtermode && !isServerSidePagination() ? filteredData : internalDataset;
+    }, [
+      navigation,
+      accumulatedData,
+      filteredData,
+      internalDataset,
+      filtermode,
+      isServerSidePagination
+    ]);
+    const memoizedPagination = useMemo(
+      () => ({
+        pageSize: navigation === "None" ? (tableData == null ? void 0 : tableData.length) || 0 : paginationState.pageSize,
+        pageIndex: paginationState.pageIndex
+      }),
+      [navigation, tableData == null ? void 0 : tableData.length, paginationState.pageSize, paginationState.pageIndex]
+    );
+    const table = useReactTable({
+      data: tableData,
+      columns: columnsForTable,
+      state: {
+        sorting,
+        columnSizing,
+        rowSelection,
+        // Add row selection state
+        pagination: memoizedPagination
+      },
+      onSortingChange: handleSortingChange,
+      onColumnSizingChange: handleColumnSizingChange,
+      onPaginationChange: setPaginationState,
+      getCoreRowModel: getCoreRowModel(),
+      // Only use pagination model for client-side pagination
+      getPaginationRowModel: isServerSidePagination() ? void 0 : getPaginationRowModel(),
+      // Use sorted row model only for client-side sorting
+      getSortedRowModel: isServerSideSorting ? void 0 : getSortedRowModel(),
+      enableSorting: enablesort,
+      enableSortingRemoval: false,
+      autoResetPageIndex: false,
+      enableColumnResizing: true,
+      columnResizeMode: "onChange",
+      // Keep onChange for real-time visual feedback
+      enableRowSelection: true,
+      // Enable row selection
+      // Use manual pagination and sorting for server-side operations
+      manualPagination: isServerSidePagination(),
+      manualSorting: isServerSideSorting,
+      pageCount: isServerSidePagination() && ((_g = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _g.totalPages) ? datasource.pagination.totalPages : void 0,
+      getRowId: (row) => row._wmTableRowId || String(row.id) || uniqueId("row_")
+    });
+    tableRef.current = table;
+    const memoizedFilterFields = useMemo(() => {
+      if (!filtermode) return {};
+      const searchObj = filtermode === "search" ? [
+        {
+          field: globalSearchColumn,
+          value: globalFilter,
+          matchMode: "anywhereignorecase",
+          type: "string"
+        }
+      ] : transformFilterFields(columnFilters);
+      return getFilterFields(searchObj);
+    }, [
+      filtermode,
+      globalSearchColumn,
+      globalFilter,
+      columnFilters,
+      getFilterFields,
+      transformFilterFields
+    ]);
+    const memoizedLogicalOp = useMemo(() => {
+      return filtermode === "search" && !globalSearchColumn ? "OR" : "AND";
+    }, [filtermode, globalSearchColumn]);
+    useServerSideSorting({
+      datasource,
+      sorting,
+      setInternalDataset,
+      showToast,
+      isServerSidePagination: isServerSidePagination(),
+      pageIndex: table.getState().pagination.pageIndex,
+      onError,
+      onBeforefilter,
+      filterFields: memoizedFilterFields,
+      logicalOp: memoizedLogicalOp,
+      listener,
+      name
+    });
+    const { showPanelHeading, showPagination } = usePanelStructure({
+      title,
+      subheading,
+      iconclass,
+      exportformat,
+      headerActions,
+      footerActions,
+      shownavigation,
+      onDemandLoad,
+      internalDataset,
+      pagesize,
+      allowpagesizechange,
+      datasource,
+      showrecordcount
+    });
+    const handlePaginationWidgetReady = useCallback(
+      (paginationWidget) => {
+        var _a2;
+        if (name && ((_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name])) {
+          listener.Widgets[name].dataNavigator = paginationWidget;
+        }
+      },
+      [name]
+    );
+    const sortInfoForExport = useMemo(() => {
+      if (sorting.length > 0) {
+        return {
+          field: sorting[0].id,
+          direction: sorting[0].desc ? "desc" : "asc"
+        };
+      }
+      return void 0;
+    }, [sorting]);
+    const isGridEditModeComplete = isAddingNewRow || editingRowId !== null;
+    const spacingClasses = getSpacingClasses(spacing);
+    const filterDataForState = useMemo(() => {
+      if (!filtermode) return void 0;
+      if (filtermode === "search") {
+        if (globalFilter || globalSearchColumn) {
+          const columnType = globalSearchColumn ? (() => {
+            var _a2, _b2;
+            const col = find(columnsForTable, (c) => {
+              const column = c;
+              return column.accessorKey === globalSearchColumn || column.id === globalSearchColumn;
+            });
+            return ((_a2 = col == null ? void 0 : col.meta) == null ? void 0 : _a2.type) || ((_b2 = col == null ? void 0 : col.meta) == null ? void 0 : _b2.editinputtype) || "string";
+          })() : "string";
+          return [
+            {
+              field: globalSearchColumn || "",
+              value: globalFilter,
+              matchMode: "anywhereignorecase",
+              type: columnType
+            }
+          ];
+        }
+      } else if (filtermode === "multicolumn") {
+        const activeFilters = Object.entries(columnFilters).filter(([_, filter]) => filter.value).map(([field, filter]) => {
+          const columnType = (() => {
+            var _a2, _b2;
+            const col = find(columnsForTable, (c) => {
+              const column = c;
+              return column.accessorKey === field || column.id === field;
+            });
+            return ((_a2 = col == null ? void 0 : col.meta) == null ? void 0 : _a2.type) || ((_b2 = col == null ? void 0 : col.meta) == null ? void 0 : _b2.editinputtype) || "string";
+          })();
+          return {
+            field,
+            value: filter.value,
+            matchMode: filter.matchMode,
+            type: columnType
+          };
+        });
+        return activeFilters.length > 0 ? activeFilters : void 0;
+      }
+      return void 0;
+    }, [filtermode, globalFilter, globalSearchColumn, columnFilters, columnsForTable]);
+    const sortDataForState = useMemo(() => {
+      if (sorting.length > 0) {
+        const firstSort = sorting[0];
+        return {
+          field: firstSort.id,
+          direction: firstSort.desc ? "desc" : "asc"
+        };
+      }
+      return void 0;
+    }, [sorting]);
+    const stateManager = useTableStateManager({
+      name,
+      storage: effectiveStateHandler,
+      currentPage: table.getState().pagination.pageIndex + 1,
+      currentPageSize: table.getState().pagination.pageSize,
+      selectedRowIds,
+      internalDataset,
+      initialActualPageSize,
+      datasource,
+      multiselect: effectiveMultiselect,
+      filterData: filterDataForState,
+      sortData: sortDataForState,
+      navigation,
+      isStateConfigured: effectiveStateHandler !== void 0 && effectiveStateHandler !== "none",
+      defaultPageSize: initialPageSize,
+      initialSortState,
+      initialFilterState: initialSearchState
+    });
+    const handlePageSizeChange = useCallback(
+      (newPageSize) => {
+        const oldPageSize = paginationState.pageSize;
+        handlePageSizeChangeBase(newPageSize);
+        if (navigation !== "Scroll") {
+          const currentPersistedState = getTableState(name, effectiveStateHandler);
+          const newState = stateManager.getStateForPageSizeChange(
+            newPageSize,
+            currentPersistedState == null ? void 0 : currentPersistedState.selectedItem,
+            oldPageSize
+            // Pass the old page size
+          );
+          clearTableState(name, effectiveStateHandler);
+          if (Object.keys(newState).length > 0) {
+            if (newPageSize === initialPageSize) {
+              delete newState.pagesize;
+            }
+            if (Object.keys(newState).length > 0) {
+              saveTableState(name, effectiveStateHandler, newState);
+            }
+          }
+        }
+      },
+      [
+        handlePageSizeChangeBase,
+        name,
+        effectiveStateHandler,
+        stateManager,
+        initialPageSize,
+        navigation
+      ]
+    );
+    const selectPageSize = useCallback(
+      (pagesize2) => {
+        if (!allowpagesizechange && !pagesize2) return;
+        const pageSizeOptions = (pagesizeoptions || "5,10,20,50,100").split(",").map((v) => Number(v.trim())).filter((n) => !Number.isNaN(n)).sort((a, b) => a - b);
+        if (pageSizeOptions.length === 0) return;
+        const nv = Number(pagesize2);
+        const clamped = nv < pageSizeOptions[0] || nv > pageSizeOptions[pageSizeOptions.length - 1] || !pageSizeOptions.includes(nv) ? pageSizeOptions[0] : nv;
+        handlePageSizeChange(clamped);
+        if (effectiveStorageKey !== name) {
+          broadcastScriptPageSize(name, effectiveStorageKey, clamped);
+        }
+      },
+      [allowpagesizechange, pagesizeoptions, handlePageSizeChange, effectiveStorageKey, name]
+    );
+    useEffect(() => {
+      if (effectiveStorageKey === name) return;
+      return subscribeToScriptPageSizeBroadcast(name, effectiveStorageKey, (value) => {
+        handlePageSizeChange(value);
+      });
+    }, [name, effectiveStorageKey, handlePageSizeChange]);
+    useEffect(() => {
+      var _a2;
+      const shouldCallCallbacks = isDynamicTable ? internalDataset.length > 0 : internalDataset.length > 0 && wmTableColumns.length > 0;
+      if (shouldCallCallbacks) {
+        const currentPageIndex = table.getState().pagination.pageIndex;
+        prevPageIndexRef.current = currentPageIndex;
+        if (!isEqual(prevDatasetRef.current, internalDataset)) {
+          prevDatasetRef.current = internalDataset;
+          const data = internalDataset.map((row) => {
+            if (row && typeof row === "object") {
+              const _a3 = row, { _wmTableRowId, getProperty } = _a3, rest2 = __objRest(_a3, ["_wmTableRowId", "getProperty"]);
+              return rest2;
+            }
+            return row;
+          });
+          if (onBeforedatarender) {
+            onBeforedatarender(
+              (_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[name],
+              // widget reference
+              data,
+              // data
+              columnsProxy
+              // columns (including dynamic ones)
+            );
+            const customExprKeys = Object.keys(columnsProxy).filter(
+              (key) => columnsProxy[key].customExpression
+            );
+            if (customExprKeys.length > 0) {
+              void mergeParsedCustomColumns().finally(queueOnDatarenderAfterPaint);
+            } else {
+              queueOnDatarenderAfterPaint();
+            }
+            const nextRows = internalDataset.map(
+              (r) => typeof r === "object" && r !== null ? __spreadValues({}, r) : r
+            );
+            setInternalDataset(nextRows);
+          } else if (onDatarender) {
+            queueOnDatarenderAfterPaint();
+          }
+        }
+      }
+    }, [
+      internalDataset,
+      wmTableColumns,
+      onBeforedatarender,
+      onDatarender,
+      name,
+      isDynamicTable,
+      table.getState().pagination.pageIndex,
+      setInternalDataset,
+      columnsProxy,
+      mergeParsedCustomColumns,
+      queueOnDatarenderAfterPaint
+    ]);
+    useLayoutEffect(() => {
+      if (!onDatarender || !pendingDatarender) return;
+      setPendingDatarender(false);
+      invokeOnDatarender();
+    }, [pendingDatarender, invokeOnDatarender, onDatarender]);
+    useEffect(() => {
+      if (!onBeforedatarender) return;
+      if (internalDataset.length === 0) return;
+      void mergeParsedCustomColumns();
+    }, [
+      customExpressionSignature,
+      mergeParsedCustomColumns,
+      onBeforedatarender,
+      internalDataset.length
+    ]);
+    useTableInitialization({
+      internalDataset,
+      wmTableColumns: wmTableColumnsWithOverrides,
+      cellState,
+      gridfirstrowselect,
+      useRadioSelect,
+      useMultiSelect,
+      setActiveRow,
+      selectedRowIds,
+      formName,
+      editmode,
+      activeRowIds,
+      listener
+    });
+    const { restoredPageNumber, restoredSelectedIndices, setIsRestoringSelection } = useTableEffects({
+      name,
+      navigation,
+      datasource,
+      internalDataset,
+      statehandler: effectiveStateHandler,
+      selectedRowIds,
+      currentPage: table.getState().pagination.pageIndex + 1,
+      // Convert to 1-based
+      currentPageSize: table.getState().pagination.pageSize,
+      sorting,
+      isGridEditMode: isGridEditModeComplete,
+      stateManager,
+      initialActualPageSize
+    });
+    useEffect(() => {
+      if (restoredPageNumber !== null && restoredPageNumber > 1) {
+        table.setPageIndex(restoredPageNumber - 1);
+      }
+    }, [restoredPageNumber, table]);
+    const hasRestoredSelectionRef = useRef(false);
+    useEffect(() => {
+      if (restoredSelectedIndices.length > 0 && internalDataset.length > 0 && !hasRestoredSelectionRef.current) {
+        hasRestoredSelectionRef.current = true;
+        setIsRestoringSelection(true);
+        if (useMultiSelect) {
+          const selectedRowIds2 = [];
+          restoredSelectedIndices.forEach((index) => {
+            if (index >= 0 && index < internalDataset.length) {
+              const row = internalDataset[index];
+              if (row && row._wmTableRowId) {
+                handleMultiSelection(row._wmTableRowId, row, true);
+                selectedRowIds2.push(row._wmTableRowId);
+              }
+            }
+          });
+          if (selectedRowIds2.length > 0) {
+            setActiveRow(selectedRowIds2);
+          }
+        } else {
+          const firstIndex = restoredSelectedIndices[0];
+          if (firstIndex >= 0 && firstIndex < internalDataset.length) {
+            const row = internalDataset[firstIndex];
+            if (row && row._wmTableRowId) {
+              handleRadioSelection(row._wmTableRowId, row);
+              setActiveRow(row._wmTableRowId);
+            }
+          }
+        }
+        setTimeout(() => {
+          setIsRestoringSelection(false);
+        }, 0);
+      }
+    }, [
+      restoredSelectedIndices,
+      internalDataset,
+      useMultiSelect,
+      handleMultiSelection,
+      handleRadioSelection,
+      setIsRestoringSelection
+    ]);
+    useEffect(() => {
+      const currentTimeout = resizeTimeoutRef.current;
+      return () => {
+        if (currentTimeout) {
+          clearTimeout(currentTimeout);
+        }
+      };
+    }, []);
+    const editRow = useCallback(
+      (event, widget, row) => {
+        if (!row || !row._wmTableRowId) {
+          console.warn("Invalid row data provided to editRow");
+          return;
+        }
+        startEditing(row, row._wmTableRowId);
+      },
+      [startEditing]
+    );
+    const deleteRow = useCallback(
+      async (event, widget, row) => {
+        var _a2;
+        if (!row) {
+          console.warn("Invalid row data provided to deleteRow");
+          return;
+        }
+        if (onBeforerowdelete) {
+          const cleanedRow = cleanRowData([row])[0];
+          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, {
+            rowIndex,
+            data: cleanedRow
+          });
+          if (result === false) {
+            return;
+          }
+        }
+        deleteRecord(row, tableRef.current);
+      },
+      [deleteRecord, onBeforerowdelete, name, internalDataset]
+    );
+    const refresh = useCallback(
+      async (newData = false) => {
+        var _a2, _b2;
+        if (!datasource) {
+          console.warn("No datasource available for refresh");
+          return;
+        }
+        try {
+          const currentTable = tableRef.current;
+          if (!currentTable) {
+            console.warn("Table instance not available");
+            return;
+          }
+          let targetPage = currentTable.getState().pagination.pageIndex + 1;
+          const currentPageSize = ((_a2 = datasource.pagination) == null ? void 0 : _a2.size) || currentTable.getState().pagination.pageSize;
+          let shouldNavigateToLastPage = false;
+          if (newData && datasource.pagination) {
+            const { totalElements } = datasource.pagination;
+            if (totalElements !== void 0 && currentPageSize > 0) {
+              const totalAfterAdd = totalElements + 1;
+              const lastPage = Math.ceil(totalAfterAdd / currentPageSize);
+              targetPage = lastPage;
+              shouldNavigateToLastPage = true;
+            }
+          }
+          if (isServerSidePagination()) {
+            const response = await refreshDataSource(datasource, {
+              page: targetPage,
+              pagesize: currentPageSize,
+              filterFields: memoizedFilterFields || {},
+              condition: memoizedLogicalOp
+            });
+            if (response && response.data) {
+              const dataWithIds = addUniqueRowIds(response.data);
+              setInternalDataset(dataWithIds);
+              if (shouldNavigateToLastPage) {
+                requestAnimationFrame(() => {
+                  currentTable.setPageIndex(targetPage);
+                });
+              }
+            }
+          } else {
+            if (shouldNavigateToLastPage) {
+              currentTable.setPageIndex(targetPage);
+            }
+          }
+        } catch (error) {
+          console.error("Error refreshing table data:", error);
+          if (showToast) {
+            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");
+          }
+        }
+      },
+      [datasource, isServerSidePagination(), setInternalDataset, showToast, onError, name]
+    );
+    const tableApis = {
+      columns: columnsProxy,
+      addNewRow: handleAddNewRowClick,
+      editRow,
+      deleteRow,
+      refresh,
+      datasource,
+      dataset,
+      selectPageSize,
+      rowDefInstances
+    };
+    syncSelectedItemsImplRef.current = (newSelectedIds) => {
+      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))
+      );
+      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 }));
+        }
+      }
+    };
+    useEffect(() => {
+      var _a2, _b2, _c2;
+      if (parentForm && name && ((_a2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _a2[parentForm])) {
+        const columns2 = (_c2 = (_b2 = listener == null ? void 0 : listener.Widgets) == null ? void 0 : _b2[name]) == null ? void 0 : _c2.columns;
+        const defaultValues = Object.entries(columns2 || {}).reduce(
+          (acc, [key, value]) => {
+            if ((value == null ? void 0 : value.defaultValue) !== void 0) {
+              acc[key] = value;
+            }
+            return acc;
+          },
+          {}
+        );
+        const valuesToPass = Object.keys(defaultValues).length === 0 ? [] : defaultValues;
+        if (parentFormColumns) {
+          listener == null ? void 0 : listener.onChange(parentForm, {
+            dataoutput: __spreadProps(__spreadValues({}, parentFormColumns), {
+              [name]: valuesToPass
+            })
+          });
+        }
+      }
+    }, [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]);
+    const isTableLoading = useMemo(() => {
+      return loading && navigation !== "On-Demand" && internalDataset.length === 0;
+    }, [loading, navigation, internalDataset.length]);
+    const colGroupSpec = useMemo(() => {
+      const headerGroups = table.getHeaderGroups();
+      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: 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,
+      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(),
+        "data-widget-id": props["data-widget-id"]
+      }, { name }), { editmode }), { navigation }), { title }), {
+        currentpage: table.getState().pagination.pageIndex + 1
+      }), {
+        children: [
+          renderConfirmDialog(),
+          showPanelHeading && /* @__PURE__ */ jsx(
+            TablePanelHeading,
+            {
+              title,
+              subheading,
+              iconclass,
+              iconurl,
+              prefabName: props.prefabName,
+              exportformat,
+              headerActions,
+              spacing,
+              isGridEditMode: isGridEditModeComplete,
+              isLoading: datasource == null ? void 0 : datasource.loading,
+              listener,
+              datasource,
+              columns: wmTableColumnsWithOverrides,
+              sortInfo: sortInfoForExport,
+              filterInfo: filterDataForState,
+              exportdatasize,
+              onBeforeExport: onBeforeexport
+            }
+          ),
+          /* @__PURE__ */ jsxs(Box, { className: "app-datagrid", onKeyDown: (e) => handleTableEditKeyDown(e), children: [
+            filtermode === "search" && /* @__PURE__ */ jsx(
+              GlobalSearchFilter,
+              {
+                filteronkeypress,
+                value: globalFilter,
+                onChange: setGlobalFilter,
+                selectedColumn: globalSearchColumn,
+                onColumnChange: setGlobalSearchColumn,
+                columns: columnsForTable,
+                searchLabel: searchlabel,
+                name,
+                listener
+              }
+            ),
+            /* @__PURE__ */ jsx(Box, { className: "table-container table-responsive", children: /* @__PURE__ */ jsx(Box, { className: "app-grid-header", children: /* @__PURE__ */ jsxs(
+              Box,
+              {
+                className: "app-grid-header-inner",
+                style: __spreadValues({ height: "100%", overflow: "auto", position: "relative" }, styles),
+                children: [
+                  isTableLoading && /* @__PURE__ */ jsx(LoadingComponent, { message: loadingdatamsg }),
+                  /* @__PURE__ */ jsxs(
+                    Table,
+                    __spreadProps(__spreadValues({
+                      className: `${TABLE_CSS_CLASSES.gridDefault} table-striped table-hover ${spacingClasses}`.trim(),
+                      sx: __spreadValues({
+                        width: props.width || "100%"
+                      }, tableStructure && hasTableGroups(tableStructure) ? {
+                        tableLayout: "fixed",
+                        minWidth: table.getTotalSize()
+                      } : {})
+                    }, { name }), {
+                      children: [
+                        showheader && wmTableColumns.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                          /* @__PURE__ */ jsx(
+                            TableHeaderComponent,
+                            {
+                              table,
+                              enablesort,
+                              enablecolumnselection,
+                              rowClass,
+                              ColClassSignature,
+                              sorting,
+                              columnSizing,
+                              rowSelection,
+                              rowExpansionConfig,
+                              columnsVersion,
+                              filterMode: filtermode,
+                              columnFilters,
+                              onColumnFilterChange: setColumnFilter,
+                              renderFormWidget,
+                              listener,
+                              tableStructure,
+                              onColumnSelect: handleColumnSelect,
+                              onColumnDeselect: handleColumnDeselect,
+                              onHeaderclick,
+                              tableName: name
+                            }
+                          ),
+                          /* @__PURE__ */ jsx("colgroup", { children: colGroupSpec.map((c) => /* @__PURE__ */ jsx("col", { style: c.style, width: c.width }, c.key)) })
+                        ] }),
+                        (internalDataset.length > 0 || !isTableLoading) && /* @__PURE__ */ jsx(
+                          TableBodyComponent,
+                          {
+                            table,
+                            columns,
+                            rowClass,
+                            formposition,
+                            renderAddNewRow,
+                            onRowClick: handleRowClick,
+                            isRowActive,
+                            isRowSelected,
+                            nodatamessage,
+                            loadingdatamsg,
+                            isLoading: datasource == null ? void 0 : datasource.loading,
+                            rowExpansionConfig,
+                            expandedRows,
+                            toggleRowExpansion: handleToggleRowExpansion,
+                            isRowExpanded,
+                            rowsVersion: tableData.length,
+                            ColClassSignature,
+                            tableData,
+                            editingRowId,
+                            activeRowIds,
+                            selectedRowIds,
+                            isAddingNewRow,
+                            customExpressionColumns: customColumns,
+                            customColumnsRevision,
+                            columnsVersion,
+                            registerRowDefInstance
+                          }
+                        ),
+                        summaryRowEnabled && summaryRowDefs.length > 0 && /* @__PURE__ */ jsx(
+                          SummaryRowFooter,
+                          {
+                            summaryRowDefs,
+                            summaryRowDefObjects,
+                            columns: wmTableColumnsWithOverrides,
+                            tableName: name,
+                            summaryRowColumnShow
+                          }
+                        )
+                      ]
+                    }),
+                    `table-${isDynamicTable ? "dynamic" : "static"}-${wmTableColumns.length}-page-${table.getState().pagination.pageIndex}`
+                  )
+                ]
+              }
+            ) }) })
+          ] }),
+          /* @__PURE__ */ jsxs(Box, { className: "panel-footer clearfix", children: [
+            showPagination && /* @__PURE__ */ jsx(Box, { className: "app-datagrid-paginator", children: /* @__PURE__ */ jsx(
+              WmPagination,
+              {
+                name,
+                dataset: filtermode ? filteredData : internalDataset,
+                maxResults: (_h = table.getState().pagination.pageSize) != null ? _h : initialPageSize,
+                currentPage: table.getState().pagination.pageIndex + 1,
+                navigation,
+                navigationalign,
+                showrecordcount,
+                maxsize,
+                boundarylinks,
+                directionlinks: true,
+                allowpagesizechange,
+                pagesizeoptions,
+                listener,
+                onPaginationChange: handlePaginationChange,
+                onSetRecord: onSetrecord,
+                onPageSizeChange: handlePageSizeChange,
+                onDataUpdate: handleAccumulatedDataUpdate,
+                onPaginationWidgetReady: handlePaginationWidgetReady,
+                paginationMeta: datasource == null ? void 0 : datasource.pagination,
+                totalItems: (_i = datasource == null ? void 0 : datasource.pagination) == null ? void 0 : _i.totalElements,
+                datasource,
+                isServerSidePagination: isServerSidePagination(),
+                datasourceInvokeOptions: isServerSidePagination() ? {
+                  orderBy: sorting.length > 0 ? sorting.map((s) => `${s.id} ${s.desc ? "desc" : "asc"}`).join(", ") : void 0,
+                  filterFields: memoizedFilterFields,
+                  condition: memoizedLogicalOp
+                } : void 0,
+                ondemandmessage,
+                viewlessmessage,
+                showviewlessbutton
+              }
+            ) }),
+            /* @__PURE__ */ jsx(
+              TableFooterActions,
+              {
+                footerActions,
+                spacing,
+                isGridEditMode: isGridEditModeComplete,
+                isLoading: datasource == null ? void 0 : datasource.loading,
+                listener
+              }
+            )
+          ] })
+        ]
+      })
+    );
+  },
+  (prev, current) => {
+    const keys = [
+      "dataset",
+      "editmode",
+      "navigation",
+      "pagesize",
+      "showrowindex",
+      "showheader",
+      "enablesort",
+      "radioselect",
+      "radioselecttitle",
+      "radioselectarialabel",
+      "multiselect",
+      "multiselecttitle",
+      "multiselectarialabel",
+      "gridfirstrowselect",
+      "rowClass",
+      "deleteoktext",
+      "deletecanceltext",
+      "confirmdelete",
+      "errormessage",
+      "nodatamessage",
+      "loadingdatamsg",
+      "insertmessage",
+      "updatemessage",
+      "deletemessage",
+      "spacing",
+      "title",
+      "subheading",
+      "iconclass",
+      "allowpagesizechange",
+      "pagesizeoptions",
+      "showrecordcount",
+      "shownavigation",
+      "datasource",
+      "binddataset",
+      "onSuccess",
+      "onError",
+      "onRowinsert",
+      "onRowupdate",
+      "onRowdelete",
+      "onSort",
+      "onBeforerowdelete",
+      "onHeaderclick",
+      "onRowselect",
+      "onRowdeselect",
+      "statehandler",
+      "filtermode",
+      "children",
+      "listener",
+      "hidden"
+    ];
+    const simplePropsEqual = keys.every((key) => prev[key] === current[key]);
+    if (!simplePropsEqual) return false;
+    const prevChildrenCount = React.Children.count(prev.children);
+    const currentChildrenCount = React.Children.count(current.children);
+    if (prevChildrenCount !== currentChildrenCount) return false;
+    return true;
+  }
+);
+WmTableComponent.displayName = "WmTableComponent";
+const WmTableWithProvider = (props) => {
+  if (useShouldShowSkeleton(props.loading, props.showSkeleton))
+    return /* @__PURE__ */ jsx(
+      WmSkeleton,
+      __spreadProps(__spreadValues({}, SKELETON_REGISTRY["WmTable"]), {
+        rows: props.skeletonRows,
+        columns: props.skeletonColumns,
+        className: props.className,
+        styles: props.styles
+      })
+    );
+  return /* @__PURE__ */ jsx(EditedRowsProvider, { children: /* @__PURE__ */ jsx(WmTableComponent, __spreadValues({}, props)) });
+};
+WmTableWithProvider.displayName = "WmTable";
+const WmTableStandalone = withStandalone(WmTableWithProvider);
+const WmTable = withBaseWrapper(WmTableWithProvider);
+WmTable.displayName = "WmTable";
+var table_default = WmTable;
+export {
+  WmTableStandalone as WmTable,
+  WmTableComponent,
+  table_default as default
+};