web-mojo 2.1.46

package/dist/chunks/WebApp-B6mgbNn2.js

@@ -0,0 +1,4767 @@
+const VERSION = "2.1.45";
+const VERSION_MAJOR = 2;
+const VERSION_MINOR = 1;
+const VERSION_REVISION = 45;
+const BUILD_TIME = "2025-09-06T19:46:44.491Z";
+const VERSION_INFO = {
+  full: VERSION,
+  major: VERSION_MAJOR,
+  minor: VERSION_MINOR,
+  revision: VERSION_REVISION,
+  buildTime: BUILD_TIME,
+  toString() {
+    return this.full;
+  },
+  compare(other) {
+    const parseVer = (v) => v.split(".").map(Number);
+    const [a1, a2, a3] = parseVer(this.full);
+    const [b1, b2, b3] = parseVer(other);
+    if (a1 !== b1) return a1 - b1;
+    if (a2 !== b2) return a2 - b2;
+    return a3 - b3;
+  }
+};
+if (typeof window !== "undefined") {
+  window.MOJO = window.MOJO || {};
+  window.MOJO.VERSION = VERSION;
+  window.MOJO.VERSION_INFO = VERSION_INFO;
+  window.MOJO.version = VERSION;
+}
+const objectToString = Object.prototype.toString;
+const isArray = Array.isArray || function(obj) {
+  return objectToString.call(obj) === "[object Array]";
+};
+const isFunction = function(obj) {
+  return typeof obj === "function";
+};
+const isObject = function(obj) {
+  return obj != null && typeof obj === "object";
+};
+const escapeHtml = function(string) {
+  const entityMap = {
+    "&": "&",
+    "<": "&lt;",
+    ">": "&gt;",
+    '"': "&quot;",
+    "'": "&#39;",
+    "/": "&#x2F;",
+    "`": "&#x60;",
+    "=": "&#x3D;"
+  };
+  return String(string).replace(/[&<>"'`=\/]/g, function(s) {
+    return entityMap[s];
+  });
+};
+class Scanner {
+  constructor(string) {
+    this.string = string;
+    this.tail = string;
+    this.pos = 0;
+  }
+  eos() {
+    return this.tail === "";
+  }
+  scan(re) {
+    const match = this.tail.match(re);
+    if (!match || match.index !== 0) {
+      return "";
+    }
+    const string = match[0];
+    this.tail = this.tail.substring(string.length);
+    this.pos += string.length;
+    return string;
+  }
+  scanUntil(re) {
+    const index = this.tail.search(re);
+    let match;
+    switch (index) {
+      case -1:
+        match = this.tail;
+        this.tail = "";
+        break;
+      case 0:
+        match = "";
+        break;
+      default:
+        match = this.tail.substring(0, index);
+        this.tail = this.tail.substring(index);
+    }
+    this.pos += match.length;
+    return match;
+  }
+}
+class Context {
+  constructor(view, parentContext) {
+    this.view = view;
+    this.cache = { ".": this.view };
+    this.parent = parentContext;
+    if (!this.view?._cacheId) {
+      if (this.view && typeof this.view === "object") {
+        this.view._cacheId = Math.random().toString(36).substring(2);
+      }
+    }
+  }
+  push(view) {
+    return new Context(view, this);
+  }
+  lookup(name) {
+    if (this.renderCache && this.view?._cacheId) {
+      const cacheKey = `${this.view._cacheId}:${name}`;
+      if (this.renderCache.has(cacheKey)) {
+        return this.renderCache.get(cacheKey);
+      }
+    }
+    if (name === ".") {
+      return this.view;
+    }
+    if (name && name.startsWith(".")) {
+      let actualName = name.substring(1);
+      let shouldIterate = false;
+      if (actualName.endsWith("|iter")) {
+        actualName = actualName.substring(0, actualName.length - 5);
+        shouldIterate = true;
+      }
+      if (this.view && typeof this.view === "object") {
+        let value2;
+        if (typeof this.view.getContextValue === "function") {
+          try {
+            value2 = this.view.getContextValue(actualName);
+            if (value2 !== void 0) {
+              if (isFunction(value2)) {
+                value2 = value2.call(this.view);
+              }
+            }
+          } catch (e) {
+            value2 = void 0;
+          }
+        }
+        if (value2 === void 0 && actualName in this.view) {
+          value2 = this.view[actualName];
+          if (isFunction(value2)) {
+            value2 = value2.call(this.view);
+          }
+        }
+        if (isArray(value2)) {
+          if (shouldIterate) {
+            return value2;
+          } else {
+            return value2.length > 0;
+          }
+        }
+        if (isObject(value2)) {
+          if (shouldIterate) {
+            return Object.entries(value2).map(([key, val]) => ({
+              key,
+              value: val
+            }));
+          } else {
+            return Object.keys(value2).length > 0;
+          }
+        }
+        return value2;
+      }
+      return void 0;
+    }
+    const cache = this.cache;
+    let value;
+    if (cache.hasOwnProperty(name)) {
+      value = cache[name];
+    } else {
+      let context = this;
+      let intermediateValue;
+      let names;
+      let index;
+      let lookupHit = false;
+      while (context) {
+        if (context.view && typeof context.view.getContextValue === "function") {
+          try {
+            intermediateValue = context.view.getContextValue(name);
+            if (intermediateValue !== void 0) {
+              lookupHit = true;
+            }
+          } catch (e) {
+            lookupHit = false;
+          }
+        }
+        if (!lookupHit) {
+          if (name.indexOf(".") > 0) {
+            intermediateValue = context.view;
+            names = name.split(".");
+            index = 0;
+            while (intermediateValue != null && index < names.length) {
+              if (intermediateValue && typeof intermediateValue.getContextValue === "function" && index < names.length) {
+                try {
+                  const remainingPath = names.slice(index).join(".");
+                  intermediateValue = intermediateValue.getContextValue(remainingPath);
+                  index = names.length;
+                  if (intermediateValue !== void 0) {
+                    lookupHit = true;
+                  }
+                } catch (e) {
+                  if (index === names.length - 1) {
+                    lookupHit = hasProperty(intermediateValue, names[index]) || primitiveHasOwnProperty(intermediateValue, names[index]);
+                  }
+                  intermediateValue = intermediateValue[names[index++]];
+                }
+              } else {
+                if (index === names.length - 1) {
+                  lookupHit = hasProperty(intermediateValue, names[index]) || primitiveHasOwnProperty(intermediateValue, names[index]);
+                }
+                intermediateValue = intermediateValue[names[index++]];
+              }
+            }
+          } else {
+            intermediateValue = context.view[name];
+            lookupHit = hasProperty(context.view, name);
+          }
+        }
+        if (lookupHit) {
+          value = intermediateValue;
+          break;
+        }
+        context = context.parent;
+      }
+      cache[name] = value;
+    }
+    if (isFunction(value)) value = value.call(this.view);
+    if (this.renderCache && this.view?._cacheId) {
+      const cacheKey = `${this.view._cacheId}:${name}`;
+      this.renderCache.set(cacheKey, value);
+    }
+    return value;
+  }
+}
+function hasProperty(obj, propName) {
+  return obj != null && typeof obj === "object" && propName in obj;
+}
+function primitiveHasOwnProperty(primitive, propName) {
+  return primitive != null && typeof primitive !== "object" && primitive.hasOwnProperty && primitive.hasOwnProperty(propName);
+}
+class Writer {
+  constructor() {
+    this.templateCache = /* @__PURE__ */ new Map();
+  }
+  clearCache() {
+    this.templateCache.clear();
+  }
+  parse(template, tags) {
+    tags = tags || ["{{", "}}"];
+    const cacheKey = template + ":" + tags.join(":");
+    let tokens = this.templateCache.get(cacheKey);
+    if (tokens == null) {
+      tokens = this.parseTemplate(template, tags);
+      this.templateCache.set(cacheKey, tokens);
+    }
+    return tokens;
+  }
+  parseTemplate(template, tags) {
+    if (!template) return [];
+    const openingTag = tags[0];
+    const closingTag = tags[1];
+    const scanner = new Scanner(template);
+    const tokens = [];
+    let start, type, value, chr, token;
+    const openingTagRe = new RegExp(escapeRegExp(openingTag) + "\\s*");
+    const closingTagRe = new RegExp("\\s*" + escapeRegExp(closingTag));
+    const closingCurlyRe = new RegExp("\\s*" + escapeRegExp("}" + closingTag));
+    while (!scanner.eos()) {
+      start = scanner.pos;
+      value = scanner.scanUntil(openingTagRe);
+      if (value) {
+        for (let i = 0; i < value.length; ++i) {
+          chr = value.charAt(i);
+          if (chr === "\n") {
+            tokens.push(["text", chr]);
+          } else {
+            tokens.push(["text", chr]);
+          }
+        }
+      }
+      if (!scanner.scan(openingTagRe)) break;
+      type = scanner.scan(/[#^\/>{&=!]/);
+      if (!type) type = "name";
+      scanner.scan(/\s*/);
+      if (type === "=") {
+        value = scanner.scanUntil(/\s*=/);
+        scanner.scan(/\s*=/);
+        scanner.scanUntil(closingTagRe);
+      } else if (type === "{") {
+        value = scanner.scanUntil(closingCurlyRe);
+        scanner.scan(closingCurlyRe);
+        type = "&";
+      } else {
+        value = scanner.scanUntil(closingTagRe);
+      }
+      scanner.scan(closingTagRe);
+      if (type === "#" || type === "^") {
+        token = [type, value, start, scanner.pos];
+        tokens.push(token);
+      } else if (type === "/") {
+        let openSection;
+        for (let i = tokens.length - 1; i >= 0; --i) {
+          if (tokens[i][0] === "#" || tokens[i][0] === "^") {
+            if (tokens[i][1] === value) {
+              openSection = tokens[i];
+              break;
+            }
+          }
+        }
+        if (openSection) {
+          if (openSection.length === 4) {
+            openSection.push(scanner.pos);
+          }
+        }
+        tokens.push([type, value, start, scanner.pos]);
+      } else {
+        tokens.push([type, value, start, scanner.pos]);
+      }
+    }
+    return this.nestSections(this.squashTokens(tokens));
+  }
+  squashTokens(tokens) {
+    const squashedTokens = [];
+    let token, lastToken;
+    for (let i = 0; i < tokens.length; ++i) {
+      token = tokens[i];
+      if (token) {
+        if (token[0] === "text" && lastToken && lastToken[0] === "text") {
+          lastToken[1] += token[1];
+          lastToken[3] = token[3];
+        } else {
+          squashedTokens.push(token);
+          lastToken = token;
+        }
+      }
+    }
+    return squashedTokens;
+  }
+  nestSections(tokens) {
+    const nestedTokens = [];
+    let collector = nestedTokens;
+    const sections = [];
+    for (let i = 0; i < tokens.length; ++i) {
+      const token = tokens[i];
+      switch (token[0]) {
+        case "#":
+        case "^":
+          const sectionToken = [
+            token[0],
+            // type ('#' or '^')
+            token[1],
+            // section name
+            token[2],
+            // start position
+            token[3],
+            // end position after opening tag
+            [],
+            // children array
+            token[4] || null
+            // closing position (if set during parsing)
+          ];
+          collector.push(sectionToken);
+          sections.push(sectionToken);
+          collector = sectionToken[4];
+          break;
+        case "/":
+          const section = sections.pop();
+          if (section) {
+            section[5] = token[2];
+            collector = sections.length > 0 ? sections[sections.length - 1][4] : nestedTokens;
+          }
+          break;
+        default:
+          collector.push(token);
+      }
+    }
+    return nestedTokens;
+  }
+  render(template, view, partials, config) {
+    const tags = this.getConfigTags(config) || ["{{", "}}"];
+    const tokens = this.parse(template, tags);
+    const renderCache = /* @__PURE__ */ new Map();
+    return this.renderTokens(tokens, new Context(view), partials, template, config, renderCache);
+  }
+  renderTokens(tokens, context, partials, originalTemplate, config, renderCache) {
+    if (renderCache && !context.renderCache) {
+      context.renderCache = renderCache;
+    }
+    let buffer = "";
+    for (let i = 0; i < tokens.length; ++i) {
+      const token = tokens[i];
+      let value;
+      switch (token[0]) {
+        case "#":
+          value = context.lookup(token[1]);
+          if (!value) continue;
+          const childTokens = token[4];
+          if (!childTokens || !isArray(childTokens)) {
+            console.warn(`MUSTACHE WARNING - Section ${token[1]} has no child tokens:`, token);
+            continue;
+          }
+          if (isArray(value)) {
+            for (let j = 0; j < value.length; ++j) {
+              const itemContext = context.push(value[j]);
+              if (context.renderCache) {
+                itemContext.renderCache = context.renderCache;
+              }
+              const itemResult = this.renderTokens(childTokens, itemContext, partials, originalTemplate, config, renderCache);
+              buffer += itemResult;
+            }
+          } else if (typeof value === "object" || typeof value === "string" || typeof value === "number") {
+            const pushedContext = context.push(value);
+            if (context.renderCache) {
+              pushedContext.renderCache = context.renderCache;
+            }
+            buffer += this.renderTokens(childTokens, pushedContext, partials, originalTemplate, config, renderCache);
+          } else if (isFunction(value)) {
+            const text = originalTemplate == null ? null : originalTemplate.slice(token[3], token[5]);
+            value = value.call(context.view, text, (template) => this.render(template, context.view, partials, config));
+            if (value != null) buffer += value;
+          } else if (value) {
+            buffer += this.renderTokens(childTokens, context, partials, originalTemplate, config, renderCache);
+          }
+          break;
+        case "^":
+          value = context.lookup(token[1]);
+          if (!value || isArray(value) && value.length === 0) {
+            const childTokens2 = token[4];
+            if (childTokens2 && isArray(childTokens2)) {
+              buffer += this.renderTokens(childTokens2, context, partials, originalTemplate, config, renderCache);
+            }
+          }
+          break;
+        case ">":
+          if (!partials) continue;
+          value = isFunction(partials) ? partials(token[1]) : partials[token[1]];
+          if (value != null) {
+            buffer += this.render(value, context.view, partials, config);
+          }
+          break;
+        case "&":
+          value = context.lookup(token[1]);
+          if (value != null) buffer += value;
+          break;
+        case "name":
+          value = context.lookup(token[1]);
+          if (value != null) buffer += escapeHtml(value);
+          break;
+        case "text":
+          buffer += token[1];
+          break;
+      }
+    }
+    return buffer;
+  }
+  getConfigTags(config) {
+    if (isObject(config) && isArray(config.tags)) {
+      return config.tags;
+    }
+    return null;
+  }
+}
+function escapeRegExp(string) {
+  return string.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&");
+}
+const defaultWriter = new Writer();
+const Mustache = {
+  name: "MOJO Mustache",
+  version: "1.0.0",
+  tags: ["{{", "}}"],
+  Scanner,
+  Context,
+  Writer,
+  escape: escapeHtml,
+  clearCache() {
+    return defaultWriter.clearCache();
+  },
+  parse(template, tags) {
+    return defaultWriter.parse(template, tags);
+  },
+  render(template, view, partials, config) {
+    if (typeof template !== "string") {
+      throw new TypeError('Invalid template! Template should be a "string"');
+    }
+    return defaultWriter.render(template, view, partials, config);
+  }
+};
+const GENERIC_AVATAR_SVG = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iI2NlZDRkYSI+PHBhdGggZD0iTTEyIDEyYzIuMjEgMCA0LTEuNzkgNC00cy0xLjc5LTQtNC00LTQgMS43OS00IDQgMS43OSA0IDQgNHptMCAyYy0yLjY3IDAtOCAxLjM0LTggNHYyaDE2di0yYzAtMi42Ni01LjMzLTQtOC00eiIvPjwvc3ZnPg==";
+class DataFormatter {
+  constructor() {
+    this.formatters = /* @__PURE__ */ new Map();
+    this.registerBuiltInFormatters();
+  }
+  escapeHtml(str) {
+    if (str === null || str === void 0) {
+      return "";
+    }
+    const map = {
+      "&": "&amp;",
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#039;"
+    };
+    return String(str).replace(/[&<>"']/g, (m) => map[m]);
+  }
+  /**
+   * Register all built-in formatters
+   */
+  registerBuiltInFormatters() {
+    this.register("date", this.date.bind(this));
+    this.register("time", this.time.bind(this));
+    this.register("datetime", this.datetime.bind(this));
+    this.register("relative", this.relative.bind(this));
+    this.register("fromNow", this.relative.bind(this));
+    this.register("iso", this.iso.bind(this));
+    this.register("epoch", (v) => {
+      if (v === null || v === void 0 || v === "") return v;
+      const num = parseFloat(v);
+      if (isNaN(num)) return v;
+      return num * 1e3;
+    });
+    this.register("number", this.number.bind(this));
+    this.register("currency", this.currency.bind(this));
+    this.register("percent", this.percent.bind(this));
+    this.register("filesize", this.filesize.bind(this));
+    this.register("ordinal", this.ordinal.bind(this));
+    this.register("compact", this.compact.bind(this));
+    this.register("uppercase", (v) => String(v).toUpperCase());
+    this.register("lowercase", (v) => String(v).toLowerCase());
+    this.register("capitalize", this.capitalize.bind(this));
+    this.register("truncate", this.truncate.bind(this));
+    this.register("truncate_middle", this.truncate_middle.bind(this));
+    this.register("slug", this.slug.bind(this));
+    this.register("initials", this.initials.bind(this));
+    this.register("mask", this.mask.bind(this));
+    this.register("email", this.email.bind(this));
+    this.register("phone", this.phone.bind(this));
+    this.register("url", this.url.bind(this));
+    this.register("badge", this.badge.bind(this));
+    this.register("status", this.status.bind(this));
+    this.register("boolean", this.boolean.bind(this));
+    this.register("bool", this.boolean.bind(this));
+    this.register("yesno", (v) => this.boolean(v, "Yes", "No"));
+    this.register("yesnoicon", this.yesnoicon.bind(this));
+    this.register("icon", this.icon.bind(this));
+    this.register("avatar", this.avatar.bind(this));
+    this.register("image", this.image.bind(this));
+    this.register("default", this.default.bind(this));
+    this.register("json", this.json.bind(this));
+    this.register("raw", (v) => v);
+    this.register("custom", (v, fn) => typeof fn === "function" ? fn(v) : v);
+    this.register("iter", this.iter.bind(this));
+    this.register("keys", (v) => {
+      if (v && typeof v === "object" && !Array.isArray(v)) {
+        return Object.keys(v);
+      }
+      return null;
+    });
+    this.register("values", (v) => {
+      if (v && typeof v === "object" && !Array.isArray(v)) {
+        return Object.values(v);
+      }
+      return null;
+    });
+    this.register("plural", this.plural.bind(this));
+    this.register("list", this.formatList.bind(this));
+    this.register("duration", this.duration.bind(this));
+    this.register("hash", this.hash.bind(this));
+    this.register("stripHtml", this.stripHtml.bind(this));
+    this.register("highlight", this.highlight.bind(this));
+    this.register("pre", (v) => `<pre class="bg-light p-2 rounded border">${this.escapeHtml(String(v))}</pre>`);
+  }
+  /**
+   * Register a custom formatter
+   * @param {string} name - Formatter name
+   * @param {Function} formatter - Formatter function
+   * @returns {DataFormatter} This instance for chaining
+   */
+  register(name, formatter) {
+    if (typeof formatter !== "function") {
+      throw new Error(`Formatter must be a function, got ${typeof formatter}`);
+    }
+    this.formatters.set(name.toLowerCase(), formatter);
+    return this;
+  }
+  /**
+   * Apply a formatter
+   * @param {string} name - Formatter name
+   * @param {*} value - Value to format
+   * @param {...*} args - Additional arguments
+   * @returns {*} Formatted value
+   */
+  apply(name, value, ...args) {
+    try {
+      const formatter = this.formatters.get(name.toLowerCase());
+      if (!formatter) {
+        console.warn(`Formatter '${name}' not found`);
+        return value;
+      }
+      return formatter(value, ...args);
+    } catch (error) {
+      console.error(`Error in formatter '${name}':`, error);
+      return value;
+    }
+  }
+  /**
+   * Process pipe string
+   * @param {*} value - Value to format
+   * @param {string} pipeString - Pipe string (e.g., "date('YYYY-MM-DD')|uppercase")
+   * @returns {*} Formatted value
+   */
+  pipe(value, pipeString) {
+    if (!pipeString) return value;
+    const pipes = this.parsePipeString(pipeString);
+    return pipes.reduce((currentValue, pipe) => {
+      return this.apply(pipe.name, currentValue, ...pipe.args);
+    }, value);
+  }
+  /**
+   * Parse pipe string into formatter calls
+   * @param {string} pipeString - Pipe string
+   * @returns {Array} Array of {name, args} objects
+   */
+  parsePipeString(pipeString) {
+    const pipes = [];
+    const tokens = pipeString.split("|").map((s) => s.trim());
+    for (const token of tokens) {
+      const parsed = this.parseFormatter(token);
+      if (parsed) {
+        pipes.push(parsed);
+      }
+    }
+    return pipes;
+  }
+  /**
+   * Parse individual formatter with arguments
+   * @param {string} token - Formatter token
+   * @returns {Object} {name, args} object
+   */
+  parseFormatter(token) {
+    const match = token.match(/^([a-zA-Z_]\w*)\s*(?:\((.*)\))?$/);
+    if (!match) return null;
+    const [, name, argsString] = match;
+    const args = argsString ? this.parseArguments(argsString) : [];
+    return { name, args };
+  }
+  /**
+   * Parse formatter arguments
+   * @param {string} argsString - Arguments string
+   * @returns {Array} Parsed arguments
+   */
+  parseArguments(argsString) {
+    const args = [];
+    let current = "";
+    let inQuotes = false;
+    let quoteChar = null;
+    let depth = 0;
+    for (let i = 0; i < argsString.length; i++) {
+      const char = argsString[i];
+      if (!inQuotes && (char === '"' || char === "'")) {
+        inQuotes = true;
+        quoteChar = char;
+        current += char;
+      } else if (inQuotes && char === quoteChar && argsString[i - 1] !== "\\") {
+        inQuotes = false;
+        quoteChar = null;
+        current += char;
+      } else if (!inQuotes && char === "{") {
+        depth++;
+        current += char;
+      } else if (!inQuotes && char === "}") {
+        depth--;
+        current += char;
+      } else if (!inQuotes && depth === 0 && char === ",") {
+        args.push(this.parseValue(current.trim()));
+        current = "";
+      } else {
+        current += char;
+      }
+    }
+    if (current.trim()) {
+      args.push(this.parseValue(current.trim()));
+    }
+    return args;
+  }
+  /**
+   * Parse a single value
+   * @param {string} value - Value string
+   * @returns {*} Parsed value
+   */
+  parseValue(value) {
+    if (value.startsWith('"') && value.endsWith('"') || value.startsWith("'") && value.endsWith("'")) {
+      return value.slice(1, -1);
+    }
+    if (value === "true") return true;
+    if (value === "false") return false;
+    if (value === "null") return null;
+    if (value === "undefined") return void 0;
+    if (!isNaN(value) && value !== "") {
+      return Number(value);
+    }
+    if (value.startsWith("{") && value.endsWith("}")) {
+      try {
+        return JSON.parse(value);
+      } catch (e) {
+      }
+    }
+    return value;
+  }
+  // ============= Date/Time Formatters =============
+  /**
+   * Format date
+   * @param {*} value - Date value
+   * @param {string} format - Date format pattern
+   * @returns {string} Formatted date
+   */
+  date(value, format = "MM/DD/YYYY") {
+    if (!value) return "";
+    value = this.normalizeEpoch(value);
+    let date;
+    if (value instanceof Date) {
+      date = value;
+    } else if (typeof value === "string") {
+      if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
+        const [year, month, day] = value.split("-").map(Number);
+        date = new Date(year, month - 1, day);
+      } else {
+        date = new Date(value);
+      }
+    } else {
+      date = new Date(value);
+    }
+    if (isNaN(date.getTime())) return String(value);
+    const tokens = {
+      "YYYY": date.getFullYear(),
+      "YY": String(date.getFullYear()).slice(-2),
+      "MMMM": date.toLocaleDateString("en-US", { month: "long" }),
+      "MMM": date.toLocaleDateString("en-US", { month: "short" }),
+      "MM": String(date.getMonth() + 1).padStart(2, "0"),
+      "M": date.getMonth() + 1,
+      "dddd": date.toLocaleDateString("en-US", { weekday: "long" }),
+      "ddd": date.toLocaleDateString("en-US", { weekday: "short" }),
+      "DD": String(date.getDate()).padStart(2, "0"),
+      "D": date.getDate()
+    };
+    let result = format;
+    const tokenPattern = new RegExp(`(${Object.keys(tokens).join("|")})`, "g");
+    result = result.replace(tokenPattern, (match) => tokens[match] || match);
+    return result;
+  }
+  /**
+   * Format time
+   * @param {*} value - Time value
+   * @param {string} format - Time format pattern
+   * @returns {string} Formatted time
+   */
+  time(value, format = "HH:mm:ss") {
+    if (!value) return "";
+    value = this.normalizeEpoch(value);
+    const date = value instanceof Date ? value : new Date(value);
+    if (isNaN(date.getTime())) return String(value);
+    const hours = date.getHours();
+    const replacements = {
+      "HH": String(hours).padStart(2, "0"),
+      "H": hours,
+      "hh": String(hours % 12 || 12).padStart(2, "0"),
+      "h": hours % 12 || 12,
+      "mm": String(date.getMinutes()).padStart(2, "0"),
+      "m": date.getMinutes(),
+      "ss": String(date.getSeconds()).padStart(2, "0"),
+      "s": date.getSeconds(),
+      "A": hours >= 12 ? "PM" : "AM",
+      "a": hours >= 12 ? "pm" : "am"
+    };
+    let result = format;
+    const sortedKeys = Object.keys(replacements).sort((a, b) => b.length - a.length);
+    for (const key of sortedKeys) {
+      result = result.replace(new RegExp(key, "g"), replacements[key]);
+    }
+    return result;
+  }
+  /**
+   * Format date and time
+   * @param {*} value - DateTime value
+   * @param {string} dateFormat - Date format
+   * @param {string} timeFormat - Time format
+   * @returns {string} Formatted datetime
+   */
+  datetime(value, dateFormat = "MM/DD/YYYY", timeFormat = "HH:mm") {
+    value = this.normalizeEpoch(value);
+    const dateStr = this.date(value, dateFormat);
+    const timeStr = this.time(value, timeFormat);
+    return dateStr && timeStr ? `${dateStr} ${timeStr}` : "";
+  }
+  normalizeEpoch(value) {
+    if (typeof value !== "number") value = Number(value);
+    if (isNaN(value)) return "";
+    if (value < 1e11) {
+      return value * 1e3;
+    } else if (value > 1e12 && value < 1e13) {
+      return value;
+    } else {
+      throw new Error("Value doesn't look like epoch seconds or ms");
+    }
+  }
+  /**
+   * Format relative time
+   * @param {*} value - Date value
+   * @param {boolean} short - Use short format
+   * @returns {string} Relative time string
+   */
+  relative(value, short = false) {
+    if (!value) return "";
+    value = this.normalizeEpoch(value);
+    const date = value instanceof Date ? value : new Date(value);
+    if (isNaN(date.getTime())) return String(value);
+    const now2 = /* @__PURE__ */ new Date();
+    const diffMs = now2 - date;
+    const diffSecs = Math.floor(diffMs / 1e3);
+    const diffMins = Math.floor(diffSecs / 60);
+    const diffHours = Math.floor(diffMins / 60);
+    const diffDays = Math.floor(diffHours / 24);
+    if (short) {
+      if (diffDays > 365) return Math.floor(diffDays / 365) + "y";
+      if (diffDays > 30) return Math.floor(diffDays / 30) + "mo";
+      if (diffDays > 7) return Math.floor(diffDays / 7) + "w";
+      if (diffDays > 0) return diffDays + "d";
+      if (diffHours > 0) return diffHours + "h";
+      if (diffMins > 0) return diffMins + "m";
+      return "now";
+    }
+    if (diffDays > 365) {
+      const years = Math.floor(diffDays / 365);
+      return years + " year" + (years > 1 ? "s" : "") + " ago";
+    }
+    if (diffDays > 30) {
+      const months = Math.floor(diffDays / 30);
+      return months + " month" + (months > 1 ? "s" : "") + " ago";
+    }
+    if (diffDays > 7) {
+      const weeks = Math.floor(diffDays / 7);
+      return weeks + " week" + (weeks > 1 ? "s" : "") + " ago";
+    }
+    if (diffDays === 1) return "yesterday";
+    if (diffDays > 0) return diffDays + " days ago";
+    if (diffHours > 0) return diffHours + " hour" + (diffHours > 1 ? "s" : "") + " ago";
+    if (diffMins > 0) return diffMins + " minute" + (diffMins > 1 ? "s" : "") + " ago";
+    if (diffSecs > 30) return diffSecs + " seconds ago";
+    return "just now";
+  }
+  /**
+   * Format ISO date
+   * @param {*} value - Date value
+   * @param {boolean} dateOnly - Return date only
+   * @returns {string} ISO date string
+   */
+  iso(value, dateOnly = false) {
+    if (!value) return "";
+    value = this.normalizeEpoch(value);
+    const date = value instanceof Date ? value : new Date(value);
+    if (isNaN(date.getTime())) return String(value);
+    if (dateOnly) {
+      return date.toISOString().split("T")[0];
+    }
+    return date.toISOString();
+  }
+  // ============= Number Formatters =============
+  /**
+   * Format number
+   * @param {*} value - Number value
+   * @param {number} decimals - Decimal places
+   * @param {string} locale - Locale string
+   * @returns {string} Formatted number
+   */
+  number(value, decimals = 2, locale = "en-US") {
+    const num = parseFloat(value);
+    if (isNaN(num)) return String(value);
+    return num.toLocaleString(locale, {
+      minimumFractionDigits: decimals,
+      maximumFractionDigits: decimals
+    });
+  }
+  /**
+   * Format currency
+   * @param {*} value - Number value
+   * @param {string} symbol - Currency symbol
+   * @param {number} decimals - Decimal places
+   * @returns {string} Formatted currency
+   */
+  currency(value, symbol = "$", decimals = 2) {
+    const num = parseFloat(value);
+    if (isNaN(num)) return String(value);
+    const formatted = this.number(num, decimals);
+    return symbol + formatted;
+  }
+  /**
+   * Format percentage
+   * @param {*} value - Number value
+   * @param {number} decimals - Decimal places
+   * @param {boolean} multiply - Multiply by 100
+   * @returns {string} Formatted percentage
+   */
+  percent(value, decimals = 0, multiply = true) {
+    const num = parseFloat(value);
+    if (isNaN(num)) return String(value);
+    const percent = multiply ? num * 100 : num;
+    return this.number(percent, decimals) + "%";
+  }
+  /**
+   * Format file size
+   * @param {*} value - Size in bytes
+   * @param {boolean} binary - Use binary units (1024)
+   * @param {number} decimals - Decimal places
+   * @returns {string} Formatted file size
+   */
+  filesize(value, binary = false, decimals = 1) {
+    const bytes = parseInt(value);
+    if (isNaN(bytes)) return String(value);
+    const units = binary ? ["B", "KiB", "MiB", "GiB", "TiB"] : ["B", "KB", "MB", "GB", "TB"];
+    const divisor = binary ? 1024 : 1e3;
+    let size = bytes;
+    let unitIndex = 0;
+    while (size >= divisor && unitIndex < units.length - 1) {
+      size /= divisor;
+      unitIndex++;
+    }
+    const decimalPlaces = unitIndex === 0 ? 0 : decimals;
+    return `${size.toFixed(decimalPlaces)} ${units[unitIndex]}`;
+  }
+  /**
+   * Format ordinal number
+   * @param {*} value - Number value
+   * @param {boolean} suffixOnly - Return suffix only
+   * @returns {string} Ordinal number
+   */
+  ordinal(value, suffixOnly = false) {
+    const num = parseInt(value);
+    if (isNaN(num)) return String(value);
+    const j = num % 10;
+    const k = num % 100;
+    let suffix = "th";
+    if (j === 1 && k !== 11) suffix = "st";
+    else if (j === 2 && k !== 12) suffix = "nd";
+    else if (j === 3 && k !== 13) suffix = "rd";
+    return suffixOnly ? suffix : num + suffix;
+  }
+  /**
+   * Format compact number
+   * @param {*} value - Number value
+   * @param {number} decimals - Decimal places
+   * @returns {string} Compact number
+   */
+  compact(value, decimals = 1) {
+    const num = parseFloat(value);
+    if (isNaN(num)) return String(value);
+    const abs = Math.abs(num);
+    const sign = num < 0 ? "-" : "";
+    if (abs >= 1e9) {
+      return sign + (abs / 1e9).toFixed(decimals) + "B";
+    }
+    if (abs >= 1e6) {
+      return sign + (abs / 1e6).toFixed(decimals) + "M";
+    }
+    if (abs >= 1e3) {
+      return sign + (abs / 1e3).toFixed(decimals) + "K";
+    }
+    return String(num);
+  }
+  // ============= String Formatters =============
+  /**
+   * Capitalize string
+   * @param {*} value - String value
+   * @param {boolean} all - Capitalize all words (default: true). If false, only capitalizes first letter
+   * @returns {string} Capitalized string
+   */
+  capitalize(value, all = true) {
+    const str = String(value);
+    if (!str) return "";
+    if (all) {
+      return str.replace(/\b\w/g, (c) => c.toUpperCase());
+    }
+    return str.charAt(0).toUpperCase() + str.slice(1);
+  }
+  /**
+   * Truncate string
+   * @param {*} value - String value
+   * @param {number} length - Max length
+   * @param {string} suffix - Suffix to append
+   * @returns {string} Truncated string
+   */
+  truncate(value, length = 50, suffix = "...") {
+    const str = String(value);
+    if (str.length <= length) return str;
+    return str.substring(0, length) + suffix;
+  }
+  /**
+   * Truncate string in the middle
+   * @param {*} value - String value
+   * @param {number} size - The total number of characters to keep (half for the start, half for the end).
+   * @param {string} replace - The character(s) to use for the middle part.
+   * @returns {string} Truncated string
+   */
+  truncate_middle(value, size = 8, replace = "***") {
+    const str = String(value);
+    if (str.length <= size) {
+      return str;
+    }
+    const halfSize = Math.floor(size / 2);
+    const front = str.substring(0, halfSize);
+    const back = str.substring(str.length - halfSize);
+    return `${front}${replace}${back}`;
+  }
+  /**
+   * Create slug from string
+   * @param {*} value - String value
+   * @param {string} separator - Word separator
+   * @returns {string} Slug
+   */
+  slug(value, separator = "-") {
+    const str = String(value);
+    return str.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, separator).replace(new RegExp(`${separator}+`, "g"), separator).replace(new RegExp(`^${separator}|${separator}$`, "g"), "");
+  }
+  /**
+   * Get initials from string
+   * @param {*} value - String value
+   * @param {number} count - Number of initials
+   * @returns {string} Initials
+   */
+  initials(value, count = 2) {
+    const str = String(value);
+    const words = str.split(/\s+/).filter((w) => w.length > 0);
+    return words.slice(0, count).map((word) => word.charAt(0).toUpperCase()).join("");
+  }
+  /**
+   * Mask string
+   * @param {*} value - String value
+   * @param {string} char - Mask character
+   * @param {number} showLast - Number of chars to show at end
+   * @returns {string} Masked string
+   */
+  mask(value, char = "*", showLast = 4) {
+    const str = String(value);
+    if (str.length <= showLast) return str;
+    const masked = char.repeat(Math.max(0, str.length - showLast));
+    const visible = str.slice(-showLast);
+    return masked + visible;
+  }
+  // ============= HTML/Web Formatters =============
+  /**
+   * Format email
+   * @param {*} value - Email value
+   * @param {Object} options - Options
+   * @returns {string} Formatted email
+   */
+  email(value, options = {}) {
+    const email = String(value).trim();
+    if (!email) return "";
+    if (options.link === false) {
+      return email;
+    }
+    const subject = options.subject ? `?subject=${encodeURIComponent(options.subject)}` : "";
+    const body = options.body ? `&body=${encodeURIComponent(options.body)}` : "";
+    const className = options.class ? ` class="${options.class}"` : "";
+    return `<a href="mailto:${email}${subject}${body}"${className}>${email}</a>`;
+  }
+  /**
+   * Format phone number
+   * @param {*} value - Phone value
+   * @param {string} format - Format type
+   * @param {boolean} link - Create tel link
+   * @returns {string} Formatted phone
+   */
+  phone(value, format = "US", link = true) {
+    let phone = String(value).replace(/\D/g, "");
+    let formatted = phone;
+    if (format === "US") {
+      if (phone.length === 10) {
+        formatted = `(${phone.slice(0, 3)}) ${phone.slice(3, 6)}-${phone.slice(6)}`;
+      } else if (phone.length === 11 && phone[0] === "1") {
+        formatted = `+1 (${phone.slice(1, 4)}) ${phone.slice(4, 7)}-${phone.slice(7)}`;
+      }
+    }
+    if (!link) {
+      return formatted;
+    }
+    return `<a href="tel:${phone}">${formatted}</a>`;
+  }
+  /**
+   * Format URL
+   * @param {*} value - URL value
+   * @param {string} text - Link text
+   * @param {boolean} newWindow - Open in new window
+   * @returns {string} Formatted URL
+   */
+  url(value, text = null, newWindow = true) {
+    let url = String(value).trim();
+    if (!url) return "";
+    if (!/^https?:\/\//.test(url)) {
+      url = "https://" + url;
+    }
+    const linkText = text || url;
+    const target = newWindow ? ' target="_blank"' : "";
+    const rel = newWindow ? ' rel="noopener noreferrer"' : "";
+    return `<a href="${url}"${target}${rel}>${linkText}</a>`;
+  }
+  /**
+   * Format as badge
+   * @param {*} value - Badge text
+   * @param {string} type - Badge type
+   * @returns {string} Badge HTML
+   */
+  badge(value, type = "auto") {
+    if (Array.isArray(value)) {
+      return value.map((item) => this.badge(item, type)).join(" ");
+    }
+    const text = String(value);
+    const badgeType = type === "auto" ? this.inferBadgeType(text) : type;
+    const className = badgeType ? `bg-${badgeType}` : "bg-secondary";
+    return `<span class="badge ${className}">${text}</span>`;
+  }
+  /**
+   * Infer badge type from text
+   * @param {string} text - Badge text
+   * @returns {string} Badge type
+   */
+  inferBadgeType(text) {
+    const lowered = text.toLowerCase();
+    if (["active", "success", "complete", "completed", "approved", "done", "true", "on", "yes"].includes(lowered)) return "success";
+    if (["error", "failed", "rejected", "deleted", "cancelled", "false", "off", "no"].includes(lowered)) return "danger";
+    if (["warning", "pending", "review", "processing", "uploading"].includes(lowered)) return "warning";
+    if (["info", "new", "draft"].includes(lowered)) return "info";
+    if (["inactive", "disabled", "archived", "suspended"].includes(lowered)) return "secondary";
+    return "secondary";
+  }
+  /**
+   * Format status
+   * @param {*} value - Status value
+   * @param {Object} icons - Icon mapping
+   * @param {Object} colors - Color mapping
+   * @returns {string} Status HTML
+   */
+  status(value, icons = {}, colors = {}) {
+    const status = String(value).toLowerCase();
+    const defaultIcons = {
+      "active": "✓",
+      "inactive": "✗",
+      "pending": "⏳",
+      "success": "✓",
+      "error": "✗",
+      "warning": "⚠"
+    };
+    const defaultColors = {
+      "active": "success",
+      "inactive": "secondary",
+      "pending": "warning",
+      "success": "success",
+      "error": "danger",
+      "warning": "warning"
+    };
+    const icon = icons[status] || defaultIcons[status] || "";
+    const color = colors[status] || defaultColors[status] || "secondary";
+    return `<span class="text-${color}">${icon}${icon ? " " : ""}${value}</span>`;
+  }
+  /**
+   * Format boolean
+   * @param {*} value - Boolean value
+   * @param {string} trueText - Text for true
+   * @param {string} falseText - Text for false
+   * @returns {string} Boolean text
+   */
+  boolean(value, trueText = "True", falseText = "False") {
+    return value ? trueText : falseText;
+  }
+  /**
+   * Format icon
+   * @param {*} value - Icon key
+   * @param {Object} mapping - Icon mapping
+   * @returns {string} Icon HTML
+   */
+  icon(value, mapping = {}) {
+    const key = String(value).toLowerCase();
+    const icon = mapping[key] || "";
+    return icon ? `<i class="${icon}"></i>` : "";
+  }
+  /**
+   * Format boolean as a yes/no icon
+   * @param {*} value - Boolean value
+   * @returns {string} Icon HTML
+   */
+  yesnoicon(value) {
+    if (value) {
+      return '<i class="bi bi-check-circle-fill text-success"></i>';
+    }
+    return '<i class="bi bi-x-circle-fill text-danger"></i>';
+  }
+  /**
+   * Format value as Bootstrap 5 image with optional rendition support
+   * @param {string|object} value - URL string or file object with renditions
+   * @param {string} rendition - Desired rendition (thumbnail, thumbnail_sm, etc.)
+   * @param {string} classes - Additional CSS classes
+   * @param {string} alt - Alt text for the image
+   * @returns {string} Bootstrap image HTML
+   */
+  image(value, rendition = "thumbnail", classes = "img-fluid", alt = "") {
+    const url = this._extractImageUrl(value, rendition);
+    if (!url) return "";
+    return `<img src="${url}" class="${classes}" alt="${alt}" />`;
+  }
+  /**
+   * Format value as Bootstrap 5 avatar (circular image)
+   * @param {string|object} value - URL string or file object with renditions
+   * @param {string} size - Avatar size (xs, sm, md, lg, xl)
+   * @param {string} classes - Additional CSS classes
+   * @param {string} alt - Alt text for the avatar
+   * @returns {string} Bootstrap avatar HTML
+   */
+  avatar(value, size = "md", classes = "rounded-circle", alt = "") {
+    const url = this._extractImageUrl(value, "square_sm") || GENERIC_AVATAR_SVG;
+    const sizeClasses = {
+      "xs": "width: 1.5rem; height: 1.5rem;",
+      "sm": "width: 2rem; height: 2rem;",
+      "md": "width: 3rem; height: 3rem;",
+      "lg": "width: 4rem; height: 4rem;",
+      "xl": "width: 5rem; height: 5rem;"
+    };
+    const sizeStyle = sizeClasses[size] || sizeClasses["md"];
+    const baseClasses = "object-fit-cover";
+    const allClasses = `${baseClasses} ${classes}`.trim();
+    return `<img src="${url}" class="${allClasses}" style="${sizeStyle}" alt="${alt}" />`;
+  }
+  /**
+   * Helper method to extract image URL from string or file object
+   * @param {string|object} value - URL string or file object with renditions
+   * @param {string} preferredRendition - Preferred rendition name
+   * @returns {string|null} Image URL or null if not found
+   */
+  _extractImageUrl(value, preferredRendition = "thumbnail") {
+    if (!value) return null;
+    if (typeof value === "string") {
+      return value;
+    }
+    if (typeof value === "object") {
+      if (value.attributes) value = value.attributes;
+      if (preferredRendition === "thumbnail" && value.thumbnail && typeof value.thumbnail === "string") {
+        return value.thumbnail;
+      }
+      if (value.renditions && typeof value.renditions === "object") {
+        const rendition = value.renditions[preferredRendition];
+        if (rendition && rendition.url) {
+          return rendition.url;
+        }
+        const availableRenditions = Object.values(value.renditions);
+        if (availableRenditions.length > 0 && availableRenditions[0].url) {
+          return availableRenditions[0].url;
+        }
+      }
+      if (value.url) {
+        return value.url;
+      }
+    }
+    return null;
+  }
+  // ============= Utility Formatters =============
+  /**
+   * Apply default value
+   * @param {*} value - Value
+   * @param {*} defaultValue - Default value
+   * @returns {*} Value or default
+   */
+  default(value, defaultValue = "") {
+    return value === null || value === void 0 || value === "" ? defaultValue : value;
+  }
+  /**
+   * Format as JSON
+   * @param {*} value - Value to stringify
+   * @param {number} indent - Indentation
+   * @returns {string} JSON string
+   */
+  /**
+   * Format pluralization based on count
+   * @param {number} count - The count value
+   * @param {string} singular - Singular form of the word
+   * @param {string|null} plural - Plural form (defaults to singular + 's')
+   * @param {boolean} includeCount - Whether to include the count in output
+   * @returns {string} Formatted plural string
+   */
+  plural(count, singular, plural = null, includeCount = true) {
+    if (count === null || count === void 0 || singular === null || singular === void 0) {
+      return includeCount ? `${count} ${singular}` : singular || "";
+    }
+    const num = parseInt(count);
+    if (isNaN(num)) {
+      return includeCount ? `${count} ${singular}` : singular || "";
+    }
+    const word = Math.abs(num) === 1 ? singular : plural || singular + "s";
+    return includeCount ? `${num} ${word}` : word;
+  }
+  /**
+   * Format array as a human-readable list
+   * @param {Array} array - Array to format
+   * @param {Object} options - Formatting options
+   * @returns {string} Formatted list string
+   */
+  formatList(array, options = {}) {
+    if (!Array.isArray(array)) {
+      return String(array);
+    }
+    const { conjunction = "and", limit = null, moreText = "others" } = options;
+    if (array.length === 0) return "";
+    if (array.length === 1) return String(array[0]);
+    let items = array.slice();
+    let hasMore = false;
+    if (limit && array.length > limit) {
+      items = array.slice(0, limit);
+      hasMore = true;
+    }
+    if (hasMore) {
+      const remaining = array.length - limit;
+      return `${items.join(", ")}, ${conjunction} ${remaining} ${moreText}`;
+    }
+    if (items.length === 2) {
+      return `${items[0]} ${conjunction} ${items[1]}`;
+    }
+    return `${items.slice(0, -1).join(", ")}, ${conjunction} ${items[items.length - 1]}`;
+  }
+  /**
+   * Format duration in milliseconds to human-readable format
+   * @param {number} milliseconds - Duration in milliseconds
+   * @param {Object} options - Formatting options
+   * @returns {string} Formatted duration string
+   */
+  duration(milliseconds, options = {}) {
+    const { short = false, precision = 2 } = options;
+    if (milliseconds === null || milliseconds === void 0) return "";
+    const ms = parseInt(milliseconds);
+    if (isNaN(ms)) return String(milliseconds);
+    const units = [
+      { name: "day", short: "d", value: 864e5 },
+      { name: "hour", short: "h", value: 36e5 },
+      { name: "minute", short: "m", value: 6e4 },
+      { name: "second", short: "s", value: 1e3 }
+    ];
+    if (ms === 0) return short ? "0s" : "0 seconds";
+    const absMs = Math.abs(ms);
+    const sign = ms < 0 ? "-" : "";
+    const parts = [];
+    let remaining = absMs;
+    for (const unit of units) {
+      if (remaining >= unit.value) {
+        const count = Math.floor(remaining / unit.value);
+        remaining = remaining % unit.value;
+        const unitName = short ? unit.short : count === 1 ? unit.name : unit.name + "s";
+        parts.push(short ? `${count}${unitName}` : `${count} ${unitName}`);
+        if (parts.length >= precision) break;
+      }
+    }
+    if (parts.length === 0) {
+      return short ? `${Math.round(absMs)}ms` : `${Math.round(absMs)} milliseconds`;
+    }
+    return sign + (short ? parts.join("") : parts.join(" "));
+  }
+  /**
+   * Format long strings/IDs with truncation
+   * @param {string} value - Value to format
+   * @param {number} length - Maximum length before truncation
+   * @param {string} prefix - Prefix to add
+   * @param {string} suffix - Suffix for truncated strings
+   * @returns {string} Formatted hash string
+   */
+  hash(value, length = 8, prefix = "", suffix = "...") {
+    if (value === null || value === void 0) return "";
+    const str = String(value);
+    if (str.length <= length) return prefix + str;
+    return prefix + str.substring(0, length) + suffix;
+  }
+  /**
+   * Strip HTML tags from text
+   * @param {string} html - HTML string to strip
+   * @returns {string} Plain text without HTML tags
+   */
+  stripHtml(html) {
+    if (html === null || html === void 0) return "";
+    return String(html).replace(/<[^>]*>/g, "");
+  }
+  /**
+   * Highlight search terms in text
+   * @param {string} text - Text to search in
+   * @param {string} searchTerm - Term to highlight
+   * @param {string} className - CSS class for highlighting
+   * @returns {string} Text with highlighted terms
+   */
+  highlight(text, searchTerm, className = "highlight") {
+    if (text === null || text === void 0 || !searchTerm) {
+      return String(text || "");
+    }
+    const escapedTerm = String(searchTerm).replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    const regex = new RegExp(`(${escapedTerm})`, "gi");
+    return String(text).replace(regex, `<mark class="${className}">$1</mark>`);
+  }
+  json(value, indent = 2) {
+    try {
+      return JSON.stringify(value, null, indent);
+    } catch (e) {
+      return String(value);
+    }
+  }
+  /**
+   * Check if formatter exists
+   * @param {string} name - Formatter name
+   * @returns {boolean} True if exists
+   */
+  has(name) {
+    return this.formatters.has(name.toLowerCase());
+  }
+  /**
+   * Remove a formatter
+   * @param {string} name - Formatter name
+   * @returns {boolean} True if removed
+   */
+  unregister(name) {
+    return this.formatters.delete(name.toLowerCase());
+  }
+  /**
+   * Get all formatter names
+   * @returns {Array} Formatter names
+   */
+  listFormatters() {
+    return Array.from(this.formatters.keys()).sort();
+  }
+  iter(v) {
+    if (v === null || v === void 0) {
+      return [];
+    }
+    if (Array.isArray(v)) {
+      return v;
+    }
+    if (typeof v === "object") {
+      return Object.entries(v).map(([key, value]) => ({
+        key,
+        value
+      }));
+    }
+    return [{ key: "0", value: v }];
+  }
+}
+const dataFormatter = new DataFormatter();
+window.dataFormatter = dataFormatter;
+class MOJOUtils {
+  /**
+   * Get data from context with support for:
+   * - Dot notation (e.g., "user.name")
+   * - Pipe formatting (e.g., "name|uppercase")
+   * - Combined (e.g., "user.name|uppercase|truncate(10)")
+   *
+   * @param {object} context - The data context to search in
+   * @param {string} key - The key path with optional pipes
+   * @returns {*} The value, possibly formatted
+   */
+  static getContextData(context, key) {
+    if (!key || context == null) {
+      return void 0;
+    }
+    let field = key;
+    let pipes = "";
+    let parenDepth = 0;
+    let pipeIndex = -1;
+    for (let i = 0; i < key.length; i++) {
+      const char = key[i];
+      if (char === "(") parenDepth++;
+      else if (char === ")") parenDepth--;
+      else if (char === "|" && parenDepth === 0) {
+        pipeIndex = i;
+        break;
+      }
+    }
+    if (pipeIndex > -1) {
+      field = key.substring(0, pipeIndex).trim();
+      pipes = key.substring(pipeIndex + 1).trim();
+    }
+    const value = this.getNestedValue(context, field);
+    if (pipes) {
+      return dataFormatter.pipe(value, pipes);
+    }
+    return value;
+  }
+  /**
+   * Get nested value from object using dot notation
+   * IMPORTANT: Never calls get() on the top-level context to avoid recursion
+   * But DOES call get() on nested objects if they have that method
+   *
+   * @param {object} context - The object to search in
+   * @param {string} path - Dot notation path
+   * @returns {*} The value at the path
+   */
+  static getNestedValue(context, path) {
+    if (!path || context == null) {
+      return void 0;
+    }
+    if (!path.includes(".")) {
+      if (path in context) {
+        const value = context[path];
+        if (typeof value === "function") {
+          return value.call(context);
+        }
+        return value;
+      }
+      return void 0;
+    }
+    const keys = path.split(".");
+    let current = context;
+    for (let i = 0; i < keys.length; i++) {
+      const key = keys[i];
+      if (current == null) {
+        return void 0;
+      }
+      if (i === 0) {
+        if (current.hasOwnProperty(key)) {
+          const value = current[key];
+          if (typeof value === "function") {
+            current = value.call(context);
+          } else {
+            current = value;
+          }
+        } else {
+          return void 0;
+        }
+      } else {
+        if (current && typeof current.getContextValue === "function") {
+          const remainingPath = keys.slice(i).join(".");
+          return current.getContextValue(remainingPath);
+        }
+        if (Array.isArray(current) && !isNaN(key)) {
+          current = current[parseInt(key)];
+        } else if (current.hasOwnProperty(key)) {
+          current = current[key];
+        } else if (typeof current[key] === "function") {
+          current = current[key].call(current);
+        } else {
+          return void 0;
+        }
+      }
+    }
+    return current;
+  }
+  /**
+   * Check if a value is null or undefined
+   * @param {*} value - Value to check
+   * @returns {boolean} True if null or undefined
+   */
+  static isNullOrUndefined(value) {
+    return value === null || value === void 0;
+  }
+  /**
+   * Deep clone an object
+   * @param {*} obj - Object to clone
+   * @returns {*} Cloned object
+   */
+  static deepClone(obj) {
+    if (obj === null || typeof obj !== "object") return obj;
+    if (obj instanceof Date) return new Date(obj.getTime());
+    if (obj instanceof Array) return obj.map((item) => this.deepClone(item));
+    if (obj instanceof Object) {
+      const clonedObj = {};
+      for (const key in obj) {
+        if (obj.hasOwnProperty(key)) {
+          clonedObj[key] = this.deepClone(obj[key]);
+        }
+      }
+      return clonedObj;
+    }
+  }
+  /**
+   * Merge objects deeply
+   * @param {object} target - Target object
+   * @param {...object} sources - Source objects to merge
+   * @returns {object} Merged object
+   */
+  static deepMerge(target, ...sources) {
+    if (!sources.length) return target;
+    const source = sources.shift();
+    if (this.isObject(target) && this.isObject(source)) {
+      for (const key in source) {
+        if (this.isObject(source[key])) {
+          if (!target[key]) Object.assign(target, { [key]: {} });
+          this.deepMerge(target[key], source[key]);
+        } else {
+          Object.assign(target, { [key]: source[key] });
+        }
+      }
+    }
+    return this.deepMerge(target, ...sources);
+  }
+  /**
+   * Check if value is a plain object
+   * @param {*} item - Value to check
+   * @returns {boolean} True if plain object
+   */
+  static isObject(item) {
+    return item && typeof item === "object" && !Array.isArray(item);
+  }
+  /**
+   * Debounce function calls
+   * @param {function} func - Function to debounce
+   * @param {number} wait - Wait time in milliseconds
+   * @returns {function} Debounced function
+   */
+  static debounce(func, wait) {
+    let timeout;
+    return function executedFunction(...args) {
+      const later = () => {
+        clearTimeout(timeout);
+        func(...args);
+      };
+      clearTimeout(timeout);
+      timeout = setTimeout(later, wait);
+    };
+  }
+  /**
+   * Throttle function calls
+   * @param {function} func - Function to throttle
+   * @param {number} limit - Time limit in milliseconds
+   * @returns {function} Throttled function
+   */
+  static throttle(func, limit) {
+    let inThrottle;
+    return function(...args) {
+      if (!inThrottle) {
+        func.apply(this, args);
+        inThrottle = true;
+        setTimeout(() => inThrottle = false, limit);
+      }
+    };
+  }
+  /**
+   * Generate a unique ID
+   * @param {string} prefix - Optional prefix for the ID
+   * @returns {string} Unique ID
+   */
+  static generateId(prefix = "") {
+    const timestamp = Date.now().toString(36);
+    const randomStr = Math.random().toString(36).substr(2, 9);
+    return prefix ? `${prefix}_${timestamp}_${randomStr}` : `${timestamp}_${randomStr}`;
+  }
+  /**
+   * Escape HTML special characters
+   * @param {string} str - String to escape
+   * @returns {string} Escaped string
+   */
+  static escapeHtml(str) {
+    const entityMap = {
+      "&": "&amp;",
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#39;",
+      "/": "&#x2F;",
+      "`": "&#x60;",
+      "=": "&#x3D;"
+    };
+    return String(str).replace(/[&<>"'`=\/]/g, (s) => entityMap[s]);
+  }
+  /**
+   * Check password strength and provide detailed feedback
+   * @param {string} password - Password to check
+   * @returns {object} Password strength analysis
+   */
+  static checkPasswordStrength(password) {
+    if (!password || typeof password !== "string") {
+      return {
+        score: 0,
+        strength: "invalid",
+        feedback: ["Password must be a non-empty string"],
+        details: {
+          length: 0,
+          hasLowercase: false,
+          hasUppercase: false,
+          hasNumbers: false,
+          hasSpecialChars: false,
+          hasCommonPatterns: false,
+          isCommonPassword: false
+        }
+      };
+    }
+    const feedback = [];
+    const details = {
+      length: password.length,
+      hasLowercase: /[a-z]/.test(password),
+      hasUppercase: /[A-Z]/.test(password),
+      hasNumbers: /[0-9]/.test(password),
+      hasSpecialChars: /[^a-zA-Z0-9]/.test(password),
+      hasCommonPatterns: false,
+      isCommonPassword: false
+    };
+    let score = 0;
+    if (password.length < 6) {
+      feedback.push("Password should be at least 6 characters long");
+    } else if (password.length < 8) {
+      score += 1;
+      feedback.push("Consider using at least 8 characters for better security");
+    } else if (password.length < 12) {
+      score += 2;
+    } else {
+      score += 3;
+    }
+    if (details.hasLowercase) score += 1;
+    else feedback.push("Include lowercase letters");
+    if (details.hasUppercase) score += 1;
+    else feedback.push("Include uppercase letters");
+    if (details.hasNumbers) score += 1;
+    else feedback.push("Include numbers");
+    if (details.hasSpecialChars) score += 2;
+    else feedback.push("Include special characters (!@#$%^&* etc.)");
+    const commonPatterns = [
+      /123/,
+      // Sequential numbers
+      /abc/i,
+      // Sequential letters
+      /qwerty/i,
+      // Keyboard patterns
+      /asdf/i,
+      // Keyboard patterns
+      /(.)\1{2,}/,
+      // Repeated characters (aaa, 111)
+      /password/i,
+      // Contains "password"
+      /admin/i,
+      // Contains "admin"
+      /user/i,
+      // Contains "user"
+      /login/i
+      // Contains "login"
+    ];
+    for (const pattern of commonPatterns) {
+      if (pattern.test(password)) {
+        details.hasCommonPatterns = true;
+        score -= 1;
+        feedback.push("Avoid common patterns and dictionary words");
+        break;
+      }
+    }
+    const commonPasswords = [
+      "123456",
+      "password",
+      "123456789",
+      "12345678",
+      "12345",
+      "1234567",
+      "1234567890",
+      "qwerty",
+      "abc123",
+      "111111",
+      "123123",
+      "admin",
+      "letmein",
+      "welcome",
+      "monkey",
+      "password123",
+      "123qwe",
+      "qwerty123",
+      "000000",
+      "dragon",
+      "sunshine",
+      "princess",
+      "azerty",
+      "1234",
+      "iloveyou",
+      "trustno1",
+      "superman",
+      "shadow",
+      "master",
+      "jennifer"
+    ];
+    if (commonPasswords.includes(password.toLowerCase())) {
+      details.isCommonPassword = true;
+      score = Math.max(0, score - 3);
+      feedback.push("This password is too common and easily guessed");
+    }
+    let strength;
+    if (score < 2) {
+      strength = "very-weak";
+    } else if (score < 4) {
+      strength = "weak";
+    } else if (score < 6) {
+      strength = "fair";
+    } else if (score < 8) {
+      strength = "good";
+    } else {
+      strength = "strong";
+    }
+    if (score >= 7 && feedback.length === 0) {
+      feedback.push("Strong password! Consider using a password manager.");
+    } else if (score >= 5 && feedback.length <= 1) {
+      feedback.push("Good password strength. Consider adding more variety.");
+    }
+    return {
+      score: Math.max(0, score),
+      strength,
+      feedback,
+      details
+    };
+  }
+  /**
+   * Generate a secure password with customizable options
+   * @param {object} options - Password generation options
+   * @param {number} options.length - Password length (default: 12)
+   * @param {boolean} options.includeLowercase - Include lowercase letters (default: true)
+   * @param {boolean} options.includeUppercase - Include uppercase letters (default: true)
+   * @param {boolean} options.includeNumbers - Include numbers (default: true)
+   * @param {boolean} options.includeSpecialChars - Include special characters (default: true)
+   * @param {string} options.customChars - Custom character set to use
+   * @param {boolean} options.excludeAmbiguous - Exclude ambiguous characters like 0, O, l, I (default: false)
+   * @returns {string} Generated password
+   */
+  static generatePassword(options = {}) {
+    const defaults = {
+      length: 12,
+      includeLowercase: true,
+      includeUppercase: true,
+      includeNumbers: true,
+      includeSpecialChars: true,
+      customChars: "",
+      excludeAmbiguous: false
+    };
+    const config = { ...defaults, ...options };
+    if (config.length < 4) {
+      throw new Error("Password length must be at least 4 characters");
+    }
+    let lowercase = "abcdefghijklmnopqrstuvwxyz";
+    let uppercase = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
+    let numbers = "0123456789";
+    let specialChars = "!@#$%^&*()_+-=[]{}|;:,.<>?";
+    if (config.excludeAmbiguous) {
+      lowercase = lowercase.replace(/[il]/g, "");
+      uppercase = uppercase.replace(/[IOL]/g, "");
+      numbers = numbers.replace(/[01]/g, "");
+      specialChars = specialChars.replace(/[|]/g, "");
+    }
+    let charPool = "";
+    const requiredChars = [];
+    if (config.customChars) {
+      charPool = config.customChars;
+    } else {
+      if (config.includeLowercase) {
+        charPool += lowercase;
+        requiredChars.push(lowercase[Math.floor(Math.random() * lowercase.length)]);
+      }
+      if (config.includeUppercase) {
+        charPool += uppercase;
+        requiredChars.push(uppercase[Math.floor(Math.random() * uppercase.length)]);
+      }
+      if (config.includeNumbers) {
+        charPool += numbers;
+        requiredChars.push(numbers[Math.floor(Math.random() * numbers.length)]);
+      }
+      if (config.includeSpecialChars) {
+        charPool += specialChars;
+        requiredChars.push(specialChars[Math.floor(Math.random() * specialChars.length)]);
+      }
+    }
+    if (!charPool) {
+      throw new Error("No character types selected for password generation");
+    }
+    let password = "";
+    for (const char of requiredChars) {
+      password += char;
+    }
+    for (let i = password.length; i < config.length; i++) {
+      password += charPool[Math.floor(Math.random() * charPool.length)];
+    }
+    return password.split("").sort(() => Math.random() - 0.5).join("");
+  }
+  /**
+   * Parse query string into object
+   * @param {string} queryString - Query string to parse
+   * @returns {object} Parsed query parameters
+   */
+  static parseQueryString(queryString) {
+    const params = {};
+    const searchParams = new URLSearchParams(queryString);
+    for (const [key, value] of searchParams.entries()) {
+      params[key] = value;
+    }
+    return params;
+  }
+  /**
+   * Convert object to query string
+   * @param {object} params - Parameters object
+   * @returns {string} Query string
+   */
+  static toQueryString(params) {
+    return new URLSearchParams(params).toString();
+  }
+  /**
+   * Wrap data objects to provide get() method support
+   * This ensures pipe formatting works in all contexts
+   * @param {*} data - Data to wrap
+   * @param {object} rootContext - Optional root context for nested access
+   * @returns {*} Wrapped data if object/array, otherwise original
+   */
+  static wrapData(data, rootContext = null, depth = 3) {
+    if (!data || typeof data !== "object") {
+      return data;
+    }
+    if (data instanceof Date || data instanceof RegExp || data instanceof Error) {
+      return data;
+    }
+    if (depth <= 0) {
+      return data;
+    }
+    if (typeof data.getContextValue === "function") {
+      return data;
+    }
+    if (Array.isArray(data)) {
+      return data.map((item) => {
+        if (item && typeof item === "object" && !item.getContextValue) {
+          return new DataWrapper(item, rootContext);
+        }
+        return item;
+      });
+    }
+    return new DataWrapper(data, rootContext);
+  }
+}
+class DataWrapper {
+  constructor(data, rootContext = null) {
+    Object.defineProperty(this, "_data", {
+      value: data,
+      writable: false,
+      enumerable: false,
+      configurable: false
+    });
+    Object.defineProperty(this, "_rootContext", {
+      value: rootContext,
+      writable: false,
+      enumerable: false,
+      configurable: false
+    });
+    if (data && typeof data === "object") {
+      for (const key in data) {
+        if (data.hasOwnProperty(key)) {
+          const value = data[key];
+          this[key] = MOJOUtils.wrapData(value, rootContext);
+        }
+      }
+    }
+  }
+  /**
+   * Get value with pipe support
+   * @param {string} key - Key with optional pipes
+   * @returns {*} Value, possibly formatted
+   */
+  getContextValue(key) {
+    let field = key;
+    let pipes = "";
+    let parenDepth = 0;
+    let pipeIndex = -1;
+    for (let i = 0; i < key.length; i++) {
+      const char = key[i];
+      if (char === "(") parenDepth++;
+      else if (char === ")") parenDepth--;
+      else if (char === "|" && parenDepth === 0) {
+        pipeIndex = i;
+        break;
+      }
+    }
+    if (pipeIndex > -1) {
+      field = key.substring(0, pipeIndex).trim();
+      pipes = key.substring(pipeIndex + 1).trim();
+    }
+    let value;
+    if (this._data && this._data.hasOwnProperty(field)) {
+      if (field in this && field !== "_data" && field !== "_rootContext") {
+        value = this[field];
+      } else {
+        value = MOJOUtils.getNestedValue(this._data, field);
+      }
+    } else {
+      value = void 0;
+    }
+    if (pipes && value !== void 0) {
+      return dataFormatter.pipe(value, pipes);
+    }
+    return value;
+  }
+  /**
+   * Check if wrapper has a property
+   * @param {string} key - Property key
+   * @returns {boolean} True if property exists
+   */
+  has(key) {
+    return this._data && this._data.hasOwnProperty(key);
+  }
+  /**
+   * Get the raw wrapped data
+   * @returns {object} The original data object
+   */
+  toJSON() {
+    return this._data;
+  }
+}
+MOJOUtils.DataWrapper = DataWrapper;
+if (typeof window !== "undefined") {
+  window.utils = MOJOUtils;
+}
+class EventDelegate {
+  constructor(view) {
+    this.view = view;
+    this.domListeners = [];
+    this.debounceTimers = /* @__PURE__ */ new Map();
+  }
+  bind(rootEl) {
+    this.unbind();
+    if (!rootEl) return;
+    const onClick = async (event) => {
+      const actionEl = event.target.closest("[data-action]");
+      if (actionEl && this.shouldHandle(actionEl, event)) {
+        const action = actionEl.getAttribute("data-action");
+        const handled = await this.dispatch(action, event, actionEl);
+        if (handled) {
+          event.preventDefault();
+          event.stopPropagation();
+          event.handledByChild = true;
+          return;
+        }
+      }
+      const navEl = event.target.closest("a[href], [data-page]");
+      if (navEl && !navEl.hasAttribute("data-action") && this.shouldHandle(navEl, event)) {
+        if (event.ctrlKey || event.metaKey || event.shiftKey || event.button === 1) return;
+        if (navEl.tagName === "A") {
+          const href = navEl.getAttribute("href");
+          if (href && href !== "#" && !href.startsWith("#") && (this.view.isExternalLink(href) || navEl.hasAttribute("data-external"))) return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        event.handledByChild = true;
+        if (navEl.hasAttribute("data-page")) await this.view.handlePageNavigation(navEl);
+        else await this.view.handleHrefNavigation(navEl);
+      }
+    };
+    const onChange = (event) => {
+      const el = event.target.closest("[data-change-action]");
+      if (!el || !this.shouldHandle(el, event)) return;
+      const action = el.getAttribute("data-change-action");
+      this.dispatchChange(action, event, el).then((handled) => {
+        if (handled) {
+          event.stopPropagation();
+          event.handledByChild = true;
+        }
+      });
+    };
+    const onInput = (event) => {
+      const el = event.target.closest("[data-change-action]");
+      if (!el || !this.shouldHandle(el, event)) return;
+      const liveSearch = event.target.matches('[data-filter="live-search"]');
+      if (!liveSearch) return;
+      const action = el.getAttribute("data-change-action");
+      const debounceMs = parseInt(el.getAttribute("data-filter-debounce")) || 300;
+      const timerId = `${action}-${el.getAttribute("data-container") || "default"}`;
+      if (this.debounceTimers.has(timerId)) {
+        clearTimeout(this.debounceTimers.get(timerId));
+      }
+      const timer = setTimeout(() => {
+        this.debounceTimers.delete(timerId);
+        this.dispatchChange(action, event, el).then((handled) => {
+          if (handled) {
+            event.stopPropagation();
+            event.handledByChild = true;
+          }
+        });
+      }, debounceMs);
+      this.debounceTimers.set(timerId, timer);
+    };
+    const onEnterKey = (event) => {
+      if (event.key !== "Enter" || !event.target.matches('[data-filter="search"]')) return;
+      const el = event.target.closest("[data-change-action]");
+      if (!el || !this.shouldHandle(el, event)) return;
+      event.preventDefault();
+      const action = el.getAttribute("data-change-action");
+      this.dispatch(action, event, el).then((handled) => {
+        if (handled) {
+          event.stopPropagation();
+          event.handledByChild = true;
+        }
+      });
+    };
+    const onSubmit = (event) => {
+      const form = event.target.closest("form[data-action]");
+      if (!form || !this.shouldHandle(form, event)) return;
+      event.preventDefault();
+      const action = form.getAttribute("data-action");
+      this.dispatch(action, event, form);
+    };
+    rootEl.addEventListener("click", onClick);
+    rootEl.addEventListener("change", onChange);
+    rootEl.addEventListener("input", onInput);
+    rootEl.addEventListener("keydown", onEnterKey);
+    rootEl.addEventListener("submit", onSubmit);
+    this.domListeners.push(
+      { el: rootEl, type: "click", fn: onClick },
+      { el: rootEl, type: "change", fn: onChange },
+      { el: rootEl, type: "input", fn: onInput },
+      { el: rootEl, type: "keydown", fn: onEnterKey },
+      { el: rootEl, type: "submit", fn: onSubmit }
+    );
+  }
+  unbind() {
+    for (const { el, type, fn } of this.domListeners) el.removeEventListener(type, fn);
+    this.domListeners = [];
+    for (const timer of this.debounceTimers.values()) {
+      clearTimeout(timer);
+    }
+    this.debounceTimers.clear();
+  }
+  hideDropdown(element) {
+    const dropdownMenu = element.closest(".dropdown-menu");
+    const dropdown = dropdownMenu.closest(".dropdown");
+    const dropdownBtn = dropdown.querySelector('[data-bs-toggle="dropdown"]');
+    if (dropdownBtn && window.bootstrap?.Dropdown) {
+      const dropdownInstance = window.bootstrap.Dropdown.getInstance(dropdownBtn);
+      dropdownInstance?.hide();
+    }
+  }
+  async dispatch(action, event, el) {
+    const v = this.view;
+    const cap = (s) => s.includes("-") ? s.split("-").map((w) => w[0].toUpperCase() + w.slice(1)).join("") : s[0].toUpperCase() + s.slice(1);
+    const specific = `handleAction${cap(action)}`;
+    if (typeof v[specific] === "function") {
+      try {
+        event.preventDefault();
+        await v[specific](event, el);
+        return true;
+      } catch (e) {
+        console.error(`Error in action ${action}:`, e);
+        v.handleActionError(action, e, event, el);
+        return true;
+      }
+    }
+    const generic = `onAction${cap(action)}`;
+    if (typeof v[generic] === "function") {
+      try {
+        if (await v[generic](event, el)) {
+          const isInDropdown = !!el.closest(".dropdown-menu");
+          if (isInDropdown) this.hideDropdown(el);
+          event.preventDefault();
+          event.stopPropagation();
+          return true;
+        }
+        return false;
+      } catch (e) {
+        console.error(`Error in action ${action}:`, e);
+        v.handleActionError(action, e, event, el);
+        return true;
+      }
+    }
+    const passThru = `onPassThruAction${cap(action)}`;
+    if (typeof v[passThru] === "function") {
+      try {
+        await v[passThru](event, el);
+        return false;
+      } catch (e) {
+        console.error(`Error in action ${action}:`, e);
+        v.handleActionError(action, e, event, el);
+        return true;
+      }
+    }
+    if (typeof v.onActionDefault === "function") {
+      try {
+        return await v.onActionDefault(action, event, el);
+      } catch (e) {
+        console.error(`Error in default action handler for ${action}:`, e);
+        v.handleActionError(action, e, event, el);
+        return true;
+      }
+    }
+    v.emit?.(`action:${action}`, { action, event, element: el });
+    return false;
+  }
+  async dispatchChange(action, event, el) {
+    const v = this.view;
+    const cap = (s) => s.includes("-") ? s.split("-").map((w) => w[0].toUpperCase() + w.slice(1)).join("") : s[0].toUpperCase() + s.slice(1);
+    const changeHandler = `onChange${cap(action)}`;
+    if (typeof v[changeHandler] === "function") {
+      try {
+        await v[changeHandler](event, el);
+        return true;
+      } catch (e) {
+        console.error(`Error in onChange ${action}:`, e);
+        v.handleActionError?.(action, e, event, el);
+        return true;
+      }
+    }
+    return await this.dispatch(action, event, el);
+  }
+  shouldHandle(el, event) {
+    if (this.owns(el)) return true;
+    if (this.contains(el) && !event.handledByChild) return true;
+    return false;
+  }
+  owns(el) {
+    const root = this.view.element;
+    if (!root || !root.contains(el)) return false;
+    for (const child of Object.values(this.view.children)) {
+      if (child.element && child.element.contains(el)) return false;
+    }
+    return true;
+  }
+  contains(el) {
+    return !!this.view.element && this.view.element.contains(el);
+  }
+}
+const EventEmitter = {
+  /**
+   * Add an event listener
+   * @param {string} event - Event name to listen for
+   * @param {Function} callback - Function to call when event is emitted
+   * @param {Object} [context] - Context to bind the callback to (optional)
+   * @returns {Object} This instance for method chaining
+   *
+   * @example
+   * // With context binding
+   * model.on('change', this.handleChange, this);
+   * 
+   * // Without context (traditional)
+   * model.on('change', (data) => console.log(data));
+   */
+  on(event, callback, context) {
+    if (!this._listeners) this._listeners = {};
+    if (!this._listeners[event]) this._listeners[event] = [];
+    const listener = {
+      callback,
+      context,
+      fn: context ? callback.bind(context) : callback
+    };
+    this._listeners[event].push(listener);
+    return this;
+  },
+  /**
+   * Remove an event listener
+   * @param {string} event - Event name
+   * @param {Function} [callback] - Specific callback to remove. If omitted, removes all listeners for the event
+   * @param {Object} [context] - Context that was used when adding the listener
+   * @returns {Object} This instance for method chaining
+   *
+   * @example
+   * // Remove specific listener with context
+   * model.off('change', this.handleChange, this);
+   *
+   * // Remove specific callback (any context)
+   * model.off('change', myHandler);
+   *
+   * // Remove all listeners for an event
+   * model.off('change');
+   */
+  off(event, callback, context) {
+    if (!this._listeners || !this._listeners[event]) return this;
+    if (!callback) {
+      delete this._listeners[event];
+    } else {
+      this._listeners[event] = this._listeners[event].filter((listener) => {
+        if (listener.callback !== callback) return true;
+        if (arguments.length === 3 && listener.context !== context) return true;
+        return false;
+      });
+      if (this._listeners[event].length === 0) {
+        delete this._listeners[event];
+      }
+    }
+    return this;
+  },
+  /**
+   * Add a one-time event listener that automatically removes itself after being called
+   * @param {string} event - Event name to listen for
+   * @param {Function} callback - Function to call when event is emitted (called only once)
+   * @param {Object} [context] - Context to bind the callback to (optional)
+   * @returns {Object} This instance for method chaining
+   *
+   * @example
+   * model.once('ready', this.handleReady, this);
+   */
+  once(event, callback, context) {
+    const onceWrapper = (...args) => {
+      this.off(event, onceWrapper);
+      const fn = context ? callback.bind(context) : callback;
+      fn.apply(context || this, args);
+    };
+    this.on(event, onceWrapper);
+    return this;
+  },
+  /**
+   * Emit an event to all registered listeners
+   * @param {string} event - Event name to emit
+   * @param {...*} args - Arguments to pass to event listeners
+   * @returns {Object} This instance for method chaining
+   *
+   * @example
+   * // Emit with single argument
+   * model.emit('change', { field: 'name', value: 'John' });
+   *
+   * // Emit with multiple arguments
+   * model.emit('update', oldValue, newValue, timestamp);
+   *
+   * // Emit without arguments
+   * model.emit('ready');
+   */
+  emit(event, ...args) {
+    if (!this._listeners || !this._listeners[event]) return this;
+    const listeners = this._listeners[event].slice();
+    for (const listener of listeners) {
+      try {
+        listener.fn.apply(listener.context || this, args);
+      } catch (error) {
+        if (console && console.error) {
+          console.error(`Error in ${event} event handler:`, error);
+        }
+      }
+    }
+    return this;
+  }
+};
+if (typeof window !== "undefined") {
+  window.Mustache = Mustache;
+}
+class View {
+  // ---------------------------------------------
+  // Construction & defaults
+  // ---------------------------------------------
+  constructor(opts = {}) {
+    this.tagName = opts.tagName ?? "div";
+    this.className = opts.className ?? "mojo-view";
+    this.style = opts.style ?? null;
+    this.id = opts.id ?? View._genId();
+    this.containerId = opts.containerId ?? null;
+    this.container = opts.container ?? null;
+    if (typeof this.container === "string") {
+      this.containerId = this.container;
+      this.container = null;
+    }
+    this.parent = opts.parent ?? null;
+    this.children = opts.children ?? {};
+    this.template = opts.template || opts.templateUrl || "";
+    this.data = opts.data ?? {};
+    this.isRendering = false;
+    this.lastRenderTime = 0;
+    this.mounted = false;
+    this.debug = opts.debug ?? false;
+    this.app = opts.app ?? null;
+    this.cacheTemplate = opts.cacheTemplate ?? true;
+    this.options = { ...opts };
+    this.element = this._ensureElement();
+    this.events = new EventDelegate(this);
+    if (opts.model) this.setModel(opts.model);
+  }
+  // ---------------------------------------------
+  // Lifecycle hooks (overridable)
+  // ---------------------------------------------
+  async onInit() {
+  }
+  async onInitView() {
+    if (this.initialized) return;
+    this.initialized = true;
+    await this.onInit();
+  }
+  async onBeforeRender() {
+  }
+  async onAfterRender() {
+  }
+  async onBeforeMount() {
+  }
+  async onAfterMount() {
+  }
+  async onBeforeUnmount() {
+  }
+  async onAfterUnmount() {
+  }
+  async onBeforeDestroy() {
+  }
+  async onAfterDestroy() {
+  }
+  // ---------------------------------------------
+  // Public API
+  // ---------------------------------------------
+  setModel(model = {}) {
+    let isDiff = model !== this.model;
+    if (!isDiff) return this;
+    if (this.model && this.model.off) {
+      this.model.off("change", this._onModelChange, this);
+    }
+    this.model = model;
+    if (this.model && this.model.on) {
+      this.model.on("change", this._onModelChange, this);
+    }
+    for (const id in this.children) {
+      const child = this.children[id];
+      if (child && typeof child.setModel === "function") {
+        child.setModel(model);
+      }
+    }
+    if (isDiff) {
+      this._onModelChange();
+    }
+    return this;
+  }
+  _onModelChange() {
+    if (this.isMounted()) {
+      this.render();
+    }
+  }
+  setTemplate(tpl) {
+    this.template = tpl ?? "";
+    return this;
+  }
+  addChild(childView) {
+    try {
+      if (!childView || typeof childView !== "object") return this;
+      childView.parent = this;
+      if (this.getApp()) childView.app = this.app;
+      this.children[childView.id] = childView;
+    } catch (e) {
+      View._warn("addChild error", e);
+    }
+    return childView;
+  }
+  removeChild(idOrView) {
+    try {
+      const id = typeof idOrView === "string" ? idOrView : idOrView && idOrView.id;
+      if (!id) return this;
+      const child = this.children[id];
+      if (child) {
+        Promise.resolve(child.destroy()).catch((err) => View._warn("removeChild destroy error", err));
+        delete this.children[id];
+      }
+    } catch (e) {
+      View._warn("removeChild error", e);
+    }
+    return this;
+  }
+  getChild(id) {
+    return this.children[id];
+  }
+  async updateData(newData, rerender = false) {
+    Object.assign(this.data, newData);
+    if (rerender && this.isMounted()) {
+      await this.render();
+    }
+    return this;
+  }
+  toggleClass(className, force) {
+    if (force === void 0) {
+      force = !this.element.classList.contains(className);
+    }
+    this.element.classList.toggle(className, force);
+    return this;
+  }
+  addClass(className) {
+    this.element.classList.add(className);
+    return this;
+  }
+  setClass(className) {
+    this.element.className = className;
+    return this;
+  }
+  removeClass(className) {
+    this.element.classList.remove(className);
+    return this;
+  }
+  canRender() {
+    if (this.options.renderCooldown > 0 && now - this.lastRenderTime < this.options.renderCooldown) {
+      View._warn(`View ${this.id}: Render called too quickly, cooldown active`);
+      return false;
+    }
+    if (this.options.noAppend) {
+      if (this.parent) {
+        if (!this.parent.contains(this.containerId || this.container)) {
+          return false;
+        } else if (this.containerId && !document.getElementById(this.containerId)) {
+          return false;
+        } else if (this.container && !document.contains(this.container)) {
+          return false;
+        }
+      }
+    }
+    return true;
+  }
+  // ---------------------------------------------
+  // Render flow
+  // ---------------------------------------------
+  async render(allowMount = true, container = null) {
+    const now2 = Date.now();
+    if (!this.canRender()) {
+      return this;
+    }
+    this.isRendering = true;
+    this.lastRenderTime = now2;
+    try {
+      if (!this.initialized) await this.onInitView();
+      this.events.unbind();
+      await this.onBeforeRender();
+      if (this.getViewData) {
+        this.data = await this.getViewData();
+      }
+      const html = await this.renderTemplate();
+      this.element.innerHTML = html;
+      if (allowMount && !this.isMounted()) {
+        await this.mount(container);
+      }
+      await this._renderChildren();
+      await this.onAfterRender();
+      this.events.bind(this.element);
+    } catch (e) {
+      View._warn(`Render error in ${this.id}`, e);
+    } finally {
+      this.isRendering = false;
+    }
+    return this;
+  }
+  async _renderChildren() {
+    for (const id in this.children) {
+      const child = this.children[id];
+      if (!child) continue;
+      child.parent = this;
+      await Promise.resolve(child.render()).catch((err) => View._warn(`Child render error (${id})`, err));
+    }
+  }
+  async _unmountChildren() {
+    for (const id in this.children) {
+      const child = this.children[id];
+      if (!child) continue;
+      child.unbindEvents();
+    }
+  }
+  isMounted() {
+    return this.element?.isConnected;
+  }
+  getChildElementById(id, root = null) {
+    const cleanId = id.startsWith("#") ? id.substring(1) : id;
+    if (root) {
+      return root.querySelector(`#${cleanId}`);
+    }
+    return this.element.querySelector(`#${cleanId}`);
+  }
+  getChildElement(id) {
+    if (id.startsWith("#")) {
+      return this.getChildElementById(id);
+    }
+    let el = this.element?.querySelector(`[data-container="${id}"]`);
+    if (!el) {
+      return this.getChildElementById(id);
+    }
+    return el;
+  }
+  getContainer() {
+    if (this.replaceById) {
+      if (this.parent) {
+        return this.parent.getChildElementById(this.id);
+      }
+      return null;
+    }
+    if (!this.containerId) return null;
+    if (this.parent) {
+      return this.parent.getChildElement(this.containerId);
+    }
+    return this.getChildElementById(this.containerId, document.body);
+  }
+  async mount(container = null) {
+    await this.onBeforeMount();
+    if (!container) {
+      container = this.getContainer();
+    }
+    if (this.containerId && !container) {
+      console.error(`Container not found for ${this.containerId}`);
+      return;
+    }
+    if (container && this.replaceById) {
+      container.replaceWith(this.element);
+    } else if (container) {
+      container.replaceChildren(this.element);
+    } else if (!this.containerId && this.parent) {
+      this.parent.element.appendChild(this.element);
+    } else if (!this.containerId && !this.parent) {
+      document.body.appendChild(this.element);
+    } else {
+      console.error(`Container not found for ${this.containerId}`);
+    }
+    await this.onAfterMount();
+    this.mounted = true;
+  }
+  async unmount() {
+    if (!this.element || !this.element.parentNode) return;
+    await this.onBeforeUnmount();
+    await this._unmountChildren();
+    if (this.element.parentNode) this.element.parentNode.removeChild(this.element);
+    this.events.unbind();
+    await this.onAfterUnmount();
+    this.mounted = false;
+  }
+  // FIX #1: make destroy async (it already awaited hooks)
+  async destroy() {
+    try {
+      this.events.unbind();
+      for (const id in this.children) {
+        const ch = this.children[id];
+        if (ch) {
+          await Promise.resolve(ch.destroy()).catch((err) => View._warn(`Child destroy error (${id})`, err));
+        }
+      }
+      this.mounted = false;
+      if (this.element && this.element.parentNode) {
+        await this.onBeforeDestroy();
+        if (this.element.parentNode) this.element.parentNode.removeChild(this.element);
+        await this.onAfterDestroy();
+      }
+    } catch (e) {
+      View._warn(`Destroy error in ${this.id}`, e);
+    }
+  }
+  // ---------------------------------------------
+  // DOM helpers
+  // ---------------------------------------------
+  _ensureElement() {
+    try {
+      if (this.element && this.element.tagName?.toLowerCase() === this.tagName) {
+        this._syncAttrs();
+        return this.element;
+      }
+      const el = document.createElement(this.tagName);
+      this.element = el;
+      this.el = el;
+      this._syncAttrs();
+      return el;
+    } catch (e) {
+      View._warn("ensureElement error", e);
+      const el = document.createElement("div");
+      el.id = this.id || View._genId();
+      return el;
+    }
+  }
+  _syncAttrs() {
+    try {
+      if (!this.element) return;
+      if (this.id) this.element.id = this.id;
+      this.element.className = this.className || "";
+      if (this.style == null) {
+        this.element.removeAttribute("style");
+      } else {
+        this.element.style.cssText = String(this.style);
+      }
+    } catch (e) {
+      View._warn("_syncAttrs error", e);
+    }
+  }
+  bindEvents() {
+    this.events.bind(this.element);
+  }
+  unbindEvents() {
+    this.events.unbind();
+  }
+  // ---------------------------------------------
+  // Template helpers
+  // ---------------------------------------------
+  async renderTemplate() {
+    const templateContent = await this.getTemplate();
+    if (!templateContent) return "";
+    const partials = this.getPartials();
+    return Mustache.render(templateContent, this, partials);
+  }
+  renderTemplateString(template, context, partials) {
+    return Mustache.render(template, context, partials);
+  }
+  getPartials() {
+    return {};
+  }
+  async getTemplate() {
+    if (this._templateCache && this.cacheTemplate) {
+      return this._templateCache;
+    }
+    const template = this.template || this.templateUrl;
+    if (!template) {
+      throw new Error("Template not found");
+    }
+    let templateContent = "";
+    if (typeof template === "string") {
+      if (template.includes("<") || template.includes("{")) {
+        templateContent = template;
+      } else {
+        try {
+          let templatePath = template;
+          if (!this.app) this.app = this.getApp();
+          if (this.app && this.app.basePath) {
+            if (!templatePath.startsWith("/") && !templatePath.startsWith("http://") && !templatePath.startsWith("https://")) {
+              const base = this.app.basePath.endsWith("/") ? this.app.basePath.slice(0, -1) : this.app.basePath;
+              templatePath = `${base}/${templatePath}`;
+            }
+          }
+          const response = await fetch(templatePath);
+          if (!response.ok) {
+            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+          }
+          templateContent = await response.text();
+        } catch (error) {
+          View._warn(`Failed to load template from ${template}: ${error}`);
+          this.showError?.(`Failed to load template from ${template}: ${error.message}`);
+        }
+      }
+    } else if (typeof template === "function") {
+      templateContent = await this.template(this.data, this.state);
+    }
+    if (this.cacheTemplate && templateContent) {
+      this._templateCache = templateContent;
+    }
+    return templateContent;
+  }
+  getContextValue(path) {
+    const value = MOJOUtils.getContextData(this, path);
+    if (path && path.startsWith("data.") && value && typeof value === "object") {
+      return MOJOUtils.wrapData(value, this);
+    }
+    if (path && path.startsWith("model.") && path !== "model" && value && typeof value === "object" && typeof value.getContextValue !== "function") {
+      return MOJOUtils.wrapData(value, null);
+    }
+    return value;
+  }
+  // 9) Navigation Helpers ------------------------------------------------------
+  async handlePageNavigation(element) {
+    const pageName = element.getAttribute("data-page");
+    const paramsAttr = element.getAttribute("data-params");
+    let params = {};
+    if (paramsAttr) {
+      try {
+        params = JSON.parse(paramsAttr);
+      } catch (error) {
+        console.warn("Invalid JSON in data-params:", paramsAttr);
+      }
+    }
+    const app = this.getApp();
+    if (app) {
+      app.showPage(pageName, params);
+      return;
+    }
+    const router = this.findRouter();
+    if (router && typeof router.navigateToPage === "function") {
+      await router.navigateToPage(pageName, params);
+    } else {
+      console.error(`No router found for page navigation to '${pageName}'`);
+    }
+  }
+  async handleHrefNavigation(element) {
+    const href = element.getAttribute("href");
+    if (this.isExternalLink(href) || element.hasAttribute("data-external")) return;
+    const router = this.findRouter();
+    if (router) {
+      if (router.options && router.options.mode === "param" && href.startsWith("?")) {
+        const fullPath = "/" + href;
+        await router.navigate(fullPath);
+        return;
+      }
+      if (router.options && router.options.mode === "hash" && href.startsWith("#")) {
+        await router.navigate(href);
+        return;
+      }
+      const routePath = this.hrefToRoutePath(href);
+      await router.navigate(routePath);
+    } else {
+      console.warn("No router found for navigation, using default behavior");
+      window.location.href = href;
+    }
+  }
+  isExternalLink(href) {
+    if (!href) return true;
+    if (href.startsWith("/") && this.getApp()) {
+      if (href.startsWith(this.findRouter().basePath)) return false;
+      return true;
+    }
+    return href.startsWith("#") || href.startsWith("mailto:") || href.startsWith("tel:") || href.startsWith("http://") || href.startsWith("https://") || href.startsWith("//");
+  }
+  hrefToRoutePath(href) {
+    if (href.startsWith("/")) {
+      const router = this.findRouter();
+      if (router && router.options && router.options.base) {
+        const base = router.options.base;
+        if (href.startsWith(base)) return href.substring(base.length) || "/";
+      }
+      return href;
+    }
+    return href.startsWith("./") ? href.substring(2) : href;
+  }
+  findRouter() {
+    this.getApp();
+    return this.app?.router || null;
+  }
+  getApp() {
+    if (this.app) return this.app;
+    const apps = [
+      window.__app__,
+      window.matchUUID ? window[window.matchUUID]() : window[window.matchUUID],
+      window.MOJO?.app,
+      window.APP,
+      window.app,
+      window.WebApp
+    ];
+    this.app = apps.find((app) => app && typeof app.showPage === "function") || null;
+    return this.app;
+  }
+  handleActionError(action, err, evt, el) {
+    this.showError(`Action '${action}' failed: ${err}`, evt, el);
+  }
+  // ---------------------------------------------
+  // Utilities
+  // ---------------------------------------------
+  /**
+   * Escape HTML characters
+   * @param {string} str - String to escape
+   * @returns {string} Escaped string
+   */
+  escapeHtml(str) {
+    if (typeof str !== "string") return str;
+    const div = document.createElement("div");
+    div.textContent = str;
+    return div.innerHTML;
+  }
+  contains(el) {
+    if (typeof el === "string") {
+      if (!this.element) return false;
+      el = document.getElementById(el);
+    }
+    if (!el) return false;
+    return this.element.contains(el);
+  }
+  /**
+   * Show error message
+   * @param {string} message - Error message
+   */
+  async showError(message) {
+    console.error(`View ${this.id} error:`, message);
+    const app = this.getApp ? this.getApp() : this.app || null;
+    if (app && typeof app.showError === "function") {
+      await app.showError(message);
+      return;
+    }
+    alert(`Error: ${message}`);
+  }
+  /**
+   * Show success message
+   * @param {string} message - Success message
+   */
+  async showSuccess(message) {
+    if (this.debug) {
+      console.log(`View ${this.id} success:`, message);
+    }
+    const app = this.getApp ? this.getApp() : this.app || null;
+    if (app && typeof app.showSuccess === "function") {
+      await app.showSuccess(message);
+      return;
+    }
+    alert(`Success: ${message}`);
+  }
+  /**
+   * Show info message
+   * @param {string} message - Info message
+   */
+  async showInfo(message) {
+    console.info(`View ${this.id} info:`, message);
+    const app = this.getApp ? this.getApp() : this.app || null;
+    if (app && typeof app.showInfo === "function") {
+      await app.showInfo(message);
+      return;
+    }
+    alert(`Info: ${message}`);
+  }
+  /**
+   * Show warning message
+   * @param {string} message - Warning message
+   */
+  async showWarning(message) {
+    console.warn(`View ${this.id} warning:`, message);
+    const app = this.getApp ? this.getApp() : this.app || null;
+    if (app && typeof app.showWarning === "function") {
+      await app.showWarning(message);
+      return;
+    }
+    alert(`Warning: ${message}`);
+  }
+  static _genId() {
+    return `view_${Math.random().toString(36).substr(2, 9)}`;
+  }
+  static _warn(msg, err) {
+    try {
+      if (err) console.warn(`[View] ${msg}:`, err);
+      else console.warn(`[View] ${msg}`);
+    } catch {
+    }
+  }
+}
+Object.assign(View.prototype, EventEmitter);
+class Router {
+  constructor(options = {}) {
+    this.defaultRoute = options.defaultRoute || "home";
+    this.routes = [];
+    this.currentRoute = null;
+    this.eventEmitter = options.eventEmitter || null;
+    this.boundHandlePopState = this.handlePopState.bind(this);
+  }
+  start() {
+    window.addEventListener("popstate", this.boundHandlePopState);
+    this.handleCurrentLocation();
+  }
+  stop() {
+    window.removeEventListener("popstate", this.boundHandlePopState);
+  }
+  addRoute(pattern, pageName) {
+    this.routes.push({
+      pattern: this.normalizePattern(pattern),
+      regex: this.patternToRegex(pattern),
+      pageName,
+      paramNames: this.extractParamNames(pattern)
+    });
+  }
+  async navigate(path, options = {}) {
+    const { replace = false, state = null, trigger = true } = options;
+    const { pageName, queryParams } = this.parseInput(path);
+    if (trigger) {
+      await this.handleRouteChange(pageName, queryParams);
+    }
+  }
+  // Browser navigation
+  back() {
+    window.history.back();
+  }
+  forward() {
+    window.history.forward();
+  }
+  // Get current route info
+  getCurrentRoute() {
+    return this.currentRoute;
+  }
+  getCurrentPath() {
+    const { pageName, queryParams } = this.parseCurrentUrl();
+    return this.buildPublicUrl(pageName, queryParams);
+  }
+  // Private methods
+  handlePopState(_event) {
+    this.handleCurrentLocation();
+  }
+  async handleCurrentLocation() {
+    const { pageName, queryParams } = this.parseCurrentUrl();
+    await this.handleRouteChange(pageName, queryParams);
+  }
+  async handleRouteChange(pageName, queryParams) {
+    const routePath = "/" + pageName;
+    const route = this.matchRoute(routePath);
+    const publicUrl = this.buildPublicUrl(pageName, queryParams);
+    if (!route) {
+      console.log("No route matched for page:", pageName);
+      if (this.eventEmitter) {
+        this.eventEmitter.emit("route:notfound", { path: publicUrl });
+      }
+      return null;
+    }
+    this.currentRoute = route;
+    if (this.eventEmitter) {
+      this.eventEmitter.emit("route:changed", {
+        path: publicUrl,
+        pageName: route.pageName,
+        params: route.params,
+        query: queryParams,
+        route
+      });
+    }
+    return route;
+  }
+  matchRoute(path) {
+    for (const route of this.routes) {
+      const match = path.match(route.regex);
+      if (match) {
+        const params = {};
+        route.paramNames.forEach((name, index) => {
+          params[name] = match[index + 1];
+        });
+        return {
+          ...route,
+          params,
+          path
+        };
+      }
+    }
+    return null;
+  }
+  // Parse any input format and extract page name + query params
+  parseInput(input) {
+    let pageName = this.defaultRoute;
+    let queryParams = {};
+    if (!input) {
+      return { pageName, queryParams };
+    }
+    try {
+      if (input.includes("?")) {
+        const [pathPart, queryPart] = input.split("?", 2);
+        const urlParams = new URLSearchParams(queryPart);
+        if (urlParams.has("page")) {
+          pageName = urlParams.get("page") || this.defaultRoute;
+          for (const [key, value] of urlParams) {
+            if (key !== "page") {
+              queryParams[key] = value;
+            }
+          }
+        } else {
+          if (pathPart.startsWith("/")) {
+            pageName = pathPart.substring(1) || this.defaultRoute;
+          } else {
+            pageName = pathPart || this.defaultRoute;
+          }
+          for (const [key, value] of urlParams) {
+            queryParams[key] = value;
+          }
+        }
+      } else if (input.startsWith("/")) {
+        pageName = input.substring(1) || this.defaultRoute;
+      } else {
+        pageName = input;
+      }
+    } catch (error) {
+      console.warn("Failed to parse input:", input, error);
+      pageName = this.defaultRoute;
+      queryParams = {};
+    }
+    return { pageName, queryParams };
+  }
+  // Parse current browser URL
+  parseCurrentUrl() {
+    const urlParams = new URLSearchParams(window.location.search);
+    const pageName = urlParams.get("page") || this.defaultRoute;
+    const queryParams = {};
+    for (const [key, value] of urlParams) {
+      if (key !== "page") {
+        queryParams[key] = value;
+      }
+    }
+    return { pageName, queryParams };
+  }
+  // Build public URL format: ?page=admin&group=123
+  buildPublicUrl(pageName, queryParams = {}) {
+    const urlParams = new URLSearchParams();
+    urlParams.set("page", pageName);
+    Object.entries(queryParams).forEach(([key, value]) => {
+      if (value !== null && value !== void 0 && value !== "") {
+        urlParams.set(key, String(value));
+      }
+    });
+    return "?" + urlParams.toString();
+  }
+  // Update browser URL
+  updateBrowserUrl(pageName, queryParams, replace, state) {
+    const currentUrl = new URL(window.location.origin + window.location.pathname);
+    currentUrl.searchParams.set("page", pageName);
+    Object.entries(queryParams).forEach(([key, value]) => {
+      if (value !== null && value !== void 0 && value !== "") {
+        currentUrl.searchParams.set(key, String(value));
+      }
+    });
+    const url = currentUrl.toString();
+    if (replace) {
+      window.history.replaceState(state, "", url);
+    } else {
+      window.history.pushState(state, "", url);
+    }
+  }
+  // Route pattern utilities
+  patternToRegex(pattern) {
+    let regexPattern = pattern.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&").replace(/\/:([^/?]+)\?/g, "(?:/([^/]+))?").replace(/:([^/]+)/g, "([^/]+)");
+    return new RegExp(`^${regexPattern}$`);
+  }
+  extractParamNames(pattern) {
+    const matches = pattern.match(/:([^/?]+)\??/g) || [];
+    return matches.map((match) => match.replace(/[:?]/g, ""));
+  }
+  normalizePattern(pattern) {
+    return pattern.startsWith("/") ? pattern : `/${pattern}`;
+  }
+  /**
+   * Update URL parameters without triggering navigation
+   * @param {object} params - Parameters to update in URL
+   * @param {object} options - Options like { replace: true }
+   */
+  updateUrl(params = {}, options = {}) {
+    const { replace = false } = options;
+    const { pageName } = this.parseCurrentUrl();
+    this.updateBrowserUrl(pageName, params, replace);
+  }
+  /**
+   * Build URL for given page and query parameters
+   */
+  buildUrl(page, query = {}) {
+    return this.buildPublicUrl(page, query);
+  }
+  /**
+   * Check if two routes match (ignoring query parameters)
+   * @param {string} route1 - First route in any format ("/admin", "?page=admin", "admin")
+   * @param {string} route2 - Second route in any format
+   * @returns {boolean} - True if routes point to the same page
+   */
+  doRoutesMatch(route1, route2) {
+    if (!route1 || !route2) return false;
+    const { pageName: pageName1 } = this.parseInput(route1);
+    const { pageName: pageName2 } = this.parseInput(route2);
+    return pageName1 === pageName2;
+  }
+}
+class Rest {
+  constructor() {
+    this.config = {
+      baseURL: "",
+      timeout: 3e4,
+      headers: {
+        "Content-Type": "application/json",
+        "Accept": "application/json"
+      },
+      trackDevice: true,
+      // New setting to control DUID tracking
+      duidHeader: "X-Mojo-UID",
+      // Header name for the DUID
+      duidTransport: "header"
+      // How to send the DUID: 'payload' or 'header'
+    };
+    this.interceptors = {
+      request: [],
+      response: []
+    };
+    this.duid = null;
+    if (this.config.trackDevice) {
+      this._initializeDuid();
+    }
+  }
+  /**
+   * Initialize or generate the Device Unique ID (DUID)
+   * @private
+   */
+  _initializeDuid() {
+    const storageKey = "mojo_device_uid";
+    try {
+      let storedDuid = localStorage.getItem(storageKey);
+      if (storedDuid) {
+        this.duid = storedDuid;
+      } else {
+        this.duid = this._generateDuid();
+        localStorage.setItem(storageKey, this.duid);
+      }
+    } catch (e) {
+      console.error("Could not access localStorage to get/set DUID.", e);
+      this.duid = this._generateDuid();
+    }
+  }
+  /**
+   * Generate a new DUID (UUID v4)
+   * @private
+   * @returns {string} A new UUID
+   */
+  _generateDuid() {
+    if (crypto && crypto.randomUUID) {
+      return crypto.randomUUID();
+    }
+    return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
+      const r = Math.random() * 16 | 0, v = c === "x" ? r : r & 3 | 8;
+      return v.toString(16);
+    });
+  }
+  /**
+   * Configure the REST client
+   * @param {object} config - Configuration object
+   */
+  configure(config) {
+    if (config.baseUrl) config.baseURL = config.baseUrl;
+    const oldTrackDevice = this.config.trackDevice;
+    this.config = {
+      ...this.config,
+      ...config,
+      headers: {
+        ...this.config.headers,
+        ...config.headers
+      }
+    };
+    if (this.config.trackDevice && !oldTrackDevice) {
+      this._initializeDuid();
+    }
+  }
+  /**
+   * Add request or response interceptor
+   * @param {string} type - 'request' or 'response'
+   * @param {function} interceptor - Interceptor function
+   */
+  addInterceptor(type, interceptor) {
+    if (this.interceptors[type]) {
+      this.interceptors[type].push(interceptor);
+    }
+  }
+  /**
+   * Build complete URL
+   * @param {string} url - Endpoint URL
+   * @returns {string} Complete URL
+   */
+  buildUrl(url) {
+    if (url.startsWith("http://") || url.startsWith("https://")) {
+      return url;
+    }
+    const baseURL = this.config.baseURL.endsWith("/") ? this.config.baseURL.slice(0, -1) : this.config.baseURL;
+    const endpoint = url.startsWith("/") ? url : `/${url}`;
+    return `${baseURL}${endpoint}`;
+  }
+  /**
+   * Categorize error into common reason codes
+   * @param {Error} error - The error object
+   * @param {number} status - HTTP status code (if available)
+   * @returns {object} Object with reason code and user-friendly message
+   */
+  categorizeError(error, status = 0) {
+    if (error.name === "TypeError" && error.message.includes("fetch")) {
+      return {
+        reason: "not_reachable",
+        message: "Service is not reachable - please check your connection"
+      };
+    }
+    if (error.name === "AbortError") {
+      return {
+        reason: "cancelled",
+        message: "Request was cancelled"
+      };
+    }
+    if (error.name === "TimeoutError" || error.message.includes("timeout")) {
+      return {
+        reason: "timed_out",
+        message: "Request timed out - please try again"
+      };
+    }
+    if (status >= 400) {
+      if (status === 400) {
+        return {
+          reason: "bad_request",
+          message: "Invalid request data"
+        };
+      }
+      if (status === 401) {
+        return {
+          reason: "unauthorized",
+          message: "Authentication required"
+        };
+      }
+      if (status === 403) {
+        return {
+          reason: "forbidden",
+          message: "Access denied"
+        };
+      }
+      if (status === 404) {
+        return {
+          reason: "not_found",
+          message: "Resource not found"
+        };
+      }
+      if (status === 409) {
+        return {
+          reason: "conflict",
+          message: "Resource conflict"
+        };
+      }
+      if (status === 422) {
+        return {
+          reason: "validation_error",
+          message: "Validation failed"
+        };
+      }
+      if (status === 429) {
+        return {
+          reason: "rate_limited",
+          message: "Too many requests - please wait"
+        };
+      }
+      if (status >= 500) {
+        return {
+          reason: "server_error",
+          message: "Server error - please try again later"
+        };
+      }
+      if (status >= 400) {
+        return {
+          reason: "client_error",
+          message: "Request error"
+        };
+      }
+    }
+    if (error.message.includes("CORS")) {
+      return {
+        reason: "cors_error",
+        message: "Cross-origin request blocked"
+      };
+    }
+    if (error.message.includes("DNS") || error.message.includes("ENOTFOUND")) {
+      return {
+        reason: "dns_error",
+        message: "Unable to resolve server address"
+      };
+    }
+    return {
+      reason: "unknown_error",
+      message: `Network error: ${error.message}`
+    };
+  }
+  /**
+   * Build query string from parameters
+   * @param {object} params - Query parameters
+   * @returns {string} Query string
+   */
+  buildQueryString(params = {}) {
+    const searchParams = new URLSearchParams();
+    Object.entries(params).forEach(([key, value]) => {
+      if (value !== null && value !== void 0) {
+        if (Array.isArray(value)) {
+          value.forEach((v) => searchParams.append(`${key}[]`, v));
+        } else {
+          searchParams.append(key, value);
+        }
+      }
+    });
+    const queryString = searchParams.toString();
+    return queryString ? `?${queryString}` : "";
+  }
+  /**
+   * Process request through interceptors
+   * @param {object} request - Request configuration
+   * @returns {object} Processed request configuration
+   */
+  async processRequestInterceptors(request) {
+    let processedRequest = { ...request };
+    for (const interceptor of this.interceptors.request) {
+      try {
+        processedRequest = await interceptor(processedRequest);
+      } catch (error) {
+        console.error("Request interceptor error:", error);
+        throw error;
+      }
+    }
+    return processedRequest;
+  }
+  /**
+   * Process response through interceptors
+   * @param {Response} response - Fetch response object
+   * @param {object} request - Original request configuration
+   * @returns {object} Processed response data
+   */
+  async processResponseInterceptors(response, request) {
+    let responseData = {
+      success: response.ok,
+      status: response.status,
+      statusText: response.statusText,
+      headers: Object.fromEntries(response.headers.entries()),
+      data: null,
+      errors: null,
+      message: null,
+      reason: null
+    };
+    try {
+      const contentType = response.headers.get("content-type");
+      if (contentType && contentType.includes("application/json")) {
+        const jsonData = await response.json();
+        responseData.data = jsonData;
+        if (!response.ok) {
+          const errorInfo = this.categorizeError(new Error("HTTP Error"), response.status);
+          responseData.errors = jsonData.errors || {};
+          responseData.message = jsonData.message || errorInfo.message;
+          responseData.reason = errorInfo.reason;
+        }
+      } else {
+        responseData.data = await response.text();
+        if (!response.ok) {
+          const errorInfo = this.categorizeError(new Error("HTTP Error"), response.status);
+          responseData.message = errorInfo.message;
+          responseData.reason = errorInfo.reason;
+        }
+      }
+    } catch (error) {
+      responseData.errors = { parse: "Failed to parse response" };
+      responseData.message = "Invalid response format";
+    }
+    for (const interceptor of this.interceptors.response) {
+      try {
+        responseData = await interceptor(responseData, request);
+      } catch (error) {
+        console.error("Response interceptor error:", error);
+      }
+    }
+    return responseData;
+  }
+  /**
+   * Make HTTP request
+   * @param {string} method - HTTP method
+   * @param {string} url - Request URL
+   * @param {object} data - Request body data
+   * @param {object} params - Query parameters
+   * @param {object} options - Additional request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async request(method, url, data = null, params = {}, options = {}) {
+    let request = {
+      method: method.toUpperCase(),
+      url: this.buildUrl(url) + this.buildQueryString(params),
+      headers: {
+        ...this.config.headers,
+        ...options.headers
+      },
+      data,
+      options: {
+        timeout: this.config.timeout,
+        ...options
+      }
+    };
+    request = await this.processRequestInterceptors(request);
+    if (this.config.trackDevice && this.duid) {
+      if (this.config.duidTransport === "header") {
+        request.headers[this.config.duidHeader] = this.duid;
+      } else {
+        if (request.method === "GET") {
+          const url2 = new URL(request.url);
+          url2.searchParams.append("duid", this.duid);
+          request.url = url2.toString();
+        } else if (request.data && typeof request.data === "object" && !(request.data instanceof FormData)) {
+          request.data.duid = this.duid;
+        }
+      }
+    }
+    const fetchOptions = {
+      method: request.method,
+      headers: request.headers
+    };
+    const signals = [];
+    if (request.options.timeout) {
+      signals.push(AbortSignal.timeout(request.options.timeout));
+    }
+    if (request.options.signal) {
+      signals.push(request.options.signal);
+    }
+    if (signals.length > 1) {
+      fetchOptions.signal = AbortSignal.any ? AbortSignal.any(signals) : signals[0];
+    } else if (signals.length === 1) {
+      fetchOptions.signal = signals[0];
+    }
+    if (request.data && ["POST", "PUT", "PATCH"].includes(request.method)) {
+      if (request.data instanceof FormData) {
+        fetchOptions.body = request.data;
+        delete fetchOptions.headers["Content-Type"];
+      } else if (typeof request.data === "object") {
+        fetchOptions.body = JSON.stringify(request.data);
+      } else {
+        fetchOptions.body = request.data;
+      }
+    }
+    try {
+      const response = await fetch(request.url, fetchOptions);
+      const responseData = await this.processResponseInterceptors(response, request);
+      return responseData;
+    } catch (error) {
+      if (error.name === "AbortError") {
+        throw error;
+      }
+      const errorInfo = this.categorizeError(error);
+      const errorResponse = {
+        success: false,
+        status: 0,
+        statusText: "Network Error",
+        headers: {},
+        data: null,
+        errors: { network: error.message },
+        message: errorInfo.message,
+        reason: errorInfo.reason
+      };
+      const mockResponse = {
+        ok: false,
+        status: 0,
+        statusText: "Network Error",
+        headers: new Headers(),
+        json: async () => ({}),
+        text: async () => ""
+      };
+      await this.processResponseInterceptors(mockResponse, request);
+      return errorResponse;
+    }
+  }
+  /**
+   * GET request
+   * @param {string} url - Request URL
+   * @param {object} params - Query parameters
+   * @param {object} options - Request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async GET(url, params = {}, options = {}) {
+    return this.request("GET", url, null, params, options);
+  }
+  /**
+   * POST request
+   * @param {string} url - Request URL
+   * @param {object} data - Request body data
+   * @param {object} params - Query parameters
+   * @param {object} options - Request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async POST(url, data = {}, params = {}, options = {}) {
+    return this.request("POST", url, data, params, options);
+  }
+  /**
+   * PUT request
+   * @param {string} url - Request URL
+   * @param {object} data - Request body data
+   * @param {object} params - Query parameters
+   * @param {object} options - Request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async PUT(url, data = {}, params = {}, options = {}) {
+    return this.request("PUT", url, data, params, options);
+  }
+  /**
+   * PATCH request
+   * @param {string} url - Request URL
+   * @param {object} data - Request body data
+   * @param {object} params - Query parameters
+   * @param {object} options - Request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async PATCH(url, data = {}, params = {}, options = {}) {
+    return this.request("PATCH", url, data, params, options);
+  }
+  /**
+   * DELETE request
+   * @param {string} url - Request URL
+   * @param {object} params - Query parameters
+   * @param {object} options - Request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async DELETE(url, params = {}, options = {}) {
+    return this.request("DELETE", url, null, params, options);
+  }
+  /**
+   * Upload file with raw PUT request (compatible with legacy backend)
+   * @param {string} url - Upload URL
+   * @param {File} file - Single file to upload
+   * @param {object} options - Request options
+   * @param {function} options.onProgress - Progress callback function(event)
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async upload(url, file, options = {}) {
+    return new Promise((resolve, reject) => {
+      if (!(file instanceof File)) {
+        reject(new Error("Only single File objects are supported for legacy backend compatibility"));
+        return;
+      }
+      const xhr = new XMLHttpRequest();
+      if (options.onProgress && typeof options.onProgress === "function") {
+        xhr.upload.onprogress = options.onProgress;
+      }
+      xhr.onload = function() {
+        if (xhr.status >= 200 && xhr.status < 300) {
+          resolve({
+            data: xhr.response,
+            status: xhr.status,
+            statusText: xhr.statusText,
+            xhr
+          });
+        } else {
+          reject(new Error(`Upload failed: ${xhr.status} ${xhr.statusText}`));
+        }
+      };
+      xhr.onerror = function() {
+        reject(new Error("Upload failed: Network error"));
+      };
+      xhr.ontimeout = function() {
+        reject(new Error("Upload failed: Timeout"));
+      };
+      xhr.open("PUT", url);
+      xhr.setRequestHeader("Content-Type", file.type);
+      if (options.timeout) {
+        xhr.timeout = options.timeout;
+      }
+      xhr.send(file);
+    });
+  }
+  /**
+   * Upload multiple files with multipart/form-data (for modern backends)
+   * @param {string} url - Upload URL
+   * @param {File|FileList|FormData} files - File(s) to upload
+   * @param {object} additionalData - Additional form fields
+   * @param {object} options - Request options
+   * @returns {Promise} Promise that resolves with response data
+   */
+  async uploadMultipart(url, files, additionalData = {}, options = {}) {
+    const formData = new FormData();
+    if (files instanceof FileList) {
+      Array.from(files).forEach((file, index) => {
+        formData.append(`file_${index}`, file);
+      });
+    } else if (files instanceof File) {
+      formData.append("file", files);
+    } else if (files instanceof FormData) {
+      return this.POST(url, files, {}, options);
+    }
+    Object.entries(additionalData).forEach(([key, value]) => {
+      formData.append(key, value);
+    });
+    return this.POST(url, formData, {}, options);
+  }
+  /**
+   * Set authentication token
+   * @param {string} token - JWT or API token
+   * @param {string} type - Token type ('Bearer', 'Token', etc.)
+   */
+  setAuthToken(token, type = "Bearer") {
+    if (token) {
+      this.config.headers["Authorization"] = `${type} ${token}`;
+    } else {
+      delete this.config.headers["Authorization"];
+    }
+  }
+  /**
+   * Clear authentication
+   */
+  clearAuth() {
+    delete this.config.headers["Authorization"];
+  }
+  /**
+   * Check if an error is retryable (network issues that might resolve)
+   * @param {object} response - Response object with reason field
+   * @returns {boolean} True if error can be retried
+   */
+  isRetryableError(response) {
+    const retryableReasons = [
+      "not_reachable",
+      "timed_out",
+      "server_error",
+      "dns_error"
+    ];
+    return retryableReasons.includes(response.reason);
+  }
+  /**
+   * Check if error requires authentication
+   * @param {object} response - Response object with reason field
+   * @returns {boolean} True if authentication is required
+   */
+  requiresAuth(response) {
+    return response.reason === "unauthorized";
+  }
+  /**
+   * Check if error is network-related
+   * @param {object} response - Response object with reason field
+   * @returns {boolean} True if it's a network error
+   */
+  isNetworkError(response) {
+    const networkReasons = [
+      "not_reachable",
+      "timed_out",
+      "cancelled",
+      "cors_error",
+      "dns_error"
+    ];
+    return networkReasons.includes(response.reason);
+  }
+  /**
+   * Get user-friendly error message based on reason
+   * @param {object} response - Response object with reason field
+   * @returns {string} User-friendly error message
+   */
+  getUserMessage(response) {
+    if (response.message) {
+      return response.message;
+    }
+    const messages = {
+      "not_reachable": "Unable to connect to the server. Please check your internet connection.",
+      "timed_out": "The request took too long. Please try again.",
+      "cancelled": "The request was cancelled.",
+      "unauthorized": "Please log in to continue.",
+      "forbidden": "You don't have permission to perform this action.",
+      "not_found": "The requested resource was not found.",
+      "validation_error": "Please check your input and try again.",
+      "rate_limited": "Too many requests. Please wait a moment before trying again.",
+      "server_error": "Server error. Please try again later.",
+      "cors_error": "Access blocked by security policy.",
+      "dns_error": "Unable to reach the server.",
+      "unknown_error": "An unexpected error occurred."
+    };
+    return messages[response.reason] || "An error occurred. Please try again.";
+  }
+}
+const rest = new Rest();
+class EventBus {
+  constructor() {
+    this.listeners = {};
+    this.onceListeners = {};
+    this.maxListeners = 100;
+    this.debugMode = false;
+    this.eventStats = {};
+  }
+  /**
+   * Add event listener
+   * @param {string|Array<string>} event - Event name or array of event names
+   * @param {function} callback - Event callback
+   * @returns {EventBus} This instance for chaining
+   */
+  on(event, callback) {
+    if (typeof callback !== "function") {
+      throw new Error("Callback must be a function");
+    }
+    if (Array.isArray(event)) {
+      event.forEach((eventName) => this.on(eventName, callback));
+      return this;
+    }
+    if (!this.listeners[event]) {
+      this.listeners[event] = [];
+    }
+    if (this.listeners[event].length >= this.maxListeners) {
+      console.warn(`Max listeners (${this.maxListeners}) exceeded for event: ${event}`);
+    }
+    this.listeners[event].push(callback);
+    return this;
+  }
+  /**
+   * Add one-time event listener
+   * @param {string|Array<string>} event - Event name or array of event names
+   * @param {function} callback - Event callback
+   * @returns {EventBus} This instance for chaining
+   */
+  once(event, callback) {
+    if (typeof callback !== "function") {
+      throw new Error("Callback must be a function");
+    }
+    if (Array.isArray(event)) {
+      event.forEach((eventName) => this.once(eventName, callback));
+      return this;
+    }
+    if (!this.onceListeners[event]) {
+      this.onceListeners[event] = [];
+    }
+    this.onceListeners[event].push(callback);
+    return this;
+  }
+  /**
+   * Remove event listener
+   * @param {string|Array<string>} event - Event name or array of event names
+   * @param {function} callback - Event callback to remove
+   * @returns {EventBus} This instance for chaining
+   */
+  off(event, callback) {
+    if (Array.isArray(event)) {
+      event.forEach((eventName) => this.off(eventName, callback));
+      return this;
+    }
+    if (!callback) {
+      delete this.listeners[event];
+      delete this.onceListeners[event];
+      return this;
+    }
+    if (this.listeners[event]) {
+      const index = this.listeners[event].indexOf(callback);
+      if (index !== -1) {
+        this.listeners[event].splice(index, 1);
+        if (this.listeners[event].length === 0) {
+          delete this.listeners[event];
+        }
+      }
+    }
+    if (this.onceListeners[event]) {
+      const index = this.onceListeners[event].indexOf(callback);
+      if (index !== -1) {
+        this.onceListeners[event].splice(index, 1);
+        if (this.onceListeners[event].length === 0) {
+          delete this.onceListeners[event];
+        }
+      }
+    }
+    return this;
+  }
+  /**
+   * Emit event to all listeners
+   * @param {string} event - Event name
+   * @param {*} data - Event data
+   * @returns {EventBus} This instance for chaining
+   */
+  emit(event, data) {
+    this.updateEventStats(event);
+    if (this.debugMode) {
+      console.log(`[EventBus] Emitting: ${event}`, data);
+    }
+    const listeners = [];
+    if (this.listeners[event]) {
+      listeners.push(...this.listeners[event]);
+    }
+    if (this.listeners["*"]) {
+      listeners.push(...this.listeners["*"]);
+    }
+    if (this.onceListeners[event]) {
+      listeners.push(...this.onceListeners[event]);
+      delete this.onceListeners[event];
+    }
+    if (this.onceListeners["*"]) {
+      listeners.push(...this.onceListeners["*"]);
+      delete this.onceListeners["*"];
+    }
+    if (this.debugMode && listeners.length > 0) {
+      console.log(`[EventBus] ${listeners.length} listener(s) for '${event}'`);
+    }
+    listeners.forEach((callback) => {
+      try {
+        callback(data, event);
+      } catch (error) {
+        console.error(`Error in event listener for '${event}':`, error);
+        this.emitError(error, event, callback);
+      }
+    });
+    return this;
+  }
+  /**
+   * Emit event asynchronously
+   * @param {string} event - Event name
+   * @param {*} data - Event data
+   * @returns {Promise<EventBus>} Promise that resolves with this instance
+   */
+  async emitAsync(event, data) {
+    const listeners = [];
+    if (this.listeners[event]) {
+      listeners.push(...this.listeners[event]);
+    }
+    if (this.listeners["*"]) {
+      listeners.push(...this.listeners["*"]);
+    }
+    if (this.onceListeners[event]) {
+      listeners.push(...this.onceListeners[event]);
+      delete this.onceListeners[event];
+    }
+    if (this.onceListeners["*"]) {
+      listeners.push(...this.onceListeners["*"]);
+      delete this.onceListeners["*"];
+    }
+    const promises = listeners.map((callback) => {
+      return new Promise((resolve) => {
+        try {
+          const result = callback(data, event);
+          resolve(result);
+        } catch (error) {
+          console.error(`Error in async event listener for '${event}':`, error);
+          this.emitError(error, event, callback);
+          resolve();
+        }
+      });
+    });
+    await Promise.all(promises);
+    return this;
+  }
+  /**
+   * Remove all listeners for all events
+   * @returns {EventBus} This instance for chaining
+   */
+  removeAllListeners() {
+    this.listeners = {};
+    this.onceListeners = {};
+    return this;
+  }
+  /**
+   * Get listener count for an event
+   * @param {string} event - Event name
+   * @returns {number} Number of listeners
+   */
+  listenerCount(event) {
+    const regularCount = this.listeners[event] ? this.listeners[event].length : 0;
+    const onceCount = this.onceListeners[event] ? this.onceListeners[event].length : 0;
+    return regularCount + onceCount;
+  }
+  /**
+   * Get all event names that have listeners
+   * @returns {Array<string>} Array of event names
+   */
+  eventNames() {
+    const regularEvents = Object.keys(this.listeners);
+    const onceEvents = Object.keys(this.onceListeners);
+    return [.../* @__PURE__ */ new Set([...regularEvents, ...onceEvents])];
+  }
+  /**
+   * Set maximum number of listeners per event
+   * @param {number} max - Maximum listeners
+   * @returns {EventBus} This instance for chaining
+   */
+  setMaxListeners(max) {
+    if (typeof max !== "number" || max < 0) {
+      throw new Error("Max listeners must be a non-negative number");
+    }
+    this.maxListeners = max;
+    return this;
+  }
+  /**
+   * Create a namespaced event bus
+   * @param {string} namespace - Namespace prefix
+   * @returns {object} Namespaced event bus methods
+   */
+  namespace(namespace) {
+    const prefixEvent = (event) => `${namespace}:${event}`;
+    return {
+      on: (event, callback) => this.on(prefixEvent(event), callback),
+      once: (event, callback) => this.once(prefixEvent(event), callback),
+      off: (event, callback) => this.off(prefixEvent(event), callback),
+      emit: (event, data) => this.emit(prefixEvent(event), data),
+      emitAsync: (event, data) => this.emitAsync(prefixEvent(event), data)
+    };
+  }
+  /**
+   * Add middleware to intercept events
+   * @param {function} middleware - Middleware function
+   * @returns {EventBus} This instance for chaining
+   */
+  use(middleware) {
+    if (typeof middleware !== "function") {
+      throw new Error("Middleware must be a function");
+    }
+    const originalEmit = this.emit;
+    this.emit = (event, data) => {
+      try {
+        const result = middleware(event, data);
+        if (result === false) {
+          return this;
+        }
+        const finalData = result !== void 0 ? result : data;
+        return originalEmit.call(this, event, finalData);
+      } catch (error) {
+        console.error("Error in event middleware:", error);
+        return originalEmit.call(this, event, data);
+      }
+    };
+    return this;
+  }
+  /**
+   * Emit error event for listener errors
+   * @private
+   * @param {Error} error - The error that occurred
+   * @param {string} originalEvent - The event that caused the error
+   * @param {function} callback - The callback that threw the error
+   */
+  emitError(error, originalEvent, callback) {
+    if (originalEvent === "error") {
+      return;
+    }
+    setTimeout(() => {
+      this.emit("error", {
+        error,
+        originalEvent,
+        callback: callback.toString()
+      });
+    }, 0);
+  }
+  /**
+   * Create a promise that resolves when an event is emitted
+   * @param {string} event - Event name
+   * @param {number} timeout - Optional timeout in milliseconds
+   * @returns {Promise} Promise that resolves with event data
+   */
+  waitFor(event, timeout = null) {
+    return new Promise((resolve, reject) => {
+      let timeoutId = null;
+      const cleanup = () => {
+        if (timeoutId) {
+          clearTimeout(timeoutId);
+        }
+      };
+      const listener = (data) => {
+        cleanup();
+        resolve(data);
+      };
+      this.once(event, listener);
+      if (timeout) {
+        timeoutId = setTimeout(() => {
+          this.off(event, listener);
+          reject(new Error(`Timeout waiting for event: ${event}`));
+        }, timeout);
+      }
+    });
+  }
+  /**
+   * Enable/disable debug mode for detailed event logging
+   * @param {boolean} enable - Whether to enable debug mode
+   * @returns {EventBus} This instance for chaining
+   */
+  debug(enable = true) {
+    this.debugMode = enable;
+    if (enable) {
+      console.log("[EventBus] Debug mode enabled");
+    } else {
+      console.log("[EventBus] Debug mode disabled");
+    }
+    return this;
+  }
+  /**
+   * Get statistics about the event bus
+   * @returns {object} Statistics object
+   */
+  getStats() {
+    const eventNames = this.eventNames();
+    const stats = {
+      totalEvents: eventNames.length,
+      totalListeners: 0,
+      events: {},
+      emissions: { ...this.eventStats }
+    };
+    eventNames.forEach((event) => {
+      const count = this.listenerCount(event);
+      stats.events[event] = count;
+      stats.totalListeners += count;
+    });
+    return stats;
+  }
+  /**
+   * Update event emission statistics
+   * @private
+   * @param {string} event - Event name
+   */
+  updateEventStats(event) {
+    if (!this.eventStats[event]) {
+      this.eventStats[event] = {
+        count: 0,
+        firstEmission: Date.now(),
+        lastEmission: null
+      };
+    }
+    this.eventStats[event].count++;
+    this.eventStats[event].lastEmission = Date.now();
+  }
+  /**
+   * Get detailed statistics for a specific event
+   * @param {string} event - Event name
+   * @returns {Object} Event statistics
+   */
+  getEventStats(event) {
+    const stats = this.eventStats[event];
+    if (!stats) {
+      return null;
+    }
+    return {
+      ...stats,
+      listenerCount: this.listenerCount(event),
+      avgEmissionsPerMinute: this.calculateEmissionRate(stats)
+    };
+  }
+  /**
+   * Calculate emission rate for an event
+   * @private
+   * @param {Object} stats - Event statistics
+   * @returns {number} Emissions per minute
+   */
+  calculateEmissionRate(stats) {
+    if (!stats.firstEmission || !stats.lastEmission) {
+      return 0;
+    }
+    const durationMs = stats.lastEmission - stats.firstEmission;
+    if (durationMs === 0) {
+      return 0;
+    }
+    const durationMinutes = durationMs / (1e3 * 60);
+    return Math.round(stats.count / durationMinutes * 100) / 100;
+  }
+  /**
+   * Reset event statistics
+   * @returns {EventBus} This instance for chaining
+   */
+  resetStats() {
+    this.eventStats = {};
+    return this;
+  }
+  /**
+   * Get a summary of the most active events
+   * @param {number} limit - Number of events to return (default: 10)
+   * @returns {Array} Array of event statistics sorted by emission count
+   */
+  getTopEvents(limit = 10) {
+    return Object.entries(this.eventStats).map(([event, stats]) => ({
+      event,
+      count: stats.count,
+      rate: this.calculateEmissionRate(stats),
+      listeners: this.listenerCount(event)
+    })).sort((a, b) => b.count - a.count).slice(0, limit);
+  }
+  /**
+   * Log comprehensive debug information
+   * @returns {EventBus} This instance for chaining
+   */
+  debugInfo() {
+    console.group("[EventBus] Debug Information");
+    console.log("Debug Mode:", this.debugMode);
+    console.log("Max Listeners:", this.maxListeners);
+    const stats = this.getStats();
+    console.log("Total Events:", stats.totalEvents);
+    console.log("Total Listeners:", stats.totalListeners);
+    if (Object.keys(this.eventStats).length > 0) {
+      console.log("Top Events:", this.getTopEvents(5));
+    }
+    console.groupEnd();
+    return this;
+  }
+}
+class WebApp {
+  constructor(config = {}) {
+    this.initPluginRegistry();
+    this.name = config.name || "MOJO App";
+    this.version = config.version || "1.0.0";
+    this.debug = config.debug || false;
+    this.container = config.container || "#app";
+    this.layoutType = config.layout || "portal";
+    this.layoutConfig = config.layoutConfig || {};
+    if (config.sidebar) {
+      this.layoutConfig.sidebarConfig = config.sidebar;
+    }
+    if (config.topbar) {
+      this.layoutConfig.topbarConfig = config.topbar;
+    }
+    this.layout = null;
+    this.layoutConfig.containerId = this.container || this.containerId || "#app";
+    this.pageContainer = config.pageContainer || "#page-container";
+    this.basePath = config.basePath || "";
+    this.routerMode = config.routerMode || config.router?.mode || "param";
+    this.basePath = config.basePath || config.router?.base || "";
+    this.defaultRoute = config.defaultRoute || "home";
+    this.session = config.session || {};
+    this.router = null;
+    this.navigation = config.navigation || {};
+    this.state = {
+      currentPage: null,
+      previousPage: null,
+      loading: false
+    };
+    this.events = new EventBus();
+    this.rest = rest;
+    if (config.api) {
+      this.rest.configure(config.api);
+    }
+    this.router = new Router({
+      mode: this.routerMode === "param" ? "params" : this.routerMode,
+      basePath: this.basePath,
+      defaultRoute: this.defaultRoute,
+      eventEmitter: this.events
+    });
+    this.events.on("route:changed", async (routeInfo) => {
+      const { pageName, params, query } = routeInfo;
+      await this.showPage(pageName, query, params, { fromRouter: true });
+    });
+    if (typeof window !== "undefined") {
+      window.MOJO = window.MOJO || {};
+      window.MOJO.router = this.router;
+    }
+    this.pageCache = /* @__PURE__ */ new Map();
+    this.pageClasses = /* @__PURE__ */ new Map();
+    this.componentClasses = /* @__PURE__ */ new Map();
+    this.modelClasses = /* @__PURE__ */ new Map();
+    this.currentPage = null;
+    this.isStarted = false;
+    if (window.matchUUID) {
+      window[window.matchUUID] = this;
+    } else if (window.MOJO) {
+      window.MOJO.app = this;
+    } else {
+      window.__app__ = this;
+    }
+    console.log(`WebApp initialized: ${this.name} v${this.version}`);
+  }
+  /**
+   * Start the application
+   */
+  async start() {
+    if (this.isStarted) {
+      console.warn("WebApp already started");
+      return;
+    }
+    try {
+      console.log(`Starting ${this.name}...`);
+      this.setupPageContainer();
+      this.validateDefaultRoute();
+      console.log("Setting up router...");
+      await this.setupRouter();
+      this.isStarted = true;
+      this.events.emit("app:ready", { app: this });
+      console.log(`✅ ${this.name} started successfully`);
+    } catch (error) {
+      console.error(`Failed to start ${this.name}:`, error);
+      this.showError("Failed to start application");
+      throw error;
+    }
+  }
+  /**
+   * Setup router with configuration
+   */
+  async setupRouter() {
+    if (!this.router) {
+      console.error("Router not initialized");
+      return;
+    }
+    this.events.on("route:notfound", async (info) => {
+      console.warn(`Route not found: ${info.path}`);
+      this._show404(info.path);
+    });
+    this.router.start();
+    console.log(`Router started in ${this.routerMode} mode`);
+  }
+  /**
+   * Setup layout based on configuration
+   */
+  setupPageContainer() {
+    const container = typeof this.container === "string" ? document.querySelector(this.container) : this.container;
+    if (container && !container.querySelector("#page-container")) {
+      container.innerHTML = '<div id="page-container"></div>';
+    }
+    this.pageContainer = "#page-container";
+  }
+  /**
+   * Register a page with the app
+   */
+  registerPage(pageName, PageClass, options = {}) {
+    if (typeof pageName !== "string" || !pageName) {
+      console.error("registerPage: pageName must be a non-empty string");
+      return this;
+    }
+    if (typeof PageClass !== "function") {
+      console.error("registerPage: PageClass must be a constructor function");
+      return this;
+    }
+    if (!options.containerId) options.containerId = this.pageContainer;
+    this.pageClasses.set(pageName, {
+      PageClass,
+      constructorOptions: options
+    });
+    if (this.router) {
+      let route = options.route || `/${pageName}`;
+      if (!route.startsWith("/")) {
+        route = `/${route}`;
+      }
+      options.route = route;
+      this.router.addRoute(route, pageName);
+      console.log(`📝 Registered route: "${route}" -> ${pageName}`);
+    }
+    return this;
+  }
+  /**
+   * Get page instance (cached)
+   */
+  getPage(pageName) {
+    return this.pageCache.get(pageName);
+  }
+  /**
+   * Get or create page instance (with caching)
+   */
+  getOrCreatePage(pageName) {
+    if (this.pageCache.has(pageName)) {
+      return this.pageCache.get(pageName);
+    }
+    const pageInfo = this.pageClasses.get(pageName);
+    if (!pageInfo) {
+      console.error(`Page not registered: ${pageName}`);
+      return null;
+    }
+    const { PageClass, constructorOptions } = pageInfo;
+    try {
+      const pageOptions = {
+        pageName,
+        ...constructorOptions,
+        app: this
+      };
+      const page = new PageClass(pageOptions);
+      if (constructorOptions.route) {
+        page.route = constructorOptions.route;
+      }
+      this.pageCache.set(pageName, page);
+      console.log(`Created page: ${pageName} with route: ${page.route}`);
+      return page;
+    } catch (error) {
+      console.error(`Failed to create page ${pageName}:`, error);
+      return null;
+    }
+  }
+  /**
+   * Show a page
+   */
+  /**
+   * SIMPLIFIED UNIFIED PAGE SHOWING METHOD
+   * @param {string|object} page - Page name or page instance
+   * @param {object} query - URL query parameters (URL-safe)
+   * @param {object} params - Any data to pass to page (can include objects)
+   * @param {object} options - Options { fromRouter, replace, force }
+   */
+  async showPage(page, query = {}, params = {}, options = {}) {
+    const { fromRouter = false, replace = false, force = false } = options;
+    try {
+      let pageInstance, pageName;
+      if (typeof page === "string") {
+        pageName = page;
+        pageInstance = this.getOrCreatePage(page);
+      } else if (page && typeof page === "object") {
+        pageInstance = page;
+        pageName = page.pageName;
+      }
+      const oldPage = this.currentPage;
+      if (!pageInstance) {
+        this._show404(pageName, params, query, fromRouter);
+        return;
+      }
+      if (!pageInstance.canEnter()) {
+        this._showDeniedPage(pageInstance, params, query, fromRouter);
+        return;
+      }
+      if (oldPage && oldPage !== pageInstance) {
+        await this._exitOldPage(oldPage);
+      }
+      await pageInstance.onParams(params, query);
+      if (oldPage !== pageInstance) {
+        await pageInstance.onEnter();
+      }
+      pageInstance.syncUrl();
+      await pageInstance.render();
+      this.currentPage = pageInstance;
+      this.events.emit("page:show", {
+        page: pageInstance,
+        pageName: pageInstance.pageName,
+        params,
+        query,
+        fromRouter
+      });
+      console.log(`✅ Showing page: ${pageInstance.pageName}`, { query, params });
+    } catch (error) {
+      console.error("Error in showPage:", error);
+      this.showError(`Failed to load page: ${error.message}`);
+      if (page !== "error") {
+        await this.showPage("error", {}, { error, originalPage: page }, { fromRouter });
+      }
+    }
+  }
+  async _show404(pageName, params, query, fromRouter) {
+    const notFoundPage = this.getOrCreatePage("404");
+    if (!notFoundPage) return;
+    if (notFoundPage.setInfo) {
+      notFoundPage.setInfo(pageName);
+    }
+    await this._exitOldPage(this.currentPage);
+    await notFoundPage.render();
+    this.currentPage = notFoundPage;
+    this.events.emit("page:404", {
+      page: null,
+      pageName,
+      params,
+      query,
+      fromRouter
+    });
+  }
+  async _showDeniedPage(pageInstance, params, query, fromRouter) {
+    const deniedPage = this.getOrCreatePage("denied");
+    if (deniedPage.setDeniedPage) {
+      deniedPage.setDeniedPage(pageInstance);
+    }
+    await this._exitOldPage(this.currentPage);
+    await deniedPage.render();
+    this.currentPage = deniedPage;
+    this.events.emit("page:denied", {
+      page: pageInstance,
+      pageName: pageInstance.pageName,
+      params,
+      query,
+      fromRouter
+    });
+  }
+  async _exitOldPage(oldPage) {
+    if (!oldPage) return;
+    try {
+      await oldPage.onExit();
+      await oldPage.unmount();
+      this.events.emit("page:hide", { page: oldPage });
+    } catch (error) {
+      console.error(`Error exiting page ${oldPage.pageName}:`, error);
+    }
+  }
+  /**
+   * SIMPLIFIED NAVIGATION - delegates to router
+   * @param {string} route - Route like "/users" or "/users/123"
+   * @param {object} query - Query string params { filter: 'active' }
+   * @param {object} options - Navigation options { replace, force }
+   */
+  async navigate(route, query = {}, options = {}) {
+    if (!this.router) {
+      console.error("Router not initialized");
+      return;
+    }
+    console.log("🧭 WebApp.navigate:", { route, query, options });
+    let fullPath = route;
+    if (Object.keys(query).length > 0) {
+      const queryString = new URLSearchParams(query).toString();
+      fullPath += (route.includes("?") ? "&" : "?") + queryString;
+    }
+    return await this.router.navigate(fullPath, options);
+  }
+  /**
+   * Navigate to the default route
+   */
+  async navigateToDefault(options = {}) {
+    return await this.showPage(this.defaultRoute, {}, {}, options);
+  }
+  /**
+   * Navigate back
+   */
+  back() {
+    if (this.router) {
+      this.router.back();
+    } else {
+      console.warn("Router not initialized");
+    }
+  }
+  /**
+   * Navigate forward
+   */
+  forward() {
+    if (this.router) {
+      this.router.forward();
+    } else {
+      console.warn("Router not initialized");
+    }
+  }
+  /**
+   * Get current page
+   */
+  getCurrentPage() {
+    return this.currentPage;
+  }
+  /**
+   * Get page container element
+   */
+  getPageContainer() {
+    if (this.layout && this.layout.getPageContainer) {
+      return this.layout.getPageContainer();
+    }
+    const container = typeof this.pageContainer === "string" ? document.querySelector(this.pageContainer) : this.pageContainer;
+    return container;
+  }
+  /**
+   * Show error notification
+   */
+  async showError(message) {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      await Dialog.alert(message, "Error", { size: "md", class: "text-danger" });
+    } catch (e) {
+      this.events.emit("notification", { message, type: "error" });
+      if (typeof window !== "undefined" && window?.console) {
+        console.error("[WebApp] showError fallback:", e);
+      }
+      if (typeof window !== "undefined") {
+        alert(`Error: ${message}`);
+      }
+    }
+  }
+  /**
+   * Show success notification
+   */
+  async showSuccess(message) {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      await Dialog.alert(message, "Success", { size: "md", class: "text-success" });
+    } catch (e) {
+      this.events.emit("notification", { message, type: "success" });
+      if (typeof window !== "undefined" && window?.console) {
+        console.warn("[WebApp] showSuccess fallback:", e);
+      }
+      if (typeof window !== "undefined") {
+        alert(`Success: ${message}`);
+      }
+    }
+  }
+  /**
+   * Show info notification
+   */
+  async showInfo(message) {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      await Dialog.alert(message, "Information", { size: "md", class: "text-info" });
+    } catch (e) {
+      this.events.emit("notification", { message, type: "info" });
+      if (typeof window !== "undefined" && window?.console) {
+        console.info("[WebApp] showInfo fallback:", e);
+      }
+      if (typeof window !== "undefined") {
+        alert(`Info: ${message}`);
+      }
+    }
+  }
+  /**
+   * Show warning notification
+   */
+  async showWarning(message) {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      await Dialog.alert(message, "Warning", { size: "md", class: "text-warning" });
+    } catch (e) {
+      this.events.emit("notification", { message, type: "warning" });
+      if (typeof window !== "undefined" && window?.console) {
+        console.warn("[WebApp] showWarning fallback:", e);
+      }
+      if (typeof window !== "undefined") {
+        alert(`Warning: ${message}`);
+      }
+    }
+  }
+  /**
+   * Show generic notification
+   */
+  showNotification(message, type = "info") {
+    this.events.emit("notification", { message, type });
+  }
+  /**
+   * Show loading indicator
+   */
+  async showLoading(opts = {}) {
+    if (typeof opts === "string") {
+      opts = { message: opts };
+    }
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      Dialog.showBusy(opts);
+    } catch (e) {
+      if (typeof window !== "undefined" && window?.console) {
+        console.warn("[WebApp] showLoading fallback:", e, opts);
+      }
+      this.events.emit("notification", { message: opts.message || "Loading...", type: "info" });
+    }
+  }
+  /**
+   * Hide loading indicator
+   */
+  async hideLoading() {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      Dialog.hideBusy();
+    } catch (e) {
+      if (typeof window !== "undefined" && window?.console) {
+        console.warn("[WebApp] hideLoading fallback:", e);
+      }
+    }
+  }
+  async showModelForm(options = {}) {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      return await Dialog.showModelForm(options);
+    } catch (e) {
+      if (typeof window !== "undefined" && window?.console) {
+        console.error("[WebApp] showModelForm failed:", e);
+      }
+      throw e;
+    }
+  }
+  async showForm(options = {}) {
+    try {
+      const Dialog = (await import("./Dialog-DSlctbon.js")).default;
+      return await Dialog.showForm(options);
+    } catch (e) {
+      if (typeof window !== "undefined" && window?.console) {
+        console.error("[WebApp] showForm failed:", e);
+      }
+      throw e;
+    }
+  }
+  /**
+   * Setup global error handling
+   */
+  setupErrorHandling() {
+    window.addEventListener("error", (event) => {
+      console.error("Global error:", event.error);
+      if (this.debug) {
+        this.showError(`Error: ${event.error?.message || "Unknown error"}`);
+      }
+    });
+    window.addEventListener("unhandledrejection", (event) => {
+      console.error("Unhandled promise rejection:", event.reason);
+      if (this.debug) {
+        this.showError(`Promise rejected: ${event.reason?.message || "Unknown error"}`);
+      }
+    });
+  }
+  /**
+   * Escape HTML to prevent XSS
+   */
+  escapeHtml(unsafe) {
+    return unsafe.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+  }
+  /**
+   * Get application state
+   */
+  getState(key) {
+    return key ? this.state[key] : this.state;
+  }
+  /**
+   * Set application state
+   */
+  setState(updates) {
+    const oldState = { ...this.state };
+    Object.assign(this.state, updates);
+    this.events.emit("state:changed", {
+      oldState,
+      newState: this.state,
+      updates
+    });
+  }
+  /**
+   * Register component class
+   */
+  registerComponent(name, ComponentClass) {
+    this.componentClasses.set(name, ComponentClass);
+  }
+  /**
+   * Get component class
+   */
+  getComponent(name) {
+    return this.componentClasses.get(name);
+  }
+  /**
+   * Register model class
+   */
+  registerModel(name, ModelClass) {
+    this.modelClasses.set(name, ModelClass);
+  }
+  /**
+   * Get model class
+   */
+  getModel(name) {
+    return this.modelClasses.get(name);
+  }
+  /**
+   * Setup REST configuration
+   */
+  setupRest() {
+    this.rest = rest;
+    rest.configure(this.api);
+  }
+  /**
+   * Destroy the application
+   */
+  async destroy() {
+    console.log("Destroying WebApp...");
+    if (this.router) {
+      this.router.stop();
+    }
+    const pages = Array.from(this.pageCache.values());
+    await Promise.allSettled(
+      pages.map(async (page) => {
+        try {
+          if (page.destroy) {
+            await page.destroy();
+          }
+        } catch (error) {
+          console.error("Error destroying page:", error);
+        }
+      })
+    );
+    if (this.layout && this.layout.destroy) {
+      try {
+        await this.layout.destroy();
+      } catch (error) {
+        console.error("Error destroying layout:", error);
+      }
+    }
+    this.pageCache.clear();
+    this.pageClasses.clear();
+    this.componentClasses.clear();
+    this.modelClasses.clear();
+    if (typeof window !== "undefined" && window.MOJO) {
+      delete window.MOJO.router;
+    }
+    this.isStarted = false;
+    console.log(`✨ ${this.name} destroyed`);
+  }
+  /**
+   * Build page path with params and query
+   */
+  buildPagePath(page, params, query) {
+    let path = page.route || `/${page.pageName.toLowerCase()}`;
+    Object.keys(params).forEach((key) => {
+      if (typeof params[key] === "string" || typeof params[key] === "number") {
+        path = path.replace(`:${key}`, params[key]);
+      }
+    });
+    if (query && Object.keys(query).length > 0) {
+      const queryString = new URLSearchParams(query).toString();
+      path += (path.includes("?") ? "&" : "?") + queryString;
+    }
+    return path;
+  }
+  /**
+   * Static factory method
+   */
+  /**
+   * Validate that default route has a registered page
+   */
+  validateDefaultRoute() {
+    if (!this.pageClasses.has(this.defaultRoute)) {
+      console.warn(`⚠️  Default route '${this.defaultRoute}' is not registered!`);
+      console.warn(`   Please register a page: app.registerPage('${this.defaultRoute}', YourPageClass);`);
+      console.warn(`   Or change default route: new WebApp({ defaultRoute: 'your-page' });`);
+    } else {
+      console.log(`✅ Default route '${this.defaultRoute}' is registered`);
+    }
+  }
+  /**
+   * Find any registered page to use as emergency fallback
+   */
+  findFallbackPage() {
+    const systemPages = ["404", "error", "denied"];
+    for (const [pageName] of this.pageClasses.entries()) {
+      if (!systemPages.includes(pageName)) {
+        return pageName;
+      }
+    }
+    return null;
+  }
+  static create(config = {}) {
+    return new WebApp(config);
+  }
+  /**
+   * Initialize global plugin registry for extensions
+   * Allows extensions to register components that core can use optionally
+   */
+  initPluginRegistry() {
+    if (typeof window !== "undefined") {
+      if (!window.MOJO) {
+        window.MOJO = {};
+      }
+      if (!window.MOJO.plugins) {
+        window.MOJO.plugins = {};
+      }
+      window.MOJO.app = this;
+    }
+  }
+  /**
+   * Register a plugin component
+   * @param {string} name - Plugin component name (e.g., 'ImageCropView')
+   * @param {*} component - The component/class to register
+   */
+  static registerPlugin(name, component) {
+    if (typeof window !== "undefined") {
+      if (!window.MOJO) {
+        window.MOJO = {};
+      }
+      if (!window.MOJO.plugins) {
+        window.MOJO.plugins = {};
+      }
+      window.MOJO.plugins[name] = component;
+      console.debug(`MOJO Plugin registered: ${name}`);
+    }
+  }
+}
+export {
+  BUILD_TIME as B,
+  DataWrapper as D,
+  EventDelegate as E,
+  Mustache as M,
+  Router as R,
+  View as V,
+  WebApp as W,
+  VERSION_INFO as a,
+  VERSION as b,
+  VERSION_MAJOR as c,
+  dataFormatter as d,
+  VERSION_MINOR as e,
+  VERSION_REVISION as f,
+  EventBus as g,
+  MOJOUtils as h,
+  EventEmitter as i,
+  rest as r
+};
+//# sourceMappingURL=WebApp-B6mgbNn2.js.map