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

package/components/data/form/base-form/utils.js

@@ -0,0 +1,411 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.transformToNestedObject = exports.transformRangeFilterData = exports.setWidgetValidationMessages = exports.setWidgetFormData = exports.scrollToElement = exports.registerChildFieldInWidget = exports.mergeWithFormDataRef = exports.isElementInViewport = exports.isAndroid = exports.hasArrayData = exports.getWidgetFormFields = exports.getWidgetFormData = exports.getFieldLayoutConfig = exports.focusOnFirstInvalidField = exports.filterTableColumns = exports.filterArraysByRenderedForms = exports.cleanNullValues = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _lodashEs = require("lodash-es");
+var _constant = require("./constant");
+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; }
+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; }
+var userAgent = "";
+if (typeof window !== "undefined") {
+  userAgent = window.navigator.userAgent;
+}
+var isAndroid = exports.isAndroid = function isAndroid() {
+  return _constant.REGEX.ANDROID.test(userAgent);
+};
+var getFieldLayoutConfig = exports.getFieldLayoutConfig = function getFieldLayoutConfig(captionWidth, captionPosition, os) {
+  var captionCls = "",
+    widgetCls = "";
+  captionPosition = captionPosition || "top";
+  if (captionPosition === "top" || captionPosition === "floating") {
+    if (os && os === "android" || isAndroid()) {
+      // Is android or not a mobile application
+      captionCls = widgetCls = "col-xs-12";
+    }
+  } else if (captionWidth) {
+    // handling itemsperrow containing string of classes
+    (0, _lodashEs.forEach)((0, _lodashEs.split)(captionWidth, " "), function (cls) {
+      var keys = (0, _lodashEs.split)(cls, "-"),
+        tier = keys[0];
+      var _captionWidth, widgetWidth;
+      _captionWidth = parseInt(keys[1], 10);
+      widgetWidth = 12 - _captionWidth;
+      widgetWidth = widgetWidth <= 0 ? 12 : widgetWidth;
+      captionCls += " " + "col-" + tier + "-" + _captionWidth;
+      widgetCls += " " + "col-" + tier + "-" + widgetWidth;
+    });
+  }
+  return {
+    captionCls: captionCls,
+    widgetCls: widgetCls
+  };
+};
+
+/**
+ * Checks if an element is visible in the viewport
+ */
+var isElementInViewport = exports.isElementInViewport = function isElementInViewport(el) {
+  if (!el) return false;
+  var rect = el.getBoundingClientRect();
+  return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);
+};
+
+/**
+ * Focuses on the first invalid field in a form using multiple DOM-based strategies
+ */
+var focusOnFirstInvalidField = exports.focusOnFirstInvalidField = function focusOnFirstInvalidField(formElement, errorFieldNames) {
+  if (!formElement) return;
+  setTimeout(function () {
+    if (!formElement) return;
+    var focusableElement = null;
+
+    // Strategy 1: Find by error field names if provided
+    if (errorFieldNames !== null && errorFieldNames !== void 0 && errorFieldNames.length) {
+      var selectors = [function (name) {
+        return "input[name=\"".concat(name, "\"]:not([type=\"hidden\"]), textarea[name=\"").concat(name, "\"], select[name=\"").concat(name, "\"]");
+      }, function (name) {
+        return "#".concat(name);
+      }, function (name) {
+        return "[data-name=\"".concat(name, "\"], div[name=\"").concat(name, "\"]");
+      }];
+      var _iterator = _createForOfIteratorHelper(errorFieldNames),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var fieldName = _step.value;
+          var _iterator2 = _createForOfIteratorHelper(selectors),
+            _step2;
+          try {
+            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+              var selector = _step2.value;
+              var element = formElement.querySelector(selector(fieldName));
+              if (element) {
+                focusableElement = element.matches("input, textarea, select") ? element : element.querySelector('input:not([type="hidden"]), textarea, select, [contenteditable="true"]');
+                if (focusableElement) break;
+              }
+            }
+          } catch (err) {
+            _iterator2.e(err);
+          } finally {
+            _iterator2.f();
+          }
+          if (focusableElement) break;
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+
+    // Strategies 2-5: Find by CSS classes and attributes
+    var fallbackSelectors = ['input.ng-invalid:not([type="hidden"]), textarea.ng-invalid, select.ng-invalid', '.app-input-wrapper.ng-invalid input:not([type="hidden"]), .MuiFormControl-root.Mui-error input:not([type="hidden"])', ".help-block.text-danger", 'input[aria-invalid="true"], textarea[aria-invalid="true"], select[aria-invalid="true"]'];
+    for (var _i = 0, _fallbackSelectors = fallbackSelectors; _i < _fallbackSelectors.length; _i++) {
+      var _selector = _fallbackSelectors[_i];
+      if (focusableElement) break;
+      var _element = formElement.querySelector(_selector);
+      if (_element) {
+        var _element$parentElemen;
+        focusableElement = _element.matches("input, textarea, select") ? _element : (_element$parentElemen = _element.parentElement) === null || _element$parentElemen === void 0 ? void 0 : _element$parentElemen.querySelector('input:not([type="hidden"]), textarea, select');
+      }
+    }
+    if (focusableElement) {
+      if (!isElementInViewport(focusableElement)) {
+        focusableElement.scrollIntoView({
+          behavior: "smooth",
+          block: "center"
+        });
+      }
+      setTimeout(function () {
+        var _focusableElement;
+        return (_focusableElement = focusableElement) === null || _focusableElement === void 0 ? void 0 : _focusableElement.focus({
+          preventScroll: true
+        });
+      }, 100);
+    }
+  }, 100);
+};
+
+/**
+ * Scrolls an element into view with smooth behavior
+ */
+var scrollToElement = exports.scrollToElement = function scrollToElement(el) {
+  if (el) {
+    el.scrollIntoView({
+      behavior: "smooth",
+      block: "start"
+    });
+  }
+};
+
+/**
+ * Converts null values to empty strings in an object
+ */
+var cleanNullValues = exports.cleanNullValues = function cleanNullValues(data) {
+  return (0, _lodashEs.mapValues)(data, function (value) {
+    return value === null ? "" : value;
+  });
+};
+
+/**
+ * Filters out table column keys from form data
+ * Table columns are prefixed with 'wm_table_column_'
+ */
+var filterTableColumns = exports.filterTableColumns = function filterTableColumns(data) {
+  return (0, _lodashEs.pickBy)(data, function (_, key) {
+    return !key.startsWith("wm_table_column_");
+  });
+};
+
+/**
+ * Transforms flat form data to nested object structure using dataKey paths.
+ * Handles PREFAB_CHILD scenario where child form data exists both at root and nested levels.
+ */
+var transformToNestedObject = exports.transformToNestedObject = function transformToNestedObject(data, formfields, formName) {
+  if (!data || (0, _typeof2["default"])(data) !== "object") return {};
+  var result = {};
+  var dataKeys = (0, _lodashEs.keys)(data);
+
+  // Identify child form keys (plain objects without field registration)
+  var childFormKeys = new Set((0, _lodashEs.filter)(dataKeys, function (key) {
+    var fieldInfo = formfields["".concat(formName, ".").concat(key)];
+    return !fieldInfo && (0, _lodashEs.isPlainObject)(data[key]);
+  }));
+
+  // Find nested paths for child form keys (maps child key → parent.child path)
+  var childFormNestedPaths = new Map();
+  if (childFormKeys.size > 0) {
+    (0, _lodashEs.forEach)(dataKeys, function (parentKey) {
+      var parentValue = data[parentKey];
+      if ((0, _lodashEs.isPlainObject)(parentValue)) {
+        (0, _lodashEs.forEach)((0, _lodashEs.keys)(parentValue), function (nestedKey) {
+          if (childFormKeys.has(nestedKey) && nestedKey !== parentKey && (0, _lodashEs.isPlainObject)(data[nestedKey])) {
+            childFormNestedPaths.set(nestedKey, "".concat(parentKey, ".").concat(nestedKey));
+          }
+        });
+      }
+    });
+  }
+
+  // Transform each key to its target path
+  (0, _lodashEs.forEach)(dataKeys, function (key) {
+    var fieldInfo = formfields["".concat(formName, ".").concat(key)];
+    var nestedPath = childFormNestedPaths.get(key);
+    var transformedKey = nestedPath || (fieldInfo === null || fieldInfo === void 0 ? void 0 : fieldInfo.dataKey) || key;
+    var valueToSet = data[key];
+
+    // Remove stale nested child keys from parent objects
+    if ((0, _lodashEs.isPlainObject)(valueToSet) && childFormNestedPaths.size > 0) {
+      var staleKeys = (0, _lodashEs.filter)((0, _lodashEs.keys)(valueToSet), function (k) {
+        return childFormNestedPaths.has(k);
+      });
+      if (staleKeys.length > 0) {
+        valueToSet = (0, _lodashEs.omit)(valueToSet, staleKeys);
+      }
+    }
+    (0, _lodashEs.set)(result, transformedKey, valueToSet);
+  });
+  return result;
+};
+
+/**
+ * Checks if data contains any arrays that might need filtering
+ * Used to skip filterArraysByRenderedForms when no arrays exist
+ */
+var hasArrayData = exports.hasArrayData = function hasArrayData(data) {
+  if (!data || (0, _typeof2["default"])(data) !== "object") return false;
+  return (0, _lodashEs.some)(data, Array.isArray);
+};
+
+/**
+ * Generic filter for array items based on a predicate function
+ */
+var filterArrayItems = function filterArrayItems(items, shouldIncludeKey) {
+  return items.map(function (item) {
+    if (!item || (0, _typeof2["default"])(item) !== "object" || Array.isArray(item)) return item;
+    return (0, _lodashEs.pickBy)(item, shouldIncludeKey);
+  });
+};
+
+/**
+ * Finds child form field names for array filtering.
+ * Returns null if no child form found (no filtering needed).
+ */
+var getChildFormFieldNames = function getChildFormFieldNames(arrayKey, widgets) {
+  if (!widgets) return null;
+  var childForm = (0, _lodashEs.find)(Object.entries(widgets), function (_ref) {
+    var _ref2 = (0, _slicedToArray2["default"])(_ref, 2),
+      _ = _ref2[0],
+      widget = _ref2[1];
+    return (widget === null || widget === void 0 ? void 0 : widget.parentListName) === arrayKey && (widget === null || widget === void 0 ? void 0 : widget.parentForm);
+  });
+  if (!childForm) return null;
+  var _ref3 = childForm,
+    _ref4 = (0, _slicedToArray2["default"])(_ref3, 2),
+    childFormName = _ref4[0],
+    childWidget = _ref4[1];
+  var parentFormfields = (0, _lodashEs.get)(widgets, [childWidget.parentForm, "formfields"]);
+  if (!parentFormfields || (0, _typeof2["default"])(parentFormfields) !== "object") return null;
+  var prefix = "".concat(childFormName, ".");
+  var fieldNames = new Set();
+  (0, _lodashEs.keys)(parentFormfields).forEach(function (key) {
+    if (!key.includes("_formWidget") && key.startsWith(prefix)) {
+      var fieldName = key.substring(prefix.length);
+      if (fieldName) fieldNames.add(fieldName);
+    }
+  });
+  return fieldNames.size > 0 ? fieldNames : null;
+};
+
+/**
+ * Filters arrays to only include items that have rendered child forms in the DOM.
+ * Also strips nested sibling arrays and dataset-only fields from array items.
+ *
+ * Optimized: Returns data unchanged if no arrays exist or no widgets provided.
+ */
+var filterArraysByRenderedForms = exports.filterArraysByRenderedForms = function filterArraysByRenderedForms(data, widgets) {
+  if (!widgets || !data || !hasArrayData(data)) return data;
+
+  // Collect root-level array keys managed by forms
+  var rootArrayKeys = new Set((0, _lodashEs.filter)((0, _lodashEs.keys)(data), function (key) {
+    return Array.isArray(data[key]) && widgets[key];
+  }));
+  return (0, _lodashEs.mapValues)(data, function (value, key) {
+    if (!Array.isArray(value) || !widgets[key]) return value;
+    var _widgets$key = widgets[key],
+      $index = _widgets$key.$index,
+      listItems = _widgets$key.listItems;
+    var renderedCount = $index !== undefined && $index >= 0 ? $index + 1 : (listItems === null || listItems === void 0 ? void 0 : listItems.length) !== undefined && listItems.length >= 0 ? listItems.length : undefined;
+    var filtered = renderedCount !== undefined ? value.slice(0, renderedCount) : value;
+
+    // Strip nested sibling arrays
+    if (rootArrayKeys.size > 0) {
+      filtered = filterArrayItems(filtered, function (k, v) {
+        return !(Array.isArray(v) && rootArrayKeys.has(k));
+      });
+    }
+
+    // Filter to only registered form fields (wizard → list → form scenario)
+    var fieldNames = getChildFormFieldNames(key, widgets);
+    if (fieldNames) {
+      filtered = filterArrayItems(filtered, function (k) {
+        return fieldNames.has(k);
+      });
+    }
+    return filtered;
+  });
+};
+
+/**
+ * Merges form data with additional data from formDataref
+ */
+var mergeWithFormDataRef = exports.mergeWithFormDataRef = function mergeWithFormDataRef(data, formDataref) {
+  if (!formDataref) return data;
+  return _objectSpread(_objectSpread({}, data), (0, _lodashEs.mapValues)((0, _lodashEs.pickBy)(formDataref, function (_, key) {
+    return formDataref.hasOwnProperty(key);
+  }), function (val) {
+    return val || [];
+  }));
+};
+
+/**
+ * Transforms form data to combine min/max values for range filters
+ */
+var transformRangeFilterData = exports.transformRangeFilterData = function transformRangeFilterData(data) {
+  var maxWidgetKeys = (0, _lodashEs.filter)((0, _lodashEs.keys)(data), function (key) {
+    return key.endsWith("_maxWidget");
+  });
+  return _objectSpread(_objectSpread({}, (0, _lodashEs.omit)(data, maxWidgetKeys)), (0, _lodashEs.mapValues)((0, _lodashEs.pickBy)((0, _lodashEs.mapValues)(maxWidgetKeys, function (maxKey) {
+    var baseKey = maxKey.replace("_maxWidget", "");
+    var min = data[baseKey];
+    var max = data[maxKey];
+    var processedMin = min !== undefined && min !== "" && min !== null ? min : undefined;
+    var processedMax = max !== undefined && max !== "" && max !== null ? max : undefined;
+    if (processedMin !== undefined || processedMax !== undefined) {
+      return {
+        key: baseKey,
+        value: {
+          minValue: processedMin,
+          maxValue: processedMax,
+          min: processedMin,
+          max: processedMax
+        }
+      };
+    }
+    return null;
+  }), function (val) {
+    return val !== null;
+  }), function (val) {
+    return val.value;
+  }));
+};
+
+// ============================================================================
+// Listener/Widget Helper Functions
+// ============================================================================
+
+/**
+ * Safely get widget data for a specific form from the listener context
+ * Does not trigger re-renders when used outside dependency arrays
+ */
+var getWidgetFormData = exports.getWidgetFormData = function getWidgetFormData(listener, formName) {
+  if (!formName || !(listener !== null && listener !== void 0 && listener.Widgets)) return undefined;
+  return listener.Widgets[formName];
+};
+
+/**
+ * Safely set formdata on the widget registry
+ * Treats this as an imperative side effect - should not be in dependency arrays
+ */
+var setWidgetFormData = exports.setWidgetFormData = function setWidgetFormData(listener, formName, formdata) {
+  var _listener$Widgets;
+  if (formName && listener !== null && listener !== void 0 && (_listener$Widgets = listener.Widgets) !== null && _listener$Widgets !== void 0 && _listener$Widgets[formName]) {
+    listener.Widgets[formName].formdata = formdata;
+  }
+};
+
+/**
+ * Get form fields from widget registry
+ */
+var getWidgetFormFields = exports.getWidgetFormFields = function getWidgetFormFields(listener, formName) {
+  var _listener$Widgets$for;
+  if (!formName || !(listener !== null && listener !== void 0 && listener.Widgets)) return undefined;
+  return (_listener$Widgets$for = listener.Widgets[formName]) === null || _listener$Widgets$for === void 0 ? void 0 : _listener$Widgets$for.formfields;
+};
+
+/**
+ * Set validation messages on the widget registry
+ */
+var setWidgetValidationMessages = exports.setWidgetValidationMessages = function setWidgetValidationMessages(listener, formName, messages) {
+  var _listener$Widgets2;
+  if (formName && listener !== null && listener !== void 0 && (_listener$Widgets2 = listener.Widgets) !== null && _listener$Widgets2 !== void 0 && _listener$Widgets2[formName]) {
+    listener.Widgets[formName].validationMessages = messages;
+  }
+};
+
+/**
+ * Register a child field in the parent form's widget registry
+ */
+var registerChildFieldInWidget = exports.registerChildFieldInWidget = function registerChildFieldInWidget(listener, formName, data) {
+  var _listener$Widgets3;
+  if (!formName || !(listener !== null && listener !== void 0 && (_listener$Widgets3 = listener.Widgets) !== null && _listener$Widgets3 !== void 0 && _listener$Widgets3[formName])) return;
+  var formKey = data.formKey,
+    fieldName = data.fieldName,
+    widget = data.widget;
+  var parentFormContext = listener.Widgets[formName];
+  parentFormContext.formfields = parentFormContext.formfields || {};
+  parentFormContext.formWidgets = parentFormContext.formWidgets || {};
+  parentFormContext.formfields[formKey] = widget;
+  parentFormContext.formWidgets[fieldName] = widget;
+  parentFormContext.formfields["".concat(fieldName, "_formWidget")] = widget;
+  parentFormContext.formWidgets["".concat(fieldName, "_formWidget")] = widget;
+};

package/components/data/form/dynamic-fields/constant.d.ts

@@ -0,0 +1 @@
+export declare const COMPONENT_MAP: Record<string, React.ComponentType<any>>;

package/components/data/form/dynamic-fields/constant.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.COMPONENT_MAP = void 0;
+var _text = _interopRequireDefault(require("../../../input/text"));
+var _textarea = _interopRequireDefault(require("../../../input/textarea"));
+var _number = _interopRequireDefault(require("../../../input/number"));
+var _currency = _interopRequireDefault(require("../../../input/currency"));
+var _select = _interopRequireDefault(require("../../../input/select"));
+var _slider = _interopRequireDefault(require("../../../input/slider"));
+var _rating = _interopRequireDefault(require("../../../input/rating"));
+var _checkbox = _interopRequireDefault(require("../../../input/default/checkbox"));
+var _checkboxset = _interopRequireDefault(require("../../../input/default/checkboxset"));
+var _radioset = _interopRequireDefault(require("../../../input/default/radioset"));
+var _switch = _interopRequireDefault(require("../../../input/default/switch"));
+var _date = _interopRequireDefault(require("../../../input/epoch/date"));
+var _datetime = _interopRequireDefault(require("../../../input/epoch/datetime"));
+var _time = _interopRequireDefault(require("../../../input/epoch/time"));
+var _chips = _interopRequireDefault(require("../../../input/chips"));
+var _colorPicker = _interopRequireDefault(require("../../../input/color-picker"));
+var _fileupload = _interopRequireDefault(require("../../../input/fileupload"));
+var _upload = _interopRequireDefault(require("../../../input/upload"));
+var _calendar = _interopRequireDefault(require("../../../input/calendar"));
+// Default input components
+
+// Date/Time components
+
+// Other input components
+
+var COMPONENT_MAP = exports.COMPONENT_MAP = {
+  text: _text["default"],
+  textarea: _textarea["default"],
+  number: _number["default"],
+  currency: _currency["default"],
+  select: _select["default"],
+  slider: _slider["default"],
+  rating: _rating["default"],
+  checkbox: _checkbox["default"],
+  checkboxset: _checkboxset["default"],
+  radioset: _radioset["default"],
+  "switch": _switch["default"],
+  date: _date["default"],
+  datetime: _datetime["default"],
+  time: _time["default"],
+  chips: _chips["default"],
+  colorpicker: _colorPicker["default"],
+  fileupload: _fileupload["default"],
+  upload: _upload["default"],
+  calendar: _calendar["default"]
+};

package/components/data/form/dynamic-fields/index.d.ts

@@ -0,0 +1,2 @@
+import { DynamicFormProps } from "./props";
+export default function DynamicForm(props: DynamicFormProps): import("react/jsx-runtime").JSX.Element;

package/components/data/form/dynamic-fields/index.js

@@ -0,0 +1,167 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = DynamicForm;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _isArray = _interopRequireDefault(require("lodash-es/isArray"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _formContext = require("../form-context");
+var _text = _interopRequireDefault(require("../../../input/text"));
+var _layoutGrid = _interopRequireDefault(require("../../../container/layout-grid"));
+var _gridRow = _interopRequireDefault(require("../../../container/layout-grid/grid-row"));
+var _gridColumn = _interopRequireDefault(require("../../../container/layout-grid/grid-column"));
+var _label = _interopRequireDefault(require("../../../basic/label"));
+var _formField = _interopRequireDefault(require("../form-field"));
+var _utils = require("./utils");
+var _constant = require("./constant");
+var _excluded = ["class"];
+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" != _typeof(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; } // Form context
+// Input components
+// Layout components
+// Basic components
+// Form field wrapper
+// Import types
+// Default CSS classes
+var DEFAULT_FIELD_CLASS = "app-dynamic-form-field";
+function DynamicForm(props) {
+  var metadata = props.metadata,
+    listener = props.listener,
+    _props$layout = props.layout,
+    layout = _props$layout === void 0 ? "1-column" : _props$layout,
+    _props$noOfColumns = props.noOfColumns,
+    noOfColumns = _props$noOfColumns === void 0 ? 1 : _props$noOfColumns,
+    _props$isHorizontal = props.isHorizontal,
+    isHorizontal = _props$isHorizontal === void 0 ? false : _props$isHorizontal,
+    _props$name = props.name,
+    name = _props$name === void 0 ? "dynamicForm" : _props$name,
+    formRef = props.formRef,
+    onBeforeRender = props.onBeforeRender;
+  var formContext = (0, _formContext.useFormContext)();
+  var _ref = formContext || {},
+    captionposition = _ref.captionposition;
+  var metadataRef = (0, _react.useRef)(metadata);
+  (0, _react.useEffect)(function () {
+    if (onBeforeRender) {
+      var data = onBeforeRender(metadata, props);
+      if (data) {
+        metadataRef.current = (0, _utils.updateMetadata)(data, listener) || metadata;
+      }
+    } else metadataRef.current = metadata;
+  }, [metadata, onBeforeRender]);
+
+  // Return null if fields is not an array or empty
+  if (!(0, _isArray["default"])(metadataRef.current) || metadataRef.current.length === 0) {
+    return null;
+  }
+
+  // Calculate column width based on layout
+  var getColumnWidth = function getColumnWidth(fieldColumnWidth) {
+    if (fieldColumnWidth) return fieldColumnWidth;
+
+    // Calculate based on layout
+    var columns = layout === "custom" ? noOfColumns : parseInt(layout.split("-")[0]);
+    return Math.floor(12 / columns);
+  };
+
+  // Render individual form field
+  var renderFormField = function renderFormField(field) {
+    var ComponentToRender = _constant.COMPONENT_MAP[field.widget] || _text["default"];
+
+    // Prepare field props
+    var fieldProps = _objectSpread(_objectSpread({}, field), {}, {
+      listener: listener,
+      captionposition: isHorizontal ? "horizontal" : captionposition
+    }, formContext && {
+      formContext: formContext,
+      onChangeHandler: formContext.onChangeHandler
+    });
+    var className = fieldProps["class"],
+      restProps = (0, _objectWithoutProperties2["default"])(fieldProps, _excluded);
+    return __jsx(ComponentToRender, (0, _extends2["default"])({}, restProps, {
+      className: className || fieldProps.className
+    }));
+  };
+
+  // Render form field with label using FormField wrapper
+  var renderFormFieldWithWrapper = function renderFormFieldWithWrapper(field) {
+    var columnWidth = getColumnWidth(field.columnwidth);
+    return __jsx(_gridColumn["default"], {
+      key: field.name,
+      name: "".concat(field.name, "Column"),
+      columnwidth: columnWidth,
+      listener: listener
+    }, __jsx(_formField["default"], (0, _extends2["default"])({}, field, {
+      name: field.name,
+      field: "true",
+      listener: listener,
+      className: (0, _clsx["default"])(DEFAULT_FIELD_CLASS, field.className, " app-textbox", formRef === null || formRef === void 0 ? void 0 : formRef.itemsPerRow),
+      formRef: formRef,
+      required: field.required === true || String(field.required) === "true",
+      renderFormFields: function renderFormFields($formField) {
+        return __jsx(_react["default"].Fragment, null, __jsx(_label["default"], {
+          name: "".concat($formField.name, "_formLabel"),
+          caption: $formField.displayname,
+          required: $formField.required,
+          listener: listener,
+          className: (0, _clsx["default"])("app-label control-label formfield-label", (formRef === null || formRef === void 0 ? void 0 : formRef.captionCls) || ""),
+          htmlFor: $formField.name
+        }), renderFormField(_objectSpread(_objectSpread(_objectSpread({}, field), $formField), {}, {
+          datavalue: $formField.datavalue || $formField.defaultvalue,
+          name: $formField.name + "_formWidget",
+          className: (0, _clsx["default"])(field.className, (formRef === null || formRef === void 0 ? void 0 : formRef.widgetCls) || "")
+        })));
+      }
+    })));
+  };
+
+  // Group fields into rows based on column layout
+  var groupFieldsIntoRows = function groupFieldsIntoRows(fields) {
+    var columns = layout === "custom" ? noOfColumns : parseInt(layout.split("-")[0]);
+    var rows = [];
+    for (var i = 0; i < fields.length; i += columns) {
+      rows.push(fields.slice(i, i + columns));
+    }
+    return rows;
+  };
+
+  // Render fields in grid layout
+  var renderFieldsInGrid = function renderFieldsInGrid() {
+    if (layout === "1-column") {
+      // Single column layout - each field in its own row
+      return metadataRef.current.map(function (field) {
+        return __jsx(_gridRow["default"], {
+          key: field.name,
+          name: "".concat(field.name, "Row"),
+          listener: listener
+        }, renderFormFieldWithWrapper(field));
+      });
+    }
+
+    // Multi-column layout - group fields into rows
+    var fieldRows = groupFieldsIntoRows(metadataRef.current);
+    return fieldRows.map(function (row, rowIndex) {
+      return __jsx(_gridRow["default"], {
+        key: "row-".concat(rowIndex),
+        name: "dynamicFormRow".concat(rowIndex),
+        listener: listener
+      }, row.map(function (field) {
+        return renderFormFieldWithWrapper(field);
+      }));
+    });
+  };
+  return __jsx(_layoutGrid["default"], {
+    name: name,
+    listener: listener,
+    className: "dynamic-form-grid"
+  }, renderFieldsInGrid());
+}