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

package/runtime-dynamic/components/PrefabPreview.js

@@ -0,0 +1,84 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PrefabPreview = PrefabPreview;
+var _react = _interopRequireWildcard(require("react"));
+var _errorBoundary = _interopRequireDefault(require("@wavemaker-ai/react-runtime/components/page/error-boundary"));
+var _common = require("@wavemaker-ai/react-runtime/components/common");
+var _WidgetProvider = require("@wavemaker-ai/react-runtime/context/WidgetProvider");
+var _fragmentUrl = require("../services/fragment-url");
+var _ErrorBoundary = require("./ErrorBoundary");
+var _useDynamicComponent2 = require("./use-dynamic-component");
+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;
+/** Matches Angular prefab preview `prefabname="__self__"` — root bundle, not `app/prefabs/…`. */
+var PREFAB_PREVIEW_NAME = "__self__";
+
+/**
+ * Minimal host {@link WidgetProvider} so {@link BasePrefab}'s {@link withBaseWrapper} has
+ * {@link usePageContext} before the prefab's own {@link BasePage} mounts (embedded prefabs use the page's provider).
+ */
+function PrefabPreviewWidgetHost(_ref) {
+  var children = _ref.children;
+  var proxy = (0, _react.useRef)({
+    Widgets: {},
+    App: {
+      Widgets: {}
+    },
+    layoutReady: function layoutReady() {}
+  });
+  var pageShell = (0, _react.useMemo)(function () {
+    return {
+      type: "PAGE",
+      componentType: "PAGE",
+      componentName: "PrefabPreview",
+      Widgets: {},
+      App: {
+        Widgets: {}
+      }
+    };
+  }, []);
+  var providerValue = (0, _react.useMemo)(function () {
+    return {
+      value: pageShell,
+      proxy: proxy.current
+    };
+  }, [pageShell]);
+  return __jsx(_WidgetProvider.WidgetProvider, {
+    value: providerValue
+  }, children);
+}
+function PrefabPreview() {
+  var _useDynamicComponent = (0, _useDynamicComponent2.useDynamicComponent)(PREFAB_PREVIEW_NAME, _fragmentUrl.ComponentType.PREFAB),
+    Component = _useDynamicComponent.Component,
+    isLoading = _useDynamicComponent.isLoading,
+    error = _useDynamicComponent.error;
+  if (isLoading) {
+    return __jsx(_common.AppSpinner, {
+      show: true,
+      spinnermessages: ["Loading prefab…"]
+    });
+  }
+  if (error) {
+    return __jsx(_errorBoundary["default"], {
+      error: error,
+      title: "Failed to load prefab preview",
+      subtitle: "The prefab could not be loaded. Please try again."
+    });
+  }
+  if (!Component) {
+    return null;
+  }
+  return __jsx(_ErrorBoundary.ComponentErrorBoundary, {
+    scope: "prefab",
+    componentName: PREFAB_PREVIEW_NAME
+  }, __jsx(PrefabPreviewWidgetHost, null, __jsx("div", {
+    className: "prefab-preview row"
+  }, __jsx(Component, {
+    prefabname: ""
+  }))));
+}

package/runtime-dynamic/components/partial-content.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Prettify, BaseProps } from "@wavemaker-ai/react-runtime/higherOrder/props";
+export interface WmPartialContentProp {
+    prefab?: boolean;
+    content: string;
+    partialName?: string;
+    params?: string[];
+    onLoad?: (widget: {
+        viewParent?: Record<string, unknown>;
+    }) => void;
+    onRender?: (commonComponent: any) => void;
+}
+export type WmPartialContentProps = Prettify<WmPartialContentProp & BaseProps>;
+declare const WmPartialContent: React.MemoExoticComponent<(props: WmPartialContentProps) => import("react/jsx-runtime").JSX.Element>;
+export default WmPartialContent;

package/runtime-dynamic/components/partial-content.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Container = _interopRequireDefault(require("@mui/material/Container"));
+var _spinner = require("../../components/basic/spinner");
+var _isEqual = _interopRequireDefault(require("lodash-es/isEqual"));
+var _store = require("@wavemaker-ai/react-runtime/runtime-dynamic/registry/store");
+var _fragmentUrl = require("@wavemaker-ai/react-runtime/runtime-dynamic/services/fragment-url");
+var _ErrorBoundary = require("./ErrorBoundary");
+var _useDynamicComponent2 = require("./use-dynamic-component");
+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;
+var WmPartialContent = /*#__PURE__*/(0, _react.memo)(function (props) {
+  var _useDynamicComponent = (0, _useDynamicComponent2.useDynamicComponent)(props === null || props === void 0 ? void 0 : props.content, _fragmentUrl.ComponentType.PARTIAL),
+    Component = _useDynamicComponent.Component;
+  return __jsx(_ErrorBoundary.ComponentErrorBoundary, {
+    scope: "partial",
+    componentName: props.content
+  }, __jsx(_Container["default"], {
+    className: "partial-container"
+  }, __jsx(_react.Suspense, {
+    fallback: __jsx(_spinner.WmSpinner, {
+      show: true,
+      listener: props.listener,
+      name: "partial-container-spinner"
+    })
+  }, Component && __jsx(Component, props))));
+}, function (prevProps, nextProps) {
+  var staticKeys = ["content", "prefab", "prefabName", "partialName", "styles", "params"];
+  var staticEqual = staticKeys.every(function (key) {
+    if (key === "styles") {
+      return (0, _isEqual["default"])(prevProps[key], nextProps[key]);
+    }
+    return prevProps[key] === nextProps[key];
+  });
+  if (!staticEqual) return false;
+  var paramNames = nextProps.params || [];
+  return paramNames.every(function (p) {
+    return prevProps[p] === nextProps[p];
+  });
+});
+WmPartialContent.displayName = "WmPartialContent";
+(0, _store.registerComponent)("WmPartialContent", WmPartialContent);
+var _default = exports["default"] = WmPartialContent;

package/runtime-dynamic/components/prefab-content.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+type PrefabContentProps = {
+    prefabname: string;
+    content: string;
+    params: Record<string, unknown>;
+    onRender: (component: React.ComponentType<any>) => void;
+    listener: any;
+};
+declare const PrefabContent: (props: PrefabContentProps) => import("react/jsx-runtime").JSX.Element;
+export default PrefabContent;

package/runtime-dynamic/components/prefab-content.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _spinner = require("../../components/basic/spinner");
+var _fragmentUrl = require("../services/fragment-url");
+var _ErrorBoundary = require("./ErrorBoundary");
+var _useDynamicComponent2 = require("./use-dynamic-component");
+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;
+var PrefabContent = function PrefabContent(props) {
+  var _useDynamicComponent = (0, _useDynamicComponent2.useDynamicComponent)(props === null || props === void 0 ? void 0 : props.prefabname, _fragmentUrl.ComponentType.PREFAB, {
+      prefabName: props === null || props === void 0 ? void 0 : props.prefabname
+    }),
+    Component = _useDynamicComponent.Component;
+  return __jsx(_ErrorBoundary.ComponentErrorBoundary, {
+    scope: "prefab",
+    componentName: props.prefabname
+  }, __jsx(_react.Suspense, {
+    fallback: __jsx(_spinner.WmSpinner, {
+      show: true,
+      listener: props.listener,
+      name: "prefab-spinner"
+    })
+  }, Component && __jsx(Component, props)));
+};
+var _default = exports["default"] = PrefabContent;

package/runtime-dynamic/components/use-dynamic-component.d.ts

@@ -0,0 +1,10 @@
+import { ComponentType } from "../services/fragment-url";
+interface DynamicComponentState {
+    Component: React.ComponentType<any> | null;
+    isLoading: boolean;
+    error: Error | null;
+}
+export declare function useDynamicComponent(componentName: string | undefined, componentType: ComponentType, options?: {
+    prefabName?: string;
+}): DynamicComponentState;
+export {};

package/runtime-dynamic/components/use-dynamic-component.js

@@ -0,0 +1,165 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDynamicComponent = useDynamicComponent;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("react");
+var _componentRefProvider = require("../services/component-ref-provider");
+var _fragmentUrl = require("../services/fragment-url");
+var _cache = require("../services/cache");
+var _buildBasePageLikeComponent = require("../factories/build-base-page-like-component");
+var _prefabFactory = require("../factories/prefab-factory");
+/** Third argument is only used for {@link ComponentType.PREFAB}: outbound defaults from prefab `config.json` (see {@link buildPrefabComponent}). */
+
+var builders = (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _fragmentUrl.ComponentType.PAGE, function (name, fragment) {
+  return (0, _buildBasePageLikeComponent.buildBasePageLikeComponent)("page", name, fragment);
+}), _fragmentUrl.ComponentType.PARTIAL, function (name, fragment) {
+  return (0, _buildBasePageLikeComponent.buildBasePageLikeComponent)("partial", name, fragment);
+}), _fragmentUrl.ComponentType.PREFAB, function (name, fragment, prefabOutboundDefaults) {
+  return (0, _prefabFactory.buildPrefabComponent)(name, fragment, prefabOutboundDefaults !== null && prefabOutboundDefaults !== void 0 ? prefabOutboundDefaults : {});
+});
+function getCachedComponent(componentType, name) {
+  if (!name) return undefined;
+  return (0, _cache.getComponentFromCache)(componentType, name);
+}
+function resolveInitialState(componentName, componentType) {
+  var cached = getCachedComponent(componentType, componentName);
+  if (cached) return {
+    Component: cached,
+    isLoading: false,
+    error: null
+  };
+  return {
+    Component: null,
+    isLoading: !!componentName,
+    error: null
+  };
+}
+function getFragmentFetchOptions(componentType, prefabNameOption, resolvedName) {
+  if (componentType !== _fragmentUrl.ComponentType.PREFAB) return undefined;
+  return {
+    prefabName: prefabNameOption || resolvedName
+  };
+}
+function useDynamicComponent(componentName, componentType, options) {
+  var _useState = (0, _react.useState)(function () {
+      return resolveInitialState(componentName, componentType);
+    }),
+    state = _useState[0],
+    setState = _useState[1];
+  var activeRequestRef = (0, _react.useRef)(0);
+  var load = (0, _react.useCallback)(/*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(name) {
+      var cached, requestId, fetchOptions, _prefabOutboundDefaults, _fragment, builder, Component, error;
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            cached = getCachedComponent(componentType, name);
+            if (!cached) {
+              _context.next = 4;
+              break;
+            }
+            setState({
+              Component: cached,
+              isLoading: false,
+              error: null
+            });
+            return _context.abrupt("return");
+          case 4:
+            requestId = ++activeRequestRef.current;
+            setState({
+              Component: null,
+              isLoading: true,
+              error: null
+            });
+            _context.prev = 6;
+            fetchOptions = getFragmentFetchOptions(componentType, options === null || options === void 0 ? void 0 : options.prefabName, name);
+            if (!(componentType === _fragmentUrl.ComponentType.PREFAB)) {
+              _context.next = 15;
+              break;
+            }
+            _context.next = 11;
+            return (0, _componentRefProvider.getPrefabConfig)(name);
+          case 11:
+            _context.t0 = _context.sent;
+            if (_context.t0) {
+              _context.next = 14;
+              break;
+            }
+            _context.t0 = {};
+          case 14:
+            _prefabOutboundDefaults = _context.t0;
+          case 15:
+            _context.next = 17;
+            return (0, _componentRefProvider.getComponentRef)(name, componentType, fetchOptions);
+          case 17:
+            _fragment = _context.sent;
+            builder = builders[componentType];
+            if (builder) {
+              _context.next = 21;
+              break;
+            }
+            throw new Error("No builder registered for component type: ".concat(componentType));
+          case 21:
+            _context.next = 23;
+            return builder(name, _fragment, _prefabOutboundDefaults);
+          case 23:
+            Component = _context.sent;
+            (0, _cache.setComponentInCache)(componentType, name, Component);
+            if (requestId === activeRequestRef.current) {
+              setState({
+                Component: Component,
+                isLoading: false,
+                error: null
+              });
+            }
+            _context.next = 35;
+            break;
+          case 28:
+            _context.prev = 28;
+            _context.t1 = _context["catch"](6);
+            if (!(requestId !== activeRequestRef.current)) {
+              _context.next = 32;
+              break;
+            }
+            return _context.abrupt("return");
+          case 32:
+            error = _context.t1 instanceof Error ? _context.t1 : new Error("Failed to load ".concat(componentType));
+            console.error("Failed to load ".concat(componentType, " \"").concat(name, "\":"), _context.t1);
+            setState({
+              Component: null,
+              isLoading: false,
+              error: error
+            });
+          case 35:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[6, 28]]);
+    }));
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(), [componentType, options === null || options === void 0 ? void 0 : options.prefabName]);
+  (0, _react.useEffect)(function () {
+    if (!componentName) return;
+    var cached = getCachedComponent(componentType, componentName);
+    if (cached) {
+      setState(function (prev) {
+        return prev.Component === cached ? prev : {
+          Component: cached,
+          isLoading: false,
+          error: null
+        };
+      });
+      return;
+    }
+    load(componentName);
+  }, [componentName, load, componentType]);
+  return state;
+}

package/runtime-dynamic/factories/build-base-page-like-component.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { DecodedFragment } from "../services/cache";
+export type BasePageLikeKind = "page" | "partial";
+/**
+ * Shared path for dynamically loaded pages and partials: both wrap codegen output
+ * with {@link BasePage}, differing only in script scope and startup metadata labels.
+ */
+export declare function buildBasePageLikeComponent(kind: BasePageLikeKind, name: string, fragment: DecodedFragment): Promise<React.ComponentType<any>>;

package/runtime-dynamic/factories/build-base-page-like-component.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildBasePageLikeComponent = buildBasePageLikeComponent;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _react = _interopRequireDefault(require("react"));
+var _BasePage = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/BasePage"));
+var _scriptExecutor = require("../services/script-executor");
+var _utils = require("./utils");
+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; }
+/**
+ * Shared path for dynamically loaded pages and partials: both wrap codegen output
+ * with {@link BasePage}, differing only in script scope and startup metadata labels.
+ */
+function buildBasePageLikeComponent(_x, _x2, _x3) {
+  return _buildBasePageLikeComponent.apply(this, arguments);
+}
+function _buildBasePageLikeComponent() {
+  _buildBasePageLikeComponent = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(kind, name, fragment) {
+    var isPage, WrappedComponent, MemoizedComponent;
+    return _regenerator["default"].wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          isPage = kind === "page";
+          _context.next = 3;
+          return (0, _utils.buildDynamicComponent)(fragment, {
+            componentName: name,
+            componentType: isPage ? "page" : "partial",
+            scriptScope: isPage ? _scriptExecutor.ScriptScope.PAGE : _scriptExecutor.ScriptScope.PARTIAL,
+            hoc: _BasePage["default"],
+            componentInfo: function componentInfo(startupInfo) {
+              return _objectSpread(_objectSpread({
+                componentName: name,
+                componentType: isPage ? "PAGE" : "PARTIAL"
+              }, startupInfo), {}, {
+                isPartOfPrefab: false,
+                appLocale: {}
+              });
+            }
+          });
+        case 3:
+          WrappedComponent = _context.sent;
+          MemoizedComponent = /*#__PURE__*/_react["default"].memo(WrappedComponent);
+          MemoizedComponent.displayName = isPage ? "BasePage(".concat(name, ")") : "BasePage_Partial(".concat(name, ")");
+          return _context.abrupt("return", MemoizedComponent);
+        case 7:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return _buildBasePageLikeComponent.apply(this, arguments);
+}

package/runtime-dynamic/factories/prefab-factory.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import type { DecodedFragment } from "../services/cache";
+export declare function buildPrefabComponent(prefabName: string, fragment: DecodedFragment, defaultPrefabProps: Record<string, unknown>): Promise<React.ComponentType<any>>;

package/runtime-dynamic/factories/prefab-factory.js

@@ -0,0 +1,82 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildPrefabComponent = buildPrefabComponent;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _react = _interopRequireDefault(require("react"));
+var _BasePrefab = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/BasePrefab"));
+var _scriptExecutor = require("../services/script-executor");
+var _utils = require("./utils");
+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; }
+function buildPrefabComponent(_x, _x2, _x3) {
+  return _buildPrefabComponent.apply(this, arguments);
+}
+function _buildPrefabComponent() {
+  _buildPrefabComponent = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(prefabName, fragment, defaultPrefabProps) {
+    var BasePrefabComponent, DynamicPrefabShell;
+    return _regenerator["default"].wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.next = 2;
+          return (0, _utils.buildDynamicComponent)(fragment, {
+            componentName: prefabName,
+            componentType: "prefab",
+            scriptScope: _scriptExecutor.ScriptScope.PREFAB,
+            hoc: _BasePrefab["default"],
+            componentInfo: function componentInfo(startupInfo) {
+              return _objectSpread(_objectSpread({
+                type: "PREFAB",
+                componentName: prefabName,
+                componentType: "PREFAB"
+              }, startupInfo), {}, {
+                partials: [],
+                pages: [],
+                prefabInfo: {}
+              });
+            },
+            transpileOptions: {
+              isPartOfPrefab: true,
+              prefabName: prefabName
+            }
+          });
+        case 2:
+          BasePrefabComponent = _context.sent;
+          DynamicPrefabShell = /*#__PURE__*/_react["default"].memo(function (props) {
+            var _ref, _ref2;
+            var resolvedName = (_ref = (_ref2 = props.name) !== null && _ref2 !== void 0 ? _ref2 : defaultPrefabProps.name) !== null && _ref !== void 0 ? _ref : prefabName;
+            // Do NOT spread `defaultPrefabProps` as direct props here. The defaults flow
+            // into the prefab's internal `prefabInfo` via `outbound` (see `BasePrefab`),
+            // and from there into the prefab's own `pageContext` (so `Prefab.x` defaults
+            // are still applied). Spreading them as direct props would make them visible
+            // to the OUTER `withBaseWrapper`, which mirrors all direct props onto the
+            // parent page's `proxy.Widgets[name]`. Each re-render of the wrapper would
+            // then clobber any value the prefab itself wrote via `PARTIAL_STATE_SYNC`
+            // (e.g. `Prefab.selectedweekdataset = ...`) with the stale default (null),
+            // making `Page.Widgets.<prefab>.<prop>` reset to null in preview while
+            // codegen — which never spread defaults at this level — worked correctly.
+            return __jsx(BasePrefabComponent, (0, _extends2["default"])({
+              inbound: props,
+              outbound: defaultPrefabProps,
+              prefabname: prefabName
+            }, props, {
+              name: resolvedName
+            }));
+          });
+          DynamicPrefabShell.displayName = "DynamicPrefab(".concat(prefabName, ")");
+          return _context.abrupt("return", DynamicPrefabShell);
+        case 6:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return _buildPrefabComponent.apply(this, arguments);
+}

package/runtime-dynamic/factories/startup-info.d.ts

@@ -0,0 +1,6 @@
+export interface StartupInfo {
+    startUpVariables: string[];
+    startUpActions: string[];
+    autoUpdateVariables: string[];
+}
+export declare function buildStartupInfo(variables: Record<string, unknown> | undefined): StartupInfo;

package/runtime-dynamic/factories/startup-info.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildStartupInfo = buildStartupInfo;
+var TIMER_ACTION_CATEGORY = "wm.TimerAction";
+var AUTO_UPDATE_CATEGORIES = ["wm.Variable", "wm.LiveVariable"];
+function buildStartupInfo(variables) {
+  var varDefs = Object.values(variables || {});
+  return {
+    startUpVariables: varDefs.filter(function (v) {
+      return v.startUpdate && v.category !== TIMER_ACTION_CATEGORY;
+    }).map(function (v) {
+      return v.name;
+    }),
+    startUpActions: varDefs.filter(function (v) {
+      return v.startUpdate && v.category === TIMER_ACTION_CATEGORY;
+    }).map(function (v) {
+      return v.name;
+    }),
+    autoUpdateVariables: varDefs.filter(function (v) {
+      return v.autoUpdate || AUTO_UPDATE_CATEGORIES.includes(v.category || "") && v.dataBinding && v.dataBinding.length;
+    }).map(function (v) {
+      return v.name;
+    })
+  };
+}

package/runtime-dynamic/factories/utils.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+import { ScriptScope } from "../services/script-executor";
+import { buildStartupInfo } from "./startup-info";
+import type { TranspiledOutput, TranspileOptions } from "../services/markup-transpiler";
+import type { DecodedFragment } from "../services/cache";
+interface InnerComponentConfig {
+    componentName: string;
+    componentType: "page" | "partial" | "prefab";
+    transpiled: TranspiledOutput | null;
+    styles: string;
+}
+export declare function createDynamicInnerComponent({ componentName, componentType, transpiled, styles, }: InnerComponentConfig): React.FC<any>;
+export interface DynamicComponentConfig {
+    componentName: string;
+    componentType: "page" | "partial" | "prefab";
+    scriptScope: ScriptScope;
+    hoc: (...args: any[]) => React.ComponentType<any>;
+    componentInfo: (startupInfo: ReturnType<typeof buildStartupInfo>) => Record<string, unknown>;
+    transpileOptions?: Partial<TranspileOptions>;
+    displayName?: string;
+}
+export declare function buildDynamicComponent(fragment: DecodedFragment, config: DynamicComponentConfig): Promise<React.ComponentType<any>>;
+export {};