@wavemaker/react-runtime 11.14.1-rc.236

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

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LIST_NAVIGATION_TYPES = exports.LIST_MESSAGES = exports.LIST_DIRECTION = exports.LIST_DEFAULTS = exports.LIST_ALIGN = exports.DEFAULT_PAGINATION_META = exports.DEFAULT_CLS = exports.APP_LOCALE = void 0;
+/**
+ * Default classes and constants for the List component
+ */
+var DEFAULT_CLS = exports.DEFAULT_CLS = "app-livelist app-panel";
+
+// Strongly typed defaults
+var LIST_DEFAULTS = exports.LIST_DEFAULTS = {
+  // updated to 20 from 10 as per angular code
+  PAGESIZE: 20,
+  PAGESIZE_FOR_MODAL_VARIABLE: 5,
+  MAX_SIZE: 5,
+  BOUNDARY_LINKS: false,
+  COLLAPSIBLE: false,
+  MULTISELECT: false,
+  SELECT_FIRST_ITEM: false,
+  SELECTION_LIMIT: 0,
+  SHOW_COUNT: false,
+  SHOW_RECORD_COUNT: false
+};
+
+// Application locale strings
+var APP_LOCALE = exports.APP_LOCALE = {
+  LABEL_FIRST: "First",
+  LABEL_PREVIOUS: "Previous",
+  LABEL_NEXT: "Next",
+  LABEL_LAST: "Last",
+  LABEL_TOTAL_RECORDS: "Total Records",
+  LABEL_ICON: "Icon",
+  LABEL_ITEMS_PER_PAGE: "Items per page"
+};
+
+// List messages
+var LIST_MESSAGES = exports.LIST_MESSAGES = {
+  LOADING: "Loading...",
+  NO_DATA: "No data found",
+  LOAD_MORE: "Load More"
+};
+
+// Navigation types enum with const assertion for better type inference
+var LIST_NAVIGATION_TYPES = exports.LIST_NAVIGATION_TYPES = {
+  NONE: "None",
+  BASIC: "Basic",
+  PAGER: "Pager",
+  CLASSIC: "Classic",
+  ADVANCED: "Advanced",
+  INLINE: "Inline",
+  ON_DEMAND: "On-Demand",
+  SCROLL: "Scroll"
+};
+
+// Direction types
+var LIST_DIRECTION = exports.LIST_DIRECTION = {
+  VERTICAL: "vertical",
+  HORIZONTAL: "horizontal"
+};
+
+// Alignment types
+var LIST_ALIGN = exports.LIST_ALIGN = {
+  LEFT: "left",
+  CENTER: "center",
+  RIGHT: "right"
+};
+
+// Default pagination metadata for when none is provided
+var DEFAULT_PAGINATION_META = exports.DEFAULT_PAGINATION_META = {
+  totalPages: 1,
+  totalElements: 0,
+  last: true,
+  sort: [],
+  numberOfElements: 0,
+  first: true,
+  size: 0,
+  number: 0,
+  empty: true
+};

package/components/data/list/utils/list-helpers.js

@@ -0,0 +1,173 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.saveListState = exports.getTextAlignClass = exports.getSelectedItemWidgets = exports.getSafeDataset = exports.getListState = exports.getItemsPerRowClass = exports.clearListState = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _constants = require("./constants");
+var _statePersistance = require("@wavemaker/react-runtime/utils/state-persistance");
+var _lodashEs = require("lodash-es");
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+/**
+ * Get items per row CSS classes based on configuration
+ * @param itemsperrow - Items per row configuration
+ * @param direction - List direction
+ * @returns CSS class string
+ */
+var getItemsPerRowClass = exports.getItemsPerRowClass = function getItemsPerRowClass(itemsperrow, direction) {
+  if (direction === "horizontal") {
+    return "";
+  }
+  if (!itemsperrow) {
+    return "col-xs-12";
+  }
+  if (isNaN(parseInt(itemsperrow, 10))) {
+    return itemsperrow.split(" ").map(function (cls) {
+      var _cls$split = cls.split("-"),
+        _cls$split2 = (0, _slicedToArray2["default"])(_cls$split, 2),
+        tier = _cls$split2[0],
+        value = _cls$split2[1];
+      var colSize = 12 / parseInt(value, 10);
+      return "col-".concat(tier, "-").concat(colSize);
+    }).join(" ").trim();
+  }
+  var numValue = parseInt(itemsperrow, 10);
+  return "col-xs-".concat(12 / numValue);
+};
+
+/**
+ * Get text alignment class
+ * @param align - Alignment value
+ * @returns CSS class string
+ */
+var getTextAlignClass = exports.getTextAlignClass = function getTextAlignClass(align) {
+  switch (align) {
+    case _constants.LIST_ALIGN.CENTER:
+      return "text-center";
+    case _constants.LIST_ALIGN.RIGHT:
+      return "text-right";
+    case _constants.LIST_ALIGN.LEFT:
+    default:
+      return "text-left";
+  }
+};
+
+/**
+ * Get safe dataset ensuring it's always an array
+ * @param dataset - Input dataset of any type
+ * @returns Array dataset with proper typing
+ */
+var getSafeDataset = exports.getSafeDataset = function getSafeDataset(dataset) {
+  if (typeof dataset === "string") {
+    try {
+      var parsedData = dataset.split(",").map(function (str) {
+        return str.trim();
+      });
+      return Array.isArray(parsedData) ? parsedData : [];
+    } catch (e) {
+      return [];
+    }
+  } else if (!(dataset instanceof Array) && (0, _lodashEs.isObject)(dataset) && Object.keys(dataset).length > 0) {
+    return dataset ? [dataset] : [];
+  }
+  return Array.isArray(dataset) ? dataset : [];
+};
+
+// Type definition for list state
+
+var saveListState = exports.saveListState = function saveListState(name, storage, stateToSave) {
+  // Simply save the provided state
+  (0, _statePersistance.setWidgetState)({
+    name: name,
+    type: "list",
+    storage: storage
+  }, stateToSave);
+};
+var getListState = exports.getListState = function getListState(name, storage) {
+  var state = (0, _statePersistance.getWidgetState)({
+    name: name,
+    type: "list",
+    storage: storage
+  });
+  return state;
+};
+var clearListState = exports.clearListState = function clearListState(name, storage) {
+  (0, _statePersistance.clearWidgetState)({
+    name: name,
+    storage: storage,
+    type: "list"
+  });
+};
+
+// Helper function to get all descendant elements with data-widget-id
+var getAllDescendants = function getAllDescendants(element) {
+  var all = [];
+  function traverse(node) {
+    // include the node itself if it has data-widget-id
+    if (node.nodeType === 1 && node.hasAttribute("data-widget-id")) {
+      all.push(node);
+    }
+    // go deeper
+    var _iterator = _createForOfIteratorHelper(node.children),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var child = _step.value;
+        traverse(child);
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  }
+  traverse(element);
+  return all;
+};
+var getSelectedItemWidgets = exports.getSelectedItemWidgets = function getSelectedItemWidgets(event, listener, name) {
+  var listItem = null;
+  if (event) {
+    // Manual selection - get from event
+    listItem = event.currentTarget;
+  } else {
+    // Programmatic selection - find active item in DOM
+    var activeItems = document.querySelectorAll("[data-name=\"".concat(name, "\"] .app-list-item.active"));
+    if (activeItems.length > 0) {
+      // Get the last active item (most recently selected)
+      listItem = activeItems[activeItems.length - 1];
+    }
+  }
+  var componentElements = listItem ? getAllDescendants(listItem) : [];
+  var currentItemWidgets = componentElements.reduce(function (result, comp) {
+    // Try different attributes to get widget name
+    var widgetName = comp.getAttribute("name");
+    if (widgetName) {
+      // Try to get the widget instance from the component or create a reference
+      var widgetInstance = comp.widget;
+      if (!widgetInstance) {
+        // Create a basic widget reference with properties from the DOM element
+        widgetInstance = {
+          name: widgetName,
+          caption: comp.getAttribute("caption") || comp.textContent || "",
+          value: comp.value || comp.getAttribute("value") || "",
+          // Add other common properties
+          show: comp.getAttribute("show") !== "false",
+          element: comp
+        };
+      }
+      result[widgetName] = widgetInstance;
+    }
+    return result;
+  }, {});
+  if (listener) {
+    setTimeout(function () {
+      listener.onChange(name, {
+        selectedItemWidgets: currentItemWidgets
+      });
+    }, 0);
+  }
+};

package/components/data/list/utils/list-widget-methods.js

@@ -0,0 +1,114 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useListWidgetMethods = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = require("react");
+var _lodashEs = require("lodash-es");
+var useListWidgetMethods = exports.useListWidgetMethods = function useListWidgetMethods(items, listState, multiselect, onSelect, widgetInstance, listener, userInitiatedSelectionRef, name) {
+  // Helper function to find an item by index or model
+  var getItemByIndexOrModel = (0, _react.useCallback)(function (val) {
+    if (typeof val === "number") {
+      return items[val];
+    } else {
+      return items.find(function (item) {
+        return item === val;
+      });
+    }
+  }, [items]);
+
+  // Selects an item in the list by index or model
+  var selectItem = (0, _react.useCallback)(function (val, statePersistenceTriggered) {
+    var item = getItemByIndexOrModel(val);
+    if (!item) {
+      return;
+    }
+    var isAlreadySelected = listState.activeItems.has(item);
+    if (!isAlreadySelected) {
+      if (!statePersistenceTriggered && userInitiatedSelectionRef) {
+        userInitiatedSelectionRef.current = true;
+      }
+      if (multiselect) {
+        var newSelectedItems = [].concat((0, _toConsumableArray2["default"])(listState.selectedItems), [item]);
+        var newActiveItems = new Set(listState.activeItems);
+        newActiveItems.add(item);
+        listState.setSelectedItems(newSelectedItems);
+        listState.setActiveItems(newActiveItems);
+        if (!listState.firstSelectedItem) {
+          listState.setFirstSelectedItem(item);
+        }
+      } else {
+        listState.setSelectedItems([item]);
+        listState.setActiveItems(new Set([item]));
+        listState.setFirstSelectedItem(item);
+      }
+      if (onSelect && widgetInstance && !statePersistenceTriggered) {
+        onSelect(widgetInstance, item);
+      }
+    }
+  }, [listState.activeItems]);
+  var deselectItem = (0, _react.useCallback)(function (val) {
+    var item = getItemByIndexOrModel(val);
+    if (!item) {
+      return;
+    }
+    var isSelected = Array.from(listState.activeItems).some(function (activeItem) {
+      return (0, _lodashEs.isEqual)(activeItem, item);
+    });
+    if (isSelected) {
+      if (userInitiatedSelectionRef) {
+        userInitiatedSelectionRef.current = true;
+      }
+      var newSelectedItems = listState.selectedItems.filter(function (selectedItem) {
+        return !(0, _lodashEs.isEqual)(selectedItem, item);
+      });
+      var newActiveItems = new Set(Array.from(listState.activeItems).filter(function (activeItem) {
+        return !(0, _lodashEs.isEqual)(activeItem, item);
+      }));
+      listState.setSelectedItems(newSelectedItems);
+      listState.setActiveItems(newActiveItems);
+      if ((0, _lodashEs.isEqual)(listState.firstSelectedItem, item)) {
+        listState.setFirstSelectedItem(newSelectedItems[0] || null);
+      }
+    }
+  }, [listState.activeItems, listState.selectedItems]);
+  var getItem = (0, _react.useCallback)(function (index) {
+    return items[index];
+  }, []);
+  var getIndex = (0, _react.useCallback)(function (item) {
+    return items.findIndex(function (listItem) {
+      return (0, _lodashEs.isEqual)(listItem, item);
+    });
+  }, []);
+  var clear = (0, _react.useCallback)(function () {
+    listState.setSelectedItems([]);
+    listState.setActiveItems(new Set());
+    listState.setFirstSelectedItem(null);
+    var listener_instance = name && (listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+    if (listener_instance) {
+      listener_instance.selecteditem = undefined;
+    }
+  }, [listState.setSelectedItems, listState.setActiveItems, listState.setFirstSelectedItem]);
+  var getWidgets = (0, _react.useCallback)(function (widgetName, index) {
+    if (widgetInstance && widgetInstance[widgetName]) {
+      return widgetInstance[widgetName];
+    }
+    return listener === null || listener === void 0 ? void 0 : listener.Widgets[widgetName];
+  }, []);
+
+  // Memoize the return object to prevent unnecessary re-renders
+  return (0, _react.useMemo)(function () {
+    return {
+      getItemByIndexOrModel: getItemByIndexOrModel,
+      selectItem: selectItem,
+      deselectItem: deselectItem,
+      getItem: getItem,
+      getIndex: getIndex,
+      clear: clear,
+      getWidgets: getWidgets
+    };
+  }, [getItemByIndexOrModel, selectItem, deselectItem, getItem, getIndex, clear, getWidgets]);
+};

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

@@ -0,0 +1,279 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof3 = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _lodashEs = require("lodash-es");
+var _util = require("../../../core/util");
+var _form = _interopRequireDefault(require("../form"));
+var _withBaseWrapper = _interopRequireDefault(require("../../../higherOrder/withBaseWrapper"));
+var _props = require("./props");
+var _types = require("../types");
+var _utils = require("../utils");
+var _fieldDataUtils = require("../utils/field-data-utils");
+var _filterFieldUtil = require("../utils/filter-field-util");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
+var __jsx = _react["default"].createElement;
+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; }
+var FILTER_CONSTANTS = {
+  EMPTY_KEY: "EMPTY_NULL_FILTER"
+};
+var WmLiveFilter = function WmLiveFilter(prop) {
+  var _props$listener;
+  var props = _objectSpread(_objectSpread({}, _props.DEFAULT_PROPS), prop);
+  var isInitilised = (0, _react.useRef)(false);
+  var isDataSourceUpdatedRef = (0, _react.useRef)(false);
+  var dataSource = (_props$listener = props.listener) === null || _props$listener === void 0 || (_props$listener = _props$listener.Variables) === null || _props$listener === void 0 ? void 0 : _props$listener[props.dataSource];
+  function updateResults(dataSet) {
+    var _props$listener2;
+    (_props$listener2 = props.listener) === null || _props$listener2 === void 0 || _props$listener2.onChange(props.name, {
+      result: dataSet
+    });
+  }
+  function Livefilter(_x, _x2, _x3) {
+    return _Livefilter.apply(this, arguments);
+  }
+  function _Livefilter() {
+    _Livefilter = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(options, clearFilter, formFields) {
+      var _props$orderBy, _props$pagesize;
+      var dataModel, page, orderBy, pagesize, filterFields, isValid, fieldsArray, _options$exportType, _options$exportSize, _options$data, _options$fields, _options$data2, _options$fileName, _options$data3, exportType;
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (dataSource) {
+              _context.next = 2;
+              break;
+            }
+            return _context.abrupt("return");
+          case 2:
+            // Treat first arg as submitted form data model
+            dataModel = options || {};
+            page = 1;
+            orderBy = (_props$orderBy = props.orderBy) !== null && _props$orderBy !== void 0 ? _props$orderBy : "";
+            pagesize = (_props$pagesize = props.pagesize) !== null && _props$pagesize !== void 0 ? _props$pagesize : 20;
+            filterFields = {};
+
+            // before invoke filter called onBeforeInvokeFilter if response is false or undefined then return
+            _context.prev = 7;
+            isValid = props.onBeforeservicecall(filterFields);
+            if (!(isValid === false)) {
+              _context.next = 11;
+              break;
+            }
+            return _context.abrupt("return");
+          case 11:
+            if (!(isValid && isValid.error)) {
+              _context.next = 14;
+              break;
+            }
+            props.toggleMessage(true, isValid.error, "error", "ERROR");
+            return _context.abrupt("return");
+          case 14:
+            _context.next = 20;
+            break;
+          case 16:
+            _context.prev = 16;
+            _context.t0 = _context["catch"](7);
+            if (!(_context.t0.message === "Abort")) {
+              _context.next = 20;
+              break;
+            }
+            return _context.abrupt("return");
+          case 20:
+            if (!clearFilter) {
+              _context.next = 22;
+              break;
+            }
+            return _context.abrupt("return", dataSource[_types.DataSource.Operation.LIST_RECORDS]({
+              filterFields: {},
+              orderBy: "",
+              page: 1
+            }).then(function (results) {
+              if (results) {
+                updateResults(results === null || results === void 0 ? void 0 : results.data);
+              }
+            })["catch"](function (err) {
+              props.toggleMessage(true, err, "error", "ERROR");
+              props.onResultCb(err, false);
+              return err;
+            }));
+          case 22:
+            /* Construct the formFields Variable to send it to the queryBuilder */
+            fieldsArray = (0, _lodashEs.isArray)(formFields) ? formFields : Object.values(formFields || {}); // Sync runtime values from submitted data into field definitions
+            fieldsArray.forEach(function (filterField) {
+              var submitted = dataModel === null || dataModel === void 0 ? void 0 : dataModel[filterField.field];
+              if (filterField["isRange"]) {
+                if (submitted && (0, _typeof2["default"])(submitted) === "object") {
+                  var _ref, _ref2, _submitted$minValue, _ref3, _ref4, _submitted$maxValue;
+                  filterField._minValue = (_ref = (_ref2 = (_submitted$minValue = submitted.minValue) !== null && _submitted$minValue !== void 0 ? _submitted$minValue : submitted.min) !== null && _ref2 !== void 0 ? _ref2 : submitted.start) !== null && _ref !== void 0 ? _ref : filterField._minValue;
+                  filterField._maxValue = (_ref3 = (_ref4 = (_submitted$maxValue = submitted.maxValue) !== null && _submitted$maxValue !== void 0 ? _submitted$maxValue : submitted.max) !== null && _ref4 !== void 0 ? _ref4 : submitted.end) !== null && _ref3 !== void 0 ? _ref3 : filterField._maxValue;
+                }
+              } else {
+                if (submitted !== undefined) {
+                  filterField._value = submitted;
+                }
+              }
+            });
+            fieldsArray.forEach(function (filterField) {
+              var fieldValue;
+              var matchMode;
+              var colName = filterField.field;
+              var minValue = filterField._minValue;
+              var maxvalue = filterField._maxValue;
+              /* if field is part of a related entity, column name will be 'entity.fieldName' */
+              if (filterField["isRelated"]) {
+                colName += "." + filterField["lookup-field"];
+              }
+              if (filterField["isRange"]) {
+                /*Based on the min and max values, decide the matchmode condition*/
+                fieldValue = (0, _utils.getRangeFieldValue)(minValue, maxvalue);
+                matchMode = (0, _utils.getRangeMatchMode)(minValue, maxvalue);
+                if ((0, _util.isDefined)(fieldValue)) {
+                  filterFields[colName] = {
+                    value: fieldValue,
+                    matchMode: matchMode,
+                    logicalOp: "AND"
+                  };
+                }
+              } else {
+                switch (filterField.widgettype) {
+                  case _types.FormWidgetType.SELECT:
+                  case _types.FormWidgetType.RADIOSET:
+                    if ((0, _utils.getEnableEmptyFilter)(props.enableemptyfilter) && filterField._value === FILTER_CONSTANTS.EMPTY_KEY) {
+                      matchMode = (0, _utils.getEmptyMatchMode)(props.enableemptyfilter);
+                      fieldValue = filterField._value;
+                    } else {
+                      if (filterField.type === _types.DataType.BOOLEAN) {
+                        if ((0, _util.isDefined)(filterField._value) && filterField._value !== "") {
+                          fieldValue = JSON.parse(filterField._value);
+                        }
+                      } else {
+                        fieldValue = filterField._value;
+                      }
+                    }
+                    break;
+                  case _types.FormWidgetType.CHECKBOXSET:
+                  case _types.FormWidgetType.CHIPS:
+                    if (filterField._value && filterField._value.length) {
+                      fieldValue = filterField._value;
+                    }
+                    break;
+                  case _types.FormWidgetType.CHECKBOX:
+                  case _types.FormWidgetType.TOGGLE:
+                    if ((0, _util.isDefined)(filterField._value) && filterField._value !== "") {
+                      fieldValue = filterField.type === _types.DataType.BOOLEAN ? JSON.parse(filterField._value) : filterField._value;
+                    }
+                    break;
+                  default:
+                    fieldValue = filterField._value;
+                    break;
+                }
+                if ((0, _util.isDefined)(fieldValue) && fieldValue !== "" && fieldValue !== null) {
+                  filterFields[colName] = {};
+                  if (matchMode) {
+                    filterFields[colName].matchMode = matchMode;
+                    fieldValue = undefined;
+                  } else if (filterField.type === _types.DataType.STRING || filterField.isRelated) {
+                    // Only for string types and related fields, custom match modes are enabled.
+                    // filterFields[colName].matchMode =
+                    //   matchMode || filterField.matchmode || variable[DataSource.Operation.GET_MATCH_MODE]();
+                  }
+                  filterFields[colName].value = fieldValue;
+                  filterFields[colName].logicalOp = "AND";
+                  filterFields[colName].type = filterField.type;
+                }
+              }
+            });
+
+            //  if exportType is there then return the download
+            if (!(options && options.exportType || options && options.data && options.data.exportType)) {
+              _context.next = 28;
+              break;
+            }
+            exportType = (_options$exportType = options.exportType) !== null && _options$exportType !== void 0 ? _options$exportType : options.data.exportType;
+            return _context.abrupt("return", dataSource[_types.DataSource.Operation.DOWNLOAD]({
+              data: {
+                matchMode: "anywhereignorecase",
+                filterFields: filterFields,
+                orderBy: orderBy,
+                exportType: exportType,
+                logicalOp: "AND",
+                exportSize: (_options$exportSize = options.exportSize) !== null && _options$exportSize !== void 0 ? _options$exportSize : (_options$data = options.data) === null || _options$data === void 0 ? void 0 : _options$data.exportSize,
+                fields: (_options$fields = options.fields) !== null && _options$fields !== void 0 ? _options$fields : (_options$data2 = options.data) === null || _options$data2 === void 0 ? void 0 : _options$data2.fields,
+                fileName: (_options$fileName = options.fileName) !== null && _options$fileName !== void 0 ? _options$fileName : (_options$data3 = options.data) === null || _options$data3 === void 0 ? void 0 : _options$data3.fileName
+              }
+            }));
+          case 28:
+            return _context.abrupt("return", dataSource[_types.DataSource.Operation.LIST_RECORDS]({
+              filterFields: filterFields,
+              orderBy: orderBy,
+              page: page,
+              pagesize: pagesize,
+              skipDataSetUpdate: true,
+              inFlightBehavior: "executeAll"
+            }).then(function (results) {
+              if (results) {
+                updateResults(results === null || results === void 0 ? void 0 : results.data);
+              }
+            })["catch"](function (err) {
+              props.toggleMessage(true, err, "error", "ERROR");
+              props.onResultCb(err, false);
+              return err;
+            }));
+          case 29:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[7, 16]]);
+    }));
+    return _Livefilter.apply(this, arguments);
+  }
+  function onDataSourceChange() {
+    if (isDataSourceUpdatedRef.current) return;
+    var fields = (0, _lodashEs.get)(props.listener.Widgets[props.name], "formfields", []);
+    var formFields = (0, _lodashEs.isArray)(fields) ? fields : Object.values(fields || {});
+    if ((0, _lodashEs.get)(formFields, "length")) {
+      isDataSourceUpdatedRef.current = true;
+    }
+    formFields.forEach(function (field) {
+      if ((0, _fieldDataUtils.isDataSetWidget)(field.widget)) {
+        var _props$listener3;
+        (0, _filterFieldUtil.getDistinctValuesForField)(dataSource, field, {
+          widget: "widgettype",
+          enableemptyfilter: props.enableemptyfilter,
+          EMPTY_VALUE: props === null || props === void 0 || (_props$listener3 = props.listener) === null || _props$listener3 === void 0 ? void 0 : _props$listener3.appLocale.LABEL_NO_VALUE
+        });
+      }
+    });
+  }
+
+  // side events
+  (0, _react.useEffect)(function () {
+    var _props$dataset;
+    if (!isInitilised.current && props !== null && props !== void 0 && props.dataset && (props === null || props === void 0 || (_props$dataset = props.dataset) === null || _props$dataset === void 0 ? void 0 : _props$dataset.length) > 0) {
+      updateResults(props.dataset);
+      // @ts-ignore
+      isInitilised.current = true;
+    }
+  }, [props.dataset]);
+  return (
+    // @ts-ignore
+    __jsx(_form["default"], (0, _extends2["default"])({}, props, {
+      Livefilter: Livefilter,
+      onDataSourceChange: onDataSourceChange,
+      "form-type": "live-filter"
+    }), props.children)
+  );
+};
+WmLiveFilter.displayName = "WmLiveFilter";
+var _default = exports["default"] = (0, _withBaseWrapper["default"])(WmLiveFilter);

package/components/data/live-filter/props.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DEFAULT_PROPS = void 0;
+var DEFAULT_PROPS = exports.DEFAULT_PROPS = {
+  iconclass: "wi wi-filter-list",
+  pagesize: 20,
+  autoupdate: true,
+  enableemptyfilter: " "
+};