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

package/core/util/security.js

@@ -1,183 +1,144 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useTrustAs = exports.useSafeUrl = exports.useSafeStyle = exports.useSafeResourceUrl = exports.useSafeHtml = exports.securityService = exports.isInsecureContentRequest = exports.SecurityService = exports.SecurityContext = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _dompurify = _interopRequireDefault(require("dompurify"));
-var _startsWith = _interopRequireDefault(require("lodash-es/startsWith"));
-var _react = require("react");
-var _SecurityService;
-/**
- * Security context types that can be trusted
- */
-var SecurityContext = exports.SecurityContext = /*#__PURE__*/function (SecurityContext) {
-  SecurityContext["HTML"] = "HTML";
-  SecurityContext["STYLE"] = "STYLE";
-  SecurityContext["SCRIPT"] = "SCRIPT";
-  SecurityContext["URL"] = "URL";
-  SecurityContext["RESOURCE_URL"] = "RESOURCE_URL";
-  return SecurityContext;
-}({});
-/**
- * Security service for sanitizing and trusting content
- */
-var SecurityService = exports.SecurityService = /*#__PURE__*/function () {
-  function SecurityService() {
-    (0, _classCallCheck2["default"])(this, SecurityService);
-  } // Private constructor to enforce singleton
-  return (0, _createClass2["default"])(SecurityService, [{
-    key: "sanitizeHtml",
-    value:
-    /**
-     * Sanitize HTML content
-     */
-    function sanitizeHtml(content) {
-      if (!content) return "";
-      return _dompurify["default"].sanitize(content, {
-        USE_PROFILES: {
-          html: true
-        }
-      });
-    }
-
-    /**
-     * Sanitize style content
-     */
-  }, {
-    key: "sanitizeStyle",
-    value: function sanitizeStyle(content) {
-      if (!content) return "";
-      return _dompurify["default"].sanitize(content, {
-        USE_PROFILES: {
-          html: true
-        },
-        ALLOWED_TAGS: ["style"],
-        ALLOWED_ATTR: ["type"]
-      });
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import DOMPurify from "dompurify";
+import startsWith from "lodash-es/startsWith";
+var SecurityContext = /* @__PURE__ */ ((SecurityContext2) => {
+  SecurityContext2["HTML"] = "HTML";
+  SecurityContext2["STYLE"] = "STYLE";
+  SecurityContext2["SCRIPT"] = "SCRIPT";
+  SecurityContext2["URL"] = "URL";
+  SecurityContext2["RESOURCE_URL"] = "RESOURCE_URL";
+  return SecurityContext2;
+})(SecurityContext || {});
+const _SecurityService = class _SecurityService {
+  constructor() {
+  }
+  static getInstance() {
+    if (!_SecurityService.instance) {
+      _SecurityService.instance = new _SecurityService();
     }
-
-    /**
-     * Sanitize script content
-     */
-  }, {
-    key: "sanitizeScript",
-    value: function sanitizeScript(content) {
-      if (!content) return "";
-      // Note: DOMPurify strips scripts by default for security
-      // Only use this for trusted sources
-      return content;
+    return _SecurityService.instance;
+  }
+  /**
+   * Sanitize HTML content
+   */
+  sanitizeHtml(content) {
+    if (!content) return "";
+    return DOMPurify.sanitize(content, {
+      USE_PROFILES: { html: true }
+    });
+  }
+  /**
+   * Sanitize style content
+   */
+  sanitizeStyle(content) {
+    if (!content) return "";
+    return DOMPurify.sanitize(content, {
+      USE_PROFILES: { html: true },
+      ALLOWED_TAGS: ["style"],
+      ALLOWED_ATTR: ["type"]
+    });
+  }
+  /**
+   * Sanitize script content
+   */
+  sanitizeScript(content) {
+    if (!content) return "";
+    return content;
+  }
+  /**
+   * Sanitize URL
+   */
+  sanitizeUrl(content) {
+    if (!content) return "";
+    const url = content.trim().toLowerCase();
+    if (url.startsWith("javascript:") || url.startsWith("data:") || url.startsWith("vbscript:")) {
+      return "";
     }
-
-    /**
-     * Sanitize URL
-     */
-  }, {
-    key: "sanitizeUrl",
-    value: function sanitizeUrl(content) {
-      if (!content) return "";
-      // Basic URL sanitization
-      var url = content.trim().toLowerCase();
-      if (url.startsWith("javascript:") || url.startsWith("data:") || url.startsWith("vbscript:")) {
+    return content;
+  }
+  /**
+   * Sanitize Resource URL
+   */
+  sanitizeResourceUrl(content) {
+    if (!content) return "";
+    const sanitizedUrl = this.sanitizeUrl(content);
+    return sanitizedUrl ? String(sanitizedUrl) : "";
+  }
+  /**
+   * Trust content based on security context
+   */
+  trustAs(content, context) {
+    if (!content) return "";
+    switch (context) {
+      case "HTML" /* HTML */:
+        return this.sanitizeHtml(content);
+      case "STYLE" /* STYLE */:
+        return this.sanitizeStyle(content);
+      case "SCRIPT" /* SCRIPT */:
+        return this.sanitizeScript(content);
+      case "URL" /* URL */:
+        return this.sanitizeUrl(content);
+      case "RESOURCE_URL" /* RESOURCE_URL */:
+        return this.sanitizeResourceUrl(content);
+      default:
         return "";
-      }
-      return content;
-    }
-
-    /**
-     * Sanitize Resource URL
-     */
-  }, {
-    key: "sanitizeResourceUrl",
-    value: function sanitizeResourceUrl(content) {
-      if (!content) return "";
-      // First sanitize as a regular URL, then cast to resource URL
-      var sanitizedUrl = this.sanitizeUrl(content);
-      return sanitizedUrl ? String(sanitizedUrl) : "";
-    }
-
-    /**
-     * Trust content based on security context
-     */
-  }, {
-    key: "trustAs",
-    value: function trustAs(content, context) {
-      if (!content) return "";
-      switch (context) {
-        case SecurityContext.HTML:
-          return this.sanitizeHtml(content);
-        case SecurityContext.STYLE:
-          return this.sanitizeStyle(content);
-        case SecurityContext.SCRIPT:
-          return this.sanitizeScript(content);
-        case SecurityContext.URL:
-          return this.sanitizeUrl(content);
-        case SecurityContext.RESOURCE_URL:
-          return this.sanitizeResourceUrl(content);
-        default:
-          return "";
-      }
-    }
-  }], [{
-    key: "getInstance",
-    value: function getInstance() {
-      if (!SecurityService.instance) {
-        SecurityService.instance = new SecurityService();
-      }
-      return SecurityService.instance;
     }
-  }]);
-}(); // Create hooks for easy use in React components
-_SecurityService = SecurityService;
-(0, _defineProperty2["default"])(SecurityService, "instance", void 0);
-var useTrustAs = exports.useTrustAs = function useTrustAs(content, context) {
-  return (0, _react.useMemo)(function () {
+  }
+};
+__publicField(_SecurityService, "instance");
+let SecurityService = _SecurityService;
+import { useMemo } from "react";
+const useTrustAs = (content, context) => {
+  return useMemo(() => {
     return SecurityService.getInstance().trustAs(content, context);
   }, [content, context]);
 };
-var useSafeHtml = exports.useSafeHtml = function useSafeHtml(content) {
-  return (0, _react.useMemo)(function () {
+const useSafeHtml = (content) => {
+  return useMemo(() => {
     return SecurityService.getInstance().sanitizeHtml(content);
   }, [content]);
 };
-var useSafeStyle = exports.useSafeStyle = function useSafeStyle(content) {
-  return (0, _react.useMemo)(function () {
+const useSafeStyle = (content) => {
+  return useMemo(() => {
     return SecurityService.getInstance().sanitizeStyle(content);
   }, [content]);
 };
-var useSafeUrl = exports.useSafeUrl = function useSafeUrl(content) {
-  return (0, _react.useMemo)(function () {
+const useSafeUrl = (content) => {
+  return useMemo(() => {
     return SecurityService.getInstance().sanitizeUrl(content);
   }, [content]);
 };
-var useSafeResourceUrl = exports.useSafeResourceUrl = function useSafeResourceUrl(content) {
-  return (0, _react.useMemo)(function () {
+const useSafeResourceUrl = (content) => {
+  return useMemo(() => {
     return SecurityService.getInstance().sanitizeResourceUrl(content);
   }, [content]);
 };
-var isInsecureContentRequest = exports.isInsecureContentRequest = function isInsecureContentRequest(url) {
-  var REGEX_DATA_URL = /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@\/?%\s]*)\s*$/i;
-  var parser = document.createElement("a");
+const isInsecureContentRequest = (url) => {
+  const REGEX_DATA_URL = /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@\/?%\s]*)\s*$/i;
+  const parser = document.createElement("a");
   parser.href = url;
-
-  // for relative urls IE returns the protocol as empty string
   if (parser.protocol === "") {
     return false;
   }
-
-  // If the inputted source is a base64 url, do not throw insecure content error
   if (REGEX_DATA_URL.test(url)) {
     return false;
   }
-  if ((0, _startsWith["default"])(location.href, "https://")) {
+  if (startsWith(location.href, "https://")) {
     return parser.protocol !== "https:" && parser.protocol !== "wss:";
   }
   return false;
 };
-
-// Export singleton instance
-var securityService = exports.securityService = SecurityService.getInstance();
+const securityService = SecurityService.getInstance();
+export {
+  SecurityContext,
+  SecurityService,
+  isInsecureContentRequest,
+  securityService,
+  useSafeHtml,
+  useSafeResourceUrl,
+  useSafeStyle,
+  useSafeUrl,
+  useTrustAs
+};

package/core/util/utils.d.ts

@@ -15,6 +15,10 @@ export declare const getUrlParams: (link: string) => Record<string, string>;
  * @returns Route name (e.g., "/page")
  */
 export declare const getRouteNameFromLink: (link: string) => string;
+/**
+ * Target page from a WaveMaker goToPage_* onClick handler (source or preview _optionalChain bundle).
+ */
+export declare function getGoToPageNameFromClickHandler(onClick: unknown): string | null;
 /**
  * Opens a link in browser window
  * @param link - URL to open
@@ -31,4 +35,7 @@ export declare const triggerItemAction: (item: any) => void;
 export declare const getCurrentPath: () => string;
 export declare const getItemLink: (item: any, props: any) => string | undefined;
 export declare function hasOwnObjectProperty(obj: any, prop: string): any;
-export declare const mergeProxies: (firstProxy: any, secondProxy: any) => any;
+export declare const getModesFromLocalStorage: () => Record<string, string>;
+export declare function setMode(modes: Record<string, string>, shouldPersist?: boolean): void;
+export declare function initAppModes(): void;
+export declare function teardownAppModes(): void;

package/core/util/utils.js

@@ -1,20 +1,9 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getUrlParams = exports.getRouteNameFromLink = exports.getItemLink = exports.getCurrentPath = exports.Utils = void 0;
-exports.hasOwnObjectProperty = hasOwnObjectProperty;
-exports.triggerItemAction = exports.openLink = exports.mergeProxies = exports.isJQueryError = exports.isInsecureContentRequest = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _navigationMiddleware = require("@wavemaker-ai/react-runtime/store/middleware/navigationMiddleware");
-var _constants = require("../constants");
-var _navigation = require("next/navigation");
-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 REGEX = {
+import { getRouterInstance } from "../../store/middleware/navigationMiddleware";
+import { hyperLinkMofify } from "../constants";
+import { usePathname } from "next/navigation";
+import isObject from "lodash-es/isObject";
+import { MODE_CONSTANTS } from "./index";
+const REGEX = {
   SNAKE_CASE: /[A-Z]/g,
   ANDROID: /Android/i,
   IPHONE: /iPhone/i,
@@ -47,27 +36,19 @@ var REGEX = {
   DATA_URL: /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@\/?%\s]*)\s*$/i,
   ISO_DATE_FORMAT: /(\d{4}-\d{2}-\d{2})T(\d{2}:\d{2}:\d{2})(\.\d+)?([+-]\d{2}:?\d{2}|Z)$/
 };
-
-/**
- * this method checks if a given string starts with the given string
- */
-var stringStartsWith = function stringStartsWith(str, startsWith, ignoreCase) {
+const stringStartsWith = (str, startsWith, ignoreCase) => {
   if (!str) {
     return false;
   }
-  var regEx = new RegExp("^" + startsWith, ignoreCase ? "i" : "");
+  const regEx = new RegExp("^" + startsWith, ignoreCase ? "i" : "");
   return regEx.test(str);
 };
-var isInsecureContentRequest = exports.isInsecureContentRequest = function isInsecureContentRequest(url) {
-  var parser = document.createElement("a");
+const isInsecureContentRequest = (url) => {
+  const parser = document.createElement("a");
   parser.href = url;
-
-  // for relative urls IE returns the protocol as empty string
   if (parser.protocol === "") {
     return false;
   }
-
-  // If the inputted source is a base64 url, do not throw insecure content error
   if (REGEX.DATA_URL.test(url)) {
     return false;
   }
@@ -76,136 +57,91 @@ var isInsecureContentRequest = exports.isInsecureContentRequest = function isIns
   }
   return false;
 };
-var Utils = exports.Utils = {
-  isInsecureContentRequest: isInsecureContentRequest
+const Utils = {
+  isInsecureContentRequest
 };
-var isJQueryError = exports.isJQueryError = function isJQueryError(error) {
+const isJQueryError = (error) => {
   if (!error.stack) return false;
-  var UnSupportedFunctionality = ["jQuery", "$"];
-
-  // Get the first line of stack that points to your code
-  if (error.message && UnSupportedFunctionality.some(function (func) {
-    return error.message.includes(func);
-  })) {
+  const UnSupportedFunctionality = ["jQuery", "$"];
+  if (error.message && UnSupportedFunctionality.some((func) => error.message.includes(func))) {
     return true;
   }
-  var stackLines = error.stack.split("\n");
-  var _iterator = _createForOfIteratorHelper(stackLines),
-    _step;
-  try {
-    for (_iterator.s(); !(_step = _iterator.n()).done;) {
-      var line = _step.value;
-      // Skip internal/node_modules lines, look for your code
-      if (!line.includes("node_modules") && !line.includes("internal")) {
-        // Check if this line contains jQuery access
-        if (line.toLowerCase().includes("jquery") || line.toLowerCase().includes("$")) {
-          return true;
-        }
+  const stackLines = error.stack.split("\n");
+  for (let line of stackLines) {
+    if (!line.includes("node_modules") && !line.includes("internal")) {
+      if (line.toLowerCase().includes("jquery") || line.toLowerCase().includes("$")) {
+        return true;
       }
     }
-  } catch (err) {
-    _iterator.e(err);
-  } finally {
-    _iterator.f();
   }
   return false;
 };
-
-/**
- * Extracts query parameters from a URL using URLSearchParams
- * @param link - URL string (e.g., "#/page?param1=value1&param2=value2")
- * @returns Object with query parameters (automatically URL-decoded)
- */
-var getUrlParams = exports.getUrlParams = function getUrlParams(link) {
-  var params = {};
-  var index = link.indexOf("?");
+const getUrlParams = (link) => {
+  const params = {};
+  const index = link.indexOf("?");
   if (index !== -1) {
-    var queryString = link.substring(index + 1);
-    var searchParams = new URLSearchParams(queryString);
-    searchParams.forEach(function (value, key) {
+    const queryString = link.substring(index + 1);
+    const searchParams = new URLSearchParams(queryString);
+    searchParams.forEach((value, key) => {
       params[key] = value;
     });
   }
   return params;
 };
-
-/**
- * Extracts route name from a link
- * @param link - URL string (e.g., "#/page?param=value")
- * @returns Route name (e.g., "/page")
- */
-var getRouteNameFromLink = exports.getRouteNameFromLink = function getRouteNameFromLink(link) {
+const getRouteNameFromLink = (link) => {
   link = link.replace("#/", "/");
-  var index = link.indexOf("?");
+  const index = link.indexOf("?");
   if (index !== -1) {
     link = link.substring(0, index);
   }
   return link;
 };
-
-/**
- * Opens a link in browser window
- * @param link - URL to open
- * @param target - Target attribute (_blank, _self, etc.)
- */
-var openLink = exports.openLink = function openLink(link) {
-  var target = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "_self";
+function getGoToPageNameFromClickHandler(onClick) {
+  var _a;
+  if (typeof onClick !== "function") {
+    return null;
+  }
+  const fnStr = onClick.toString();
+  if (!/invoke/.test(fnStr)) {
+    return null;
+  }
+  const match = /goToPage_([A-Za-z0-9_]+)/.exec(fnStr);
+  return (_a = match == null ? void 0 : match[1]) != null ? _a : null;
+}
+const openLink = (link, target = "_self") => {
   window.open(link, target);
 };
-
-/**
- * Triggers navigation action for menu item
- * Mimics Angular WaveMaker behavior:
- * 1. Executes item.action if present
- * 2. Then navigates to item.link if present
- */
-var triggerItemAction = exports.triggerItemAction = function triggerItemAction(item) {
-  var router = (0, _navigationMiddleware.getRouterInstance)();
-  var originalLink = item === null || item === void 0 ? void 0 : item.link;
-  var linkTarget = item === null || item === void 0 ? void 0 : item.target;
+const triggerItemAction = (item) => {
+  const router = getRouterInstance();
+  let originalLink = item == null ? void 0 : item.link;
+  const linkTarget = item == null ? void 0 : item.target;
   if (typeof originalLink === "function" || !originalLink || originalLink === "#" || originalLink === "javascript:void(0)") {
-    return; // No navigation needed
-  }
-
-  // Check if it's an internal navigation link (starts with # but not external)
-  if (originalLink !== null && originalLink !== void 0 && originalLink.startsWith("#") && (!linkTarget || linkTarget === "_self")) {
-    // Internal navigation - handle both "#/page" and "#page" formats
-    var queryParams = getUrlParams(originalLink);
-    var routeName = getRouteNameFromLink(originalLink);
-    routeName = (0, _constants.hyperLinkMofify)(routeName);
+    return;
+  }
+  if ((originalLink == null ? void 0 : originalLink.startsWith("#")) && (!linkTarget || linkTarget === "_self")) {
+    const queryParams = getUrlParams(originalLink);
+    let routeName = getRouteNameFromLink(originalLink);
+    routeName = hyperLinkMofify(routeName);
     if (Object.keys(queryParams).length > 0) {
-      // Filter out undefined/null/empty values like Angular router does
-      var queryString = Object.entries(queryParams).filter(function (_ref) {
-        var _ref2 = (0, _slicedToArray2["default"])(_ref, 2),
-          _ = _ref2[0],
-          value = _ref2[1];
-        return value !== undefined && value !== null && value !== "";
-      }).map(function (_ref3) {
-        var _ref4 = (0, _slicedToArray2["default"])(_ref3, 2),
-          key = _ref4[0],
-          value = _ref4[1];
-        return "".concat(key, "=").concat(encodeURIComponent(value));
-      }).join("&");
+      const queryString = Object.entries(queryParams).filter(([_, value]) => value !== void 0 && value !== null && value !== "").map(([key, value]) => `${key}=${encodeURIComponent(value)}`).join("&");
       if (queryString) {
-        router === null || router === void 0 || router.push("".concat(routeName, "?").concat(queryString));
+        router == null ? void 0 : router.push(`${routeName}?${queryString}`);
       } else {
-        router === null || router === void 0 || router.push(routeName);
+        router == null ? void 0 : router.push(routeName);
       }
     } else {
-      router === null || router === void 0 || router.push(routeName);
+      router == null ? void 0 : router.push(routeName);
     }
   } else if (linkTarget || originalLink) {
-    // External link or link with different target
-    // For external links, use as-is (don't apply hyperLinkMofify)
     openLink(originalLink, linkTarget || "");
   }
 };
-var getCurrentPath = exports.getCurrentPath = function getCurrentPath() {
-  var path = (0, _navigation.usePathname)();
+const getCurrentPath = () => {
+  const path = usePathname();
   return path;
 };
-var getItemLink = exports.getItemLink = function getItemLink(item, props) {
-  var linkProperty = props.itemlink || "link";
+const getItemLink = (item, props) => {
+  const linkProperty = props.itemlink || "link";
   if (typeof item[linkProperty] === "function") {
     return item[linkProperty]();
   } else {
@@ -215,14 +151,70 @@ var getItemLink = exports.getItemLink = function getItemLink(item, props) {
 function hasOwnObjectProperty(obj, prop) {
   return Object.prototype.hasOwnProperty.call(obj, prop);
 }
-var mergeProxies = exports.mergeProxies = function mergeProxies(firstProxy, secondProxy) {
-  return new Proxy(firstProxy, {
-    get: function get(target, key) {
-      return key in target ? target[key] : secondProxy[key];
-    },
-    set: function set(target, key, value) {
-      target[key] = value; // delegates back to pageProxy.widgets
-      return true;
+const getModesFromLocalStorage = () => {
+  let storedValue = localStorage.getItem("wm-app-modes") || "{}";
+  try {
+    storedValue = JSON.parse(storedValue);
+  } catch (error) {
+    console.error("Error parsing modes", error == null ? void 0 : error.message);
+    storedValue = {};
+  }
+  return isObject(storedValue) ? storedValue : {};
+};
+function setMode(modes, shouldPersist = false) {
+  const htmlEl = document.getElementsByTagName("html")[0];
+  if (!htmlEl) return;
+  if (!isObject(modes)) {
+    modes = {};
+  }
+  const modesArr = Object.entries(modes);
+  if (!modesArr.length) return;
+  modesArr.forEach(([modeKey, modeValue]) => {
+    const isDefault = modeValue === MODE_CONSTANTS.LIGHT || modeValue === MODE_CONSTANTS.DEFAULT;
+    if (isDefault) {
+      htmlEl.removeAttribute(modeKey);
+    } else {
+      htmlEl.setAttribute(modeKey, modeValue);
     }
   });
-};
+  if (shouldPersist) {
+    localStorage.setItem("wm-app-modes", JSON.stringify(modes));
+  }
+}
+let windowMessageListener = null;
+function initAppModes() {
+  setMode(getModesFromLocalStorage());
+  if (windowMessageListener) {
+    window.removeEventListener("message", windowMessageListener);
+  }
+  windowMessageListener = (event) => {
+    const { key, modes, shouldPersist } = event.data || {};
+    if (key === "switch-mode" && modes) {
+      setMode(modes, !shouldPersist);
+    }
+  };
+  window.addEventListener("message", windowMessageListener);
+}
+function teardownAppModes() {
+  if (windowMessageListener) {
+    window.removeEventListener("message", windowMessageListener);
+    windowMessageListener = null;
+  }
+}
+export {
+  Utils,
+  getCurrentPath,
+  getGoToPageNameFromClickHandler,
+  getItemLink,
+  getModesFromLocalStorage,
+  getRouteNameFromLink,
+  getUrlParams,
+  hasOwnObjectProperty,
+  initAppModes,
+  isInsecureContentRequest,
+  isJQueryError,
+  openLink,
+  setMode,
+  teardownAppModes,
+  triggerItemAction
+};