@wavemaker-ai/react-runtime 1.0.0-rc.647502 → 1.0.0-rc.647565

package/runtime-dynamic/services/index.js

@@ -1,152 +1,48 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "ComponentType", {
-  enumerable: true,
-  get: function get() {
-    return _fragmentUrl.ComponentType;
-  }
-});
-Object.defineProperty(exports, "buildAddPageScript", {
-  enumerable: true,
-  get: function get() {
-    return _scriptExecutor.buildAddPageScript;
-  }
-});
-Object.defineProperty(exports, "clearAllCaches", {
-  enumerable: true,
-  get: function get() {
-    return _cache.clearAllCaches;
-  }
-});
-Object.defineProperty(exports, "clearComponentRefCache", {
-  enumerable: true,
-  get: function get() {
-    return _componentRefProvider.clearComponentRefCache;
-  }
-});
-Object.defineProperty(exports, "clearResourceCache", {
-  enumerable: true,
-  get: function get() {
-    return _resourceManager.clearResourceCache;
-  }
-});
-Object.defineProperty(exports, "clearVariablesCache", {
-  enumerable: true,
-  get: function get() {
-    return _variableTranspiler.clearVariablesCache;
-  }
-});
-Object.defineProperty(exports, "fetchResource", {
-  enumerable: true,
-  get: function get() {
-    return _resourceManager.fetchResource;
-  }
-});
-Object.defineProperty(exports, "getComponentFromCache", {
-  enumerable: true,
-  get: function get() {
-    return _cache.getComponentFromCache;
-  }
-});
-Object.defineProperty(exports, "getComponentRef", {
-  enumerable: true,
-  get: function get() {
-    return _componentRefProvider.getComponentRef;
-  }
-});
-Object.defineProperty(exports, "getFragmentFromCache", {
-  enumerable: true,
-  get: function get() {
-    return _cache.getFragmentFromCache;
-  }
-});
-Object.defineProperty(exports, "getFragmentUrl", {
-  enumerable: true,
-  get: function get() {
-    return _fragmentUrl.getFragmentUrl;
-  }
-});
-Object.defineProperty(exports, "getPrefabBaseUrl", {
-  enumerable: true,
-  get: function get() {
-    return _fragmentUrl.getPrefabBaseUrl;
-  }
-});
-Object.defineProperty(exports, "getPrefabConfigUrl", {
-  enumerable: true,
-  get: function get() {
-    return _fragmentUrl.getPrefabConfigUrl;
-  }
-});
-Object.defineProperty(exports, "getPrefabResourceUrl", {
-  enumerable: true,
-  get: function get() {
-    return _prefabResources.getPrefabResourceUrl;
-  }
-});
-Object.defineProperty(exports, "getScriptFromCache", {
-  enumerable: true,
-  get: function get() {
-    return _cache.getScriptFromCache;
-  }
-});
-Object.defineProperty(exports, "isPrefabSelfPreview", {
-  enumerable: true,
-  get: function get() {
-    return _fragmentUrl.isPrefabSelfPreview;
-  }
-});
-Object.defineProperty(exports, "loadAppExtensions", {
-  enumerable: true,
-  get: function get() {
-    return _appExtensionProvider.loadAppExtensions;
-  }
-});
-Object.defineProperty(exports, "removeComponentStyles", {
-  enumerable: true,
-  get: function get() {
-    return _cssScoping.removeComponentStyles;
-  }
-});
-Object.defineProperty(exports, "scopeComponentStyles", {
-  enumerable: true,
-  get: function get() {
-    return _cssScoping.scopeComponentStyles;
-  }
-});
-Object.defineProperty(exports, "setComponentInCache", {
-  enumerable: true,
-  get: function get() {
-    return _cache.setComponentInCache;
-  }
-});
-Object.defineProperty(exports, "setFragmentInCache", {
-  enumerable: true,
-  get: function get() {
-    return _cache.setFragmentInCache;
-  }
-});
-Object.defineProperty(exports, "setScriptInCache", {
-  enumerable: true,
-  get: function get() {
-    return _cache.setScriptInCache;
-  }
-});
-Object.defineProperty(exports, "transpileAndBuildGetVariables", {
-  enumerable: true,
-  get: function get() {
-    return _variableTranspiler.transpileAndBuildGetVariables;
-  }
-});
-var _resourceManager = require("./resource-manager");
-var _fragmentUrl = require("./fragment-url");
-var _componentRefProvider = require("./component-ref-provider");
-var _prefabResources = require("./prefab-resources");
-var _scriptExecutor = require("./script-executor");
-var _variableTranspiler = require("./variable-transpiler");
-var _cssScoping = require("./css-scoping");
-var _appExtensionProvider = require("./app-extension-provider");
-var _cache = require("./cache");
+import { fetchResource, clearResourceCache } from "./resource-manager";
+import {
+  ComponentType,
+  getFragmentUrl,
+  getPrefabBaseUrl,
+  getPrefabConfigUrl,
+  isPrefabSelfPreview
+} from "./fragment-url";
+import { getComponentRef, clearComponentRefCache } from "./component-ref-provider";
+import { getPrefabResourceUrl } from "./prefab-resources";
+import { buildAddPageScript } from "./script-executor";
+import { transpileAndBuildGetVariables, clearVariablesCache } from "./variable-transpiler";
+import { scopeComponentStyles, removeComponentStyles } from "./css-scoping";
+import { loadAppExtensions } from "./app-extension-provider";
+import {
+  getFragmentFromCache,
+  setFragmentInCache,
+  getComponentFromCache,
+  setComponentInCache,
+  getScriptFromCache,
+  setScriptInCache,
+  clearAllCaches
+} from "./cache";
+export {
+  ComponentType,
+  buildAddPageScript,
+  clearAllCaches,
+  clearComponentRefCache,
+  clearResourceCache,
+  clearVariablesCache,
+  fetchResource,
+  getComponentFromCache,
+  getComponentRef,
+  getFragmentFromCache,
+  getFragmentUrl,
+  getPrefabBaseUrl,
+  getPrefabConfigUrl,
+  getPrefabResourceUrl,
+  getScriptFromCache,
+  isPrefabSelfPreview,
+  loadAppExtensions,
+  removeComponentStyles,
+  scopeComponentStyles,
+  setComponentInCache,
+  setFragmentInCache,
+  setScriptInCache,
+  transpileAndBuildGetVariables
+};

package/runtime-dynamic/services/markup-transpiler.d.ts

@@ -1,12 +1,12 @@
-import React from "react";
 import type { TranspiledOutput } from "@wavemaker-ai/react-codegen/transpiler";
 export type { TranspiledOutput } from "@wavemaker-ai/react-codegen/transpiler";
+export { renderTranspiledMarkup, compileJsx, resolveScope } from "./compile-render";
+export { injectAutolayoutCss, AUTOLAYOUT_SCOPE, injectedAutoLayoutRules, } from "./autolayout-inject";
 export interface TranspileOptions {
     variables?: Record<string, unknown>;
     isPartOfPrefab?: boolean;
     prefabName?: string;
 }
 export declare function transpileFragment(markup: string, variablesOrOptions?: Record<string, unknown> | TranspileOptions): TranspiledOutput | null;
-export declare function renderTranspiledMarkup(transpiled: TranspiledOutput, appState: unknown): React.ReactNode;
 export declare function transpileAndRender(markup: string, appState: unknown, variables?: Record<string, unknown>): React.ReactNode;
 export declare function clearTranspileCache(): void;

package/runtime-dynamic/services/markup-transpiler.js

@@ -1,250 +1,58 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.clearTranspileCache = clearTranspileCache;
-exports.renderTranspiledMarkup = renderTranspiledMarkup;
-exports.transpileAndRender = transpileAndRender;
-exports.transpileFragment = transpileFragment;
-var _construct2 = _interopRequireDefault(require("@babel/runtime/helpers/construct"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _react = _interopRequireDefault(require("react"));
-var _transpiler = require("@wavemaker-ai/react-codegen/transpiler");
-var _sucrase = require("sucrase");
-var _componentRegistry = require("../registry/component-registry");
-var _util = require("@wavemaker-ai/react-runtime/core/util");
-var _appInitializer = require("../app-initializer");
-var _variableRegistry = require("./variable-registry");
-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 compiledCache = new Map();
-var transpiledCache = new Map();
-var componentNameCache = new Map();
-var AUTOLAYOUT_SCOPE = "autolayout-dynamic";
-var injectedAutoLayoutRules = new Set();
-function injectAutolayoutCss(rules) {
-  var newRules = rules.filter(function (r) {
-    return !injectedAutoLayoutRules.has(r);
-  });
-  if (newRules.length === 0) return;
-  newRules.forEach(function (r) {
-    return injectedAutoLayoutRules.add(r);
-  });
-  var styleEl = document.querySelector("style[data-wm-scope=\"".concat(AUTOLAYOUT_SCOPE, "\"]"));
-  if (!styleEl) {
-    styleEl = document.createElement("style");
-    styleEl.setAttribute("data-wm-scope", AUTOLAYOUT_SCOPE);
-    document.head.appendChild(styleEl);
-  }
-  styleEl.textContent += "\n" + newRules.join("\n\n") + "\n";
-}
-var UTIL_SCOPE = {
-  formatMessage: _util.formatMessage,
-  _get: _util._get,
-  toNumber: _util.toNumber
-};
-var lazyPartialCache = new Map();
-function markupErrorNode(className, message) {
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: className
-  }, message);
-}
-function extractMarkupComponents(markup) {
-  var cached = componentNameCache.get(markup);
-  if (cached) return cached;
-  var matches = markup.match(/\bWm[A-Z]\w*/g);
-  var result = matches ? (0, _toConsumableArray2["default"])(new Set(matches)) : [];
-  componentNameCache.set(markup, result);
-  return result;
-}
-function resolveScope(imports, appState, markup) {
-  var fragment = appState;
-  var names = ["React", "fragment", "Widgets", "Variables"];
-  var values = [_react["default"], appState, fragment === null || fragment === void 0 ? void 0 : fragment.Widgets, fragment === null || fragment === void 0 ? void 0 : fragment.Variables];
-  var seen = new Set(["React", "fragment", "Widgets", "Variables"]);
-  var knownPartials = new Set((0, _appInitializer.getPartialNames)());
-  var _iterator = _createForOfIteratorHelper(imports),
-    _step;
-  try {
-    var _loop = function _loop() {
-        var importDef = _step.value;
-        var name = importDef.as || importDef.name;
-        if (seen.has(name)) return 0; // continue
-        var component = (0, _componentRegistry.getComponent)(name);
-        if (component) {
-          seen.add(name);
-          names.push(name);
-          values.push(component);
-          return 0; // continue
-        }
-        var partialName = (0, _toConsumableArray2["default"])(knownPartials).find(function (p) {
-          return p.toLowerCase() === name.toLowerCase();
-        });
-        if (partialName) {
-          if (!lazyPartialCache.has(partialName)) {
-            lazyPartialCache.set(partialName, (0, _variableRegistry.createLazyPartial)(partialName));
-          }
-          seen.add(name);
-          names.push(name);
-          values.push(lazyPartialCache.get(partialName));
-        }
-      },
-      _ret;
-    for (_iterator.s(); !(_step = _iterator.n()).done;) {
-      _ret = _loop();
-      if (_ret === 0) continue;
-    }
-  } catch (err) {
-    _iterator.e(err);
-  } finally {
-    _iterator.f();
-  }
-  if (markup) {
-    var _iterator2 = _createForOfIteratorHelper(extractMarkupComponents(markup)),
-      _step2;
-    try {
-      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-        var name = _step2.value;
-        if (seen.has(name)) continue;
-        var component = (0, _componentRegistry.getComponent)(name);
-        if (component) {
-          seen.add(name);
-          names.push(name);
-          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 compileJsx(jsxCode) {
-  var result = (0, _sucrase.transform)(jsxCode, {
-    transforms: ["typescript", "jsx"],
-    jsxRuntime: "classic",
-    production: true
-  });
-  return result.code;
-}
+import { transformMarkup } from "@wavemaker-ai/react-codegen/transpiler";
+import { getProjectConfig } from "../app-initializer";
+import { injectAutolayoutCss, clearAutolayoutState } from "./autolayout-inject";
+import { renderTranspiledMarkup, clearCompiledCache } from "./compile-render";
+import { renderTranspiledMarkup as renderTranspiledMarkup2, compileJsx, resolveScope } from "./compile-render";
+import {
+  injectAutolayoutCss as injectAutolayoutCss2,
+  AUTOLAYOUT_SCOPE,
+  injectedAutoLayoutRules
+} from "./autolayout-inject";
+const transpiledCache = /* @__PURE__ */ new Map();
 function transpileFragment(markup, variablesOrOptions) {
-  var _transpiled$autolayou;
-  if (!(markup !== null && markup !== void 0 && markup.trim())) return null;
-  var variables;
-  var isPartOfPrefab = false;
-  var prefabName;
+  var _a, _b;
+  if (!(markup == null ? void 0 : markup.trim())) return null;
+  let variables;
+  let isPartOfPrefab = false;
+  let prefabName;
   if (variablesOrOptions && ("isPartOfPrefab" in variablesOrOptions || "prefabName" in variablesOrOptions)) {
-    var _opts$isPartOfPrefab;
-    var opts = variablesOrOptions;
+    const opts = variablesOrOptions;
     variables = opts.variables;
-    isPartOfPrefab = (_opts$isPartOfPrefab = opts.isPartOfPrefab) !== null && _opts$isPartOfPrefab !== void 0 ? _opts$isPartOfPrefab : false;
+    isPartOfPrefab = (_a = opts.isPartOfPrefab) != null ? _a : false;
     prefabName = opts.prefabName;
   } else {
     variables = variablesOrOptions;
   }
-  var cacheKey = prefabName ? "prefab:".concat(prefabName, ":").concat(markup) : markup;
-  var cached = transpiledCache.get(cacheKey);
+  const cacheKey = prefabName ? `prefab:${prefabName}:${markup}` : markup;
+  const cached = transpiledCache.get(cacheKey);
   if (cached) return cached;
-  var config = (0, _appInitializer.getProjectConfig)();
-  var appUrl = config.deployUrl || "./";
-  var transpiled = (0, _transpiler.transformMarkup)(markup, {
-    variables: variables,
-    appUrl: appUrl,
-    isPartOfPrefab: isPartOfPrefab,
-    prefabName: prefabName
-  });
-  if ((_transpiled$autolayou = transpiled.autolayoutCss) !== null && _transpiled$autolayou !== void 0 && _transpiled$autolayou.length) {
+  const config = getProjectConfig();
+  const appUrl = config.deployUrl || "./";
+  const transpiled = transformMarkup(markup, { variables, appUrl, isPartOfPrefab, prefabName });
+  if ((_b = transpiled.autolayoutCss) == null ? void 0 : _b.length) {
     injectAutolayoutCss(transpiled.autolayoutCss);
   }
   transpiledCache.set(cacheKey, transpiled);
   return transpiled;
 }
-function renderTranspiledMarkup(transpiled, appState) {
-  var cacheKey = transpiled.markup;
-  var cached = compiledCache.get(cacheKey);
-  if (!cached) {
-    var jsxString = transpiled.markup;
-    var jsxWrapped = "function __render__() { return (<React.Fragment>".concat(jsxString.trim() || "null", "</React.Fragment>); }");
-    var compiledCode;
-    try {
-      var compiled = compileJsx(jsxWrapped);
-      compiledCode = "".concat(compiled, "\nreturn __render__();");
-    } catch (compileError) {
-      console.error("[markup-transpiler] Compilation failed:", compileError);
-      console.error("[markup-transpiler] JSX input:", jsxWrapped);
-      return markupErrorNode("wm-transpile-error", "Transpilation error");
-    }
-    var _resolveScope = resolveScope(transpiled.imports, appState, jsxWrapped),
-      names = _resolveScope.names,
-      values = _resolveScope.values;
-    var renderFn;
-    try {
-      renderFn = (0, _construct2["default"])(Function, (0, _toConsumableArray2["default"])(names).concat([compiledCode]));
-    } catch (constructionError) {
-      console.error("[markup-transpiler] Function compilation failed:", constructionError);
-      console.error("[markup-transpiler] Compiled code:", compiledCode);
-      return markupErrorNode("wm-transpile-error", "Compilation error");
-    }
-    var reactIdx = names.indexOf("React");
-    var fragmentIdx = names.indexOf("fragment");
-    var widgetsIdx = names.indexOf("Widgets");
-    var variablesIdx = names.indexOf("Variables");
-    cached = {
-      renderFn: renderFn,
-      scopeNames: names,
-      runtimeValues: values,
-      reactIdx: reactIdx,
-      fragmentIdx: fragmentIdx,
-      widgetsIdx: widgetsIdx,
-      variablesIdx: variablesIdx
-    };
-    compiledCache.set(cacheKey, cached);
-  }
-
-  // Mutate the 4 dynamic slots in-place — avoids a per-render array allocation.
-  var runtimeFragment = appState;
-  cached.runtimeValues[cached.reactIdx] = _react["default"];
-  cached.runtimeValues[cached.fragmentIdx] = appState;
-  cached.runtimeValues[cached.widgetsIdx] = runtimeFragment === null || runtimeFragment === void 0 ? void 0 : runtimeFragment.Widgets;
-  cached.runtimeValues[cached.variablesIdx] = runtimeFragment === null || runtimeFragment === void 0 ? void 0 : runtimeFragment.Variables;
-  try {
-    var _cached;
-    return (_cached = cached).renderFn.apply(_cached, (0, _toConsumableArray2["default"])(cached.runtimeValues));
-  } catch (renderError) {
-    console.error("[markup-transpiler] Render failed:", renderError);
-    return markupErrorNode("wm-render-error", "Render error");
-  }
-}
 function transpileAndRender(markup, appState, variables) {
-  var transpiled = transpileFragment(markup, variables);
+  const transpiled = transpileFragment(markup, variables);
   if (!transpiled) return null;
   return renderTranspiledMarkup(transpiled, appState);
 }
 function clearTranspileCache() {
-  compiledCache.clear();
   transpiledCache.clear();
-  componentNameCache.clear();
-  lazyPartialCache.clear();
-  injectedAutoLayoutRules.clear();
-  var styleEl = document.querySelector("style[data-wm-scope=\"".concat(AUTOLAYOUT_SCOPE, "\"]"));
-  if (styleEl) styleEl.remove();
-}
+  clearCompiledCache();
+  clearAutolayoutState();
+}
+export {
+  AUTOLAYOUT_SCOPE,
+  clearTranspileCache,
+  compileJsx,
+  injectAutolayoutCss2 as injectAutolayoutCss,
+  injectedAutoLayoutRules,
+  renderTranspiledMarkup2 as renderTranspiledMarkup,
+  resolveScope,
+  transpileAndRender,
+  transpileFragment
+};