@lark.js/mvc 0.0.9 → 0.0.11

package/dist/devtool.cjs

@@ -0,0 +1,3421 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/devtool.ts
+var devtool_exports = {};
+__export(devtool_exports, {
+  FrameDevtoolBridge: () => FrameDevtoolBridge,
+  installFrameDevtoolBridge: () => installFrameDevtoolBridge,
+  serializeFrameTree: () => serializeFrameTree
+});
+module.exports = __toCommonJS(devtool_exports);
+
+// src/common.ts
+var globalCounter = 0;
+var SPLITTER = String.fromCharCode(30);
+var RouterEvents = {
+  CHANGE: "change",
+  CHANGED: "changed",
+  PAGE_UNLOAD: "page_unload"
+};
+var LARK_VIEW = "v-lark";
+var EVENT_METHOD_REGEXP = new RegExp(
+  `(?:([\\w-]+)${SPLITTER})?([^(]+)\\(([\\s\\S]*?)?\\)`
+);
+var VIEW_EVENT_METHOD_REGEXP = /^(\$?)([\w]*)<(.*?)>(?:<([\w ,]*)>)?$/;
+var URL_TRIM_HASH_REGEXP = /(?:^.*\/\/[^/]+|#.*$)/gi;
+var URL_TRIM_QUERY_REGEXP = /^[^#]*#?!?/;
+var URL_PARAM_REGEXP = /([^=&?/#]+)=?([^&#?]*)/g;
+var IS_URL_PARAMS = /(?!^)=|&/;
+var URL_QUERY_HASH_REGEXP = /[#?].*$/;
+var SVG_NS = "http://www.w3.org/2000/svg";
+var MATH_NS = "http://www.w3.org/1998/Math/MathML";
+var TAG_NAME_REGEXP = /<([a-z][^/\0>\x20\t\r\n\f]+)/i;
+var V_TEXT_NODE = 0;
+var VDOM_NS_MAP = {
+  svg: SVG_NS,
+  math: MATH_NS
+};
+function nextCounter() {
+  return ++globalCounter;
+}
+var HTML_ENT_MAP = {
+  "&": "amp",
+  "<": "lt",
+  ">": "gt",
+  '"': "#34",
+  "'": "#39",
+  "`": "#96"
+};
+var HTML_ENT_REGEXP = /[&<>"'`]/g;
+function strSafe(v) {
+  return String(v == null ? "" : v);
+}
+function encodeHTML(v) {
+  return String(v == null ? "" : v).replace(
+    HTML_ENT_REGEXP,
+    (m) => "&" + HTML_ENT_MAP[m] + ";"
+  );
+}
+var URI_ENT_MAP = {
+  "!": "%21",
+  "'": "%27",
+  "(": "%28",
+  ")": "%29",
+  "*": "%2A"
+};
+var URI_ENT_REGEXP = /[!')(*]/g;
+function encodeURIExtra(v) {
+  return encodeURIComponent(strSafe(v)).replace(
+    URI_ENT_REGEXP,
+    (m) => URI_ENT_MAP[m]
+  );
+}
+var QUOTE_ENT_REGEXP = /['"\\]/g;
+function encodeQuote(v) {
+  return strSafe(v).replace(QUOTE_ENT_REGEXP, "\\$&");
+}
+function refFn(ref, value, key) {
+  const counter = ref[SPLITTER];
+  for (let i = counter; --i; ) {
+    key = SPLITTER + i;
+    if (ref[key] === value) return key;
+  }
+  key = SPLITTER + ref[SPLITTER]++;
+  ref[key] = value;
+  return key;
+}
+function isRefToken(s) {
+  if (s.length < 2 || s[0] !== SPLITTER) return false;
+  for (let i = 1; i < s.length; i++) {
+    const c = s.charCodeAt(i);
+    if (c < "0".charCodeAt(0) || c > "9".charCodeAt(0)) return false;
+  }
+  return true;
+}
+
+// src/utils.ts
+var CALL_BREAK_TIME = 9;
+var callQueue = [];
+var callScheduled = false;
+var schedulerYield = (() => {
+  try {
+    if (typeof globalThis?.scheduler?.yield === "function") {
+      return globalThis.scheduler.yield.bind(globalThis.scheduler);
+    }
+  } catch {
+  }
+  return void 0;
+})();
+async function startCall() {
+  callScheduled = false;
+  const startTime = performance.now();
+  while (callQueue.length > 0) {
+    const task = callQueue.shift();
+    try {
+      task();
+    } catch (e) {
+      console.error("scheduler task error:", e);
+    }
+    if (callQueue.length > 0 && performance.now() - startTime > CALL_BREAK_TIME) {
+      if (schedulerYield) {
+        await schedulerYield();
+      } else {
+        scheduleNextChunk();
+        return;
+      }
+    }
+  }
+}
+function scheduleNextChunk() {
+  setTimeout(() => startCall(), 0);
+  callScheduled = true;
+}
+function callFunction(fn, args) {
+  callQueue.push(() => fn(...args));
+  if (!callScheduled) {
+    scheduleNextChunk();
+  }
+}
+function isPlainObject(value) {
+  if (typeof value !== "object" || value === null) return false;
+  const proto = Object.getPrototypeOf(value);
+  return proto === null || proto === Object.prototype;
+}
+function isRecord(value) {
+  return typeof value === "object" && value !== null;
+}
+function asRecord(value) {
+  if (isRecord(value)) {
+    return value;
+  }
+  console.error("fallback to Object.fromEntries, even an empty object {}.");
+  if (Array.isArray(value)) {
+    return Object.fromEntries(value.entries());
+  }
+  return {};
+}
+function isPrimitiveOrFunc(value) {
+  return !value || typeof value !== "object" && typeof value !== "function";
+}
+function isPrimitive(value) {
+  return !value || typeof value !== "object";
+}
+var _localCounter = 0;
+function generateId(prefix) {
+  return (prefix || "lark_") + _localCounter++;
+}
+function noop() {
+}
+function hasOwnProperty(owner, prop) {
+  return owner != null && Object.prototype.hasOwnProperty.call(owner, prop);
+}
+function assign(target, ...sources) {
+  for (const source of sources) {
+    if (source) {
+      for (const p in source) {
+        if (hasOwnProperty(source, p)) {
+          target[p] = source[p];
+        }
+      }
+    }
+  }
+  return target;
+}
+function funcWithTry(fns, args, context, configError) {
+  const fnArray = Array.isArray(fns) ? fns : [fns];
+  let ret;
+  for (const fn of fnArray) {
+    try {
+      ret = fn.apply(context, args);
+    } catch (e) {
+      configError?.(e);
+    }
+  }
+  return ret;
+}
+var EMPTY_STRING_SET = /* @__PURE__ */ new Set();
+function setData(newData, oldData, changedKeys, excludes) {
+  let changed = false;
+  for (const p in newData) {
+    if (hasOwnProperty(newData, p)) {
+      const now = newData[p];
+      const old = oldData[p];
+      if ((!isPrimitiveOrFunc(now) || old !== now) && !excludes.has(p)) {
+        changedKeys.add(p);
+        changed = true;
+      }
+      oldData[p] = now;
+    }
+  }
+  return changed;
+}
+function translateData(data, value) {
+  if (isPrimitive(value)) {
+    const prop = String(value);
+    if (isRefToken(prop) && hasOwnProperty(data, prop)) {
+      return data[prop];
+    }
+    return value;
+  }
+  if (isPlainObject(value) || Array.isArray(value)) {
+    for (const p in value) {
+      if (hasOwnProperty(value, p)) {
+        const val = value[p];
+        const newVal = translateData(data, val);
+        value[p] = newVal;
+      }
+    }
+    return value;
+  }
+  return value;
+}
+function getById(id) {
+  if (!id) return null;
+  if (typeof id === "object") return id;
+  return document.getElementById(id);
+}
+function getAttribute(element, attr) {
+  return Element.prototype.getAttribute.call(element, attr) ?? "";
+}
+function ensureElementId(element, prefix) {
+  const id = element.getAttribute("id");
+  if (id) return id;
+  element.autoId = 1;
+  const newId = generateId(prefix);
+  element.id = newId;
+  return newId;
+}
+function parseUri(uri) {
+  const params = {};
+  const path = uri.replace(URL_QUERY_HASH_REGEXP, "");
+  const pathname = path;
+  const actualPath = uri === pathname && IS_URL_PARAMS.test(pathname) ? "" : pathname;
+  uri.replace(actualPath, "").replace(URL_PARAM_REGEXP, (_match, name, value) => {
+    try {
+      params[name] = decodeURIComponent(value || "");
+    } catch {
+      params[name] = value || "";
+    }
+    return "";
+  });
+  return { path: actualPath, params };
+}
+function toUri(path, params, keepEmpty) {
+  const pairs = [];
+  let hasParams = false;
+  for (const p in params) {
+    if (hasOwnProperty(params, p)) {
+      const v = String(params[p] ?? "");
+      if (!keepEmpty || v || keepEmpty.has(p)) {
+        pairs.push(`${p}=${encodeURIComponent(v)}`);
+        hasParams = true;
+      }
+    }
+  }
+  if (hasParams) {
+    path += (path && (~path.indexOf("?") ? "&" : "?")) + pairs.join("&");
+  }
+  return path;
+}
+
+// src/event-emitter.ts
+var EventEmitter = class {
+  /** Event listeners: prefixed key -> listener array */
+  listeners = /* @__PURE__ */ new Map();
+  /** Number of `fire()` calls currently on the stack (re-entrancy depth). */
+  firingDepth = 0;
+  /** Keys whose listener list needs compaction after firing settles. */
+  pendingCompaction;
+  /**
+   * Bind event listener.
+   */
+  on(event, handler) {
+    const key = SPLITTER + event;
+    let list = this.listeners.get(key);
+    if (!list) {
+      list = [];
+      this.listeners.set(key, list);
+    }
+    list.push({ handler, executing: 0 });
+    return this;
+  }
+  /**
+   * Unbind event listener.
+   * If handler is provided, removes only that handler.
+   * If no handler, removes all handlers for the event.
+   */
+  off(event, handler) {
+    const key = SPLITTER + event;
+    if (handler) {
+      const list = this.listeners.get(key);
+      if (!list) return this;
+      if (this.firingDepth > 0) {
+        for (const listener of list) {
+          if (listener.handler === handler) {
+            listener.handler = noop;
+            (this.pendingCompaction ??= /* @__PURE__ */ new Set()).add(key);
+            break;
+          }
+        }
+      } else {
+        for (let i = 0; i < list.length; i++) {
+          if (list[i].handler === handler) {
+            list.splice(i, 1);
+            break;
+          }
+        }
+        if (list.length === 0) this.listeners.delete(key);
+      }
+    } else {
+      this.listeners.delete(key);
+      Reflect.deleteProperty(
+        this,
+        `on${event[0].toUpperCase() + event.slice(1)}`
+      );
+    }
+    return this;
+  }
+  /**
+   * Fire event, execute all bound handlers. Safe for re-entrant `off()` calls
+   * during dispatch: removed handlers are replaced with noop and compacted
+   * after the outermost fire returns.
+   *
+   * @param event - Event name
+   * @param data - Event data (type property added automatically)
+   * @param remove - Whether to remove all handlers after firing
+   * @param lastToFirst - Whether to execute handlers in reverse order
+   */
+  fire(event, data, remove, lastToFirst) {
+    const key = SPLITTER + event;
+    const list = this.listeners.get(key);
+    if (!data) {
+      data = {};
+    }
+    data["type"] = event;
+    this.firingDepth++;
+    try {
+      if (list) {
+        const len = list.length;
+        for (let i = 0; i < len; i++) {
+          const idx = lastToFirst ? len - 1 - i : i;
+          const listener = list[idx];
+          if (!listener) continue;
+          if (listener.handler === noop) continue;
+          listener.executing = 1;
+          funcWithTry([listener.handler], [data], this, noop);
+          listener.executing = "";
+        }
+      }
+      const onMethodName = `on${event[0].toUpperCase() + event.slice(1)}`;
+      const onMethod = this[onMethodName];
+      if (typeof onMethod === "function") {
+        funcWithTry([onMethod], [data], this, noop);
+      }
+      if (remove) {
+        this.off(event);
+      }
+    } finally {
+      this.firingDepth--;
+      if (this.firingDepth === 0 && this.pendingCompaction) {
+        for (const k of this.pendingCompaction) {
+          const l = this.listeners.get(k);
+          if (!l) continue;
+          for (let i = l.length - 1; i >= 0; i--) {
+            if (l[i].handler === noop) l.splice(i, 1);
+          }
+          if (l.length === 0) this.listeners.delete(k);
+        }
+        this.pendingCompaction = void 0;
+      }
+    }
+    return this;
+  }
+};
+
+// src/mark.ts
+var hostStore = /* @__PURE__ */ new WeakMap();
+function unmark(host) {
+  const record = hostStore.get(host);
+  if (record) {
+    record.deleted = true;
+    record.signs.clear();
+  } else {
+    hostStore.set(host, { signs: /* @__PURE__ */ new Map(), deleted: true });
+  }
+}
+
+// src/cache.ts
+function sortCacheEntries(a, b) {
+  return b.frequency - a.frequency || b.lastTimestamp - a.lastTimestamp;
+}
+var Cache = class {
+  /** Cache entries array */
+  entries = [];
+  /** Fast lookup: prefixed key -> entry */
+  lookup = /* @__PURE__ */ new Map();
+  /** Buffer size for eviction */
+  bufferSize;
+  /** Maximum cache size */
+  maxSize;
+  /** Total capacity (maxSize + bufferSize) */
+  capacity;
+  /** Callback when entry is removed */
+  onRemove;
+  /** Sort comparator */
+  comparator;
+  constructor(options = {}) {
+    this.maxSize = options.maxSize ?? 20;
+    this.bufferSize = options.bufferSize ?? 5;
+    this.capacity = this.maxSize + this.bufferSize;
+    this.onRemove = options.onRemove;
+    this.comparator = options.sortComparator ?? sortCacheEntries;
+  }
+  /** Prefix a key with SPLITTER for namespace isolation */
+  prefixKey(key) {
+    return SPLITTER + key;
+  }
+  /**
+   * Get a cached value by key.
+   * Updates frequency and timestamp for cache sorting.
+   */
+  get(key) {
+    const prefixedKey = this.prefixKey(key);
+    const entry = this.lookup.get(prefixedKey);
+    if (!entry) return void 0;
+    entry.frequency++;
+    entry.lastTimestamp = nextCounter();
+    return entry.value;
+  }
+  /**
+   * Iterate all cached values.
+   */
+  forEach(callback) {
+    for (const entry of this.entries) {
+      callback(entry.value);
+    }
+  }
+  /**
+   * Set or update a cached value.
+   * If key already exists, updates value and increments frequency.
+   * If cache exceeds capacity, triggers eviction.
+   */
+  set(key, value) {
+    const prefixedKey = this.prefixKey(key);
+    const existing = this.lookup.get(prefixedKey);
+    if (existing) {
+      existing.value = value;
+      existing.frequency++;
+      existing.lastTimestamp = nextCounter();
+      return;
+    }
+    if (this.entries.length >= this.capacity) {
+      this.evictEntries();
+    }
+    const entry = {
+      originalKey: key,
+      value,
+      frequency: 1,
+      lastTimestamp: nextCounter()
+    };
+    this.entries.push(entry);
+    this.lookup.set(prefixedKey, entry);
+  }
+  /**
+   * Delete a cached entry. Removes it immediately from both the lookup map
+   * and the entries array so the GC can reclaim the value without waiting
+   * for the next eviction sweep.
+   */
+  del(key) {
+    const prefixedKey = this.prefixKey(key);
+    const entry = this.lookup.get(prefixedKey);
+    if (!entry) return;
+    this.lookup.delete(prefixedKey);
+    const idx = this.entries.indexOf(entry);
+    if (idx !== -1) this.entries.splice(idx, 1);
+    if (this.onRemove) {
+      this.onRemove(key);
+    }
+  }
+  /**
+   * Check if a key exists in cache.
+   */
+  has(key) {
+    return this.lookup.has(this.prefixKey(key));
+  }
+  /** Get current cache size */
+  get size() {
+    return this.entries.length;
+  }
+  /** Clear all entries */
+  clear() {
+    if (this.onRemove) {
+      for (const entry of this.entries) {
+        this.onRemove(entry.originalKey);
+      }
+    }
+    this.entries = [];
+    this.lookup.clear();
+  }
+  /**
+   * Evict the `bufferSize` worst entries from the cache.
+   *
+   * Uses single-pass partial selection (O(n·k)) instead of sorting the entire
+   * `entries` array (O(n log n)). For the typical `bufferSize = 5` this is
+   * effectively a linear scan with at most 5 in-bucket comparisons per
+   * iteration — and it avoids mutating the rest of `entries`.
+   */
+  evictEntries() {
+    const entries = this.entries;
+    const k = this.bufferSize;
+    if (k <= 0 || entries.length === 0) return;
+    if (entries.length <= k) {
+      for (const e of entries) {
+        this.lookup.delete(this.prefixKey(e.originalKey));
+        if (this.onRemove) this.onRemove(e.originalKey);
+      }
+      this.entries = [];
+      return;
+    }
+    const cmp = this.comparator;
+    const worst = [];
+    for (const entry of entries) {
+      if (worst.length < k) {
+        let i = worst.length;
+        while (i > 0 && cmp(entry, worst[i - 1]) > 0) i--;
+        worst.splice(i, 0, entry);
+      } else if (cmp(entry, worst[k - 1]) > 0) {
+        worst.pop();
+        let i = worst.length;
+        while (i > 0 && cmp(entry, worst[i - 1]) > 0) i--;
+        worst.splice(i, 0, entry);
+      }
+    }
+    const evictSet = new Set(worst);
+    for (const e of worst) {
+      this.lookup.delete(this.prefixKey(e.originalKey));
+      if (this.onRemove) this.onRemove(e.originalKey);
+    }
+    this.entries = entries.filter((e) => !evictSet.has(e));
+  }
+};
+
+// src/event-delegator.ts
+var rootEvents = {};
+var selectorEvents = {};
+var rangeEvents = {};
+var rangeFrames = {};
+var elementGuid = 0;
+var eventInfoCache = new Cache({
+  maxSize: 30,
+  bufferSize: 10
+});
+var frameGetter;
+function parseEventInfo(eventInfo) {
+  const cached = eventInfoCache.get(eventInfo);
+  if (cached) {
+    return assign({}, cached, { value: eventInfo });
+  }
+  const match = eventInfo.match(EVENT_METHOD_REGEXP) || [];
+  const result = {
+    id: match[1] || "",
+    name: match[2] || "",
+    params: match[3] || ""
+  };
+  eventInfoCache.set(eventInfo, result);
+  return assign({}, result, { value: eventInfo });
+}
+function findFrameInfo(current, eventType) {
+  const eventInfos = [];
+  const info = current.getAttribute(`@${eventType}`);
+  const hasSelectorEvents = !!selectorEvents[eventType];
+  if (!info && !hasSelectorEvents) {
+    return eventInfos;
+  }
+  let begin = current;
+  let match;
+  if (info) {
+    match = parseEventInfo(info);
+  }
+  if (match && !match.id || hasSelectorEvents) {
+    let selectorFrameId = "#";
+    let backtrace = 0;
+    while (begin && begin !== document.body) {
+      const beginId = begin.id;
+      if (beginId && frameGetter?.(beginId)) {
+        selectorFrameId = beginId;
+        break;
+      }
+      begin = begin.parentElement;
+    }
+    const currentId = current.id;
+    if (currentId && frameGetter?.(currentId)) {
+      backtrace = 1;
+      selectorFrameId = currentId;
+    }
+    let frameId = selectorFrameId;
+    do {
+      const frame = frameId ? frameGetter?.(frameId) : void 0;
+      if (frame) {
+        const view = frame.view;
+        if (view) {
+          const selectorEntry = view.eventSelectorMap[eventType];
+          if (selectorEntry) {
+            for (const selectorName of selectorEntry.selectors) {
+              const entry = {
+                value: selectorName,
+                id: frameId,
+                name: selectorName,
+                params: ""
+              };
+              if (selectorName) {
+                if (!backtrace && elementMatchesSelector(current, selectorName)) {
+                  eventInfos.push(entry);
+                }
+              } else if (backtrace) {
+                eventInfos.unshift(entry);
+              }
+            }
+          }
+          if (view.template && !backtrace) {
+            if (match && !match.id) {
+              match.id = frameId;
+            }
+            break;
+          }
+          backtrace = 0;
+        }
+      }
+      if (frame) {
+        frameId = frame.parentId || "";
+      } else {
+        break;
+      }
+    } while (frameId);
+  }
+  if (match) {
+    eventInfos.push({
+      id: match.id,
+      value: match.value,
+      name: match.name,
+      params: match.params
+    });
+  }
+  return eventInfos;
+}
+function elementMatchesSelector(element, selector) {
+  try {
+    return element.matches?.(selector) ?? false;
+  } catch {
+    return false;
+  }
+}
+function domEventProcessor(domEvent) {
+  const target = domEvent.target;
+  const eventType = domEvent.type;
+  let lastFrameId = "";
+  let current = target;
+  while (current && current !== document.body) {
+    const eventInfos = findFrameInfo(current, eventType);
+    if (eventInfos.length) {
+      for (const info of eventInfos) {
+        const { id: frameId, name: handlerName, params } = info;
+        if (lastFrameId !== frameId) {
+          if (lastFrameId && domEvent.isPropagationStopped?.()) {
+            break;
+          }
+          lastFrameId = frameId;
+        }
+        const frame = frameId ? frameGetter?.(frameId) : void 0;
+        const view = frame?.view;
+        if (view) {
+          const eventName = handlerName + SPLITTER + eventType;
+          const fn = Reflect.get(view, eventName);
+          if (fn) {
+            const extendedEvent = domEvent;
+            extendedEvent.eventTarget = target;
+            extendedEvent.params = params ? parseUri(params).params : {};
+            funcWithTry(fn, [extendedEvent], view, noop);
+          }
+        }
+      }
+    }
+    const rangeFrameId = current.getAttribute("data-range-fid");
+    const rangeGuid = current.getAttribute("data-range-guid");
+    if (rangeFrameId && rangeGuid) {
+      const rangeMap = rangeEvents[rangeFrameId];
+      if (rangeMap?.[rangeGuid]?.[eventType]) {
+        break;
+      }
+    }
+    if (domEvent.isPropagationStopped?.()) {
+      break;
+    }
+    current = current.parentElement;
+  }
+}
+var EventDelegator = {
+  /**
+   * Bind a DOM event type to document body.
+   */
+  bind(eventType, hasSelector = false) {
+    const counter = rootEvents[eventType] || 0;
+    if (counter === 0) {
+      document.body.addEventListener(eventType, domEventProcessor, true);
+    }
+    rootEvents[eventType] = counter + 1;
+    if (hasSelector) {
+      selectorEvents[eventType] = (selectorEvents[eventType] || 0) + 1;
+    }
+  },
+  /**
+   * Unbind a DOM event type from document body.
+   */
+  unbind(eventType, hasSelector = false) {
+    const counter = rootEvents[eventType] || 0;
+    if (counter <= 1) {
+      document.body.removeEventListener(eventType, domEventProcessor, true);
+      Reflect.deleteProperty(rootEvents, eventType);
+    } else {
+      rootEvents[eventType] = counter - 1;
+    }
+    if (hasSelector) {
+      const selectorCounter = selectorEvents[eventType] || 0;
+      if (selectorCounter <= 1) {
+        Reflect.deleteProperty(selectorEvents, eventType);
+      } else {
+        selectorEvents[eventType] = selectorCounter - 1;
+      }
+    }
+  },
+  /**
+   * Clean up range events for a destroyed view.
+   */
+  clearRangeEvents(viewId) {
+    Reflect.deleteProperty(rangeEvents, viewId);
+    Reflect.deleteProperty(rangeFrames, viewId);
+  },
+  /**
+   * Set the frame getter function (called by Framework.boot).
+   */
+  setFrameGetter(getter) {
+    frameGetter = getter;
+  },
+  /**
+   * Get next element GUID.
+   */
+  nextElementGuid() {
+    return ++elementGuid;
+  }
+};
+
+// src/safeguard.ts
+var proxiesPool = /* @__PURE__ */ new Map();
+var SAFEGUARD_SENTINEL = "_safe_";
+function safeguard(data, getter, setter, isRoot) {
+  if (typeof window.__lark_Debug === "undefined" || !window.__lark_Debug) {
+    return data;
+  }
+  if (typeof Proxy === "undefined") {
+    return data;
+  }
+  if (isPrimitive(data)) {
+    return data;
+  }
+  const build = (prefix, obj) => {
+    const cacheKey = (getter || "") + "
" + (setter || "");
+    const cached = proxiesPool.get(obj);
+    if (cached && cached.cacheKey === cacheKey) {
+      return cached.entity;
+    }
+    if (Reflect.get(obj, SAFEGUARD_SENTINEL)) {
+      return obj;
+    }
+    const entity = new Proxy(obj, {
+      set(target, property, value) {
+        if (!setter && !prefix) {
+          throw new Error(
+            "Avoid write back, key: " + prefix + property + " value:" + value + " more: https://github.com/hangtiancheng/lark"
+          );
+        }
+        Reflect.set(target, property, value);
+        if (setter) {
+          setter(prefix + property, value);
+        }
+        return true;
+      },
+      get(target, property) {
+        if (property === SAFEGUARD_SENTINEL) {
+          return true;
+        }
+        const out = Reflect.get(target, property);
+        if (!prefix && getter) {
+          getter(property);
+        }
+        if (!isRoot && hasOwnProperty(target, property) && (Array.isArray(out) || isPlainObject(out))) {
+          return build(prefix + property + ".", out);
+        }
+        return out;
+      }
+    });
+    proxiesPool.set(obj, { cacheKey, entity });
+    return entity;
+  };
+  return build("", data);
+}
+
+// src/module-loader.ts
+var config = {
+  rootId: "root",
+  routeMode: "history",
+  hashbang: "#!",
+  error: (error) => {
+    throw error;
+  }
+};
+function use(names, callback) {
+  const nameList = typeof names === "string" ? [names] : names;
+  const loadPromise = (() => {
+    if (config.require) {
+      const result = config.require(nameList);
+      if (result && typeof result.then === "function") {
+        return result;
+      }
+      return Promise.resolve([]);
+    }
+    return Promise.all(
+      nameList.map((name) => {
+        const importPath = name.startsWith(".") || name.startsWith("/") ? name : `./${name}`;
+        return import(
+          /* @vite-ignore */
+          /* webpackIgnore: true */
+          importPath
+        ).then((mod) => {
+          return mod && (mod["__esModule"] || // For Webpack
+          typeof mod["default"] === "function") ? mod["default"] : mod;
+        }).catch((err) => {
+          const errorHandler = config.error;
+          if (errorHandler) {
+            errorHandler(err instanceof Error ? err : new Error(String(err)));
+          }
+          return void 0;
+        });
+      })
+    );
+  })();
+  if (callback) {
+    loadPromise.then((modules) => {
+      callback(...modules);
+    });
+  }
+  return loadPromise;
+}
+
+// src/dom.ts
+var wrapMeta = {
+  option: [1, "<select multiple>"],
+  thead: [1, "<table>"],
+  col: [2, "<table><colgroup>"],
+  tr: [2, "<table><tbody>"],
+  td: [3, "<table><tbody><tr>"],
+  area: [1, "<map>"],
+  param: [1, "<object>"],
+  svg: [1, '<svg xmlns="' + SVG_NS + '">'],
+  math: [1, '<math xmlns="' + MATH_NS + '">'],
+  _: [0, ""]
+};
+wrapMeta["optgroup"] = wrapMeta["option"];
+wrapMeta["tbody"] = wrapMeta["tfoot"] = wrapMeta["colgroup"] = wrapMeta["caption"] = wrapMeta["thead"];
+wrapMeta["th"] = wrapMeta["td"];
+var VDoc = document.implementation.createHTMLDocument("");
+var VBase = VDoc.createElement("base");
+VBase.href = document.location.href;
+VDoc.head.appendChild(VBase);
+var DomSpecials = {
+  INPUT: ["value", "checked"],
+  TEXTAREA: ["value"],
+  OPTION: ["selected"]
+};
+function domUnmountFrames(frame, node) {
+  if (!(node instanceof Element)) return;
+  const id = node.getAttribute("id");
+  if (!id) return;
+  frame.unmountZone(id);
+  if (frame.children().includes(id)) {
+    frame.unmountFrame(id);
+  }
+}
+function domGetNode(html, refNode) {
+  const tmp = VDoc.createElement("div");
+  const ns = refNode.namespaceURI;
+  let tag;
+  if (ns === SVG_NS) {
+    tag = "svg";
+  } else if (ns === MATH_NS) {
+    tag = "math";
+  } else {
+    const match = TAG_NAME_REGEXP.exec(html);
+    tag = match ? match[1] : "";
+  }
+  const wrap = wrapMeta[tag] || wrapMeta["_"];
+  tmp.innerHTML = wrap[1] + html;
+  let j = wrap[0];
+  while (j--) {
+    const last = tmp.lastChild;
+    if (last) tmp.replaceChildren(last);
+  }
+  return tmp;
+}
+function domGetCompareKey(node) {
+  if (node.nodeType !== 1) return void 0;
+  const el = node;
+  if (el.compareKeyCached) {
+    return el.cachedCompareKey;
+  }
+  let key = el.autoId ? "" : el.getAttribute("id") || void 0;
+  if (!key) {
+    const larkView = el.getAttribute(LARK_VIEW);
+    if (larkView) {
+      key = parseUri(larkView).path || void 0;
+    }
+  }
+  el.compareKeyCached = 1;
+  el.cachedCompareKey = key || "";
+  return key;
+}
+function domSpecialDiff(oldNode, newNode) {
+  const specials = DomSpecials[oldNode.nodeName];
+  if (!specials) return 0;
+  let result = 0;
+  for (const prop of specials) {
+    if (Reflect.get(oldNode, prop) !== Reflect.get(newNode, prop)) {
+      result = 1;
+      Reflect.set(oldNode, prop, Reflect.get(newNode, prop));
+    }
+  }
+  return result;
+}
+function domSetAttributes(oldNode, newNode, ref, keepId) {
+  const oldEl = oldNode;
+  Reflect.deleteProperty(oldEl, "compareKeyCached");
+  const oldAttrs = oldNode.attributes;
+  const newAttrs = newNode.attributes;
+  for (let i = oldAttrs.length; i--; ) {
+    const name = oldAttrs[i].name;
+    if (!newNode.hasAttribute(name)) {
+      if (name === "id") {
+        if (!keepId) {
+          ref.idUpdates.push([oldNode, ""]);
+        }
+      } else {
+        ref.hasChanged = 1;
+        oldNode.removeAttribute(name);
+      }
+    }
+  }
+  for (let i = newAttrs.length; i--; ) {
+    const attr = newAttrs[i];
+    const key = attr.name;
+    const value = attr.value;
+    if (oldNode.getAttribute(key) !== value) {
+      if (key === "id") {
+        ref.idUpdates.push([oldNode, value]);
+      } else {
+        ref.hasChanged = 1;
+        oldNode.setAttribute(key, value);
+      }
+    }
+  }
+}
+function domSetChildNodes(oldParent, newParent, ref, frame, keys_) {
+  let oldNode = oldParent.lastChild;
+  let newNode = newParent.firstChild;
+  let extra = 0;
+  const keyedNodes = /* @__PURE__ */ new Map();
+  const newKeyedNodes = /* @__PURE__ */ new Map();
+  while (oldNode) {
+    extra++;
+    const nodeKey = domGetCompareKey(oldNode);
+    if (nodeKey) {
+      let bucket = keyedNodes.get(nodeKey);
+      if (!bucket) {
+        bucket = [];
+        keyedNodes.set(nodeKey, bucket);
+      }
+      bucket.push(oldNode);
+    }
+    oldNode = oldNode.previousSibling;
+  }
+  while (newNode) {
+    const nodeKey = domGetCompareKey(newNode);
+    if (nodeKey) {
+      newKeyedNodes.set(nodeKey, (newKeyedNodes.get(nodeKey) ?? 0) + 1);
+    }
+    newNode = newNode.nextSibling;
+  }
+  newNode = newParent.firstChild;
+  oldNode = oldParent.firstChild;
+  while (newNode) {
+    extra--;
+    const tempNew = newNode;
+    newNode = newNode.nextSibling;
+    const nodeKey = domGetCompareKey(tempNew);
+    let foundNode = nodeKey ? keyedNodes.get(nodeKey) : void 0;
+    if (foundNode && (foundNode = foundNode.slice()) && foundNode.length) {
+      const matched = foundNode.pop();
+      while (matched !== oldNode) {
+        if (!oldNode) break;
+        const next = oldNode.nextSibling;
+        oldParent.appendChild(oldNode);
+        oldNode = next;
+      }
+      oldNode = matched.nextSibling;
+      if (nodeKey) {
+        const c = newKeyedNodes.get(nodeKey);
+        if (c) newKeyedNodes.set(nodeKey, c - 1);
+      }
+      domSetNode(matched, tempNew, oldParent, ref, frame, keys_);
+    } else if (oldNode) {
+      const tempOld2 = oldNode;
+      const oldKey = domGetCompareKey(tempOld2);
+      if (oldKey && keyedNodes.has(oldKey) && newKeyedNodes.get(oldKey)) {
+        extra++;
+        ref.hasChanged = 1;
+        ref.domOps.push([8, oldParent, tempNew, tempOld2]);
+      } else {
+        oldNode = oldNode.nextSibling;
+        domSetNode(tempOld2, tempNew, oldParent, ref, frame, keys_);
+      }
+    } else {
+      ref.hasChanged = 1;
+      ref.domOps.push([1, oldParent, tempNew]);
+    }
+  }
+  let tempOld = oldParent.lastChild;
+  while (extra-- > 0) {
+    if (tempOld) {
+      domUnmountFrames(frame, tempOld);
+      ref.domOps.push([2, oldParent, tempOld]);
+      tempOld = tempOld.previousSibling;
+      ref.hasChanged = 1;
+    }
+  }
+}
+function domSetNode(oldNode, newNode, oldParent, ref, frame, keys_) {
+  const oldAsEl = oldNode instanceof Element ? oldNode : null;
+  const newAsEl = newNode instanceof Element ? newNode : null;
+  const equalAsNodes = oldAsEl !== null && newAsEl !== null && oldAsEl.isEqualNode && oldAsEl.isEqualNode(newAsEl);
+  if (domSpecialDiff(oldNode, newNode) || !equalAsNodes) {
+    if (oldNode.nodeType === newNode.nodeType && oldNode.nodeName === newNode.nodeName) {
+      if (oldAsEl !== null && newAsEl !== null) {
+        const oldEl = oldAsEl;
+        const newEl = newAsEl;
+        const newLarkView = newEl.getAttribute(LARK_VIEW);
+        let updateChildren = true;
+        if (newLarkView) {
+          const oldFrameId = oldEl.getAttribute("id") || "";
+          const newViewPath = parseUri(newLarkView).path;
+          const oldLarkView = oldEl.getAttribute(LARK_VIEW);
+          const oldViewPath = oldLarkView ? parseUri(oldLarkView).path : "";
+          if (oldFrameId && newViewPath === oldViewPath) {
+            updateChildren = false;
+          }
+        }
+        domSetAttributes(oldEl, newEl, ref, !!newLarkView);
+        if (updateChildren) {
+          domSetChildNodes(oldEl, newEl, ref, frame, keys_);
+        }
+      } else if (oldNode.nodeValue !== newNode.nodeValue) {
+        ref.hasChanged = 1;
+        oldNode.nodeValue = newNode.nodeValue;
+      }
+    } else {
+      ref.hasChanged = 1;
+      domUnmountFrames(frame, oldNode);
+      ref.domOps.push([4, oldParent, newNode, oldNode]);
+    }
+  }
+}
+function createDomRef() {
+  return {
+    idUpdates: [],
+    views: [],
+    domOps: [],
+    hasChanged: 0
+  };
+}
+function applyDomOps(ops) {
+  for (const op of ops) {
+    switch (op[0]) {
+      case 1:
+        op[1].appendChild(op[2]);
+        break;
+      case 2:
+        op[1].removeChild(op[2]);
+        break;
+      case 4:
+        op[1].replaceChild(op[2], op[3]);
+        break;
+      case 8:
+        op[1].insertBefore(op[2], op[3]);
+        break;
+    }
+  }
+}
+function applyIdUpdates(updates) {
+  for (const [element, newId] of updates) {
+    if (newId) {
+      element.setAttribute("id", newId);
+    } else {
+      element.removeAttribute("id");
+    }
+  }
+}
+
+// src/vdom.ts
+var DOM_SPECIALS = {
+  INPUT: ["value", "checked"],
+  TEXTAREA: ["value"],
+  OPTION: ["selected"]
+};
+function isSameVDomNode(a, b) {
+  return a.compareKey && b.compareKey === a.compareKey || !a.compareKey && !b.compareKey && a.tag === b.tag || a.tag === SPLITTER || b.tag === SPLITTER;
+}
+function getKeyNodes(list, nodes, start, end, realEnd) {
+  const keyedNodes = {};
+  for (let i = end, re = realEnd; i >= start; i--, re--) {
+    const oc = list[i];
+    const cKey = oc.compareKey;
+    if (cKey) {
+      const bucket = keyedNodes[cKey] || (keyedNodes[cKey] = []);
+      bucket.push(nodes[re]);
+    }
+  }
+  return keyedNodes;
+}
+function vdomCreateNode(vnode, owner, ref) {
+  const tag = vnode.tag;
+  if (tag === V_TEXT_NODE) {
+    return document.createTextNode(vnode.html);
+  }
+  const sTag = typeof tag === "string" ? tag : tag.toString();
+  const ns = VDOM_NS_MAP[sTag] || owner.namespaceURI;
+  const el = document.createElementNS(ns, sTag);
+  vdomSetAttributes(el, vnode, ref);
+  el.innerHTML = vnode.html;
+  return el;
+}
+function vdomSetAttributes(realNode, newVDom, ref, lastVDom) {
+  let changed = 0;
+  const nMap = newVDom.attrsMap || {};
+  const nsMap = newVDom.attrsSpecials || {};
+  if (lastVDom) {
+    const oMap = lastVDom.attrsMap || {};
+    const osMap = lastVDom.attrsSpecials || {};
+    for (const key in oMap) {
+      if (!hasOwnProperty(nMap, key)) {
+        changed = 1;
+        const sValue = osMap[key];
+        if (sValue) {
+          if (ref) {
+            ref.nodeProps.push([realNode, sValue, ""]);
+          } else {
+            Reflect.set(realNode, sValue, "");
+          }
+        } else {
+          realNode.removeAttribute(key);
+        }
+      }
+    }
+  }
+  for (const key in nMap) {
+    const value = nMap[key];
+    const sKey = nsMap[key];
+    if (sKey) {
+      if (Reflect.get(realNode, sKey) !== value) {
+        changed = 1;
+        if (ref) {
+          ref.nodeProps.push([realNode, sKey, value]);
+        } else {
+          Reflect.set(realNode, sKey, value);
+        }
+      }
+    } else {
+      const oldMap = lastVDom?.attrsMap;
+      if (!oldMap || oldMap[key] !== value) {
+        changed = 1;
+        realNode.setAttribute(key, String(value ?? ""));
+      }
+    }
+  }
+  return changed;
+}
+function vdomSyncFormState(realNode, newVDom) {
+  const specials = DOM_SPECIALS[realNode.nodeName];
+  if (!specials) return 0;
+  const nMap = newVDom.attrsMap || {};
+  let result = 0;
+  for (const prop of specials) {
+    const newVal = nMap[prop];
+    if (newVal !== void 0 && Reflect.get(realNode, prop) !== newVal) {
+      result = 1;
+      Reflect.set(realNode, prop, newVal);
+    }
+  }
+  return result;
+}
+function vdomSetNode(realNode, oldParent, lastVDom, newVDom, ref, frame, keys, rootView, ready) {
+  const lastTag = lastVDom.tag;
+  const newTag = newVDom.tag;
+  if (lastTag === V_TEXT_NODE || newTag === V_TEXT_NODE) {
+    if (lastTag === newTag) {
+      if (lastVDom.html !== newVDom.html) {
+        ref.changed = 1;
+        realNode.nodeValue = newVDom.html;
+      }
+    } else {
+      ref.changed = 1;
+      domUnmountFrames(frame, realNode);
+      oldParent.replaceChild(vdomCreateNode(newVDom, oldParent, ref), realNode);
+    }
+    return;
+  }
+  if (lastTag === newTag) {
+    const lastAMap = lastVDom.attrsMap || {};
+    const newAMap = newVDom.attrsMap || {};
+    if (lastVDom.compareKey && lastVDom.compareKey === newVDom.compareKey && !lastAMap["id"] && !newAMap["id"]) {
+      return;
+    }
+    let attrChanged = 0;
+    if (lastVDom.attrs !== newVDom.attrs || newVDom.hasSpecials) {
+      attrChanged = vdomSetAttributes(
+        realNode,
+        newVDom,
+        ref,
+        lastVDom
+      );
+      if (attrChanged) ref.changed = 1;
+    }
+    let updateChildren = true;
+    if (newVDom.isLarkView) {
+      const oldFrameId = realNode.getAttribute("id") || "";
+      const newViewPath = newVDom.isLarkView;
+      const oldViewPath = lastVDom.isLarkView || "";
+      if (oldFrameId && newViewPath === oldViewPath) {
+        updateChildren = false;
+      }
+    }
+    vdomSyncFormState(realNode, newVDom);
+    if (updateChildren && !newVDom.selfClose) {
+      vdomSetChildNodes(
+        realNode,
+        lastVDom,
+        newVDom,
+        ref,
+        frame,
+        keys,
+        rootView,
+        ready
+      );
+    }
+  } else {
+    ref.changed = 1;
+    domUnmountFrames(frame, realNode);
+    oldParent.replaceChild(vdomCreateNode(newVDom, oldParent, ref), realNode);
+  }
+}
+function vdomSetChildNodes(realNode, lastVDom, newVDom, ref, frame, keys, view, ready) {
+  if (!lastVDom) {
+    ref.changed = 1;
+    realNode.innerHTML = newVDom.html;
+    return;
+  }
+  if (lastVDom.html === newVDom.html) {
+    return;
+  }
+  const oldChildren = lastVDom.children;
+  const newChildren = newVDom.children;
+  const oldLen = oldChildren?.length || 0;
+  const newLen = newChildren?.length || 0;
+  if (oldLen === 0 && newLen === 0) return;
+  const nodes = realNode.childNodes;
+  let oldStart = 0;
+  let oldEnd = oldLen - 1;
+  let newStart = 0;
+  let newEnd = newLen - 1;
+  let realStart = oldStart;
+  let realEnd = oldEnd;
+  let keyedNodes;
+  const oldReusedTotal = lastVDom.reusedTotal || 0;
+  const newReusedTotal = newVDom.reusedTotal || 0;
+  let oldStartNode = oldChildren?.[oldStart];
+  let oldEndNode = oldChildren?.[oldEnd];
+  let newStartNode = newChildren?.[newStart];
+  let newEndNode = newChildren?.[newEnd];
+  while (oldStart <= oldEnd && newStart <= newEnd) {
+    if (!oldStartNode) {
+      oldStartNode = oldChildren?.[++oldStart];
+      realStart++;
+      continue;
+    }
+    if (!oldEndNode) {
+      oldEndNode = oldChildren?.[--oldEnd];
+      realEnd--;
+      continue;
+    }
+    if (isSameVDomNode(newStartNode, oldStartNode)) {
+      if (newStartNode.tag === SPLITTER || oldStartNode.tag === SPLITTER) {
+        ref.changed = 1;
+        domUnmountFrames(frame, realNode);
+        if (newStartNode.tag === SPLITTER) {
+          realNode.innerHTML = newStartNode.html;
+        } else {
+          realNode.innerHTML = "";
+          realNode.appendChild(vdomCreateNode(newStartNode, realNode, ref));
+        }
+      } else {
+        vdomSetNode(
+          nodes[realStart],
+          realNode,
+          oldStartNode,
+          newStartNode,
+          ref,
+          frame,
+          keys,
+          view,
+          ready
+        );
+      }
+      reduceCached(keyedNodes, oldStartNode, nodes[realStart]);
+      realStart++;
+      oldStartNode = oldChildren?.[++oldStart];
+      newStartNode = newChildren?.[++newStart];
+    } else if (isSameVDomNode(newEndNode, oldEndNode)) {
+      if (newEndNode.tag === SPLITTER || oldEndNode.tag === SPLITTER) {
+        ref.changed = 1;
+        domUnmountFrames(frame, realNode);
+        realNode.innerHTML = newEndNode.tag === SPLITTER ? newEndNode.html : "";
+        if (newEndNode.tag !== SPLITTER) {
+          realNode.appendChild(vdomCreateNode(newEndNode, realNode, ref));
+        }
+      } else {
+        vdomSetNode(
+          nodes[realEnd],
+          realNode,
+          oldEndNode,
+          newEndNode,
+          ref,
+          frame,
+          keys,
+          view,
+          ready
+        );
+      }
+      reduceCached(keyedNodes, oldEndNode, nodes[realEnd]);
+      realEnd--;
+      oldEndNode = oldChildren?.[--oldEnd];
+      newEndNode = newChildren?.[--newEnd];
+    } else if (isSameVDomNode(newEndNode, oldStartNode)) {
+      if (newEndNode.tag === SPLITTER || oldStartNode.tag === SPLITTER) {
+        ref.changed = 1;
+        domUnmountFrames(frame, realNode);
+        realNode.innerHTML = newEndNode.tag === SPLITTER ? newEndNode.html : "";
+        if (newEndNode.tag !== SPLITTER) {
+          realNode.appendChild(vdomCreateNode(newEndNode, realNode, ref));
+        }
+      } else {
+        const oi = nodes[realStart];
+        realNode.insertBefore(oi, nodes[realEnd + 1] || null);
+        vdomSetNode(
+          oi,
+          realNode,
+          oldStartNode,
+          newEndNode,
+          ref,
+          frame,
+          keys,
+          view,
+          ready
+        );
+      }
+      reduceCached(keyedNodes, oldStartNode, nodes[realStart]);
+      realStart++;
+      oldStartNode = oldChildren?.[++oldStart];
+      newEndNode = newChildren?.[--newEnd];
+    } else if (isSameVDomNode(newStartNode, oldEndNode)) {
+      if (newStartNode.tag === SPLITTER || oldEndNode.tag === SPLITTER) {
+        ref.changed = 1;
+        domUnmountFrames(frame, realNode);
+        realNode.innerHTML = newStartNode.tag === SPLITTER ? newStartNode.html : "";
+        if (newStartNode.tag !== SPLITTER) {
+          realNode.appendChild(vdomCreateNode(newStartNode, realNode, ref));
+        }
+      } else {
+        const oi = nodes[realEnd];
+        realNode.insertBefore(oi, nodes[realStart]);
+        vdomSetNode(
+          oi,
+          realNode,
+          oldEndNode,
+          newStartNode,
+          ref,
+          frame,
+          keys,
+          view,
+          ready
+        );
+      }
+      reduceCached(keyedNodes, oldEndNode, nodes[realEnd]);
+      realEnd--;
+      oldEndNode = oldChildren?.[--oldEnd];
+      newStartNode = newChildren?.[++newStart];
+    } else {
+      if (!keyedNodes && newReusedTotal > 0 && oldReusedTotal > 0) {
+        keyedNodes = getKeyNodes(
+          oldChildren,
+          nodes,
+          oldStart,
+          oldEnd,
+          realEnd
+        );
+      }
+      const cKey = newStartNode.compareKey;
+      let found;
+      let compareKey;
+      if (cKey && keyedNodes) {
+        found = keyedNodes[cKey];
+        compareKey = void 0;
+        while (found && found.length > 0) {
+          compareKey = found.pop();
+          if (compareKey) break;
+        }
+        if (found && found.length === 0) delete keyedNodes[cKey];
+      }
+      if (compareKey) {
+        if (compareKey !== nodes[realStart]) {
+          for (let j = oldStart + 1; j <= oldEnd; j++) {
+            const oc = oldChildren?.[j];
+            if (oc && nodes[realStart + (j - oldStart)] === compareKey) {
+              oldChildren[j] = void 0;
+              break;
+            }
+          }
+          realNode.insertBefore(compareKey, nodes[realStart]);
+        }
+        vdomSetNode(
+          compareKey,
+          realNode,
+          oldStartNode,
+          newStartNode,
+          ref,
+          frame,
+          keys,
+          view,
+          ready
+        );
+      } else if (oldStartNode.compareKey && lastVDom.reused?.[oldStartNode.compareKey] && newVDom.reused?.[oldStartNode.compareKey] || nodes[realStart]?.id && realNode.querySelectorAll?.(
+        `#${nodes[realStart].id}`
+      )?.length && !newStartNode.isLarkView) {
+        ref.changed = 1;
+        const newNode = vdomCreateNode(newStartNode, realNode, ref);
+        realNode.insertBefore(newNode, nodes[realStart]);
+        realStart--;
+        realEnd++;
+      } else {
+        vdomSetNode(
+          nodes[realStart],
+          realNode,
+          oldStartNode,
+          newStartNode,
+          ref,
+          frame,
+          keys,
+          view,
+          ready
+        );
+      }
+      realStart++;
+      oldStartNode = oldChildren?.[++oldStart];
+      newStartNode = newChildren?.[++newStart];
+    }
+  }
+  if (newStart <= newEnd) {
+    const refNode = nodes[realEnd + 1] || null;
+    for (let i = newStart; i <= newEnd; i++) {
+      ref.changed = 1;
+      const nc = newChildren[i];
+      if (nc.tag === SPLITTER) {
+        domUnmountFrames(frame, realNode);
+        realNode.innerHTML = nc.html;
+        return;
+      }
+      const newNode = vdomCreateNode(nc, realNode, ref);
+      realNode.insertBefore(newNode, refNode);
+    }
+  }
+  if (oldStart <= oldEnd) {
+    for (let i = realEnd; i >= realStart; i--) {
+      const node = nodes[i];
+      if (node) {
+        domUnmountFrames(frame, node);
+        ref.changed = 1;
+        realNode.removeChild(node);
+      }
+    }
+  }
+  if (ref.asyncCount === 0) {
+    callFunction(ready, []);
+  }
+}
+function reduceCached(keyedNodes, node, compared) {
+  if (!keyedNodes || !node.compareKey) return;
+  const bucket = keyedNodes[node.compareKey];
+  if (bucket) {
+    for (let i = bucket.length; i--; ) {
+      if (bucket[i] === compared) {
+        bucket[i] = void 0;
+        break;
+      }
+    }
+  }
+}
+function createVDomRef(viewId) {
+  return {
+    viewId,
+    viewRenders: [],
+    nodeProps: [],
+    asyncCount: 0,
+    changed: 0,
+    domOps: []
+  };
+}
+
+// src/updater.ts
+var Updater = class {
+  /** View ID (same as owner frame ID) */
+  viewId;
+  /** Current data object */
+  data;
+  /** Ref data for template rendering */
+  refData;
+  /** Changed keys in current digest cycle */
+  changedKeys = /* @__PURE__ */ new Set();
+  /** Whether data has changed since last digest */
+  hasChangedFlag = 0;
+  /**
+   * Digesting queue: supports re-digest during digest.
+   * Holds pending callbacks; `null` is used as a sentinel marking the start
+   * of an active digest cycle, so `runDigest` can detect re-entrant calls.
+   */
+  digestingQueue = [];
+  /** Monotonically increasing version, bumped each time data actually changes. */
+  version = 0;
+  /** Snapshot of `version` taken by `snapshot()`, used by `altered()`. */
+  snapshotVersion;
+  /** Last rendered VDOM tree (only used when virtualDom is enabled) */
+  vdom;
+  constructor(viewId) {
+    this.viewId = viewId;
+    this.data = { vId: viewId };
+    const refCounter = {};
+    refCounter[SPLITTER] = 1;
+    this.refData = refCounter;
+    this.hasChangedFlag = 1;
+  }
+  /**
+   * Get data by key.
+   * Returns entire data object if key is omitted.
+   */
+  get(key) {
+    let result = this.data;
+    if (key) {
+      result = this.data[key];
+    }
+    if (typeof window !== "undefined" && window.__lark_Debug) {
+      return safeguard(result);
+    }
+    return result;
+  }
+  /**
+   * Set data, tracking changed keys.
+   * Returns this for chaining.
+   */
+  set(data, excludes) {
+    const changed = setData(
+      data,
+      this.data,
+      this.changedKeys,
+      excludes || EMPTY_STRING_SET
+    );
+    if (changed) {
+      this.version++;
+      this.hasChangedFlag = 1;
+    }
+    return this;
+  }
+  /**
+   * Detect changes and trigger DOM re-render.
+   *
+   * The core rendering pipeline:
+   * 1. Set data if provided
+   * 2. If changed, run DOM diff (template → new DOM → diff against old DOM)
+   * 3. Apply DOM operations
+   * 4. Apply ID updates
+   * 5. Call endUpdate on views that need re-rendering
+   * 6. Support re-digest during digest via queue
+   */
+  digest(data, excludes, callback) {
+    if (data) {
+      this.set(data, excludes);
+    }
+    const digesting = this.digestingQueue;
+    if (callback) {
+      digesting.push(callback);
+    }
+    if (digesting.length > 0 && digesting[0] === null) {
+      return;
+    }
+    this.runDigest(digesting);
+  }
+  /**
+   * Core digest execution.
+   */
+  runDigest(digesting) {
+    const startIndex = digesting.length;
+    digesting.push(null);
+    const keys = this.changedKeys;
+    const changed = this.hasChangedFlag;
+    this.hasChangedFlag = 0;
+    this.changedKeys = /* @__PURE__ */ new Set();
+    const frame = Frame.get(this.viewId);
+    const view = frame?.view;
+    const node = getById(this.viewId);
+    if (changed && view && node && view.signature > 0 && frame) {
+      const template = view.template;
+      if (typeof template === "function") {
+        if (config.virtualDom) {
+          const vdomTemplate = template;
+          const newVDom = vdomTemplate(this.data, this.viewId, this.refData);
+          const ref = createVDomRef(this.viewId);
+          const ready = () => {
+            this.vdom = newVDom;
+            if (ref.changed || !view.rendered) {
+              view.endUpdate(this.viewId);
+            }
+            for (const [el, prop, val] of ref.nodeProps) {
+              Reflect.set(el, prop, val);
+            }
+            for (const v of ref.viewRenders) {
+              if (v.render) {
+                funcWithTry(v.render, [], v, noop);
+              }
+            }
+          };
+          vdomSetChildNodes(
+            node,
+            this.vdom,
+            newVDom,
+            ref,
+            frame,
+            keys,
+            view,
+            ready
+          );
+          if (ref.asyncCount === 0) {
+            ready();
+          }
+        } else {
+          const html = template(
+            this.data,
+            this.viewId,
+            this.refData,
+            encodeHTML,
+            strSafe,
+            encodeURIExtra,
+            refFn,
+            encodeQuote
+          );
+          const newDom = domGetNode(html, node);
+          const ref = createDomRef();
+          domSetChildNodes(node, newDom, ref, frame, keys);
+          applyIdUpdates(ref.idUpdates);
+          applyDomOps(ref.domOps);
+          for (const v of ref.views) {
+            if (v.render) {
+              funcWithTry(v.render, [], v, noop);
+            }
+          }
+          if (ref.hasChanged || !view.rendered) {
+            view.endUpdate(this.viewId);
+          }
+        }
+      }
+    }
+    if (digesting.length > startIndex + 1) {
+      this.runDigest(digesting);
+    } else {
+      const callbacks = digesting.slice();
+      digesting.length = 0;
+      for (const cb of callbacks) {
+        if (cb) cb();
+      }
+    }
+  }
+  /**
+   * Save a snapshot of the current data version for `altered()` detection.
+   * Cheap O(1) — records the current monotonic version, no serialization.
+   */
+  snapshot() {
+    this.snapshotVersion = this.version;
+    return this;
+  }
+  /**
+   * Check whether data has changed since the last snapshot.
+   * Returns undefined when no snapshot has been taken yet.
+   */
+  altered() {
+    if (this.snapshotVersion === void 0) return void 0;
+    return this.version !== this.snapshotVersion;
+  }
+  /**
+   * Translate a refData reference back to its original value.
+   *
+   * The ref protocol is `SPLITTER` + ascii decimal digits — the exact format
+   * emitted by `refFn`. We require that exact shape so a user-supplied
+   * string that merely begins with SPLITTER is never accidentally resolved
+   * (or mishandled as a "missing ref").
+   */
+  translate(data) {
+    if (typeof data !== "string" || !isRefToken(data)) return data;
+    return hasOwnProperty(this.refData, data) ? this.refData[data] : data;
+  }
+  /**
+   * Resolve a dotted property path against refData.
+   *
+   * Only safe property-path syntax is supported: `a`, `a.b`, `a.b.c`.
+   * Numeric literals (e.g. `1`, `1.5`) are returned as numbers. Anything else
+   * returns `undefined` — we no longer evaluate arbitrary JavaScript via
+   * `new Function`, so the method is CSP-safe and cannot be used as an
+   * injection vector.
+   */
+  parse(expr) {
+    const trimmed = expr.trim();
+    if (!trimmed) return void 0;
+    if (/^-?\d+(?:\.\d+)?$/.test(trimmed)) {
+      return Number(trimmed);
+    }
+    if (!/^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*)*$/.test(trimmed)) {
+      return void 0;
+    }
+    let cur = this.refData;
+    for (const segment of trimmed.split(".")) {
+      if (cur == null || typeof cur !== "object") return void 0;
+      cur = cur[segment];
+    }
+    return cur;
+  }
+  /**
+   * Get the set of keys changed since the last digest (for external inspection).
+   */
+  getChangedKeys() {
+    return this.changedKeys;
+  }
+};
+
+// src/router.ts
+var emitter = new EventEmitter();
+var hrefCache = new Cache();
+var changedCache = new Cache();
+var lastLocation = createEmptyLocation();
+var lastChanged;
+var silent = 0;
+var booted = false;
+var cachedRoutes;
+var cachedUnmatchedView;
+var cachedDefaultView;
+var cachedDefaultPath;
+var cachedRewrite;
+var defaultTitle;
+var frameworkConfig;
+var routeMode = "history";
+var beforeEachGuards = [];
+function createEmptyLocation() {
+  return {
+    href: "",
+    srcQuery: "",
+    srcHash: "",
+    query: { path: "", params: {} },
+    hash: { path: "", params: {} },
+    params: {},
+    get: (_key, defaultValue) => defaultValue ?? ""
+  };
+}
+function getParam(key, defaultValue) {
+  return this["params"][key] || (defaultValue !== void 0 ? defaultValue : "");
+}
+function attachViewAndPath(loc) {
+  if (!frameworkConfig) return;
+  if (!cachedRoutes) {
+    cachedRoutes = frameworkConfig.routes || {};
+    cachedUnmatchedView = frameworkConfig.unmatchedView;
+    cachedDefaultView = frameworkConfig.defaultView;
+    cachedDefaultPath = frameworkConfig.defaultPath || "/";
+    cachedRewrite = frameworkConfig.rewrite;
+  }
+  if (!loc.view) {
+    const rawPath = routeMode === "history" ? loc.query["path"] || loc.hash["path"] : loc.hash["path"];
+    let path = rawPath || cachedDefaultPath || "/";
+    if (!cachedRoutes[path] && path === "/" && cachedDefaultPath && cachedDefaultPath !== "/") {
+      path = cachedDefaultPath;
+    }
+    if (cachedRewrite) {
+      path = cachedRewrite(
+        path,
+        loc["params"],
+        cachedRoutes
+      );
+    }
+    const viewEntry = cachedRoutes[path] || cachedUnmatchedView || cachedDefaultView;
+    loc["path"] = path;
+    loc.view = typeof viewEntry === "string" ? viewEntry : viewEntry?.view || "";
+    if (typeof viewEntry === "object" && viewEntry) {
+      assign(loc, viewEntry);
+    }
+  }
+}
+function getChanged(oldLoc, newLoc) {
+  const oKey = oldLoc.href;
+  const nKey = newLoc.href;
+  const tKey = oKey + SPLITTER + nKey;
+  const cached = changedCache.get(tKey);
+  if (cached) {
+    return cached;
+  }
+  let hasChanged = false;
+  const changedParams = {};
+  const setDiff = (key, oldVal, newVal) => {
+    const from = oldVal || "";
+    const to = newVal || "";
+    if (from !== to) {
+      changedParams[key] = { from, to };
+      hasChanged = true;
+    }
+  };
+  const allParamKeys = /* @__PURE__ */ new Set([
+    ...Object.keys(oldLoc["params"]),
+    ...Object.keys(newLoc["params"])
+  ]);
+  for (const key of allParamKeys) {
+    setDiff(key, oldLoc["params"][key], newLoc["params"][key]);
+  }
+  const result = {
+    ["params"]: changedParams,
+    force: !oKey,
+    changed: hasChanged
+  };
+  setDiff("path", oldLoc["path"], newLoc["path"]);
+  if (changedParams["path"]) {
+    result["path"] = changedParams["path"];
+    result.changed = true;
+  }
+  const viewKey = "view";
+  setDiff(viewKey, oldLoc.view, newLoc.view);
+  if (changedParams[viewKey]) {
+    result.view = changedParams[viewKey];
+    result.changed = true;
+  }
+  const finalResult = {
+    changed: hasChanged,
+    diff: result
+  };
+  changedCache.set(tKey, finalResult);
+  return finalResult;
+}
+function updateBrowserUrl(path, replace) {
+  if (routeMode === "history") {
+    const url = path || "/";
+    const currentUrl = window.location.pathname + window.location.search;
+    if (url === currentUrl) {
+      return;
+    }
+    if (replace) {
+      window.history.replaceState(null, "", url);
+    } else {
+      window.history.pushState(null, "", url);
+    }
+    return;
+  }
+  const hashbang = frameworkConfig?.hashbang || "#!";
+  const fullPath = path === "" ? "" : hashbang + path;
+  if (replace) {
+    window.location.replace(fullPath);
+  } else {
+    window.location.hash = fullPath;
+  }
+}
+function updateUrl(path, params, loc, replace, silentFlag, lQuery) {
+  path = toUri(path, params, lQuery);
+  const currentSrc = routeMode === "history" ? loc.srcQuery : loc.srcHash;
+  if (path !== currentSrc) {
+    silent = silentFlag ? 1 : 0;
+    updateBrowserUrl(path, replace);
+    if (routeMode === "history" && Router.notify) {
+      Router.notify();
+    }
+  }
+}
+var Router = {
+  /**
+   * Parse href into Location object.
+   * Defaults to window.location.href.
+   */
+  parse(href) {
+    href = href || window.location.href;
+    const cached = hrefCache.get(href);
+    if (cached) {
+      return cached;
+    }
+    let srcQuery;
+    let srcHash;
+    let query;
+    let hash;
+    if (routeMode === "history") {
+      try {
+        const urlObj = new URL(href, window.location.origin);
+        srcQuery = urlObj.pathname + urlObj.search;
+        srcHash = urlObj.hash ? urlObj.hash.replace(/^#!?/, "") : "";
+        query = parseUri(srcQuery);
+        hash = srcHash ? parseUri(srcHash) : { path: "", params: {} };
+      } catch {
+        srcQuery = href.replace(URL_TRIM_HASH_REGEXP, "");
+        srcHash = href.replace(URL_TRIM_QUERY_REGEXP, "");
+        query = parseUri(srcQuery);
+        hash = parseUri(srcHash);
+      }
+    } else {
+      srcQuery = href.replace(URL_TRIM_HASH_REGEXP, "");
+      srcHash = href.replace(URL_TRIM_QUERY_REGEXP, "");
+      query = parseUri(srcQuery);
+      hash = parseUri(srcHash);
+    }
+    const params = assign({}, query["params"], hash["params"]);
+    const location = {
+      href,
+      srcQuery,
+      srcHash,
+      query: { path: query.path, params: query["params"] },
+      hash: { path: hash.path, params: hash["params"] },
+      ["params"]: params,
+      get: getParam
+    };
+    if (booted) {
+      attachViewAndPath(location);
+      hrefCache.set(href, location);
+    }
+    if (typeof window.__lark_Debug !== "undefined" && window.__lark_Debug) {
+      location["params"] = safeguard(location["params"]);
+    }
+    return location;
+  },
+  /**
+   * Compute diff between current and previous location.
+   * Fires 'changed' event if location changed and not silent.
+   */
+  diff() {
+    const location = Router.parse();
+    const changed = getChanged(lastLocation, location);
+    lastLocation = location;
+    if (!silent && changed.changed) {
+      lastChanged = changed.diff;
+      if (lastChanged["path"]) {
+        document.title = defaultTitle || document.title;
+      }
+      emitter.fire(RouterEvents.CHANGED, asRecord(lastChanged));
+    }
+    silent = 0;
+    if (typeof window.__lark_Debug !== "undefined" && window.__lark_Debug && lastChanged) {
+      lastChanged = safeguard(lastChanged);
+    }
+    return lastChanged;
+  },
+  /**
+   * Navigate to new URL.
+   *
+   * @param pathOrParams - Path string or params object
+   * @param params - Query parameters (if pathOrParams is string)
+   * @param replace - Whether to replace current history entry
+   * @param silentFlag - Whether to silently update without firing events
+   */
+  to(pathOrParams, params, replace, silentFlag) {
+    let tPath = "";
+    let tParams;
+    if (!params && typeof pathOrParams === "object") {
+      tParams = pathOrParams;
+    } else {
+      const parsed = parseUri(pathOrParams);
+      tPath = parsed.path;
+      tParams = { ...parsed["params"] };
+      if (params) {
+        assign(tParams, params);
+      }
+    }
+    const lPath = lastLocation["path"] || "";
+    const lParams = lastLocation["params"];
+    const lQuery = /* @__PURE__ */ new Set();
+    for (const k in lastLocation.query["params"]) {
+      if (hasOwnProperty(lastLocation.query["params"], k)) {
+        lQuery.add(k);
+      }
+    }
+    if (tPath) {
+      if (routeMode === "hash" && !hasOwnProperty(window, "history")) {
+        for (const qKey of lQuery) {
+          if (!hasOwnProperty(tParams, qKey)) {
+            tParams[qKey] = "";
+          }
+        }
+      }
+    } else if (lParams) {
+      tPath = lPath;
+      tParams = assign({}, lParams, tParams);
+    }
+    updateUrl(tPath, tParams, lastLocation, replace, silentFlag, lQuery);
+  },
+  /**
+   * Register an async-friendly navigation guard. See `RouterInterface.beforeEach`.
+   */
+  beforeEach(guard) {
+    beforeEachGuards.push(guard);
+    return () => {
+      const idx = beforeEachGuards.indexOf(guard);
+      if (idx !== -1) beforeEachGuards.splice(idx, 1);
+    };
+  },
+  /**
+   * Join multiple path segments into a single path.
+   */
+  join(...paths) {
+    let result = paths.join("/");
+    result = result.replace(/\/\.\//g, "/");
+    const doubleDotRegExp = /\/[^/]+\/\.\.\//;
+    while (doubleDotRegExp.test(result)) {
+      result = result.replace(doubleDotRegExp, "/");
+    }
+    result = result.replace(/\/{2,}/g, "/");
+    return result;
+  },
+  /** Bind event listener */
+  on(event, handler) {
+    emitter.on(event, handler);
+    return Router;
+  },
+  /** Unbind event listener */
+  off(event, handler) {
+    emitter.off(event, handler);
+    return Router;
+  },
+  /** Fire event */
+  fire(event, data, remove) {
+    emitter.fire(event, data, remove);
+    return Router;
+  },
+  /**
+   * Internal: bind routing events and beforeunload.
+   * Called by Framework.boot().
+   * In hash mode, listens to hashchange + popstate.
+   * In history mode, listens to popstate only.
+   */
+  _bind() {
+    defaultTitle = document.title;
+    const getLocationKey = () => {
+      if (routeMode === "history") {
+        return window.location.pathname + window.location.search;
+      }
+      return Router.parse().srcHash;
+    };
+    let lastKey = getLocationKey();
+    let suspend;
+    const watchChange = () => {
+      if (suspend) {
+        return;
+      }
+      hrefCache.clear();
+      const loc = Router.parse();
+      const newKey = routeMode === "history" ? loc.srcQuery : loc.srcHash;
+      if (newKey !== lastKey) {
+        const changeEvent = {
+          p: 0,
+          reject: () => {
+            changeEvent.p = 1;
+            suspend = "";
+            updateBrowserUrl(lastKey);
+          },
+          resolve: () => {
+            changeEvent.p = 1;
+            lastKey = newKey;
+            suspend = "";
+            updateBrowserUrl(newKey);
+            Router.diff();
+          },
+          prevent: () => {
+            suspend = 1;
+          }
+        };
+        Router.fire(RouterEvents.CHANGE, changeEvent);
+        if (suspend || changeEvent.p) {
+          return;
+        }
+        if (beforeEachGuards.length === 0) {
+          changeEvent.resolve();
+          return;
+        }
+        const from = lastLocation;
+        const to = loc;
+        const guards = beforeEachGuards.slice();
+        let chain = Promise.resolve(true);
+        for (const guard of guards) {
+          chain = chain.then((prev) => {
+            if (prev === false) return false;
+            return guard(to, from);
+          });
+        }
+        chain.then(
+          (result) => {
+            if (changeEvent.p) return;
+            if (result === false) {
+              changeEvent.reject();
+            } else {
+              changeEvent.resolve();
+            }
+          },
+          () => {
+            if (!changeEvent.p) changeEvent.reject();
+          }
+        );
+      }
+    };
+    Router.notify = watchChange;
+    if (routeMode === "history") {
+      window.addEventListener("popstate", watchChange);
+    } else {
+      window.addEventListener("hashchange", watchChange);
+      window.addEventListener("popstate", watchChange);
+    }
+    window.addEventListener("beforeunload", (domEvent) => {
+      const data = {};
+      Router.fire(RouterEvents.PAGE_UNLOAD, data);
+      const msg = data["msg"];
+      if (msg) {
+        domEvent.returnValue = msg;
+      }
+    });
+    Router.diff();
+  },
+  /**
+   * Internal: set framework config for route resolution.
+   */
+  _setConfig(cfg) {
+    frameworkConfig = cfg;
+    routeMode = cfg.routeMode || "history";
+  }
+};
+
+// src/view.ts
+var VIEW_GLOBALS = {};
+if (typeof window !== "undefined") {
+  VIEW_GLOBALS["window"] = window;
+}
+if (typeof document !== "undefined") {
+  VIEW_GLOBALS["document"] = document;
+}
+var View = class _View {
+  /** View ID (same as owner frame ID) */
+  id = "";
+  /** Owner frame */
+  owner = 0;
+  /** Updater instance */
+  updater;
+  /** Signature: > 0 means active, incremented on render, 0 = destroyed */
+  signature = 0;
+  /** Whether rendered at least once */
+  rendered;
+  /** Whether view has template */
+  template;
+  /** Location observation config */
+  locationObserved = {
+    flag: 0,
+    keys: [],
+    observePath: false
+  };
+  /** Observed state keys */
+  observedStateKeys;
+  /** Resource map */
+  resources = {};
+  /** Whether endUpdate pending */
+  endUpdatePending;
+  /** Internal event storage */
+  _events = new EventEmitter();
+  // ============================================================
+  // Getters for prototype-stored event maps
+  // ============================================================
+  /** Prototype-stored event maps shape (set by View.prepare). */
+  get protoEventState() {
+    return Object.getPrototypeOf(this);
+  }
+  /**
+   * Event bitmask map: eventType -> bitmask (1=root, 2=selector).
+   * Read from prototype ($evtObjMap) set by View.prepare.
+   * Using a getter avoids ES6 class field shadowing the prototype value.
+   */
+  get eventObjectMap() {
+    return this.protoEventState.$evtObjMap ?? {};
+  }
+  /**
+   * Selector event map: eventType -> selector list.
+   * Read from prototype ($selMap) set by View.prepare.
+   */
+  get eventSelectorMap() {
+    return this.protoEventState.$selMap ?? {};
+  }
+  /**
+   * Global event list: [{handler, element, eventName, modifiers}].
+   * Read from prototype ($globalEvtList) set by View.prepare.
+   */
+  get globalEventList() {
+    return this.protoEventState.$globalEvtList ?? [];
+  }
+  // ============================================================
+  // Instance lifecycle methods
+  // ============================================================
+  /**
+   * Initialize view (called by Frame when mounting).
+   */
+  init() {
+  }
+  /**
+   * Render view template (called by Frame after init).
+   * Wrapped by View.wrapMethod to manage signature + resources.
+   */
+  render() {
+    this.updater.digest();
+  }
+  // ============================================================
+  // Event methods (delegate to internal EventEmitter)
+  // ============================================================
+  on(event, handler) {
+    this._events.on(event, handler);
+    return this;
+  }
+  off(event, handler) {
+    this._events.off(event, handler);
+    return this;
+  }
+  fire(event, data, remove, lastToFirst) {
+    this._events.fire(event, data, remove, lastToFirst);
+    return this;
+  }
+  // ============================================================
+  // Update methods
+  // ============================================================
+  /** Get the owning frame, asserting it has been bound. */
+  get ownerFrame() {
+    return this.owner;
+  }
+  /**
+   * Notify view that HTML update is about to begin.
+   * Unmounts child frames in the update zone.
+   */
+  beginUpdate(id) {
+    if (this.signature > 0 && this.endUpdatePending !== void 0) {
+      this.ownerFrame.unmountZone(id);
+    }
+  }
+  /**
+   * Notify view that HTML update has ended.
+   * Mounts child frames in the update zone and runs deferred invokes.
+   */
+  endUpdate(id, inner) {
+    if (this.signature > 0) {
+      const updateId = id || this.id;
+      let flag;
+      if (inner) {
+        flag = inner;
+      } else {
+        flag = this.endUpdatePending;
+        this.endUpdatePending = 1;
+        this.rendered = true;
+      }
+      const ownerFrame = this.ownerFrame;
+      ownerFrame.mountZone(updateId);
+      if (!flag) {
+        setTimeout(
+          this.wrapAsync(() => {
+            _View.runInvokes(ownerFrame);
+          }),
+          0
+        );
+      }
+    }
+  }
+  // ============================================================
+  // Async wrapper
+  // ============================================================
+  /**
+   * Wrap an async callback to check view signature before executing.
+   * If the view has been re-rendered or destroyed, the callback is skipped.
+   */
+  wrapAsync(fn, context) {
+    const currentSignature = this.signature;
+    return (...args) => {
+      if (currentSignature > 0 && currentSignature === this.signature) {
+        return fn.apply(context || this, args);
+      }
+      return void 0;
+    };
+  }
+  // ============================================================
+  // Location observation
+  // ============================================================
+  /**
+   * Observe location parameters or path changes.
+   * When observed keys change, render() is called automatically.
+   */
+  observeLocation(params, observePath = false) {
+    const loc = this.locationObserved;
+    loc.flag = 1;
+    if (typeof params === "object" && !Array.isArray(params)) {
+      const opts = params;
+      if (opts["path"]) {
+        observePath = true;
+      }
+      const paramKeys = opts["params"];
+      if (typeof paramKeys === "string" || Array.isArray(paramKeys)) {
+        params = paramKeys;
+      }
+    }
+    loc.observePath = observePath;
+    if (params) {
+      if (typeof params === "string") {
+        loc.keys = params.split(",");
+      } else if (Array.isArray(params)) {
+        loc.keys = params;
+      }
+    }
+  }
+  // ============================================================
+  // State observation
+  // ============================================================
+  /**
+   * Observe State data keys for changes.
+   * When observed keys change via State.digest(), render() is called.
+   */
+  observeState(observedKeys) {
+    if (typeof observedKeys === "string") {
+      this.observedStateKeys = observedKeys.split(",");
+    } else {
+      this.observedStateKeys = observedKeys;
+    }
+  }
+  // ============================================================
+  // Resource management
+  // ============================================================
+  /**
+   * Capture (register) a resource under a key.
+   * If a resource already exists at that key, it's destroyed first.
+   * When destroyOnRender=true, the resource is destroyed on next render call.
+   */
+  capture(key, resource, destroyOnRender = false) {
+    const cache = this.resources;
+    if (resource) {
+      _View.destroyResource(cache, key, true, resource);
+      cache[key] = {
+        entity: resource,
+        destroyOnRender
+      };
+    } else {
+      const entry = cache[key];
+      return entry ? entry.entity : void 0;
+    }
+    return resource;
+  }
+  /**
+   * Release a captured resource.
+   * If destroy=true, calls the resource's destroy() method.
+   */
+  release(key, destroy = true) {
+    return _View.destroyResource(this.resources, key, destroy);
+  }
+  // ============================================================
+  // Leave tip
+  // ============================================================
+  /**
+   * Set up a leave confirmation for route changes and page unload.
+   */
+  leaveTip(message, condition) {
+    const changeListener = function(e) {
+      const isRouterChange = e.type === RouterEvents.CHANGE;
+      const aKey = isRouterChange ? "a" : "b";
+      const bKey = isRouterChange ? "b" : "a";
+      if (changeListener[aKey]) {
+        e.prevent?.();
+        e.reject?.();
+      } else if (condition()) {
+        e.prevent?.();
+        changeListener[bKey] = 1;
+        e.resolve?.();
+      }
+    };
+    const unloadListener = (e) => {
+      if (condition()) {
+        e["msg"] = message;
+      }
+    };
+    Router.on(RouterEvents.CHANGE, changeListener);
+    Router.on(RouterEvents.PAGE_UNLOAD, unloadListener);
+    this.on("unload", changeListener);
+    this.on("destroy", () => {
+      Router.off(RouterEvents.CHANGE, changeListener);
+      Router.off(RouterEvents.PAGE_UNLOAD, unloadListener);
+    });
+  }
+  // ============================================================
+  // Static public methods
+  // ============================================================
+  /** Collected makes from mixins */
+  static makes;
+  /**
+   * Prepare a View subclass by scanning its prototype for event method patterns.
+   * Pattern: `$?name<eventType1,eventType2>(&modifiers)`
+   *
+   * Only runs once per View subclass (guarded by makes marker).
+   * Called from Frame.mountView before creating the view instance.
+   */
+  static prepare(oView) {
+    if (oView.makes) {
+      return oView.makes;
+    }
+    const makes = [];
+    oView.makes = makes;
+    const eventsObject = {};
+    const eventsList = [];
+    const selectorObject = {};
+    const mixins = Reflect.get(oView.prototype, "mixins");
+    if (mixins && Array.isArray(mixins)) {
+      _View.mergeMixins(mixins, oView, makes);
+    }
+    for (const p in oView.prototype) {
+      if (!hasOwnProperty(oView.prototype, p)) continue;
+      const currentFn = Reflect.get(oView.prototype, p);
+      if (typeof currentFn !== "function") continue;
+      const matches = p.match(VIEW_EVENT_METHOD_REGEXP);
+      if (!matches) continue;
+      const isSelector = matches[1];
+      const selectorOrCallback = matches[2];
+      const events = matches[3];
+      const modifiers = matches[4];
+      const mod = {};
+      if (modifiers) {
+        for (const item of modifiers.split(",")) {
+          mod[item] = true;
+        }
+      }
+      const eventTypes = events.split(",");
+      for (const item of eventTypes) {
+        const globalNode = VIEW_GLOBALS[selectorOrCallback];
+        let mask = 1;
+        if (isSelector) {
+          if (globalNode) {
+            eventsList.push({
+              handler: currentFn,
+              element: globalNode,
+              eventName: item,
+              modifiers: mod
+            });
+            continue;
+          }
+          mask = 2;
+          let selectorEntry = selectorObject[item];
+          if (!selectorEntry) {
+            selectorEntry = selectorObject[item] = {
+              selectors: []
+            };
+          }
+          if (!selectorEntry[selectorOrCallback]) {
+            selectorEntry[selectorOrCallback] = 1;
+            selectorEntry.selectors.push(selectorOrCallback);
+          }
+        }
+        eventsObject[item] = (eventsObject[item] || 0) | mask;
+        const combinedKey = selectorOrCallback + SPLITTER + item;
+        const existingFn = Reflect.get(oView.prototype, combinedKey);
+        if (!existingFn) {
+          Reflect.set(oView.prototype, combinedKey, currentFn);
+        } else if (typeof existingFn === "function") {
+          const mixinFn = currentFn;
+          const existingMixin = existingFn;
+          if (existingMixin.marker) {
+            if (mixinFn.marker) {
+              Reflect.set(
+                oView.prototype,
+                combinedKey,
+                _View.processMixinsSameEvent(mixinFn, existingMixin)
+              );
+            } else if (hasOwnProperty(oView.prototype, p)) {
+              Reflect.set(oView.prototype, combinedKey, currentFn);
+            }
+          }
+        }
+      }
+    }
+    _View.wrapMethod(asRecord(oView.prototype), "render", "$renderWrap");
+    Reflect.set(oView.prototype, "$evtObjMap", eventsObject);
+    Reflect.set(oView.prototype, "$globalEvtList", eventsList);
+    Reflect.set(oView.prototype, "$selMap", selectorObject);
+    return makes;
+  }
+  /**
+   * Bind or unbind event delegation for a view instance.
+   * Called from Frame during mount/unmount.
+   */
+  static delegateEvents(view, destroy = false) {
+    const eventsObject = view.eventObjectMap;
+    const selectorObject = view.eventSelectorMap;
+    const eventsList = view.globalEventList;
+    for (const e in eventsObject) {
+      if (hasOwnProperty(eventsObject, e)) {
+        if (destroy) {
+          EventDelegator.unbind(e, !!selectorObject[e]);
+        } else {
+          EventDelegator.bind(e, !!selectorObject[e]);
+        }
+      }
+    }
+    for (const entry of eventsList) {
+      if (destroy) {
+        entry.element.removeEventListener(
+          entry.eventName,
+          entry.boundHandler
+        );
+      } else {
+        const handler = entry.handler;
+        const element = entry.element;
+        const modifiers = entry.modifiers;
+        entry.boundHandler = function(domEvent) {
+          const extendedEvent = domEvent;
+          extendedEvent.eventTarget = element;
+          if (modifiers) {
+            const kbEvent = domEvent;
+            if (modifiers["ctrl"] && !kbEvent.ctrlKey || modifiers["shift"] && !kbEvent.shiftKey || modifiers["alt"] && !kbEvent.altKey || modifiers["meta"] && !kbEvent.metaKey) {
+              return;
+            }
+          }
+          funcWithTry(handler, [domEvent], view, noop);
+        };
+        entry.element.addEventListener(
+          entry.eventName,
+          entry.boundHandler
+        );
+      }
+    }
+  }
+  /**
+   * Destroy all resources managed by a view.
+   * If lastly=true, destroy ALL resources; otherwise only destroyOnRender ones.
+   */
+  static destroyAllResources(view, lastly) {
+    const cache = view.resources;
+    for (const p in cache) {
+      if (hasOwnProperty(cache, p)) {
+        const entry = cache[p];
+        if (lastly || entry.destroyOnRender) {
+          _View.destroyResource(cache, p, true);
+        }
+      }
+    }
+  }
+  /**
+   * Process deferred invoke calls on a frame.
+   */
+  static runInvokes(frame) {
+    const list = frame.invokeList;
+    if (!list) return;
+    while (list.length) {
+      const entry = list.shift();
+      if (entry && !entry.removed) {
+        frame.invoke(entry.name, entry.args);
+      }
+    }
+  }
+  // ============================================================
+  // Static private methods
+  // ============================================================
+  /**
+   * Wrap a method on the prototype to add signature checking and resource cleanup.
+   */
+  static wrapMethod(proto, fnName, shortKey) {
+    const originalFn = proto[fnName];
+    if (typeof originalFn !== "function") return;
+    const originalAsFn = originalFn;
+    const wrapped = function(...args) {
+      if (this.signature > 0) {
+        this.signature++;
+        this.fire("render");
+        _View.destroyAllResources(this, false);
+        const lookup = asRecord(this);
+        const candidate = lookup[fnName];
+        const instanceFn = typeof candidate === "function" ? candidate : originalAsFn;
+        const fnToCall = instanceFn === wrapped ? originalAsFn : instanceFn;
+        return funcWithTry(fnToCall, args, this, noop);
+      }
+      return void 0;
+    };
+    proto[fnName] = wrapped;
+    proto[shortKey] = wrapped;
+  }
+  /**
+   * When two mixins define the same event method, merge them into
+   * a single function that calls both in sequence.
+   */
+  static processMixinsSameEvent(additional, exist) {
+    let temp;
+    if (exist.handlerList) {
+      temp = exist;
+    } else {
+      const merged = function(...e) {
+        funcWithTry(merged.handlerList ?? [], e, this, noop);
+      };
+      merged.handlerList = [exist];
+      merged.marker = 1;
+      temp = merged;
+    }
+    temp.handlerList = (temp.handlerList ?? []).concat(
+      additional.handlerList ?? [additional]
+    );
+    return temp;
+  }
+  /**
+   * Merge an array of mixin objects into the view prototype.
+   */
+  static mergeMixins(mixins, viewClass, makes) {
+    const proto = asRecord(viewClass.prototype);
+    const temp = {};
+    for (const node of mixins) {
+      for (const p in node) {
+        if (!hasOwnProperty(node, p)) continue;
+        const fn = node[p];
+        if (typeof fn !== "function") continue;
+        const mixinFn = fn;
+        const exist = temp[p];
+        if (p === "make") {
+          makes.push(mixinFn);
+          continue;
+        }
+        if (VIEW_EVENT_METHOD_REGEXP.test(p)) {
+          if (exist) {
+            temp[p] = _View.processMixinsSameEvent(mixinFn, exist);
+          } else {
+            mixinFn.marker = 1;
+            temp[p] = mixinFn;
+          }
+        } else if (!exist) {
+          temp[p] = mixinFn;
+        }
+      }
+    }
+    for (const p in temp) {
+      if (!hasOwnProperty(proto, p)) {
+        proto[p] = temp[p];
+      }
+    }
+  }
+  /**
+   * Destroy a single resource entry.
+   */
+  static destroyResource(cache, key, callDestroy, oldEntity) {
+    const entry = cache[key];
+    if (!entry || entry.entity === oldEntity) return void 0;
+    const entity = entry.entity;
+    if (entity && typeof entity === "object") {
+      const destroyFn = entity["destroy"];
+      if (typeof destroyFn === "function" && callDestroy) {
+        funcWithTry(destroyFn, [], entity, noop);
+      }
+    }
+    Reflect.deleteProperty(cache, key);
+    return entity;
+  }
+  // ============================================================
+  // Static: extend and merge
+  // ============================================================
+  /**
+   * Extend View to create a new View subclass.
+   *
+   * Supports:
+   * - props.make: constructor-like init (called with initParams + {node, deep})
+   * - props.mixins: array of mixin objects
+   * - Event method patterns: `'name<click>'` etc.
+   */
+  static extend(props, statics) {
+    const definedProps = props ?? {};
+    const make = definedProps["make"];
+    const makes = [];
+    if (typeof make === "function") {
+      makes.push(make);
+    }
+    const ParentView = this;
+    const ChildView = class extends ParentView {
+      constructor(nodeId, ownerFrame, initParams, node, mixinCtors) {
+        super(nodeId, ownerFrame, initParams, node, []);
+        const instanceProps = this;
+        for (const key in definedProps) {
+          if (hasOwnProperty(definedProps, key) && key !== "make" && key !== "render") {
+            instanceProps[key] = definedProps[key];
+          }
+        }
+        this.id = nodeId;
+        this.owner = ownerFrame;
+        this.updater = new Updater(nodeId);
+        const params = [
+          initParams,
+          {
+            node,
+            deep: !this.template
+          }
+        ];
+        const concatCtors = makes.concat(mixinCtors || []);
+        if (concatCtors.length) {
+          funcWithTry(concatCtors, params, this, noop);
+        }
+      }
+    };
+    for (const key in definedProps) {
+      if (hasOwnProperty(definedProps, key) && key !== "make") {
+        Reflect.set(ChildView.prototype, key, definedProps[key]);
+      }
+    }
+    if (statics) {
+      for (const key in statics) {
+        if (hasOwnProperty(statics, key)) {
+          Reflect.set(ChildView, key, statics[key]);
+        }
+      }
+    }
+    return ChildView;
+  }
+  /**
+   * Merge mixins into View prototype.
+   */
+  static merge(...mixins) {
+    const existingCtors = this.makes || [];
+    _View.mergeMixins(mixins, this, existingCtors);
+    return this;
+  }
+};
+
+// src/view-registry.ts
+var viewClassRegistry = {};
+function getViewClass(path) {
+  return viewClassRegistry[path];
+}
+function registerViewClass(viewPath, ViewClass) {
+  const parsed = parseUri(viewPath);
+  const path = parsed.path;
+  if (path) {
+    viewClassRegistry[path] = ViewClass;
+  }
+}
+
+// src/frame.ts
+var frameRegistry = /* @__PURE__ */ new Map();
+var rootFrame;
+var globalAlter;
+var MAX_FRAME_POOL = 64;
+var frameCache = [];
+var staticEmitter = new EventEmitter();
+var Frame = class _Frame extends EventEmitter {
+  /** Frame ID (same as owner DOM element ID) */
+  id;
+  /** Parent Frame ID */
+  _parentId = void 0;
+  get parentId() {
+    return this._parentId;
+  }
+  /** Children map: id -> id */
+  childrenMap = {};
+  /** Children count */
+  childrenCount = 0;
+  /** Ready count (children that have fired 'created') */
+  readyCount = 0;
+  /** Set of child frame IDs that have fired 'created' */
+  readyMap = /* @__PURE__ */ new Set();
+  /** View instance */
+  viewInstance;
+  /** Get view instance (read-only) */
+  get view() {
+    return this.viewInstance;
+  }
+  /** Invoke list for deferred method calls */
+  invokeList = [];
+  /** Signature for async operation tracking */
+  signature = 1;
+  /** Whether view has altered */
+  hasAltered = 0;
+  /** Whether view is destroyed */
+  destroyed = 0;
+  /** View path (v-lark attribute value) */
+  viewPath;
+  /** Original template before mount */
+  originalTemplate;
+  /** Hold fire created flag */
+  holdFireCreated = 0;
+  /** Children created flag */
+  childrenCreated = 0;
+  /** Children alter flag */
+  childrenAlter = 0;
+  constructor(id, parentId) {
+    super();
+    this.id = id;
+    if (parentId) {
+      this._parentId = parentId;
+    }
+    frameRegistry.set(id, this);
+    const element = document.getElementById(id);
+    if (element) {
+      element.frame = this;
+      element.frameBound = 1;
+    }
+    _Frame.fire("add", { frame: this });
+  }
+  // ============================================================
+  // Instance methods
+  // ============================================================
+  /**
+   * Mount a view to this frame.
+   *
+   * Complete flow:
+   * 1. Parse viewPath, translate query params from parent
+   * 2. Unmount current view
+   * 3. Load View class (via require or provided ViewClass)
+   * 4. View_Prepare (scan event methods)
+   * 5. Create View instance
+   * 6. View_DelegateEvents (bind DOM events)
+   * 7. Call view.init()
+   * 8. If view has template, call render via Updater
+   * 9. If no template, call endUpdate directly
+   */
+  mountView(viewPath, viewInitParams) {
+    const node = document.getElementById(this.id);
+    const pId = this.parentId;
+    if (!this.hasAltered && node) {
+      this.hasAltered = 1;
+      this.originalTemplate = node.innerHTML;
+    }
+    this.unmountView();
+    this.destroyed = 0;
+    const parsed = parseUri(viewPath || "");
+    const viewClassName = parsed.path;
+    if (!node || !viewClassName) return;
+    this.viewPath = viewPath;
+    const params = parsed["params"];
+    translateQuery(pId || this.id, viewPath, params);
+    const initParams = { ...params };
+    if (viewInitParams) {
+      assign(initParams, viewInitParams);
+    }
+    const sign = this.signature;
+    const registered = getViewClass(viewClassName);
+    if (registered) {
+      this.doMountView(registered, initParams, node, sign);
+      return;
+    }
+    use(viewClassName, (ViewClass) => {
+      if (sign !== this.signature) return;
+      if (typeof ViewClass === "function") {
+        const ViewClassTyped = ViewClass;
+        registerViewClass(viewClassName, ViewClassTyped);
+        this.doMountView(ViewClassTyped, initParams, node, sign);
+      } else {
+        const error = new Error(`Cannot load view: ${viewClassName}`);
+        const errorHandler = config.error;
+        if (errorHandler) {
+          errorHandler(error);
+        }
+      }
+    });
+  }
+  /**
+   * Internal: actually mount the view after class is loaded.
+   */
+  doMountView(ViewClass, params, node, sign) {
+    if (sign !== this.signature) return;
+    const mixinConstructors = View.prepare(ViewClass);
+    const Constructor = ViewClass;
+    const view = new Constructor(
+      this.id,
+      this,
+      params,
+      node,
+      mixinConstructors
+    );
+    this.viewInstance = view;
+    view.signature = 1;
+    View.delegateEvents(view);
+    const initResult = funcWithTry(
+      view.init,
+      [params, { node, deep: !view.template }],
+      view,
+      noop
+    );
+    const nextSign = ++this.signature;
+    Promise.resolve(initResult).then(() => {
+      if (nextSign !== this.signature) return;
+      if (view.template) {
+        view.render();
+      } else {
+        this.hasAltered = 0;
+        if (!view.endUpdatePendingFlag) {
+          view.endUpdate();
+        }
+      }
+    });
+  }
+  /**
+   * Unmount current view.
+   */
+  unmountView() {
+    const view = this.view;
+    this.invokeList = [];
+    if (!view) return;
+    if (!globalAlter) {
+      globalAlter = { id: this.id };
+    }
+    this.destroyed = 1;
+    this.unmountZone();
+    notifyAlter(this, globalAlter);
+    if (view.signature > 0) {
+      view.fire("destroy", void 0, true, true);
+    }
+    EventDelegator.clearRangeEvents(this.id);
+    delete this["viewInstance"];
+    const node = document.getElementById(this.id);
+    if (node && this.originalTemplate) {
+      node.innerHTML = this.originalTemplate;
+    }
+    globalAlter = void 0;
+    unmark(view);
+  }
+  /**
+   * Mount a child frame.
+   */
+  mountFrame(frameId, viewPath, viewInitParams) {
+    notifyAlter(this, { id: frameId });
+    let childFrame = frameRegistry.get(frameId);
+    if (!childFrame) {
+      if (!this.childrenMap[frameId]) {
+        this.childrenCount++;
+      }
+      this.childrenMap[frameId] = frameId;
+      childFrame = frameCache.pop();
+      if (childFrame) {
+        reInitFrame(childFrame, frameId, this.id);
+      } else {
+        childFrame = new _Frame(frameId, this.id);
+      }
+    }
+    childFrame.mountView(viewPath, viewInitParams);
+    return childFrame;
+  }
+  /**
+   * Unmount a child frame.
+   */
+  unmountFrame(id) {
+    const targetId = id ? this.childrenMap[id] : this.id;
+    const frame = frameRegistry.get(targetId);
+    if (!frame) return;
+    const wasCreated = frame.readyCount > 0;
+    const pId = frame.parentId;
+    frame.unmountView();
+    removeFrame(targetId, wasCreated);
+    reInitFrameForCache(frame);
+    if (frameCache.length < MAX_FRAME_POOL) {
+      frameCache.push(frame);
+    }
+    const parent = frameRegistry.get(pId || "");
+    if (parent && parent.childrenMap[targetId]) {
+      Reflect.deleteProperty(parent.childrenMap, targetId);
+      parent.childrenCount--;
+      notifyCreated(parent);
+    }
+  }
+  /**
+   * Mount all views in a zone.
+   */
+  mountZone(zoneId) {
+    const targetZone = zoneId || this.id;
+    this.holdFireCreated = 1;
+    const rootEl = document.getElementById(targetZone);
+    if (!rootEl) return;
+    const viewElements = rootEl.querySelectorAll(`[${LARK_VIEW}]`);
+    const frames = [];
+    viewElements.forEach((el) => {
+      if (!(el instanceof HTMLElement)) return;
+      if (htmlElIsBound(el)) return;
+      const elId = ensureElementId(el, "frame_");
+      el.frameBound = 1;
+      const viewPath = getAttribute(el, LARK_VIEW);
+      frames.push([elId, viewPath]);
+    });
+    for (const [frameId, viewPath] of frames) {
+      this.mountFrame(frameId, viewPath);
+    }
+    this.holdFireCreated = 0;
+    notifyCreated(this);
+  }
+  /**
+   * Unmount all views in a zone.
+   */
+  unmountZone(zoneId) {
+    for (const childId in this.childrenMap) {
+      if (hasOwnProperty(this.childrenMap, childId)) {
+        if (!zoneId || childId !== zoneId) {
+          this.unmountFrame(childId);
+        }
+      }
+    }
+    notifyCreated(this);
+  }
+  /**
+   * Get all child frame IDs.
+   */
+  children() {
+    const result = [];
+    for (const id in this.childrenMap) {
+      if (hasOwnProperty(this.childrenMap, id)) {
+        result.push(id);
+      }
+    }
+    return result;
+  }
+  /**
+   * Get parent frame at given level.
+   * @param level - How many levels up (default 1)
+   */
+  parent(level = 1) {
+    let frame = void 0;
+    let currentPid = this.parentId;
+    let n = level >>> 0 || 1;
+    while (currentPid && n--) {
+      frame = frameRegistry.get(currentPid);
+      currentPid = frame?.parentId;
+    }
+    return frame;
+  }
+  /**
+   * Invoke a method on the view.
+   */
+  invoke(name, args) {
+    let result;
+    const view = this.view;
+    if (view && view.rendered) {
+      const fn = Reflect.get(view, name);
+      if (typeof fn === "function") {
+        result = funcWithTry(fn, args || [], view, noop);
+      }
+    } else {
+      const key = SPLITTER + name;
+      let existingEntry;
+      for (const entry of this.invokeList) {
+        if (entry.key === key) {
+          existingEntry = entry;
+          break;
+        }
+      }
+      if (existingEntry) {
+        existingEntry.removed = args === existingEntry.args;
+      }
+      const newEntry = {
+        name,
+        args: args || [],
+        key
+      };
+      this.invokeList.push(newEntry);
+    }
+    return result;
+  }
+  /**
+   * Type-safe variant of `invoke`.
+   *
+   * `invoke()` accepts any string and any args, which silently hides
+   * mismatched call sites when a method gets renamed. `invokeTyped` carries
+   * the view's method signature through TypeScript so the compiler catches
+   * those mistakes:
+   *
+   * ```ts
+   * type Home = View & { loadData(id: string): Promise<void> };
+   * frame.invokeTyped<Home, "loadData">("loadData", ["user-1"]);
+   * ```
+   *
+   * Behavior is identical to `invoke` at runtime — same defer / direct-call
+   * paths — so it's a drop-in safer overload.
+   */
+  invokeTyped(name, args) {
+    return this.invoke(name, args);
+  }
+  // ============================================================
+  // Static methods
+  // ============================================================
+  /** Get frame by ID */
+  static get(id) {
+    return frameRegistry.get(id);
+  }
+  /** Get all frames */
+  static getAll() {
+    return frameRegistry;
+  }
+  /**
+   * Returns the existing root frame, or `undefined` if none has been created.
+   * Pure getter — never creates a Frame, never touches the DOM.
+   *
+   * Use `Frame.createRoot(id)` to create the root explicitly during framework
+   * boot. For Micro-Frontend hosts that own multiple independent containers,
+   * use `new Frame(containerId)` directly so each MF mount has its own root.
+   */
+  static getRoot() {
+    return rootFrame;
+  }
+  /**
+   * Create (or return) the singleton root frame for this app.
+   *
+   * Idempotent: subsequent calls always return the original root regardless
+   * of `rootId` — so passing a different id later is silently ignored.
+   * `Framework.boot()` is the canonical caller; user code rarely needs this.
+   */
+  static createRoot(rootId) {
+    if (!rootFrame) {
+      rootId = rootId || "root";
+      let rootElement = document.getElementById(rootId);
+      if (!rootElement) {
+        rootElement = document.body;
+        rootElement.id = rootId;
+      }
+      rootFrame = new _Frame(rootId);
+    }
+    return rootFrame;
+  }
+  /** Bind event listener (static) */
+  static on(event, handler) {
+    staticEmitter.on(event, handler);
+    return _Frame;
+  }
+  /** Unbind event listener (static) */
+  static off(event, handler) {
+    staticEmitter.off(event, handler);
+    return _Frame;
+  }
+  /** Fire event (static) */
+  static fire(event, data) {
+    staticEmitter.fire(event, data);
+  }
+};
+function htmlElIsBound(element) {
+  return !!element.frameBound;
+}
+function removeFrame(id, wasCreated) {
+  const frameInstance = frameRegistry.get(id);
+  if (!frameInstance) return;
+  frameRegistry.delete(id);
+  Frame.fire("remove", { frame: frameInstance, fcc: wasCreated });
+  const element = document.getElementById(id);
+  if (element) {
+    element.frameBound = 0;
+    Reflect.deleteProperty(element, "frame");
+  }
+}
+function notifyCreated(frameInstance) {
+  if (!frameInstance["childrenCreated"] && !frameInstance["holdFireCreated"] && frameInstance["childrenCount"] === frameInstance["readyCount"]) {
+    if (!frameInstance["childrenCreated"]) {
+      frameInstance["childrenCreated"] = 1;
+      frameInstance["childrenAlter"] = 0;
+      frameInstance.fire("created");
+    }
+    const pId = frameInstance.parentId;
+    if (pId) {
+      const parent = frameRegistry.get(pId);
+      if (parent && !parent.readyMap.has(frameInstance.id)) {
+        parent.readyMap.add(frameInstance.id);
+        parent.readyCount++;
+        notifyCreated(parent);
+      }
+    }
+  }
+}
+function notifyAlter(frameInstance, data) {
+  if (!frameInstance["childrenAlter"] && frameInstance["childrenCreated"]) {
+    frameInstance["childrenCreated"] = 0;
+    frameInstance["childrenAlter"] = 1;
+    frameInstance.fire("alter", data);
+    const pId = frameInstance.parentId;
+    if (pId) {
+      const parent = frameRegistry.get(pId);
+      if (parent && parent.readyMap.has(frameInstance.id)) {
+        parent.readyCount--;
+        parent.readyMap.delete(frameInstance.id);
+        notifyAlter(parent, data);
+      }
+    }
+  }
+}
+function reInitFrame(frame, id, parentId) {
+  Reflect.set(frame, "id", id);
+  frame["_parentId"] = parentId;
+  frame["childrenMap"] = {};
+  frame["childrenCount"] = 0;
+  frame["readyCount"] = 0;
+  frame["signature"] = 1;
+  frame["readyMap"] = /* @__PURE__ */ new Set();
+  frame["invokeList"] = [];
+  frameRegistry.set(id, frame);
+}
+function reInitFrameForCache(frame) {
+  Reflect.set(frame, "id", "");
+  frame["_parentId"] = void 0;
+  frame["childrenMap"] = {};
+  frame["readyMap"] = /* @__PURE__ */ new Set();
+}
+function translateQuery(pId, src, params) {
+  const parentFrame = frameRegistry.get(pId);
+  const parentView = parentFrame?.view;
+  if (!parentView) return;
+  const parentRefData = parentView.updater.refData;
+  if (!parentRefData) return;
+  if (src.indexOf(SPLITTER) > 0) {
+    translateData(parentRefData, params);
+    const paramsRec = params;
+    const splitterValue = paramsRec[SPLITTER];
+    if (splitterValue && typeof splitterValue === "object") {
+      assign(params, splitterValue);
+      Reflect.deleteProperty(params, SPLITTER);
+    }
+  }
+}
+
+// src/devtool.ts
+var FrameDevtoolBridge = {
+  MSG_PING: "LARK_DEVTOOL_PING",
+  MSG_PONG: "LARK_DEVTOOL_PONG",
+  MSG_REQUEST_TREE: "LARK_DEVTOOL_REQUEST_TREE",
+  MSG_TREE: "LARK_DEVTOOL_TREE",
+  MSG_TREE_DELTA: "LARK_DEVTOOL_TREE_DELTA"
+};
+function serializeView(view) {
+  const evtMap = view.eventObjectMap;
+  const eventMethodKeys = evtMap ? Object.keys(evtMap) : [];
+  const resourceKeys = view.resources ? Object.keys(view.resources) : [];
+  const hasAssign = typeof view["assign"] === "function";
+  let updaterData = null;
+  try {
+    const ref = view.updater?.refData;
+    if (ref && typeof ref === "object") {
+      updaterData = {};
+      for (const k of Object.keys(ref)) {
+        const v = ref[k];
+        updaterData[k] = v === null || typeof v !== "object" ? v : `[${typeof v}]`;
+      }
+    }
+  } catch {
+  }
+  return {
+    id: view.id,
+    rendered: !!view.rendered,
+    signature: view.signature,
+    observedStateKeys: view.observedStateKeys ?? null,
+    locationObserved: {
+      flag: view.locationObserved.flag,
+      keys: view.locationObserved.keys,
+      observePath: view.locationObserved.observePath
+    },
+    hasTemplate: !!view.template,
+    eventMethodKeys,
+    resourceKeys,
+    hasAssign,
+    updaterData
+  };
+}
+function serializeFrame(frameId) {
+  const frame = Frame.get(frameId);
+  if (!frame) return null;
+  const view = frame.view;
+  const children = [];
+  for (const childId of frame.children()) {
+    const childNode = serializeFrame(childId);
+    if (childNode) {
+      children.push(childNode);
+    }
+  }
+  return {
+    id: frame.id,
+    parentId: frame.parentId ?? null,
+    viewPath: frame.viewPath ?? null,
+    childrenCount: frame.childrenCount,
+    readyCount: frame.readyCount,
+    childrenCreated: frame.childrenCreated,
+    childrenAlter: frame.childrenAlter,
+    destroyed: frame.destroyed,
+    view: view ? serializeView(view) : null,
+    children
+  };
+}
+function serializeFrameTree() {
+  const root = Frame.getRoot();
+  if (!root) {
+    return { root: null, totalFrames: 0, timestamp: Date.now(), rootId: "" };
+  }
+  const rootNode = serializeFrame(root.id);
+  let totalFrames = 0;
+  const countFrames = (node) => {
+    if (!node) return;
+    totalFrames++;
+    for (const child of node.children) {
+      countFrames(child);
+    }
+  };
+  countFrames(rootNode);
+  return {
+    root: rootNode,
+    totalFrames,
+    timestamp: Date.now(),
+    rootId: root.id
+  };
+}
+var bridgeInstalled = false;
+var lastTreeJson = "";
+function installFrameDevtoolBridge() {
+  if (bridgeInstalled) return;
+  if (typeof window === "undefined") return;
+  bridgeInstalled = true;
+  window.addEventListener("message", (event) => {
+    const data = event.data;
+    if (!data || typeof data !== "object") return;
+    const type = data.type;
+    if (type === FrameDevtoolBridge.MSG_PING) {
+      const source = event.source;
+      if (source) {
+        source.postMessage(
+          { type: FrameDevtoolBridge.MSG_PONG },
+          { targetOrigin: "*" }
+        );
+      }
+      return;
+    }
+    if (type === FrameDevtoolBridge.MSG_REQUEST_TREE) {
+      const tree = serializeFrameTree();
+      const source = event.source;
+      if (source) {
+        source.postMessage(
+          { type: FrameDevtoolBridge.MSG_TREE, data: tree },
+          { targetOrigin: "*" }
+        );
+      }
+    }
+  });
+  Frame.on("add", () => {
+    pushTreeUpdate();
+  });
+  Frame.on("remove", () => {
+    pushTreeUpdate();
+  });
+}
+function pushTreeUpdate() {
+  if (window === window.parent) return;
+  const tree = serializeFrameTree();
+  const treeJson = JSON.stringify(tree);
+  if (treeJson !== lastTreeJson) {
+    lastTreeJson = treeJson;
+    window.parent.postMessage(
+      { type: FrameDevtoolBridge.MSG_TREE_DELTA, data: tree },
+      "*"
+    );
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FrameDevtoolBridge,
+  installFrameDevtoolBridge,
+  serializeFrameTree
+});