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

package/core/formatter/security-formatters.js

@@ -0,0 +1,321 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof3 = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TrustedContent = exports.TrustAsFormatter = exports.SanitizeFormatter = void 0;
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _dompurify = _interopRequireDefault(require("dompurify"));
+var React = _interopRequireWildcard(require("react"));
+var _types = require("./types");
+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" != _typeof3(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); }
+// @ts-ignore
+var TrustAsFormatter = exports.TrustAsFormatter = /*#__PURE__*/function () {
+  function TrustAsFormatter() {
+    (0, _classCallCheck2["default"])(this, TrustAsFormatter);
+  }
+  return (0, _createClass2["default"])(TrustAsFormatter, [{
+    key: "format",
+    value: function format(content) {
+      var context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "html";
+      if (content === null || content === undefined) {
+        return "";
+      }
+
+      // Convert context to string if it's a SecurityContext enum
+      var contextStr;
+      switch (context) {
+        case "html":
+        case _types.SecurityContext.HTML:
+          contextStr = "html";
+          break;
+        case "style":
+        case _types.SecurityContext.STYLE:
+          contextStr = "style";
+          break;
+        case "script":
+        case _types.SecurityContext.SCRIPT:
+          contextStr = "script";
+          break;
+        case "url":
+        case _types.SecurityContext.URL:
+          contextStr = "url";
+          break;
+        case "resource":
+        case "resourceUrl":
+        case _types.SecurityContext.RESOURCE_URL:
+          contextStr = "resource";
+          break;
+        default:
+          contextStr = "html";
+      }
+
+      // Return trusted value directly based on context
+      switch (contextStr) {
+        case "html":
+          return this.bypassSecurityTrustHtml(content);
+        case "style":
+          return this.bypassSecurityTrustStyle(content);
+        case "script":
+          return this.bypassSecurityTrustScript(content);
+        case "url":
+          return this.bypassSecurityTrustUrl(content);
+        case "resource":
+          return this.bypassSecurityTrustResourceUrl(content);
+        default:
+          return content;
+      }
+    }
+  }, {
+    key: "bypassSecurityTrustHtml",
+    value: function bypassSecurityTrustHtml(value) {
+      return value;
+    }
+  }, {
+    key: "bypassSecurityTrustStyle",
+    value: function bypassSecurityTrustStyle(value) {
+      return value;
+    }
+  }, {
+    key: "bypassSecurityTrustScript",
+    value: function bypassSecurityTrustScript(value) {
+      console.warn("Bypassing script security. Make sure you trust the content.");
+      return value;
+    }
+  }, {
+    key: "bypassSecurityTrustUrl",
+    value: function bypassSecurityTrustUrl(value) {
+      // Basic URL validation
+      try {
+        new URL(value, typeof window !== "undefined" ? window.location.origin : "http://localhost");
+        return value;
+      } catch (_unused) {
+        console.warn("Invalid URL provided to trustAs formatter:", value);
+        return "";
+      }
+    }
+  }, {
+    key: "bypassSecurityTrustResourceUrl",
+    value: function bypassSecurityTrustResourceUrl(value) {
+      // Basic URL validation for resource URLs
+      try {
+        new URL(value, typeof window !== "undefined" ? window.location.origin : "http://localhost");
+        return value;
+      } catch (_unused2) {
+        console.warn("Invalid resource URL provided to trustAs formatter:", value);
+        return "";
+      }
+    }
+
+    // Helper method to check if a value is trusted
+  }], [{
+    key: "isTrustedValue",
+    value: function isTrustedValue(value) {
+      return value && (0, _typeof2["default"])(value) === "object" && "__trustAs" in value && "__trustedValue" in value;
+    }
+
+    // Helper method to extract trusted value
+  }, {
+    key: "getTrustedValue",
+    value: function getTrustedValue(value) {
+      if (this.isTrustedValue(value)) {
+        return value.__trustedValue;
+      }
+      return value;
+    }
+
+    // Helper method to get trust type
+  }, {
+    key: "getTrustType",
+    value: function getTrustType(value) {
+      if (this.isTrustedValue(value)) {
+        return value.__trustAs;
+      }
+      return null;
+    }
+  }]);
+}();
+var SanitizeFormatter = exports.SanitizeFormatter = /*#__PURE__*/function () {
+  function SanitizeFormatter() {
+    (0, _classCallCheck2["default"])(this, SanitizeFormatter);
+  }
+  return (0, _createClass2["default"])(SanitizeFormatter, [{
+    key: "format",
+    value: function format(input) {
+      var sanitizeType = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "html";
+      if (!input) return input;
+
+      // Check if input is already trusted - if so, return the trusted value
+      if (TrustAsFormatter.isTrustedValue(input)) {
+        return TrustAsFormatter.getTrustedValue(input);
+      }
+      switch (sanitizeType) {
+        case "html":
+          return this.sanitizeHtml(input);
+        case "script":
+          // Scripts should be completely removed for security
+          return "";
+        case "style":
+          return this.sanitizeStyle(input);
+        case "url":
+        case "resourceUrl":
+          return this.sanitizeUrl(input);
+        default:
+          return this.sanitizeHtml(input);
+        // Default to HTML sanitization
+      }
+    }
+  }, {
+    key: "sanitizeHtml",
+    value: function sanitizeHtml(html) {
+      try {
+        // Check if we're in a browser environment and DOMPurify is available
+        if (typeof window !== "undefined" && _dompurify["default"] && typeof _dompurify["default"].sanitize === "function") {
+          // Use DOMPurify for robust HTML sanitization
+          // Configure DOMPurify to allow common safe tags and attributes
+          var cleanHtml = _dompurify["default"].sanitize(html, {
+            ALLOWED_TAGS: ["p", "div", "span", "a", "strong", "em", "u", "b", "i", "ul", "ol", "li", "br", "h1", "h2", "h3", "h4", "h5", "h6", "blockquote", "pre", "code", "table", "thead", "tbody", "tr", "td", "th", "img", "video", "audio", "source"],
+            ALLOWED_ATTR: ["href", "title", "alt", "src", "width", "height", "class", "id", "style", "target", "rel", "data-*"],
+            ALLOW_DATA_ATTR: true,
+            ALLOWED_URI_REGEXP: /^(?:(?:(?:f|ht)tps?|mailto|tel|callto|cid|xmpp|data):|[^a-z]|[a-z+.\-]+(?:[^a-z+.\-:]|$))/i
+          });
+          return cleanHtml;
+        } else {
+          // Fallback to basic sanitization if DOMPurify is not available (e.g., in Node.js)
+          return this.basicHtmlSanitization(html);
+        }
+      } catch (error) {
+        console.error("HTML sanitization failed:", error);
+        // Fallback to basic sanitization if DOMPurify fails
+        return this.basicHtmlSanitization(html);
+      }
+    }
+  }, {
+    key: "basicHtmlSanitization",
+    value: function basicHtmlSanitization(html) {
+      // Fallback basic HTML sanitization
+      return html.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, "").replace(/\s*on\w+\s*=\s*["'][^"']*["']/gi, "") // Remove event handlers
+      .replace(/\s*javascript:\s*[^"'\s>]*/gi, "") // Remove javascript: URLs
+      .replace(/<iframe\b[^>]*>/gi, "") // Remove iframes
+      .replace(/<object\b[^>]*>/gi, "") // Remove objects
+      .replace(/<embed\b[^>]*>/gi, ""); // Remove embeds
+    }
+  }, {
+    key: "sanitizeStyle",
+    value: function sanitizeStyle(style) {
+      try {
+        // Check if we're in a browser environment and DOMPurify is available
+        if (typeof window !== "undefined" && _dompurify["default"] && typeof _dompurify["default"].sanitize === "function") {
+          // Use DOMPurify for CSS sanitization
+          var cleanStyle = _dompurify["default"].sanitize("<div style=\"".concat(style, "\"></div>"), {
+            ALLOWED_TAGS: ["div"],
+            ALLOWED_ATTR: ["style"]
+          });
+
+          // Extract the style attribute value
+          var match = cleanStyle.match(/style="([^"]*)"/);
+          return match ? match[1] : "";
+        } else {
+          // Fallback to basic style sanitization
+          return style.replace(/expression\s*\(/gi, "").replace(/javascript:/gi, "").replace(/url\s*\(\s*["']?\s*javascript:/gi, "");
+        }
+      } catch (error) {
+        console.error("Style sanitization failed:", error);
+        // Fallback to basic style sanitization
+        return style.replace(/expression\s*\(/gi, "").replace(/javascript:/gi, "").replace(/url\s*\(\s*["']?\s*javascript:/gi, "");
+      }
+    }
+  }, {
+    key: "sanitizeUrl",
+    value: function sanitizeUrl(url) {
+      try {
+        // Check if we're in a browser environment and DOMPurify is available
+        if (typeof window !== "undefined" && _dompurify["default"] && typeof _dompurify["default"].sanitize === "function") {
+          // Use DOMPurify for URL sanitization
+          var cleanUrl = _dompurify["default"].sanitize("<a href=\"".concat(url, "\"></a>"), {
+            ALLOWED_TAGS: ["a"],
+            ALLOWED_ATTR: ["href"]
+          });
+
+          // Extract the href attribute value
+          var match = cleanUrl.match(/href="([^"]*)"/);
+          var sanitizedUrl = match ? match[1] : "";
+
+          // Additional validation
+          if (sanitizedUrl && this.isValidUrl(sanitizedUrl)) {
+            return sanitizedUrl;
+          }
+          return "";
+        } else {
+          // Fallback to basic URL validation
+          return this.basicUrlSanitization(url);
+        }
+      } catch (error) {
+        console.error("URL sanitization failed:", error);
+        // Fallback to basic URL validation
+        return this.basicUrlSanitization(url);
+      }
+    }
+  }, {
+    key: "basicUrlSanitization",
+    value: function basicUrlSanitization(url) {
+      // Allow only safe URL schemes
+      var safeSchemes = /^(https?|ftp|mailto|tel):/i;
+      var dataScheme = /^data:[^;]+;base64,/i;
+      if (safeSchemes.test(url) || dataScheme.test(url) || url.startsWith("/") || url.startsWith("./") || url.startsWith("../")) {
+        return url;
+      }
+
+      // If URL doesn't match safe patterns, return empty string
+      return "";
+    }
+  }, {
+    key: "isValidUrl",
+    value: function isValidUrl(url) {
+      try {
+        var urlObj = new URL(url, typeof window !== "undefined" ? window.location.origin : "http://localhost");
+        var allowedProtocols = ["http:", "https:", "mailto:", "tel:", "ftp:"];
+        return allowedProtocols.includes(urlObj.protocol);
+      } catch (_unused3) {
+        // Check for relative URLs
+        return url.startsWith("/") || url.startsWith("./") || url.startsWith("../");
+      }
+    }
+  }]);
+}(); // React utility component to safely render trusted content
+var TrustedContent = exports.TrustedContent = function TrustedContent(_ref) {
+  var value = _ref.value,
+    _ref$fallback = _ref.fallback,
+    fallback = _ref$fallback === void 0 ? "" : _ref$fallback;
+  if (TrustAsFormatter.isTrustedValue(value)) {
+    var trustType = TrustAsFormatter.getTrustType(value);
+    var trustedValue = TrustAsFormatter.getTrustedValue(value);
+    switch (trustType) {
+      case "html":
+        // For HTML content, use dangerouslySetInnerHTML
+        return /*#__PURE__*/React.createElement("div", {
+          dangerouslySetInnerHTML: {
+            __html: trustedValue
+          }
+        });
+      case "style":
+        // For style content, return as style attribute
+        return /*#__PURE__*/React.createElement("div", {
+          style: trustedValue
+        });
+      case "url":
+      case "resource":
+        // For URLs, return as href or src depending on usage
+        return trustedValue;
+      default:
+        return trustedValue || fallback;
+    }
+  }
+
+  // For non-trusted content, return as plain text or fallback
+  return value || fallback;
+};

package/core/formatter/string-formatters.d.ts

@@ -0,0 +1,10 @@
+import { Formatter } from "./types";
+export declare class PrependFormatter implements Formatter {
+    format(input: any, prefix: string): string;
+}
+export declare class AppendFormatter implements Formatter {
+    format(input: any, suffix: string): string;
+}
+export declare class TemplateReplaceFormatter implements Formatter {
+    format(template: string, replacements: Record<string, any> | any[]): string;
+}

package/core/formatter/string-formatters.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TemplateReplaceFormatter = exports.PrependFormatter = exports.AppendFormatter = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _util = require("../util");
+var PrependFormatter = exports.PrependFormatter = /*#__PURE__*/function () {
+  function PrependFormatter() {
+    (0, _classCallCheck2["default"])(this, PrependFormatter);
+  }
+  return (0, _createClass2["default"])(PrependFormatter, [{
+    key: "format",
+    value: function format(input, prefix) {
+      return (prefix || "") + (input !== null || input != undefined ? input : "");
+    }
+  }]);
+}();
+var AppendFormatter = exports.AppendFormatter = /*#__PURE__*/function () {
+  function AppendFormatter() {
+    (0, _classCallCheck2["default"])(this, AppendFormatter);
+  }
+  return (0, _createClass2["default"])(AppendFormatter, [{
+    key: "format",
+    value: function format(input, suffix) {
+      return (input !== null || input != undefined ? input : "") + (suffix || "");
+    }
+  }]);
+}();
+var TemplateReplaceFormatter = exports.TemplateReplaceFormatter = /*#__PURE__*/function () {
+  function TemplateReplaceFormatter() {
+    (0, _classCallCheck2["default"])(this, TemplateReplaceFormatter);
+  }
+  return (0, _createClass2["default"])(TemplateReplaceFormatter, [{
+    key: "format",
+    value: function format(template, replacements) {
+      if (!template) return template;
+      try {
+        return (0, _util.replace)(template, replacements) || "";
+      } catch (error) {
+        console.error("Template replacement failed:", error);
+        return template; // Return original template if replacement fails
+      }
+    }
+  }]);
+}();

package/core/formatter/types.d.ts

@@ -0,0 +1,33 @@
+export interface Formatter {
+    format: (input: any, ...params: any) => any;
+}
+export interface SafeValue {
+    __trustAs: string;
+    __trustedValue: string;
+}
+export interface SafeHtml extends SafeValue {
+    __trustAs: "html";
+}
+export interface SafeStyle extends SafeValue {
+    __trustAs: "style";
+}
+export interface SafeScript extends SafeValue {
+    __trustAs: "script";
+}
+export interface SafeUrl extends SafeValue {
+    __trustAs: "url";
+}
+export interface SafeResourceUrl extends SafeValue {
+    __trustAs: "resource";
+}
+export declare enum SecurityContext {
+    NONE = 0,
+    HTML = 1,
+    STYLE = 2,
+    SCRIPT = 3,
+    URL = 4,
+    RESOURCE_URL = 5
+}
+export interface DateFormatter {
+    format: (input: Date | string | number | null | undefined, format?: string | null) => string;
+}

package/core/formatter/types.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SecurityContext = void 0;
+// Base formatter interface
+// Trust marker interfaces to match Angular's DomSanitizer behavior
+// Security Context enum to match Angular's SecurityContext
+var SecurityContext = exports.SecurityContext = /*#__PURE__*/function (SecurityContext) {
+  SecurityContext[SecurityContext["NONE"] = 0] = "NONE";
+  SecurityContext[SecurityContext["HTML"] = 1] = "HTML";
+  SecurityContext[SecurityContext["STYLE"] = 2] = "STYLE";
+  SecurityContext[SecurityContext["SCRIPT"] = 3] = "SCRIPT";
+  SecurityContext[SecurityContext["URL"] = 4] = "URL";
+  SecurityContext[SecurityContext["RESOURCE_URL"] = 5] = "RESOURCE_URL";
+  return SecurityContext;
+}({}); // Date formatter interface

package/core/formatters.d.ts

@@ -0,0 +1,3 @@
+export * from "./formatter";
+import defaultFormatters from "./formatter";
+export default defaultFormatters;

package/core/formatters.js

@@ -0,0 +1,24 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+var _formatter = _interopRequireWildcard(require("./formatter"));
+Object.keys(_formatter).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _formatter[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _formatter[key];
+    }
+  });
+});
+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); }
+// Re-export everything from the formatter directory
+// Import and export the default formatters registry
+var _default = exports["default"] = _formatter["default"];

package/core/proxy-service.d.ts

@@ -0,0 +1,6 @@
+import { PageContextState, ProxyTarget } from "@wavemaker-ai/react-runtime/types";
+import { OverriddenPropsRegistry } from "@wavemaker-ai/react-runtime/core/script-registry";
+import BaseAppProps from "../higherOrder/BaseAppProps";
+export declare const createWidgetProxy: (widget: any, widgetName: string, setPageContext: any, overriddenPropsRegistry?: OverriddenPropsRegistry) => any;
+export declare const createPageProxy: (target: ProxyTarget, setPageContext: React.Dispatch<React.SetStateAction<PageContextState>>, overriddenPropsRegistry?: OverriddenPropsRegistry) => ProxyTarget;
+export declare const createStateProxy: (obj: PageContextState | BaseAppProps, path: string[], setPageContext: React.Dispatch<React.SetStateAction<PageContextState>> | React.Dispatch<React.SetStateAction<BaseAppProps>>, overriddenPropsRegistry?: OverriddenPropsRegistry) => ProxyTarget;