@wavemaker-ai/react-runtime 1.0.0-rc.309

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

@@ -0,0 +1,157 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTableEffects = void 0;
+var _react = require("react");
+var _tableHelpers = require("../utils/table-helpers");
+var _constants = require("../utils/constants");
+var useTableEffects = exports.useTableEffects = function useTableEffects(props) {
+  var name = props.name,
+    navigation = props.navigation,
+    datasource = props.datasource,
+    internalDataset = props.internalDataset,
+    statehandler = props.statehandler,
+    selectedRowIds = props.selectedRowIds,
+    currentPage = props.currentPage,
+    currentPageSize = props.currentPageSize,
+    isGridEditMode = props.isGridEditMode,
+    stateManager = props.stateManager;
+
+  // State to track if we've restored state
+  var _useState = (0, _react.useState)(false),
+    hasRestoredState = _useState[0],
+    setHasRestoredState = _useState[1];
+  var _useState2 = (0, _react.useState)(null),
+    restoredPageNumber = _useState2[0],
+    setRestoredPageNumber = _useState2[1];
+  var _useState3 = (0, _react.useState)([]),
+    restoredSelectedRowIds = _useState3[0],
+    setRestoredSelectedRowIds = _useState3[1];
+  var _useState4 = (0, _react.useState)([]),
+    restoredSelectedIndices = _useState4[0],
+    setRestoredSelectedIndices = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    isRestoringSelection = _useState5[0],
+    setIsRestoringSelection = _useState5[1];
+
+  // Effect 1: Load persisted state when component mounts
+  (0, _react.useEffect)(function () {
+    // Skip state restoration for navigation types that don't support it
+    if (_constants.UNSUPPORTED_STATE_PERSISTENCE_TYPES.includes(navigation)) {
+      setHasRestoredState(true);
+      return;
+    }
+    if (!hasRestoredState && statehandler && internalDataset.length > 0) {
+      var savedState = (0, _tableHelpers.getTableState)(name, statehandler);
+      if (savedState) {
+        // Check if there's an active filter
+        var hasActiveFilter = savedState.search && savedState.search.length > 0;
+
+        // Extract page number (only if no active filter)
+        if (savedState.pagination && !hasActiveFilter) {
+          setRestoredPageNumber(savedState.pagination);
+        }
+
+        // Extract selected indices for the current page (only if no active filter)
+        if (savedState.selectedItem && savedState.selectedItem.length > 0 && !hasActiveFilter) {
+          // Default to page 1 if pagination is not saved (page 1 is the default, so it's not persisted)
+          var restoredPage = savedState.pagination || 1;
+          // Only restore selections for the current page
+          var currentPageSelections = savedState.selectedItem.filter(function (item) {
+            return item.page === restoredPage;
+          }).map(function (item) {
+            return item.index;
+          });
+          setRestoredSelectedIndices(currentPageSelections);
+        }
+        // If there's an active filter, don't restore selections as the data is completely different
+      }
+      setHasRestoredState(true);
+    }
+  }, [name, statehandler, hasRestoredState, internalDataset.length, navigation]);
+
+  // Effect 2: Persist state on changes
+  (0, _react.useEffect)(function () {
+    // Skip persistence for navigation types that don't support it
+    if (_constants.UNSUPPORTED_STATE_PERSISTENCE_TYPES.includes(navigation)) {
+      return;
+    }
+
+    // Skip persistence if we haven't loaded initial data yet
+    if (internalDataset.length === 0 || !statehandler) {
+      return;
+    }
+
+    // Skip persistence during edit mode or when restoring selection
+    if (isGridEditMode || isRestoringSelection) {
+      return;
+    }
+
+    // Skip persistence while datasource is loading
+    // This prevents saving stale state (e.g., old pagination value) during page transitions
+    if (datasource !== null && datasource !== void 0 && datasource.loading) {
+      return;
+    }
+
+    // Check if we're in default state
+    if (!stateManager.isDefaultState()) {
+      // Get existing persisted state
+      var existingState = (0, _tableHelpers.getTableState)(name, statehandler);
+
+      // Merge current state with existing state
+      var stateToSave = stateManager.mergeWithExisting(stateManager.currentState, existingState);
+
+      // Clean up the state to save - remove default values
+      var cleanedState = {};
+
+      // Only include non-default values
+      if (stateToSave.pagination && stateToSave.pagination !== 1) {
+        cleanedState.pagination = stateToSave.pagination;
+      }
+      if (stateToSave.pagesize) {
+        cleanedState.pagesize = stateToSave.pagesize;
+      }
+      if (stateToSave.selectedItem && stateToSave.selectedItem.length > 0) {
+        cleanedState.selectedItem = stateToSave.selectedItem;
+      }
+      if (stateToSave.search && stateToSave.search.length > 0) {
+        cleanedState.search = stateToSave.search;
+      }
+      if (stateToSave.sort) {
+        cleanedState.sort = stateToSave.sort;
+      }
+
+      // Include actualpagesize if present
+      if (stateToSave.actualpagesize !== undefined) {
+        cleanedState.actualpagesize = stateToSave.actualpagesize;
+      }
+
+      // Only save if there's something to save
+      if (Object.keys(cleanedState).length > 0) {
+        // Always clear first to ensure clean replacement (not merge)
+        // This is required because setWidgetState uses lodash merge() which would
+        // preserve old properties like pagination even when they should be removed
+        (0, _tableHelpers.clearTableState)(name, statehandler);
+
+        // Save the cleaned state
+        (0, _tableHelpers.saveTableState)(name, statehandler, cleanedState);
+      } else {
+        // If nothing to save, clear the state
+        (0, _tableHelpers.clearTableState)(name, statehandler);
+      }
+    } else {
+      // We're in default state - clear any existing persisted state
+      // This ensures old values (like pagination: 2) are removed when returning to defaults
+      (0, _tableHelpers.clearTableState)(name, statehandler);
+    }
+  }, [selectedRowIds, currentPage, currentPageSize, internalDataset, name, statehandler, isGridEditMode, isRestoringSelection, stateManager, navigation, datasource === null || datasource === void 0 ? void 0 : datasource.loading]);
+  return {
+    restoredPageNumber: restoredPageNumber,
+    restoredSelectedRowIds: restoredSelectedRowIds,
+    restoredSelectedIndices: restoredSelectedIndices,
+    hasRestoredState: hasRestoredState,
+    setIsRestoringSelection: setIsRestoringSelection
+  };
+};

package/components/data/table/hooks/useTableFilter.d.ts

@@ -0,0 +1,26 @@
+import { TableFilterMode } from "../props";
+import { TableSearchFilter, FilterFieldsObject } from "../utils/table-helpers";
+interface UseTableFilterProps {
+    filterMode?: TableFilterMode;
+    columns: Array<Record<string, unknown>>;
+    dataset: Array<Record<string, unknown>>;
+    initialSearchState?: TableSearchFilter[];
+}
+interface ColumnFilter {
+    value: string | number | boolean | null;
+    matchMode: string;
+}
+interface UseTableFilterReturn {
+    globalFilter: string;
+    setGlobalFilter: (value: string) => void;
+    globalSearchColumn: string;
+    setGlobalSearchColumn: (columnId: string) => void;
+    columnFilters: Record<string, ColumnFilter>;
+    setColumnFilter: (columnId: string, value: string | number | boolean | null, matchMode?: string) => void;
+    filteredData: Array<Record<string, unknown>>;
+    clearAllFilters: () => void;
+    getFilterFields: (searchObj?: TableSearchFilter | TableSearchFilter[]) => FilterFieldsObject;
+    transformFilterFields: (filterFields: Record<string, unknown>) => TableSearchFilter[];
+}
+export declare const useTableFilter: ({ filterMode, columns, dataset, initialSearchState, }: UseTableFilterProps) => UseTableFilterReturn;
+export {};

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

@@ -0,0 +1,389 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTableFilter = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("react");
+var _lodashEs = require("lodash-es");
+var _types = require("@wavemaker-ai/react-runtime/components/data/types");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+// Constants
+var NUMERIC_DATA_TYPES = [_types.DataType.INTEGER, _types.DataType.BIG_INTEGER, _types.DataType.SHORT, _types.DataType.FLOAT, _types.DataType.BIG_DECIMAL, _types.DataType.DOUBLE, _types.DataType.LONG, _types.DataType.BYTE, "number"];
+var DATE_DATA_TYPES = [_types.DataType.DATE, _types.DataType.TIME, _types.DataType.TIMESTAMP, _types.DataType.DATETIME];
+var MATCH_MODES = {
+  START: "start",
+  START_IGNORE_CASE: "startignorecase",
+  END: "end",
+  END_IGNORE_CASE: "endignorecase",
+  EXACT: "exact",
+  EXACT_IGNORE_CASE: "exactignorecase",
+  NOT_EQUALS: "notequals",
+  NOT_EQUALS_IGNORE_CASE: "notequalsignorecase",
+  NULL: "null",
+  IS_NOT_NULL: "isnotnull",
+  EMPTY: "empty",
+  IS_NOT_EMPTY: "isnotempty",
+  NULL_OR_EMPTY: "nullorempty",
+  LESS_THAN: "lessthan",
+  LESS_THAN_EQUAL: "lessthanequal",
+  GREATER_THAN: "greaterthan",
+  GREATER_THAN_EQUAL: "greaterthanequal",
+  ANYWHERE: "anywhere",
+  ANYWHERE_IGNORE_CASE: "anywhereignorecase"
+};
+var EMPTY_MATCH_MODES = [MATCH_MODES.NULL, MATCH_MODES.EMPTY, MATCH_MODES.NULL_OR_EMPTY, MATCH_MODES.IS_NOT_NULL, MATCH_MODES.IS_NOT_EMPTY];
+
+// Helper function to check if type is numeric
+var isNumberType = function isNumberType(type) {
+  return (0, _lodashEs.includes)(NUMERIC_DATA_TYPES, type === null || type === void 0 ? void 0 : type.toLowerCase());
+};
+
+// Get search value based on the type
+var getSearchValue = function getSearchValue(value, type) {
+  if (!value && value !== 0 && value !== "") {
+    return undefined;
+  }
+  var dataType = type === null || type === void 0 ? void 0 : type.toLowerCase();
+  if (isNumberType(dataType !== null && dataType !== void 0 ? dataType : "")) {
+    return (0, _lodashEs.toNumber)(value);
+  }
+  if ((0, _lodashEs.includes)(DATE_DATA_TYPES, dataType)) {
+    // For now, return timestamp - can be enhanced with moment.js if needed
+    return new Date(value).valueOf();
+  }
+  return (0, _lodashEs.toLower)((0, _lodashEs.toString)(value));
+};
+
+// Filter the data based on the search value and conditions - matches Angular implementation
+var getFilteredData = function getFilteredData(data, searchObj) {
+  var _searchObj$matchMode, _searchObj$type;
+  var visibleCols = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var searchVal = getSearchValue(searchObj.value, searchObj.type);
+  var currentVal;
+
+  // Return whole data if search value is undefined and matchmode is not an empty matchmode type
+  // or search value is null and datatype is number. Null can not be compared with numeric values
+  if (!searchVal && searchVal !== 0 && !(0, _lodashEs.includes)(EMPTY_MATCH_MODES, (_searchObj$matchMode = searchObj.matchMode) !== null && _searchObj$matchMode !== void 0 ? _searchObj$matchMode : "") || isNumberType((_searchObj$type = searchObj.type) !== null && _searchObj$type !== void 0 ? _searchObj$type : "") && (0, _lodashEs.isNull)(searchObj.value)) {
+    return data;
+  }
+  return (0, _lodashEs.filter)(data, function (obj) {
+    var _searchObj$type2;
+    var isExists;
+    if (searchObj.field) {
+      currentVal = getSearchValue((0, _lodashEs.get)(obj, searchObj.field), searchObj.type);
+    } else {
+      // If field is not there, search on all visible columns
+      var valuesArray = [];
+
+      // Use lodash's forEach and filter more efficiently
+      (0, _lodashEs.forEach)(obj, function (val, key) {
+        if ((0, _lodashEs.includes)(visibleCols, key)) {
+          valuesArray.push(val);
+        } else {
+          // Handle nested key format (dot notation)
+          var nestedColPaths = (0, _lodashEs.filter)(visibleCols, function (col) {
+            return (0, _lodashEs.startsWith)(col, "".concat(key, "."));
+          });
+          (0, _lodashEs.forEach)(nestedColPaths, function (colPath) {
+            var value = (0, _lodashEs.get)(obj, colPath);
+            if (!(0, _lodashEs.includes)(valuesArray, value)) {
+              valuesArray.push(value);
+            }
+          });
+        }
+      });
+      currentVal = (0, _lodashEs.toLower)(valuesArray.join(" "));
+    }
+
+    // Check if values are valid for comparison operations upfront
+    var hasValidValues = !(0, _lodashEs.isNil)(currentVal) && !(0, _lodashEs.isNil)(searchVal);
+    var isCurrentString = (0, _lodashEs.isString)(currentVal);
+    var isSearchString = (0, _lodashEs.isString)(searchVal);
+    var areBothStrings = isCurrentString && isSearchString;
+    switch (searchObj.matchMode) {
+      case MATCH_MODES.START:
+      case MATCH_MODES.START_IGNORE_CASE:
+        isExists = areBothStrings ? (0, _lodashEs.startsWith)(currentVal, searchVal) : false;
+        break;
+      case MATCH_MODES.END:
+      case MATCH_MODES.END_IGNORE_CASE:
+        isExists = areBothStrings ? (0, _lodashEs.endsWith)(currentVal, searchVal) : false;
+        break;
+      case MATCH_MODES.EXACT:
+      case MATCH_MODES.EXACT_IGNORE_CASE:
+        isExists = (0, _lodashEs.isEqual)(currentVal, searchVal);
+        break;
+      case MATCH_MODES.NOT_EQUALS:
+      case MATCH_MODES.NOT_EQUALS_IGNORE_CASE:
+        isExists = !(0, _lodashEs.isEqual)(currentVal, searchVal);
+        break;
+      case MATCH_MODES.NULL:
+        isExists = (0, _lodashEs.isNull)(currentVal);
+        break;
+      case MATCH_MODES.IS_NOT_NULL:
+        isExists = !(0, _lodashEs.isNull)(currentVal);
+        break;
+      case MATCH_MODES.EMPTY:
+        isExists = (0, _lodashEs.isEmpty)(currentVal);
+        break;
+      case MATCH_MODES.IS_NOT_EMPTY:
+        isExists = !(0, _lodashEs.isEmpty)(currentVal);
+        break;
+      case MATCH_MODES.NULL_OR_EMPTY:
+        isExists = (0, _lodashEs.isNull)(currentVal) || (0, _lodashEs.isEmpty)(currentVal);
+        break;
+      case MATCH_MODES.LESS_THAN:
+        isExists = hasValidValues && currentVal < searchVal;
+        break;
+      case MATCH_MODES.LESS_THAN_EQUAL:
+        isExists = hasValidValues && currentVal <= searchVal;
+        break;
+      case MATCH_MODES.GREATER_THAN:
+        isExists = hasValidValues && currentVal > searchVal;
+        break;
+      case MATCH_MODES.GREATER_THAN_EQUAL:
+        isExists = hasValidValues && currentVal >= searchVal;
+        break;
+      case MATCH_MODES.ANYWHERE:
+      case MATCH_MODES.ANYWHERE_IGNORE_CASE:
+      default:
+        isExists = isNumberType((_searchObj$type2 = searchObj.type) !== null && _searchObj$type2 !== void 0 ? _searchObj$type2 : "") ? (0, _lodashEs.isEqual)(currentVal, searchVal) : isCurrentString && !(0, _lodashEs.isNil)(searchVal) ? (0, _lodashEs.includes)(currentVal, (0, _lodashEs.toString)(searchVal)) : false;
+        break;
+    }
+    return isExists;
+  });
+};
+
+// Set the filter fields as required by datasource
+var setFilterFields = function setFilterFields(filterFields, searchObj) {
+  var visibleCols = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var columns = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
+  var field = searchObj && searchObj.field;
+  if (field) {
+    var _ref, _ref2, _searchObj$type3, _column$meta, _column$meta2, _searchObj$matchMode2;
+    // Set the filter options when a field/column has been selected
+    // Find the column to get its type
+    var column = (0, _lodashEs.find)(columns, function (col) {
+      var c = col;
+      return c.accessorKey === field || c.id === field;
+    });
+    var columnType = (_ref = (_ref2 = (_searchObj$type3 = searchObj.type) !== null && _searchObj$type3 !== void 0 ? _searchObj$type3 : column === null || column === void 0 || (_column$meta = column.meta) === null || _column$meta === void 0 ? void 0 : _column$meta.type) !== null && _ref2 !== void 0 ? _ref2 : column === null || column === void 0 || (_column$meta2 = column.meta) === null || _column$meta2 === void 0 ? void 0 : _column$meta2.editinputtype) !== null && _ref !== void 0 ? _ref : _types.DataType.STRING;
+    filterFields[field] = {
+      value: searchObj.value,
+      logicalOp: "AND",
+      matchMode: (_searchObj$matchMode2 = searchObj.matchMode) !== null && _searchObj$matchMode2 !== void 0 ? _searchObj$matchMode2 : MATCH_MODES.ANYWHERE_IGNORE_CASE,
+      type: columnType
+    };
+  } else {
+    // Set the filter options when a field/column hasn't been selected
+    (0, _lodashEs.forEach)(visibleCols, function (field) {
+      var _ref3, _column$meta$type, _column$meta3, _column$meta4, _searchObj$matchMode3;
+      // Find the column to get its type
+      var column = (0, _lodashEs.find)(columns, function (col) {
+        var c = col;
+        return c.accessorKey === field;
+      });
+      var columnType = (_ref3 = (_column$meta$type = column === null || column === void 0 || (_column$meta3 = column.meta) === null || _column$meta3 === void 0 ? void 0 : _column$meta3.type) !== null && _column$meta$type !== void 0 ? _column$meta$type : column === null || column === void 0 || (_column$meta4 = column.meta) === null || _column$meta4 === void 0 ? void 0 : _column$meta4.editinputtype) !== null && _ref3 !== void 0 ? _ref3 : _types.DataType.STRING;
+      filterFields[field] = {
+        value: searchObj.value,
+        type: columnType,
+        logicalOp: "OR",
+        matchMode: (_searchObj$matchMode3 = searchObj.matchMode) !== null && _searchObj$matchMode3 !== void 0 ? _searchObj$matchMode3 : MATCH_MODES.ANYWHERE_IGNORE_CASE
+      };
+    });
+  }
+};
+var useTableFilter = exports.useTableFilter = function useTableFilter(_ref4) {
+  var filterMode = _ref4.filterMode,
+    _ref4$columns = _ref4.columns,
+    columns = _ref4$columns === void 0 ? [] : _ref4$columns,
+    _ref4$dataset = _ref4.dataset,
+    dataset = _ref4$dataset === void 0 ? [] : _ref4$dataset,
+    initialSearchState = _ref4.initialSearchState;
+  // Initialize filter states based on persisted state
+  var getInitialGlobalFilter = function getInitialGlobalFilter() {
+    if (!initialSearchState || filterMode !== "search") return "";
+    // For search mode, we expect an array with one item
+    if ((0, _lodashEs.isArray)(initialSearchState) && initialSearchState.length > 0) {
+      var value = initialSearchState[0].value;
+      return !(0, _lodashEs.isNil)(value) ? String(value) : "";
+    }
+    return "";
+  };
+  var getInitialGlobalSearchColumn = function getInitialGlobalSearchColumn() {
+    if (!initialSearchState || filterMode !== "search") return "";
+    // For search mode, we expect an array with one item
+    if ((0, _lodashEs.isArray)(initialSearchState) && initialSearchState.length > 0) {
+      return initialSearchState[0].field || "";
+    }
+    return "";
+  };
+  var getInitialColumnFilters = function getInitialColumnFilters() {
+    if (!initialSearchState || filterMode !== "multicolumn") return {};
+    var filters = {};
+    if ((0, _lodashEs.isArray)(initialSearchState)) {
+      (0, _lodashEs.forEach)(initialSearchState, function (filter) {
+        if (filter.field) {
+          var _filter$value, _filter$matchMode;
+          filters[filter.field] = {
+            value: (_filter$value = filter.value) !== null && _filter$value !== void 0 ? _filter$value : "",
+            matchMode: (_filter$matchMode = filter.matchMode) !== null && _filter$matchMode !== void 0 ? _filter$matchMode : MATCH_MODES.ANYWHERE_IGNORE_CASE
+          };
+        }
+      });
+    }
+    return filters;
+  };
+
+  // Global filter state for 'search' mode
+  var _useState = (0, _react.useState)(getInitialGlobalFilter()),
+    globalFilter = _useState[0],
+    setGlobalFilter = _useState[1];
+
+  // Selected column for global search
+  var _useState2 = (0, _react.useState)(getInitialGlobalSearchColumn()),
+    globalSearchColumn = _useState2[0],
+    setGlobalSearchColumn = _useState2[1];
+
+  // Column filters state for 'multicolumn' mode
+  var _useState3 = (0, _react.useState)(getInitialColumnFilters()),
+    columnFilters = _useState3[0],
+    setColumnFilters = _useState3[1];
+
+  // Set individual column filter
+  var setColumnFilter = (0, _react.useCallback)(function (columnId, value) {
+    var matchMode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : MATCH_MODES.ANYWHERE_IGNORE_CASE;
+    setColumnFilters(function (prev) {
+      return _objectSpread(_objectSpread({}, prev), {}, (0, _defineProperty2["default"])({}, columnId, {
+        value: value,
+        matchMode: matchMode
+      }));
+    });
+  }, []);
+
+  // Clear all filters
+  var clearAllFilters = (0, _react.useCallback)(function () {
+    setGlobalFilter("");
+    setGlobalSearchColumn("");
+    setColumnFilters({});
+  }, []);
+
+  // Get visible columns that can be searched
+  var getTableVisibleCols = (0, _react.useCallback)(function () {
+    var excludedColumnIds = ["actions", "row-operations", "multiSelect", "radioSelect", "row-index"];
+    return (0, _lodashEs.map)((0, _lodashEs.filter)(columns, function (col) {
+      var column = col;
+      return column.searchable !== false && !!column.accessorKey && !(0, _lodashEs.includes)(excludedColumnIds, column.id);
+    }), function (col) {
+      return col.accessorKey;
+    });
+  }, [columns]);
+
+  // Get filter fields as required by datasource
+  var getFilterFields = (0, _react.useCallback)(function (searchObj) {
+    var filterFields = {};
+    var visibleCols = getTableVisibleCols();
+    if (!searchObj) return filterFields;
+    if ((0, _lodashEs.isArray)(searchObj)) {
+      (0, _lodashEs.forEach)(searchObj, function (obj) {
+        setFilterFields(filterFields, obj, visibleCols, columns);
+      });
+    } else {
+      setFilterFields(filterFields, searchObj, visibleCols, columns);
+    }
+    return filterFields;
+  }, [getTableVisibleCols, columns]);
+
+  // Transform filter fields from object to array format
+  var transformFilterFields = (0, _react.useCallback)(function (filterFields) {
+    var result = [];
+    (0, _lodashEs.forEach)(filterFields, function (filter, field) {
+      var _filterObj$matchMode;
+      var filterObj = filter;
+      if (filterObj && (!(0, _lodashEs.isNil)(filterObj.value) || (0, _lodashEs.includes)(EMPTY_MATCH_MODES, (_filterObj$matchMode = filterObj.matchMode) !== null && _filterObj$matchMode !== void 0 ? _filterObj$matchMode : ""))) {
+        var _filterObj$matchMode2, _filterObj$type;
+        result.push({
+          field: field,
+          value: filterObj.value,
+          matchMode: (_filterObj$matchMode2 = filterObj.matchMode) !== null && _filterObj$matchMode2 !== void 0 ? _filterObj$matchMode2 : MATCH_MODES.ANYWHERE_IGNORE_CASE,
+          type: (_filterObj$type = filterObj.type) !== null && _filterObj$type !== void 0 ? _filterObj$type : _types.DataType.STRING
+        });
+      }
+    });
+    return result;
+  }, []);
+
+  // Apply filtering logic based on filter mode
+  var filteredData = (0, _react.useMemo)(function () {
+    if (!filterMode || !dataset) {
+      return dataset;
+    }
+    var data = (0, _toConsumableArray2["default"])(dataset);
+    var visibleCols = getTableVisibleCols();
+    if (filterMode === "search") {
+      // Handle search mode filtering
+      if (globalFilter || globalSearchColumn) {
+        var searchObj = {
+          field: globalSearchColumn || "",
+          value: globalFilter,
+          matchMode: MATCH_MODES.ANYWHERE_IGNORE_CASE,
+          type: globalSearchColumn ? function (_ref5, _col$meta$type, _col$meta, _col$meta2) {
+            var col = (0, _lodashEs.find)(columns, function (c) {
+              var column = c;
+              return column.accessorKey === globalSearchColumn || column.id === globalSearchColumn;
+            });
+            return (_ref5 = (_col$meta$type = col === null || col === void 0 || (_col$meta = col.meta) === null || _col$meta === void 0 ? void 0 : _col$meta.type) !== null && _col$meta$type !== void 0 ? _col$meta$type : col === null || col === void 0 || (_col$meta2 = col.meta) === null || _col$meta2 === void 0 ? void 0 : _col$meta2.editinputtype) !== null && _ref5 !== void 0 ? _ref5 : _types.DataType.STRING;
+          }() : _types.DataType.STRING
+        };
+        data = getFilteredData(data, searchObj, visibleCols);
+      }
+    } else if (filterMode === "multicolumn") {
+      // Handle multicolumn filtering
+      var filterArray = [];
+      (0, _lodashEs.forEach)(columnFilters, function (filterObj, columnId) {
+        if (!filterObj) return;
+
+        // Special match modes that don't require a value
+        if ((0, _lodashEs.isNil)(filterObj.value) && !(0, _lodashEs.includes)(EMPTY_MATCH_MODES, filterObj.matchMode)) return;
+
+        // Find column to get type
+        var column = (0, _lodashEs.find)(columns, function (col) {
+          var c = col;
+          return c.id === columnId || c.accessorKey === columnId;
+        });
+        if (column && column.accessorKey) {
+          var _ref6, _column$meta$type2, _column$meta5, _column$meta6;
+          filterArray.push({
+            field: column.accessorKey,
+            value: filterObj.value,
+            matchMode: filterObj.matchMode,
+            type: (_ref6 = (_column$meta$type2 = (_column$meta5 = column.meta) === null || _column$meta5 === void 0 ? void 0 : _column$meta5.type) !== null && _column$meta$type2 !== void 0 ? _column$meta$type2 : (_column$meta6 = column.meta) === null || _column$meta6 === void 0 ? void 0 : _column$meta6.editinputtype) !== null && _ref6 !== void 0 ? _ref6 : _types.DataType.STRING
+          });
+        }
+      });
+
+      // Apply each filter sequentially
+      data = filterArray.reduce(function (filteredData, searchObj) {
+        return getFilteredData(filteredData, searchObj, visibleCols);
+      }, data);
+    }
+    return data;
+  }, [dataset, columns, filterMode, globalFilter, globalSearchColumn, columnFilters, getTableVisibleCols]);
+  return {
+    globalFilter: globalFilter,
+    setGlobalFilter: setGlobalFilter,
+    globalSearchColumn: globalSearchColumn,
+    setGlobalSearchColumn: setGlobalSearchColumn,
+    columnFilters: columnFilters,
+    setColumnFilter: setColumnFilter,
+    filteredData: filteredData,
+    clearAllFilters: clearAllFilters,
+    getFilterFields: getFilterFields,
+    transformFilterFields: transformFilterFields
+  };
+};

package/components/data/table/hooks/useTableInitialization.d.ts

@@ -0,0 +1,5 @@
+import { UseTableInitializationProps } from "../props";
+/**
+ * Hook to handle table initialization and active row synchronization logic
+ */
+export declare const useTableInitialization: ({ internalDataset, wmTableColumns, cellState, gridfirstrowselect, useRadioSelect, useMultiSelect, setActiveRow, selectedRowIds, activeRowIds, formName, editmode, listener, }: UseTableInitializationProps) => void;