@wavemaker-ai/react-runtime 1.0.0-rc.647469 → 1.0.0-rc.647499

package/types/index.d.ts

@@ -10,6 +10,7 @@ export interface PageContextState {
     Variables: Record<string, VariableState>;
     Actions: Record<string, any>;
     onReady: () => void;
+    pageReady: () => void;
     serviceDefinitions: Record<string, any>;
     baseUrl: string;
     [key: string]: any;

package/utils/attr.js

@@ -6,30 +6,87 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.removeInvalidAttributes = void 0;
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var INTERNAL_ATTRIBUTES = new Set(["clearSearch", "conditionalclass", "conditionalstyle", "dataset", "destroy", "eventCallback", "formfield", "forwardedRef", "inbound", "iswidget", "listener", "onHeaderclick", "onHeaderClick", "onLoad", "onDestroy", "onNavHeightChange", "onRender", "outbound", "prefab", "ref", "showindevice", "styles", "viewParent"]);
+var SAFE_ATTRIBUTES = new Set(["accessKey", "autoCapitalize", "autoComplete", "autoCorrect", "autoFocus", "capture", "cellPadding", "cellSpacing", "charSet", "className", "cols", "colSpan", "content", "contentEditable", "controls", "coords", "crossOrigin", "dateTime", "default", "defaultChecked", "defaultValue", "dir", "disabled", "download", "draggable", "encType", "form", "height", "hidden", "hint", "href", "hrefLang", "htmlFor", "id", "inputMode", "label", "lang", "list", "max", "maxLength", "media", "method", "min", "minLength", "multiple", "name", "noValidate", "pattern", "placeholder", "readOnly", "rel", "required", "role", "rows", "rowSpan", "selected", "slot", "spellCheck", "src", "step", "style", "tabIndex", "target", "title", "translate", "type", "value", "width"]);
+var VALID_DOM_EVENT_HANDLERS = new Set(["onAbort", "onAnimationEnd", "onAnimationIteration", "onAnimationStart", "onAuxClick", "onBeforeInput", "onBlur", "onCanPlay", "onCanPlayThrough", "onChange", "onClick", "onCompositionEnd", "onCompositionStart", "onCompositionUpdate", "onContextMenu", "onCopy", "onCut", "onDoubleClick", "onDrag", "onDragEnd", "onDragEnter", "onDragExit", "onDragLeave", "onDragOver", "onDragStart", "onDrop", "onDurationChange", "onEmptied", "onEncrypted", "onEnded", "onError", "onFocus", "onGotPointerCapture", "onInput", "onInvalid", "onKeyDown", "onKeyPress", "onKeyUp", "onLoad", "onLoadedData", "onLoadedMetadata", "onLoadStart", "onLostPointerCapture", "onMouseDown", "onMouseEnter", "onMouseLeave", "onMouseMove", "onMouseOut", "onMouseOver", "onMouseUp", "onPaste", "onPause", "onPlay", "onPlaying", "onPointerCancel", "onPointerDown", "onPointerEnter", "onPointerLeave", "onPointerMove", "onPointerOut", "onPointerOver", "onPointerUp", "onProgress", "onRateChange", "onReset", "onScroll", "onSeeked", "onSeeking", "onSelect", "onStalled", "onSubmit", "onSuspend", "onTimeUpdate", "onTouchCancel", "onTouchEnd", "onTouchMove", "onTouchStart", "onTransitionEnd", "onVolumeChange", "onWaiting", "onWheel"]);
+
+// Maps lowercase HTML attribute names to their React camelCase equivalents.
+// Lowercase attributes that appear here are normalized on the way out; those
+// NOT in this map but still all-lowercase are passed through as-is (custom /
+// data-like attributes handled elsewhere).
+var LOWERCASE_TO_REACT_ATTR = {
+  autocomplete: "autoComplete",
+  autocapitalize: "autoCapitalize",
+  autocorrect: "autoCorrect",
+  autofocus: "autoFocus",
+  accesskey: "accessKey",
+  classname: "className",
+  colspan: "colSpan",
+  contenteditable: "contentEditable",
+  crossorigin: "crossOrigin",
+  datetime: "dateTime",
+  defaultchecked: "defaultChecked",
+  defaultvalue: "defaultValue",
+  enctype: "encType",
+  hreflang: "hrefLang",
+  htmlfor: "htmlFor",
+  inputmode: "inputMode",
+  maxlength: "maxLength",
+  minlength: "minLength",
+  novalidate: "noValidate",
+  readonly: "readOnly",
+  rowspan: "rowSpan",
+  spellcheck: "spellCheck",
+  tabindex: "tabIndex"
+};
+var isLowercaseAttribute = function isLowercaseAttribute(key) {
+  return key === key.toLowerCase();
+};
+var isSafeAttributeName = function isSafeAttributeName(key) {
+  return SAFE_ATTRIBUTES.has(key) || key.startsWith("aria-") || key.startsWith("data-") || isLowercaseAttribute(key) || VALID_DOM_EVENT_HANDLERS.has(key);
+};
+var isObjectLikeString = function isObjectLikeString(value) {
+  var trimmed = value.trim();
+  if (/^\[object\s*,?\s*object\]$/i.test(trimmed)) {
+    return true;
+  }
+  if (trimmed.startsWith("{") && trimmed.endsWith("}") || trimmed.startsWith("[") && trimmed.endsWith("]")) {
+    try {
+      var parsed = JSON.parse(trimmed);
+      return (0, _typeof2["default"])(parsed) === "object" && parsed !== null;
+    } catch (e) {
+      return false;
+    }
+  }
+  return false;
+};
+var shouldStringifyBooleanAttribute = function shouldStringifyBooleanAttribute(key, value) {
+  return typeof value === "boolean" && isLowercaseAttribute(key) && !SAFE_ATTRIBUTES.has(key) && !key.startsWith("aria-") && !key.startsWith("data-");
+};
 var removeInvalidAttributes = exports.removeInvalidAttributes = function removeInvalidAttributes(attributes, explicitRemoveAttributes) {
   var filteredAttributes = {};
   Object.keys(attributes).forEach(function (key) {
-    if (explicitRemoveAttributes !== null && explicitRemoveAttributes !== void 0 && explicitRemoveAttributes.includes(key)) {
+    var _LOWERCASE_TO_REACT_A;
+    if (explicitRemoveAttributes !== null && explicitRemoveAttributes !== void 0 && explicitRemoveAttributes.includes(key) || INTERNAL_ATTRIBUTES.has(key) || !isSafeAttributeName(key)) {
       return;
     }
     var value = attributes[key];
     if (Array.isArray(value) || (0, _typeof2["default"])(value) === "object" && value !== null) {
       return;
     }
-    if (typeof value === "string") {
-      var trimmed = value.trim();
-      if (trimmed.startsWith("{") && trimmed.endsWith("}") || trimmed.startsWith("[") && trimmed.endsWith("]")) {
-        try {
-          var parsed = JSON.parse(value);
-          if ((0, _typeof2["default"])(parsed) === "object" && parsed !== null) {
-            return;
-          }
-        } catch (e) {
-          // invalid json, ignore
-        }
-      }
+    if (typeof value === "function" && !VALID_DOM_EVENT_HANDLERS.has(key)) {
+      return;
+    }
+    if (typeof value === "string" && value.trim() === "") {
+      return;
+    }
+    if (typeof value === "string" && isObjectLikeString(value)) {
+      return;
     }
-    filteredAttributes[key] = value;
+    // Normalize lowercase HTML attribute names to their React camelCase form
+    // to prevent "Invalid DOM property" warnings (e.g. autocomplete → autoComplete).
+    var normalizedKey = (_LOWERCASE_TO_REACT_A = LOWERCASE_TO_REACT_ATTR[key]) !== null && _LOWERCASE_TO_REACT_A !== void 0 ? _LOWERCASE_TO_REACT_A : key;
+    filteredAttributes[normalizedKey] = shouldStringifyBooleanAttribute(normalizedKey, value) ? value.toString() : value;
   });
   return filteredAttributes;
 };

package/utils/custom-expression/index.d.ts

@@ -0,0 +1,43 @@
+import { transformMarkup } from "@wavemaker-ai/react-codegen/transpiler";
+import type { CustomExpressionComponent, TransformedMarkupInput } from "./parser";
+import { parseCustomExpressionToJsx } from "./parser";
+export type { CustomExpressionComponent, TransformedMarkupInput } from "./parser";
+export { parseCustomExpressionToJsx } from "./parser";
+/** Re-export for callers that need the same WaveMaker transpiler the table uses. */
+export { transformMarkup };
+/** Column-like objects that expose WaveMaker `customExpression` markup per field key. */
+export type CustomExpressionColumnSource = Record<string, {
+    customExpression?: string | undefined;
+}>;
+/**
+ * WaveMaker transpiler often emits `(row) => …`. Normalize arrow params so the row cell
+ * binding stays consistent with compiled JSX.
+ */
+export declare function normalizeTransformedMarkupRowBinding(transformedMarkup: TransformedMarkupInput): TransformedMarkupInput;
+/**
+ * Pass column custom-expression markup and get a row renderer for `customColumns` /
+ * `customExpressionColumns` state. Uses codegen `transformMarkup` unless overridden.
+ */
+export declare function compileCustomExpressionMarkup(markup: string, options: {
+    listener: unknown;
+    transformMarkup?: (markup: string) => TransformedMarkupInput;
+    parse?: typeof parseCustomExpressionToJsx;
+}): Promise<CustomExpressionComponent>;
+/**
+ * Stable fingerprint of all custom markup strings (sorted keys) — use for memo deps / merge dedupe.
+ */
+export declare function buildCustomExpressionSignature(columnSource: CustomExpressionColumnSource): string;
+export type BuildCustomExpressionComponentsMapOptions = {
+    columnSource: CustomExpressionColumnSource;
+    /** Listener / fragment passed through to the parser (e.g. Studio listener). */
+    listener: unknown;
+    /** Defaults to `@wavemaker-ai/react-codegen/transpiler` `transformMarkup`. */
+    transformMarkup?: (markup: string) => TransformedMarkupInput;
+    /** Override for tests or alternate parsers. */
+    parseCustomExpressionToJsx?: typeof parseCustomExpressionToJsx;
+};
+/**
+ * Parses every column on `columnSource` that defines `customExpression` into render callables.
+ * Store the result in table `customColumns` (or any map of column id → row renderer).
+ */
+export declare function buildCustomExpressionComponentsMap(options: BuildCustomExpressionComponentsMapOptions): Promise<Record<string, CustomExpressionComponent>>;

package/utils/custom-expression/index.js

@@ -0,0 +1,161 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildCustomExpressionComponentsMap = buildCustomExpressionComponentsMap;
+exports.buildCustomExpressionSignature = buildCustomExpressionSignature;
+exports.compileCustomExpressionMarkup = compileCustomExpressionMarkup;
+exports.normalizeTransformedMarkupRowBinding = normalizeTransformedMarkupRowBinding;
+Object.defineProperty(exports, "parseCustomExpressionToJsx", {
+  enumerable: true,
+  get: function get() {
+    return _parser.parseCustomExpressionToJsx;
+  }
+});
+Object.defineProperty(exports, "transformMarkup", {
+  enumerable: true,
+  get: function get() {
+    return _transpiler.transformMarkup;
+  }
+});
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _transpiler = require("@wavemaker-ai/react-codegen/transpiler");
+var _parser = require("./parser");
+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; } /** Re-export for callers that need the same WaveMaker transpiler the table uses. */
+/** Column-like objects that expose WaveMaker `customExpression` markup per field key. */
+
+/**
+ * WaveMaker transpiler often emits `(row) => …`. Normalize arrow params so the row cell
+ * binding stays consistent with compiled JSX.
+ */
+function normalizeTransformedMarkupRowBinding(transformedMarkup) {
+  transformedMarkup.markup = transformedMarkup.markup.replace(/\(([^)]*)\)\s*=>/g, function (_match, params) {
+    var cleaned = params.split(",").map(function (p) {
+      return p.trim();
+    }).filter(function (p) {
+      return p !== "row";
+    }).join(", ");
+    return "(".concat(cleaned, ") =>");
+  });
+  return transformedMarkup;
+}
+
+/**
+ * Pass column custom-expression markup and get a row renderer for `customColumns` /
+ * `customExpressionColumns` state. Uses codegen `transformMarkup` unless overridden.
+ */
+function compileCustomExpressionMarkup(_x, _x2) {
+  return _compileCustomExpressionMarkup.apply(this, arguments);
+}
+/**
+ * Stable fingerprint of all custom markup strings (sorted keys) — use for memo deps / merge dedupe.
+ */
+function _compileCustomExpressionMarkup() {
+  _compileCustomExpressionMarkup = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(markup, options) {
+    var _options$parse, _options$transformMar;
+    var parse, tm, transformedMarkup;
+    return _regenerator["default"].wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          parse = (_options$parse = options.parse) !== null && _options$parse !== void 0 ? _options$parse : _parser.parseCustomExpressionToJsx;
+          tm = (_options$transformMar = options.transformMarkup) !== null && _options$transformMar !== void 0 ? _options$transformMar : _transpiler.transformMarkup;
+          transformedMarkup = normalizeTransformedMarkupRowBinding(tm(markup));
+          return _context.abrupt("return", parse(transformedMarkup, options.listener));
+        case 4:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return _compileCustomExpressionMarkup.apply(this, arguments);
+}
+function buildCustomExpressionSignature(columnSource) {
+  try {
+    return Object.keys(columnSource).filter(function (key) {
+      var _columnSource$key;
+      return (_columnSource$key = columnSource[key]) === null || _columnSource$key === void 0 ? void 0 : _columnSource$key.customExpression;
+    }).map(function (key) {
+      return "".concat(key, "\0").concat(String(columnSource[key].customExpression));
+    }).sort().join("\x1F");
+  } catch (_unused) {
+    return "";
+  }
+}
+/**
+ * Parses every column on `columnSource` that defines `customExpression` into render callables.
+ * Store the result in table `customColumns` (or any map of column id → row renderer).
+ */
+function buildCustomExpressionComponentsMap(_x3) {
+  return _buildCustomExpressionComponentsMap.apply(this, arguments);
+}
+function _buildCustomExpressionComponentsMap() {
+  _buildCustomExpressionComponentsMap = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3(options) {
+    var columnSource, transformMarkupOpt, listener, _options$parseCustomE, parseFn, tm, keys, results, out, _iterator, _step, _step$value, key, component;
+    return _regenerator["default"].wrap(function _callee3$(_context3) {
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          columnSource = options.columnSource, transformMarkupOpt = options.transformMarkup, listener = options.listener, _options$parseCustomE = options.parseCustomExpressionToJsx, parseFn = _options$parseCustomE === void 0 ? _parser.parseCustomExpressionToJsx : _options$parseCustomE;
+          tm = transformMarkupOpt !== null && transformMarkupOpt !== void 0 ? transformMarkupOpt : _transpiler.transformMarkup;
+          keys = Object.keys(columnSource).filter(function (key) {
+            return columnSource[key].customExpression;
+          });
+          if (!(keys.length === 0)) {
+            _context3.next = 5;
+            break;
+          }
+          return _context3.abrupt("return", {});
+        case 5:
+          _context3.next = 7;
+          return Promise.all(keys.map(/*#__PURE__*/function () {
+            var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2(key) {
+              var transformedMarkup, component;
+              return _regenerator["default"].wrap(function _callee2$(_context2) {
+                while (1) switch (_context2.prev = _context2.next) {
+                  case 0:
+                    transformedMarkup = normalizeTransformedMarkupRowBinding(tm(columnSource[key].customExpression));
+                    _context2.next = 3;
+                    return parseFn(transformedMarkup, listener);
+                  case 3:
+                    component = _context2.sent;
+                    return _context2.abrupt("return", {
+                      key: key,
+                      component: component
+                    });
+                  case 5:
+                  case "end":
+                    return _context2.stop();
+                }
+              }, _callee2);
+            }));
+            return function (_x4) {
+              return _ref.apply(this, arguments);
+            };
+          }()));
+        case 7:
+          results = _context3.sent;
+          out = {};
+          _iterator = _createForOfIteratorHelper(results);
+          try {
+            for (_iterator.s(); !(_step = _iterator.n()).done;) {
+              _step$value = _step.value, key = _step$value.key, component = _step$value.component;
+              out[key] = component;
+            }
+          } catch (err) {
+            _iterator.e(err);
+          } finally {
+            _iterator.f();
+          }
+          return _context3.abrupt("return", out);
+        case 12:
+        case "end":
+          return _context3.stop();
+      }
+    }, _callee3);
+  }));
+  return _buildCustomExpressionComponentsMap.apply(this, arguments);
+}

package/utils/custom-expression/parser.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+export interface TransformedMarkupInput {
+    markup: string;
+    components?: Record<string, unknown>;
+    partials?: string[];
+    prefabs?: string[];
+    imports: Array<{
+        name: string;
+        as?: string;
+        from: string;
+        lazy?: boolean;
+    }>;
+}
+export type CustomExpressionComponent = (rowData: any) => React.ReactNode;
+export declare function parseCustomExpressionToJsx(transformedMarkup: TransformedMarkupInput, fragment: any): Promise<CustomExpressionComponent>;

package/utils/custom-expression/parser.js

@@ -0,0 +1,208 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.parseCustomExpressionToJsx = parseCustomExpressionToJsx;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _construct2 = _interopRequireDefault(require("@babel/runtime/helpers/construct"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireDefault(require("react"));
+var _sucrase = require("sucrase");
+var _registry = require("@wavemaker-ai/react-runtime/runtime-dynamic/registry");
+var _util = require("@wavemaker-ai/react-runtime/core/util");
+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 UTIL_SCOPE = {
+  formatMessage: _util.formatMessage,
+  _get: _util._get,
+  toNumber: _util.toNumber
+};
+
+/** WaveMaker column expressions are often `(row) => <WmLabel … />`. Strip that so we compile JSX only (same idea as markup-transpiler wrapping fragment content). */
+function stripLeadingArrow(markup) {
+  var trimmed = markup.trim();
+  var arrow = trimmed.match(/^\([^)]*\)\s*=>\s*/);
+  return arrow ? trimmed.slice(arrow[0].length).trim() : trimmed;
+}
+function extractMarkupComponents(markup) {
+  var matches = markup.match(/\bWm[A-Z]\w*/g);
+  return matches ? (0, _toConsumableArray2["default"])(new Set(matches)) : [];
+}
+
+/**
+ * Align with runtime-dynamic `markup-transpiler` resolveScope: React, fragment,
+ * row (cell), Widgets/Variables from fragment, imported + inferred Wm* components, utils.
+ */
+function resolveCustomExpressionScope(imports, fragment, markupForInference) {
+  var fr = fragment;
+  var names = ["React", "fragment", "row", "Widgets", "Variables"];
+  var values = [_react["default"], fragment, undefined, fr === null || fr === void 0 ? void 0 : fr.Widgets, fr === null || fr === void 0 ? void 0 : fr.Variables];
+  var seen = new Set(names);
+  var _iterator = _createForOfIteratorHelper(imports),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var importDef = _step.value;
+      var binding = importDef.as || importDef.name;
+      if (seen.has(binding)) continue;
+      var component = (0, _registry.getComponent)(importDef.name);
+      if (component) {
+        seen.add(binding);
+        names.push(binding);
+        values.push(component);
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  var _iterator2 = _createForOfIteratorHelper(extractMarkupComponents(markupForInference)),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var wmName = _step2.value;
+      if (seen.has(wmName)) continue;
+      var _component = (0, _registry.getComponent)(wmName);
+      if (_component) {
+        seen.add(wmName);
+        names.push(wmName);
+        values.push(_component);
+      }
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  for (var _i = 0, _Object$entries = Object.entries(UTIL_SCOPE); _i < _Object$entries.length; _i++) {
+    var _Object$entries$_i = (0, _slicedToArray2["default"])(_Object$entries[_i], 2),
+      name = _Object$entries$_i[0],
+      value = _Object$entries$_i[1];
+    if (!seen.has(name)) {
+      seen.add(name);
+      names.push(name);
+      values.push(value);
+    }
+  }
+  return {
+    names: names,
+    values: values
+  };
+}
+function compileJsxToRenderBody(jsxWrapped) {
+  var result = (0, _sucrase.transform)(jsxWrapped, {
+    transforms: ["typescript", "jsx"],
+    jsxRuntime: "classic",
+    production: true
+  });
+  return result.code || "";
+}
+var cache = new Map();
+function parseCustomExpressionToJsx(_x, _x2) {
+  return _parseCustomExpressionToJsx.apply(this, arguments);
+}
+function _parseCustomExpressionToJsx() {
+  _parseCustomExpressionToJsx = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(transformedMarkup, fragment) {
+    var markup, _transformedMarkup$im, imports, jsxInner, jsxWrapped, compiledCode, fallback, fullCode, _resolveCustomExpress, names, templateValues, rowIdx, fragmentIdx, widgetsIdx, variablesIdx, _fallback, renderFn, _fallback2, stopPropagation, renderComponent;
+    return _regenerator["default"].wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          markup = transformedMarkup.markup, _transformedMarkup$im = transformedMarkup.imports, imports = _transformedMarkup$im === void 0 ? [] : _transformedMarkup$im;
+          if (markup !== null && markup !== void 0 && markup.trim()) {
+            _context.next = 3;
+            break;
+          }
+          return _context.abrupt("return", function () {
+            return null;
+          });
+        case 3:
+          if (!cache.has(markup)) {
+            _context.next = 5;
+            break;
+          }
+          return _context.abrupt("return", cache.get(markup));
+        case 5:
+          jsxInner = stripLeadingArrow(markup);
+          jsxWrapped = "function __render__() { return (<React.Fragment>".concat(jsxInner.trim() || "null", "</React.Fragment>); }");
+          _context.prev = 7;
+          compiledCode = compileJsxToRenderBody(jsxWrapped);
+          _context.next = 17;
+          break;
+        case 11:
+          _context.prev = 11;
+          _context.t0 = _context["catch"](7);
+          console.error("[customExpressionParser] Sucrase transform failed:", _context.t0);
+          fallback = function fallback() {
+            return null;
+          };
+          cache.set(markup, fallback);
+          return _context.abrupt("return", fallback);
+        case 17:
+          compiledCode = compiledCode.replace(/^["']use strict["'];?\s*/, "").replace(/\/\*#__PURE__\*\//g, "");
+          fullCode = "".concat(compiledCode, "\nreturn __render__();");
+          _resolveCustomExpress = resolveCustomExpressionScope(imports, fragment, "".concat(markup, "\n").concat(jsxInner)), names = _resolveCustomExpress.names, templateValues = _resolveCustomExpress.values;
+          rowIdx = names.indexOf("row");
+          fragmentIdx = names.indexOf("fragment");
+          widgetsIdx = names.indexOf("Widgets");
+          variablesIdx = names.indexOf("Variables");
+          if (!(rowIdx < 0)) {
+            _context.next = 29;
+            break;
+          }
+          console.error("[customExpressionParser] Internal error: row not in scope");
+          _fallback = function _fallback() {
+            return null;
+          };
+          cache.set(markup, _fallback);
+          return _context.abrupt("return", _fallback);
+        case 29:
+          _context.prev = 29;
+          renderFn = (0, _construct2["default"])(Function, (0, _toConsumableArray2["default"])(names).concat([fullCode]));
+          _context.next = 39;
+          break;
+        case 33:
+          _context.prev = 33;
+          _context.t1 = _context["catch"](29);
+          console.error("[customExpressionParser] Function compilation failed:", _context.t1);
+          _fallback2 = function _fallback2() {
+            return null;
+          };
+          cache.set(markup, _fallback2);
+          return _context.abrupt("return", _fallback2);
+        case 39:
+          stopPropagation = function stopPropagation(e) {
+            return e.stopPropagation();
+          };
+          renderComponent = function renderComponent(rowData) {
+            try {
+              var args = templateValues.slice();
+              args[rowIdx] = rowData;
+              var fr = fragment;
+              if (fragmentIdx >= 0) args[fragmentIdx] = fragment;
+              if (widgetsIdx >= 0) args[widgetsIdx] = fr === null || fr === void 0 ? void 0 : fr.Widgets;
+              if (variablesIdx >= 0) args[variablesIdx] = fr === null || fr === void 0 ? void 0 : fr.Variables;
+              return /*#__PURE__*/_react["default"].createElement("span", {
+                className: "custom-expr-wrapper",
+                onClick: stopPropagation
+              }, renderFn.apply(void 0, (0, _toConsumableArray2["default"])(args)));
+            } catch (err) {
+              console.error("[customExpressionParser] Render error:", err);
+              return null;
+            }
+          };
+          cache.set(markup, renderComponent);
+          return _context.abrupt("return", renderComponent);
+        case 43:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[7, 11], [29, 33]]);
+  }));
+  return _parseCustomExpressionToJsx.apply(this, arguments);
+}

package/utils/layoutsize-util.d.ts

@@ -0,0 +1 @@
+export declare function layoutSizeUtil(el: HTMLElement, widget?: string, height?: string): void;

package/utils/layoutsize-util.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.layoutSizeUtil = layoutSizeUtil;
+// alligening flexgrow, flexShrink,selfAlign and minWidth/minHeight to achieve the desired
+// auto layout behavior based on parent flex context and provided value (fill/hug/number).
+
+function applySize(el, key, nv) {
+  var parent = el.parentElement;
+  var parentStyle = parent ? getComputedStyle(parent) : null;
+  var isParentFlex = !!parentStyle && ["flex", "inline-flex"].includes(parentStyle.display);
+  var isMainAxis = false;
+  if (isParentFlex) {
+    var flexDir = parentStyle.flexDirection;
+    var isRow = ["row", "row-reverse"].includes(flexDir);
+    isMainAxis = key === "width" && isRow || key === "height" && !isRow;
+  }
+  var minKey = key === "width" ? "minWidth" : "minHeight";
+  if (nv === "fill") {
+    if (!isParentFlex) {
+      el.style[key] = "100%";
+    } else {
+      el.style[key] = "";
+      if (isMainAxis) {
+        el.style.flexGrow = "1";
+        el.style.flexShrink = "";
+        el.style[minKey] = "0";
+      } else {
+        el.style.alignSelf = "stretch";
+      }
+    }
+  } else {
+    if (nv === "hug") {
+      el.style[key] = "fit-content";
+    }
+    if (isParentFlex) {
+      if (isMainAxis) {
+        el.style.flexGrow = "";
+        el.style.flexShrink = "0";
+        el.style[minKey] = "";
+      } else {
+        el.style.alignSelf = "";
+      }
+    } else {
+      el.style.flexGrow = "";
+      el.style.flexShrink = "0";
+      el.style.alignSelf = "";
+      el.style[minKey] = "";
+    }
+  }
+}
+function layoutSizeUtil(el, widget, height) {
+  if (widget) applySize(el, "width", widget);
+  if (height) applySize(el, "height", height);
+}

package/utils/lib-error-skipper.d.ts

@@ -1,33 +1,11 @@
 /**
- * Utility to wrap all methods in a script object with jQuery error handling
- * This prevents jQuery usage from breaking the React application
- */
-/**
- * Configuration for unsupported libraries
- */
-interface LibraryConfig {
-    identifiers: string[];
-    errorMessage: string;
-    notificationMessage: string;
-}
-interface UnsupportedLibraries {
-    [key: string]: LibraryConfig;
-}
-/**
- * Checks if an error is related to jQuery usage
- * @param error - The error object to check
- * @returns true if the error is jQuery-related
+ * Wraps page/prefab script methods with error handling that detects
+ * unsupported library usage (e.g. jQuery) and surfaces all other errors
+ * with full context instead of swallowing them.
  */
 export declare const isJQueryError: (error: any) => boolean;
 interface AppContext {
     notifyApp?: (message: string, type: string) => void;
 }
-/**
- * Wraps all methods with unsupported library error handling
- * @param pageProxy - The page/prefab proxy object
- * @param appContext - App context for notifications
- * @param componentName - Name of component for logging
- * @param libraryConfig - Optional: specific libraries to check (default: all)
- */
-export declare const wrapWithThirdPartyErrorGuard: (pageProxy: Record<string, any>, appContext: AppContext | null | undefined, componentName: string, libraryConfig?: UnsupportedLibraries) => void;
+export declare const wrapWithThirdPartyErrorGuard: (pageProxy: Record<string, any>, appContext: AppContext | null | undefined, componentName: string) => void;
 export {};