@next-core/runtime 1.44.1 → 1.44.3

package/dist/esm/internal/Router.js

@@ -1,5 +1,3 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classPrivateMethodInitSpec from "@babel/runtime/helpers/classPrivateMethodInitSpec";
 import _classPrivateFieldInitSpec from "@babel/runtime/helpers/classPrivateFieldInitSpec";
 import _classPrivateFieldGet from "@babel/runtime/helpers/classPrivateFieldGet2";
@@ -60,9 +58,9 @@ export class Router {
     _classPrivateFieldInitSpec(this, _previousApp, void 0);
     _classPrivateFieldInitSpec(this, _navConfig, void 0);
     _classPrivateFieldSet(_storyboards, this, storyboards);
-    var _history = getHistory();
+    const _history = getHistory();
     window.addEventListener("beforeunload", event => {
-      var message = _assertClassBrand(_Router_brand, this, _getBlockMessageBeforePageLave).call(this, {});
+      const message = _assertClassBrand(_Router_brand, this, _getBlockMessageBeforePageLave).call(this, {});
       // See examples in https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload
       if (message) {
         // Cancel the event
@@ -96,83 +94,83 @@ export class Router {
     return _classPrivateFieldGet(_navConfig, this);
   }
   bootstrap() {
-    var _this = this;
     initAbortController();
-    var history = getHistory();
+    const history = getHistory();
     _classPrivateFieldSet(_prevLocation, this, history.location);
-    var renderId = 0;
-    history.listen( /*#__PURE__*/function () {
-      var _ref = _asyncToGenerator(function* (location, action) {
-        var _classPrivateFieldGet2, _location$state, _location$state2, _classPrivateFieldGet4;
-        var currentRenderId = ++renderId;
-        var ignoreRendering;
-        var omittedLocationProps = {
-          hash: undefined,
-          state: undefined
-        };
-        // Omit the "key" when checking whether locations are equal in certain situations.
-        if (
-        // When current location is triggered by browser action of hash link.
-        location.key === undefined ||
-        // When current location is triggered by browser action of non-push-or-replace,
-        // such as goBack or goForward,
-        action === "POP" && (
-        // and the previous location was triggered by hash link,
-        _classPrivateFieldGet(_prevLocation, _this).key === undefined ||
-        // or the previous location specified notify false.
-        ((_classPrivateFieldGet2 = _classPrivateFieldGet(_prevLocation, _this).state) === null || _classPrivateFieldGet2 === void 0 ? void 0 : _classPrivateFieldGet2.notify) === false)) {
-          omittedLocationProps.key = undefined;
-        }
-        if (locationsAreEqual(_objectSpread(_objectSpread({}, _classPrivateFieldGet(_prevLocation, _this)), omittedLocationProps), _objectSpread(_objectSpread({}, location), omittedLocationProps)) || action !== "POP" && ((_location$state = location.state) === null || _location$state === void 0 ? void 0 : _location$state.notify) === false) {
-          // Ignore rendering if location not changed except hash, state and optional key.
-          // Ignore rendering if notify is `false`.
-          ignoreRendering = true;
-        }
-        if (!ignoreRendering && !((_location$state2 = location.state) !== null && _location$state2 !== void 0 && _location$state2.noIncremental)) {
-          var _classPrivateFieldGet3;
-          ignoreRendering = yield (_classPrivateFieldGet3 = _classPrivateFieldGet(_rendererContext, _this)) === null || _classPrivateFieldGet3 === void 0 ? void 0 : _classPrivateFieldGet3.didPerformIncrementalRender(location, _classPrivateFieldGet(_prevLocation, _this));
-        }
+    let renderId = 0;
+    history.listen(async (location, action) => {
+      var _classPrivateFieldGet2, _location$state, _location$state2, _classPrivateFieldGet4;
+      const currentRenderId = ++renderId;
+      let ignoreRendering;
+      const omittedLocationProps = {
+        hash: undefined,
+        state: undefined
+      };
+      // Omit the "key" when checking whether locations are equal in certain situations.
+      if (
+      // When current location is triggered by browser action of hash link.
+      location.key === undefined ||
+      // When current location is triggered by browser action of non-push-or-replace,
+      // such as goBack or goForward,
+      action === "POP" && (
+      // and the previous location was triggered by hash link,
+      _classPrivateFieldGet(_prevLocation, this).key === undefined ||
+      // or the previous location specified notify false.
+      ((_classPrivateFieldGet2 = _classPrivateFieldGet(_prevLocation, this).state) === null || _classPrivateFieldGet2 === void 0 ? void 0 : _classPrivateFieldGet2.notify) === false)) {
+        omittedLocationProps.key = undefined;
+      }
+      if (locationsAreEqual({
+        ..._classPrivateFieldGet(_prevLocation, this),
+        ...omittedLocationProps
+      }, {
+        ...location,
+        ...omittedLocationProps
+      }) || action !== "POP" && ((_location$state = location.state) === null || _location$state === void 0 ? void 0 : _location$state.notify) === false) {
+        // Ignore rendering if location not changed except hash, state and optional key.
+        // Ignore rendering if notify is `false`.
+        ignoreRendering = true;
+      }
+      if (!ignoreRendering && !((_location$state2 = location.state) !== null && _location$state2 !== void 0 && _location$state2.noIncremental)) {
+        var _classPrivateFieldGet3;
+        ignoreRendering = await ((_classPrivateFieldGet3 = _classPrivateFieldGet(_rendererContext, this)) === null || _classPrivateFieldGet3 === void 0 ? void 0 : _classPrivateFieldGet3.didPerformIncrementalRender(location, _classPrivateFieldGet(_prevLocation, this)));
+      }
 
-        // Ignore stale renders
-        if (renderId !== currentRenderId) {
-          return;
-        }
-        if (ignoreRendering) {
-          _classPrivateFieldSet(_prevLocation, _this, location);
+      // Ignore stale renders
+      if (renderId !== currentRenderId) {
+        return;
+      }
+      if (ignoreRendering) {
+        _classPrivateFieldSet(_prevLocation, this, location);
+        return;
+      }
+      abortPendingRequest();
+      _classPrivateFieldSet(_prevLocation, this, location);
+      (_classPrivateFieldGet4 = _classPrivateFieldGet(_rendererContext, this)) === null || _classPrivateFieldGet4 === void 0 || _classPrivateFieldGet4.dispatchPageLeave();
+      if (action === "POP") {
+        const storyboard = matchStoryboard(_classPrivateFieldGet(_storyboards, this), location.pathname);
+        // When a browser action of goBack or goForward is performing,
+        // force reload when the target page is a page of an outside app.
+        if (isOutsideApp(storyboard)) {
+          window.location.reload();
           return;
         }
-        abortPendingRequest();
-        _classPrivateFieldSet(_prevLocation, _this, location);
-        (_classPrivateFieldGet4 = _classPrivateFieldGet(_rendererContext, _this)) === null || _classPrivateFieldGet4 === void 0 || _classPrivateFieldGet4.dispatchPageLeave();
-        if (action === "POP") {
-          var storyboard = matchStoryboard(_classPrivateFieldGet(_storyboards, _this), location.pathname);
-          // When a browser action of goBack or goForward is performing,
-          // force reload when the target page is a page of an outside app.
-          if (isOutsideApp(storyboard)) {
-            window.location.reload();
-            return;
-          }
-        }
-        if (_classPrivateFieldGet(_rendering, _this)) {
-          _classPrivateFieldSet(_nextLocation, _this, location);
-        } else {
-          devtoolsHookEmit("locationChange");
-          _assertClassBrand(_Router_brand, _this, _queuedRender).call(_this, location).catch(handleHttpError);
-        }
-      });
-      return function (_x, _x2) {
-        return _ref.apply(this, arguments);
-      };
-    }());
+      }
+      if (_classPrivateFieldGet(_rendering, this)) {
+        _classPrivateFieldSet(_nextLocation, this, location);
+      } else {
+        devtoolsHookEmit("locationChange");
+        _assertClassBrand(_Router_brand, this, _queuedRender).call(this, location).catch(handleHttpError);
+      }
+    });
     return _assertClassBrand(_Router_brand, this, _queuedRender).call(this, history.location);
   }
 }
 function _getBlockMessageBeforePageLave(detail) {
   var _classPrivateFieldGet5;
-  var history = getHistory();
-  var previousMessage = history.getBlockMessage();
+  const history = getHistory();
+  const previousMessage = history.getBlockMessage();
   (_classPrivateFieldGet5 = _classPrivateFieldGet(_rendererContext, this)) === null || _classPrivateFieldGet5 === void 0 || _classPrivateFieldGet5.dispatchBeforePageLeave(detail);
-  var message = history.getBlockMessage();
+  const message = history.getBlockMessage();
   if (!previousMessage && message) {
     // Auto unblock only if new block was introduced by `onBeforePageLeave`.
     history.unblock();
@@ -182,7 +180,7 @@ function _getBlockMessageBeforePageLave(detail) {
 function _safeRedirect(to, state, from) {
   var _this$redirectCount, _this$redirectCount2;
   if ((_classPrivateFieldSet(_redirectCount, this, (_this$redirectCount = _classPrivateFieldGet(_redirectCount, this), _this$redirectCount2 = _this$redirectCount++, _this$redirectCount)), _this$redirectCount2) > 10) {
-    var message = "Infinite redirect detected: from \"".concat(from.pathname).concat(from.search).concat(from.hash, "\" to \"").concat(to, "\"");
+    const message = `Infinite redirect detected: from "${from.pathname}${from.search}${from.hash}" to "${to}"`;
     // istanbul ignore else: error cannot be caught in test
     if (process.env.NODE_ENV === "test") {
       // eslint-disable-next-line no-console
@@ -194,304 +192,288 @@ function _safeRedirect(to, state, from) {
   }
   getHistory().replace(to, state);
 }
-function _queuedRender(_x3) {
-  return _queuedRender2.apply(this, arguments);
-}
-function _queuedRender2() {
-  _queuedRender2 = _asyncToGenerator(function* (location) {
-    _classPrivateFieldSet(_rendering, this, true);
-    try {
-      yield _assertClassBrand(_Router_brand, this, _render).call(this, location);
-    } finally {
-      _classPrivateFieldSet(_rendering, this, false);
-      if (_classPrivateFieldGet(_nextLocation, this)) {
-        var nextLocation = _classPrivateFieldGet(_nextLocation, this);
-        _classPrivateFieldSet(_nextLocation, this, undefined);
-        yield _assertClassBrand(_Router_brand, this, _queuedRender).call(this, nextLocation);
-      }
+async function _queuedRender(location) {
+  _classPrivateFieldSet(_rendering, this, true);
+  try {
+    await _assertClassBrand(_Router_brand, this, _render).call(this, location);
+  } finally {
+    _classPrivateFieldSet(_rendering, this, false);
+    if (_classPrivateFieldGet(_nextLocation, this)) {
+      const nextLocation = _classPrivateFieldGet(_nextLocation, this);
+      _classPrivateFieldSet(_nextLocation, this, undefined);
+      await _assertClassBrand(_Router_brand, this, _queuedRender).call(this, nextLocation);
     }
-  });
-  return _queuedRender2.apply(this, arguments);
-}
-function _render(_x4) {
-  return _render2.apply(this, arguments);
+  }
 }
-function _render2() {
-  _render2 = _asyncToGenerator(function* (location) {
-    var _hooks$flowApi,
-      _hooks$pageView,
-      _classPrivateFieldGet6,
-      _storyboard$app,
-      _this2 = this;
-    var renderId = _classPrivateFieldSet(_renderId, this, uniqueId("render-id-"));
-    resetAllComputedMarks();
-    clearResolveCache();
-    hooks === null || hooks === void 0 || (_hooks$flowApi = hooks.flowApi) === null || _hooks$flowApi === void 0 || _hooks$flowApi.clearCollectWidgetContract();
-    var history = getHistory();
-    history.unblock();
+async function _render(location) {
+  var _hooks$flowApi, _hooks$pageView, _classPrivateFieldGet6, _storyboard$app;
+  const renderId = _classPrivateFieldSet(_renderId, this, uniqueId("render-id-"));
+  resetAllComputedMarks();
+  clearResolveCache();
+  hooks === null || hooks === void 0 || (_hooks$flowApi = hooks.flowApi) === null || _hooks$flowApi === void 0 || _hooks$flowApi.clearCollectWidgetContract();
+  const history = getHistory();
+  history.unblock();
 
-    // const renderStartTime = performance.now();
-    var finishPageView = hooks === null || hooks === void 0 || (_hooks$pageView = hooks.pageView) === null || _hooks$pageView === void 0 ? void 0 : _hooks$pageView.create();
-    var storyboard = matchStoryboard(_classPrivateFieldGet(_storyboards, this), location.pathname);
-    var previousApp = (_classPrivateFieldGet6 = _classPrivateFieldGet(_runtimeContext, this)) === null || _classPrivateFieldGet6 === void 0 ? void 0 : _classPrivateFieldGet6.app;
-    var currentAppId = storyboard === null || storyboard === void 0 || (_storyboard$app = storyboard.app) === null || _storyboard$app === void 0 ? void 0 : _storyboard$app.id;
-    //  dynamically change the value of the APP variable, if it's union app
-    if (window.BOOTSTRAP_UNION_FILE && currentAppId && currentAppId !== (previousApp === null || previousApp === void 0 ? void 0 : previousApp.id)) {
-      setAppVariable({
-        appId: currentAppId,
-        version: storyboard.app.currentVersion
-      });
-    }
-    if (storyboard !== null && storyboard !== void 0 && storyboard.app) {
-      yield fulfilStoryboard(storyboard);
-    }
-    var currentApp = _classPrivateFieldSet(_currentApp, this, storyboard === null || storyboard === void 0 ? void 0 : storyboard.app);
-    setWatermark();
+  // const renderStartTime = performance.now();
+  const finishPageView = hooks === null || hooks === void 0 || (_hooks$pageView = hooks.pageView) === null || _hooks$pageView === void 0 ? void 0 : _hooks$pageView.create();
+  const storyboard = matchStoryboard(_classPrivateFieldGet(_storyboards, this), location.pathname);
+  const previousApp = (_classPrivateFieldGet6 = _classPrivateFieldGet(_runtimeContext, this)) === null || _classPrivateFieldGet6 === void 0 ? void 0 : _classPrivateFieldGet6.app;
+  const currentAppId = storyboard === null || storyboard === void 0 || (_storyboard$app = storyboard.app) === null || _storyboard$app === void 0 ? void 0 : _storyboard$app.id;
+  //  dynamically change the value of the APP variable, if it's union app
+  if (window.BOOTSTRAP_UNION_FILE && currentAppId && currentAppId !== (previousApp === null || previousApp === void 0 ? void 0 : previousApp.id)) {
+    setAppVariable({
+      appId: currentAppId,
+      version: storyboard.app.currentVersion
+    });
+  }
+  if (storyboard !== null && storyboard !== void 0 && storyboard.app) {
+    await fulfilStoryboard(storyboard);
+  }
+  const currentApp = _classPrivateFieldSet(_currentApp, this, storyboard === null || storyboard === void 0 ? void 0 : storyboard.app);
+  setWatermark();
 
-    // Storyboard maybe re-assigned, e.g. when open launchpad.
-    var appChanged = previousApp && currentApp ? previousApp.id !== currentApp.id : previousApp !== currentApp;
+  // Storyboard maybe re-assigned, e.g. when open launchpad.
+  const appChanged = previousApp && currentApp ? previousApp.id !== currentApp.id : previousApp !== currentApp;
 
-    // TODO: handle favicon
+  // TODO: handle favicon
 
-    // Set `Router::#currentApp` before calling `getFeatureFlags()`
-    var flags = getRuntime().getFeatureFlags();
-    var prevRendererContext = _classPrivateFieldGet(_rendererContext, this);
-    var redirectTo = (to, state) => {
-      finishPageView === null || finishPageView === void 0 || finishPageView({
-        status: "redirected"
-      });
-      _classPrivateFieldGet(_rendererContextTrashCan, this).add(prevRendererContext);
-      _assertClassBrand(_Router_brand, this, _safeRedirect).call(this, to, state, location);
-    };
-    var redirectToLogin = () => {
-      var to = flags["sso-enabled"] ? "/sso-auth/login" : "/auth/login";
-      setLoginStateCookie(location);
-      redirectTo(to, {
-        from: location
-      });
-    };
-    var main = document.querySelector("#main-mount-point");
-    var portal = document.querySelector("#portal-mount-point");
-    var renderRoot = {
-      tag: RenderTag.ROOT,
-      container: main,
-      createPortal: portal
-    };
-    var cleanUpPreviousRender = () => {
-      var _hooks$messageDispatc;
-      unmountTree(main);
-      unmountTree(portal);
+  // Set `Router::#currentApp` before calling `getFeatureFlags()`
+  const flags = getRuntime().getFeatureFlags();
+  const prevRendererContext = _classPrivateFieldGet(_rendererContext, this);
+  const redirectTo = (to, state) => {
+    finishPageView === null || finishPageView === void 0 || finishPageView({
+      status: "redirected"
+    });
+    _classPrivateFieldGet(_rendererContextTrashCan, this).add(prevRendererContext);
+    _assertClassBrand(_Router_brand, this, _safeRedirect).call(this, to, state, location);
+  };
+  const redirectToLogin = () => {
+    const to = flags["sso-enabled"] ? "/sso-auth/login" : "/auth/login";
+    setLoginStateCookie(location);
+    redirectTo(to, {
+      from: location
+    });
+  };
+  const main = document.querySelector("#main-mount-point");
+  const portal = document.querySelector("#portal-mount-point");
+  const renderRoot = {
+    tag: RenderTag.ROOT,
+    container: main,
+    createPortal: portal
+  };
+  const cleanUpPreviousRender = () => {
+    var _hooks$messageDispatc;
+    unmountTree(main);
+    unmountTree(portal);
 
-      // Note: redirects can lead to multiple trash renderer contexts.
-      _classPrivateFieldGet(_rendererContextTrashCan, this).add(prevRendererContext);
-      for (var item of _classPrivateFieldGet(_rendererContextTrashCan, this)) {
-        if (item) {
-          item.dispatchOnUnmount();
-          item.dispose();
-        }
-      }
-      _classPrivateFieldGet(_rendererContextTrashCan, this).clear();
-      hooks === null || hooks === void 0 || (_hooks$messageDispatc = hooks.messageDispatcher) === null || _hooks$messageDispatc === void 0 || _hooks$messageDispatc.reset();
-      if (appChanged) {
-        _classPrivateFieldSet(_previousApp, this, previousApp);
-        window.dispatchEvent(new CustomEvent("app.change", {
-          detail: {
-            previousApp,
-            currentApp
-          }
-        }));
+    // Note: redirects can lead to multiple trash renderer contexts.
+    _classPrivateFieldGet(_rendererContextTrashCan, this).add(prevRendererContext);
+    for (const item of _classPrivateFieldGet(_rendererContextTrashCan, this)) {
+      if (item) {
+        item.dispatchOnUnmount();
+        item.dispose();
       }
-    };
-    setTheme(currentApp && (getLocalAppsTheme()[currentApp.id] || currentApp.theme) || "light");
-    setMode("default");
-    if (currentApp) {
-      var _hooks$checkInstalled, _hooks$auth, _hooks$checkPermissio, _storyboard$meta, _hooks$flowApi2, _storyboard$meta2;
-      hooks === null || hooks === void 0 || (_hooks$checkInstalled = hooks.checkInstalledApps) === null || _hooks$checkInstalled === void 0 || _hooks$checkInstalled.preCheckInstalledApps(storyboard, appId => !!_internalApiGetAppInBootstrapData(appId));
-      var routeHelper = {
-        bailout: output => {
-          if (output.unauthenticated) {
-            redirectToLogin();
-            return true;
-          }
-          if (output.redirect) {
-            redirectTo(output.redirect.path, output.redirect.state);
-            return true;
-          }
-          // Reset redirect count if no redirect is set.
-          _classPrivateFieldSet(_redirectCount, this, 0);
-        },
-        mergeMenus: function () {
-          var _ref2 = _asyncToGenerator(function* (menuRequests) {
-            var menuConfs = yield Promise.all(menuRequests);
-            _classPrivateFieldSet(_navConfig, _this2, mergeMenuConfs(menuConfs));
-            window.dispatchEvent(new CustomEvent("navConfig.change", {
-              detail: _classPrivateFieldGet(_navConfig, _this2)
-            }));
-          });
-          return function mergeMenus(_x5) {
-            return _ref2.apply(this, arguments);
-          };
-        }(),
-        catch: (error, returnNode) => {
-          if (isUnauthenticatedError(error) && !window.NO_AUTH_GUARD) {
-            redirectToLogin();
-            return;
-          } else if (error instanceof HttpAbortError) {
-            _classPrivateFieldGet(_rendererContextTrashCan, this).add(prevRendererContext);
-            return;
-          } else {
-            var noAuthGuardLoginPath = getRuntime().getMiscSettings().noAuthGuardLoginPath;
-            if (isUnauthenticatedError(error) && noAuthGuardLoginPath) {
-              redirectTo(noAuthGuardLoginPath, {
-                from: location
-              });
-              return;
-            }
-            return {
-              failed: true,
-              output: {
-                node: {
-                  tag: RenderTag.BRICK,
-                  type: "div",
-                  properties: {
-                    textContent: httpErrorToString(error),
-                    style: {
-                      color: "var(--color-error)"
-                    }
-                  },
-                  runtimeContext: null,
-                  return: returnNode
-                },
-                blockingList: []
-              }
-            };
-          }
+    }
+    _classPrivateFieldGet(_rendererContextTrashCan, this).clear();
+    hooks === null || hooks === void 0 || (_hooks$messageDispatc = hooks.messageDispatcher) === null || _hooks$messageDispatc === void 0 || _hooks$messageDispatc.reset();
+    if (appChanged) {
+      _classPrivateFieldSet(_previousApp, this, previousApp);
+      window.dispatchEvent(new CustomEvent("app.change", {
+        detail: {
+          previousApp,
+          currentApp
         }
-      };
-      var rendererContext = _classPrivateFieldSet(_rendererContext, this, new RendererContext("page", {
-        routeHelper,
-        renderId
       }));
-      var runtimeContext = _classPrivateFieldSet(_runtimeContext, this, {
-        app: currentApp,
-        location,
-        query: new URLSearchParams(location.search),
-        flags,
-        sys: _objectSpread(_objectSpread(_objectSpread({}, hooks === null || hooks === void 0 || (_hooks$auth = hooks.auth) === null || _hooks$auth === void 0 ? void 0 : _hooks$auth.getAuth()), getPageInfo()), {}, {
-          settings: {
-            brand: getRuntime().getBrandSettings()
-          }
-        }),
-        ctxStore: new DataStore("CTX", undefined, rendererContext),
-        pendingPermissionsPreCheck: [hooks === null || hooks === void 0 || (_hooks$checkPermissio = hooks.checkPermissions) === null || _hooks$checkPermissio === void 0 ? void 0 : _hooks$checkPermissio.preCheckPermissions(storyboard)],
-        tplStateStoreMap: new Map(),
-        formStateStoreMap: new Map()
-      });
-      _classPrivateFieldSet(_navConfig, this, undefined);
-      registerCustomTemplates(storyboard);
-      registerStoryboardFunctions((_storyboard$meta = storyboard.meta) === null || _storyboard$meta === void 0 ? void 0 : _storyboard$meta.functions, currentApp);
-      hooks === null || hooks === void 0 || (_hooks$flowApi2 = hooks.flowApi) === null || _hooks$flowApi2 === void 0 || _hooks$flowApi2.collectContract((_storyboard$meta2 = storyboard.meta) === null || _storyboard$meta2 === void 0 ? void 0 : _storyboard$meta2.contracts);
-      var failed = false;
-      var output;
-      var stores = [];
-      try {
-        var rootMenuRequestNode = {};
-        output = yield renderRoutes(renderRoot, insertPreviewRoutes(storyboard.routes), runtimeContext, rendererContext, [], rootMenuRequestNode);
-        if (routeHelper.bailout(output)) {
-          return;
+    }
+  };
+  setTheme(currentApp && (getLocalAppsTheme()[currentApp.id] || currentApp.theme) || "light");
+  setMode("default");
+  if (currentApp) {
+    var _hooks$checkInstalled, _hooks$auth, _hooks$checkPermissio, _storyboard$meta, _hooks$flowApi2, _storyboard$meta2;
+    hooks === null || hooks === void 0 || (_hooks$checkInstalled = hooks.checkInstalledApps) === null || _hooks$checkInstalled === void 0 || _hooks$checkInstalled.preCheckInstalledApps(storyboard, appId => !!_internalApiGetAppInBootstrapData(appId));
+    const routeHelper = {
+      bailout: output => {
+        if (output.unauthenticated) {
+          redirectToLogin();
+          return true;
+        }
+        if (output.redirect) {
+          redirectTo(output.redirect.path, output.redirect.state);
+          return true;
         }
-        stores = getDataStores(runtimeContext);
-        yield postAsyncRender(output, runtimeContext, stores);
-        rootMenuRequestNode.child = output.menuRequestNode;
-        rendererContext.setInitialMenuRequestNode(rootMenuRequestNode);
-        yield routeHelper.mergeMenus(rendererContext.getMenuRequests());
-      } catch (error) {
-        // eslint-disable-next-line no-console
-        console.error("Router failed:", error);
-        var result = routeHelper.catch(error, renderRoot);
-        if (!result) {
+        // Reset redirect count if no redirect is set.
+        _classPrivateFieldSet(_redirectCount, this, 0);
+      },
+      mergeMenus: async menuRequests => {
+        const menuConfs = await Promise.all(menuRequests);
+        _classPrivateFieldSet(_navConfig, this, mergeMenuConfs(menuConfs));
+        window.dispatchEvent(new CustomEvent("navConfig.change", {
+          detail: _classPrivateFieldGet(_navConfig, this)
+        }));
+      },
+      catch: (error, returnNode) => {
+        if (isUnauthenticatedError(error) && !window.NO_AUTH_GUARD) {
+          redirectToLogin();
+          return;
+        } else if (error instanceof HttpAbortError) {
+          _classPrivateFieldGet(_rendererContextTrashCan, this).add(prevRendererContext);
           return;
+        } else {
+          const noAuthGuardLoginPath = getRuntime().getMiscSettings().noAuthGuardLoginPath;
+          if (isUnauthenticatedError(error) && noAuthGuardLoginPath) {
+            redirectTo(noAuthGuardLoginPath, {
+              from: location
+            });
+            return;
+          }
+          return {
+            failed: true,
+            output: {
+              node: {
+                tag: RenderTag.BRICK,
+                type: "div",
+                properties: {
+                  textContent: httpErrorToString(error),
+                  dataset: {
+                    errorBoundary: ""
+                  },
+                  style: {
+                    color: "var(--color-error)"
+                  }
+                },
+                runtimeContext: null,
+                return: returnNode
+              },
+              blockingList: []
+            }
+          };
         }
-        ({
-          failed,
-          output
-        } = result);
       }
-      renderRoot.child = output.node;
-      cleanUpPreviousRender();
-      if (output.route && output.route.type !== "routes" || failed) {
-        if (!failed) {
-          // There is a window to set theme and mode by `lifeCycle.onBeforePageLoad`.
-          rendererContext.dispatchBeforePageLoad();
+    };
+    const rendererContext = _classPrivateFieldSet(_rendererContext, this, new RendererContext("page", {
+      routeHelper,
+      renderId
+    }));
+    const runtimeContext = _classPrivateFieldSet(_runtimeContext, this, {
+      app: currentApp,
+      location,
+      query: new URLSearchParams(location.search),
+      flags,
+      sys: {
+        ...(hooks === null || hooks === void 0 || (_hooks$auth = hooks.auth) === null || _hooks$auth === void 0 ? void 0 : _hooks$auth.getAuth()),
+        ...getPageInfo(),
+        settings: {
+          brand: getRuntime().getBrandSettings()
         }
-        applyTheme();
-        applyMode();
-        setUIVersion(currentApp === null || currentApp === void 0 ? void 0 : currentApp.uiVersion);
-        mountTree(renderRoot);
+      },
+      ctxStore: new DataStore("CTX", undefined, rendererContext),
+      pendingPermissionsPreCheck: [hooks === null || hooks === void 0 || (_hooks$checkPermissio = hooks.checkPermissions) === null || _hooks$checkPermissio === void 0 ? void 0 : _hooks$checkPermissio.preCheckPermissions(storyboard)],
+      tplStateStoreMap: new Map(),
+      formStateStoreMap: new Map()
+    });
+    _classPrivateFieldSet(_navConfig, this, undefined);
+    registerCustomTemplates(storyboard);
+    registerStoryboardFunctions((_storyboard$meta = storyboard.meta) === null || _storyboard$meta === void 0 ? void 0 : _storyboard$meta.functions, currentApp);
+    hooks === null || hooks === void 0 || (_hooks$flowApi2 = hooks.flowApi) === null || _hooks$flowApi2 === void 0 || _hooks$flowApi2.collectContract((_storyboard$meta2 = storyboard.meta) === null || _storyboard$meta2 === void 0 ? void 0 : _storyboard$meta2.contracts);
+    let failed = false;
+    let output;
+    let stores = [];
+    try {
+      const rootMenuRequestNode = {};
+      output = await renderRoutes(renderRoot, insertPreviewRoutes(storyboard.routes), runtimeContext, rendererContext, [], rootMenuRequestNode);
+      if (routeHelper.bailout(output)) {
+        return;
+      }
+      stores = getDataStores(runtimeContext);
+      await postAsyncRender(output, runtimeContext, stores);
+      rootMenuRequestNode.child = output.menuRequestNode;
+      rendererContext.setInitialMenuRequestNode(rootMenuRequestNode);
+      await routeHelper.mergeMenus(rendererContext.getMenuRequests());
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.error("Router failed:", error);
+      const result = routeHelper.catch(error, renderRoot);
+      if (!result) {
+        return;
+      }
+      ({
+        failed,
+        output
+      } = result);
+    }
+    renderRoot.child = output.node;
+    cleanUpPreviousRender();
+    if (output.route && output.route.type !== "routes" || failed) {
+      if (!failed) {
+        // There is a window to set theme and mode by `lifeCycle.onBeforePageLoad`.
+        rendererContext.dispatchBeforePageLoad();
+      }
+      applyTheme();
+      applyMode();
+      setUIVersion(currentApp === null || currentApp === void 0 ? void 0 : currentApp.uiVersion);
+      mountTree(renderRoot);
 
-        // Scroll to top after each rendering.
-        // See https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/docs/guides/scroll-restoration.md
-        window.scrollTo(0, 0);
-        if (!failed) {
-          rendererContext.dispatchPageLoad();
-          rendererContext.dispatchAnchorLoad();
-          rendererContext.dispatchOnMount();
-          rendererContext.initializeScrollIntoView();
-          rendererContext.initializeMediaChange();
-          rendererContext.initializeMessageDispatcher();
-          for (var store of stores) {
-            store.mountAsyncData();
-          }
-          finishPageView === null || finishPageView === void 0 || finishPageView({
-            status: "ok",
-            path: output.path,
-            pageTitle: document.title
-          });
-        } else {
-          finishPageView === null || finishPageView === void 0 || finishPageView({
-            status: "failed"
-          });
+      // Scroll to top after each rendering.
+      // See https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/docs/guides/scroll-restoration.md
+      window.scrollTo(0, 0);
+      if (!failed) {
+        rendererContext.dispatchPageLoad();
+        rendererContext.dispatchAnchorLoad();
+        rendererContext.dispatchOnMount();
+        rendererContext.initializeScrollIntoView();
+        rendererContext.initializeMediaChange();
+        rendererContext.initializeMessageDispatcher();
+        for (const store of stores) {
+          store.mountAsyncData();
         }
-        devtoolsHookEmit("rendered");
-        return;
+        finishPageView === null || finishPageView === void 0 || finishPageView({
+          status: "ok",
+          path: output.path,
+          pageTitle: document.title
+        });
+      } else {
+        finishPageView === null || finishPageView === void 0 || finishPageView({
+          status: "failed"
+        });
       }
-    } else if (!window.NO_AUTH_GUARD && hooks !== null && hooks !== void 0 && hooks.auth && !hooks.auth.isLoggedIn()) {
-      // Todo(steve): refine after api-gateway supports fetching storyboards before logged in.
-      // Redirect to login if no storyboard is matched.
-      redirectToLogin();
+      devtoolsHookEmit("rendered");
       return;
-    } else {
-      cleanUpPreviousRender();
     }
-    applyTheme();
-    applyMode();
-    var node = {
-      tag: RenderTag.BRICK,
-      type: "div",
-      properties: {
-        textContent: "Page not found"
-      },
-      runtimeContext: null,
-      return: renderRoot
-    };
-    renderRoot.child = node;
-    mountTree(renderRoot);
+  } else if (!window.NO_AUTH_GUARD && hooks !== null && hooks !== void 0 && hooks.auth && !hooks.auth.isLoggedIn()) {
+    // Todo(steve): refine after api-gateway supports fetching storyboards before logged in.
+    // Redirect to login if no storyboard is matched.
+    redirectToLogin();
+    return;
+  } else {
+    cleanUpPreviousRender();
+  }
+  applyTheme();
+  applyMode();
+  const node = {
+    tag: RenderTag.BRICK,
+    type: "div",
+    properties: {
+      textContent: "Page not found"
+    },
+    runtimeContext: null,
+    return: renderRoot
+  };
+  renderRoot.child = node;
+  mountTree(renderRoot);
 
-    // Scroll to top after each rendering.
-    window.scrollTo(0, 0);
-    finishPageView === null || finishPageView === void 0 || finishPageView({
-      status: "not-found"
-    });
-    devtoolsHookEmit("rendered");
+  // Scroll to top after each rendering.
+  window.scrollTo(0, 0);
+  finishPageView === null || finishPageView === void 0 || finishPageView({
+    status: "not-found"
   });
-  return _render2.apply(this, arguments);
+  devtoolsHookEmit("rendered");
 }
 function mergeMenuConfs(menuConfs) {
-  var navConfig = {
+  const navConfig = {
     breadcrumb: []
   };
-  for (var menuConf of menuConfs) {
-    var {
+  for (const menuConf of menuConfs) {
+    const {
       breadcrumb
     } = menuConf;
     if (breadcrumb) {