@jasonshimmy/custom-elements-runtime 0.1.2 → 0.1.3

package/dist/custom-elements-runtime.es.js

@@ -1,20 +1,42 @@
-function Re(e) {
-  let t = new Proxy(e, {
-    set: (i, l, c) => (i[l] = c, s(), !0)
+function rt(e, t) {
+  return J(e ? t : [], "when-block");
+}
+function nt(e, t) {
+  return e.map((r, n) => {
+    const o = typeof r == "object" ? r?.key ?? r?.id ?? `idx-${n}` : String(r);
+    return J(t(r, n), `each-${o}`);
   });
-  const n = [];
-  function r(i) {
-    n.push(i), i(t);
-  }
-  function o() {
-    return t;
-  }
-  function s() {
-    n.forEach((i) => i(t));
+}
+function be() {
+  const e = [];
+  return {
+    when(t, r) {
+      return e.push([t, r]), this;
+    },
+    otherwise(t) {
+      return e.push([!0, t]), this;
+    },
+    done() {
+      return ve(...e);
+    }
+  };
+}
+function ve(...e) {
+  for (let t = 0; t < e.length; t++) {
+    const [r, n] = e[t];
+    if (r) return [J(n, `whenChain-branch-${t}`)];
   }
-  return { subscribe: r, getState: o };
+  return [J([], "whenChain-empty")];
+}
+function J(e, t) {
+  const r = e ? Array.isArray(e) ? e.filter(Boolean) : [e].filter(Boolean) : [];
+  return {
+    tag: "#anchor",
+    key: t,
+    children: r
+  };
 }
-class B extends EventTarget {
+class P extends EventTarget {
   handlers = {};
   static instance;
   eventCounters = /* @__PURE__ */ new Map();
@@ -22,7 +44,7 @@ class B extends EventTarget {
    * Returns the singleton instance of GlobalEventBus
    */
   static getInstance() {
-    return B.instance || (B.instance = new B()), B.instance;
+    return P.instance || (P.instance = new P()), P.instance;
   }
   // Enhanced emit method with better typing and event storm protection
   /**
@@ -30,16 +52,16 @@ class B extends EventTarget {
    * @param eventName - Name of the event
    * @param data - Optional event payload
    */
-  emit(t, n) {
-    const r = Date.now(), o = this.eventCounters.get(t);
-    if (!o || r - o.window > 1e3)
-      this.eventCounters.set(t, { count: 1, window: r });
+  emit(t, r) {
+    const n = Date.now(), o = this.eventCounters.get(t);
+    if (!o || n - o.window > 1e3)
+      this.eventCounters.set(t, { count: 1, window: n });
     else if (o.count++, o.count > 50 && (console.error(`Event storm detected for "${t}": ${o.count} events in 1 second. Throttling...`), o.count > 100)) {
       console.warn(`Blocking further "${t}" events to prevent infinite loop`);
       return;
     }
     this.dispatchEvent(new CustomEvent(t, {
-      detail: n,
+      detail: r,
       bubbles: !1,
       // Global events don't need to bubble
       cancelable: !0
@@ -47,9 +69,9 @@ class B extends EventTarget {
     const s = this.handlers[t];
     s && s.forEach((i) => {
       try {
-        i(n);
-      } catch (l) {
-        console.error(`Error in global event handler for "${t}":`, l);
+        i(r);
+      } catch (a) {
+        console.error(`Error in global event handler for "${t}":`, a);
       }
     });
   }
@@ -58,17 +80,17 @@ class B extends EventTarget {
    * @param eventName - Name of the event
    * @param handler - Handler function
    */
-  on(t, n) {
-    return this.handlers[t] || (this.handlers[t] = /* @__PURE__ */ new Set()), this.handlers[t].add(n), () => this.off(t, n);
+  on(t, r) {
+    return this.handlers[t] || (this.handlers[t] = /* @__PURE__ */ new Set()), this.handlers[t].add(r), () => this.off(t, r);
   }
   /**
    * Remove a specific handler for a global event.
    * @param eventName - Name of the event
    * @param handler - Handler function to remove
    */
-  off(t, n) {
-    const r = this.handlers[t];
-    r && r.delete(n);
+  off(t, r) {
+    const n = this.handlers[t];
+    n && n.delete(r);
   }
   /**
    * Remove all handlers for a specific event.
@@ -83,18 +105,18 @@ class B extends EventTarget {
    * @param handler - CustomEvent handler
    * @param options - AddEventListener options
    */
-  listen(t, n, r) {
-    return this.addEventListener(t, n, r), () => this.removeEventListener(t, n);
+  listen(t, r, n) {
+    return this.addEventListener(t, r, n), () => this.removeEventListener(t, r);
   }
   /**
    * Register a one-time event handler. Returns a promise that resolves with the event data.
    * @param eventName - Name of the event
    * @param handler - Handler function
    */
-  once(t, n) {
-    return new Promise((r) => {
+  once(t, r) {
+    return new Promise((n) => {
       const o = this.on(t, (s) => {
-        o(), n(s), r(s);
+        o(), r(s), n(s);
       });
     });
   }
@@ -124,10 +146,10 @@ class B extends EventTarget {
    */
   getEventStats() {
     const t = {};
-    for (const [n, r] of this.eventCounters.entries())
-      t[n] = {
-        count: r.count,
-        handlersCount: this.getHandlerCount(n)
+    for (const [r, n] of this.eventCounters.entries())
+      t[r] = {
+        count: n.count,
+        handlersCount: this.getHandlerCount(r)
       };
     return t;
   }
@@ -138,436 +160,268 @@ class B extends EventTarget {
     this.eventCounters.clear();
   }
 }
-const Be = B.getInstance();
-function P(e, t = {}, n, r) {
-  const o = r ?? t.key;
-  return { tag: e, key: o, props: t, children: n };
+const H = P.getInstance(), ot = (e, t) => H.emit(e, t), it = (e, t) => H.on(e, t), st = (e, t) => H.off(e, t), at = (e, t) => H.once(e, t), lt = (e, t, r) => H.listen(e, t, r);
+function ie(e) {
+  let t = new Proxy(e, {
+    set: (i, a, l) => (i[a] = l, s(), !0)
+  });
+  const r = [];
+  function n(i) {
+    r.push(i), i(t);
+  }
+  function o() {
+    return t;
+  }
+  function s() {
+    r.forEach((i) => i(t));
+  }
+  return { subscribe: n, getState: o };
 }
-function I(e) {
-  return !!e && typeof e == "object" && (e.type === "AnchorBlock" || e.tag === "#anchor");
+function ne(e) {
+  return e.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
 }
-function R(e) {
-  return typeof e == "object" && e !== null && "tag" in e && !I(e);
+function ee(e) {
+  return typeof e == "string" ? e.replace(
+    /[&<>"']/g,
+    (t) => ({
+      "&": "&amp;",
+      "<": "&lt;",
+      ">": "&gt;",
+      '"': "&quot;",
+      "'": "&#39;"
+    })[t]
+  ) : e;
 }
-function le(e, t) {
-  return e.key != null ? e : { ...e, key: t };
+function xe(e, t, r) {
+  if (r)
+    for (const [n, o] of Object.entries(r)) {
+      let s, i = {};
+      if (Array.isArray(o) ? (s = o[0], i = o[1] || {}) : s = o, t.set(n, {
+        callback: s,
+        options: i,
+        oldValue: te(e, n)
+      }), i.immediate)
+        try {
+          const a = te(e, n);
+          s(a, void 0, e);
+        } catch (a) {
+          console.error(`Error in immediate watcher for "${n}":`, a);
+        }
+    }
 }
-function ce(e, t = [], n = {}) {
-  const r = {}, o = {}, s = {}, i = /([:@#]?)([a-zA-Z0-9-:\.]+)=("([^"\\]*(\\.[^"\\]*)*)"|'([^'\\]*(\\.[^'\\]*)*)')/g;
-  let l;
-  for (; l = i.exec(e); ) {
-    const c = l[1], d = l[2], p = (l[4] || l[6]) ?? "", u = p.match(/^{{(\d+)}}$/);
-    let f = u ? t[Number(u[1])] ?? null : p;
-    if (u || (f === "true" ? f = !0 : f === "false" ? f = !1 : f === "null" ? f = null : isNaN(Number(f)) || (f = Number(f))), c === ":")
-      typeof f == "boolean" ? o[d] = f : f != null && (r[d] = f);
-    else if (c === "@") {
-      const m = "on" + d.charAt(0).toUpperCase() + d.slice(1);
-      r[m] = typeof f == "function" ? f : typeof n[f] == "function" ? n[f] : void 0;
-    } else if (c === "#") {
-      const [m, ...h] = d.split("."), S = [...h];
-      let y = f, a = [...S];
-      if (m === "model" && typeof y == "string" && y.includes(".")) {
-        const b = ["trim", "number", "lazy"], g = y.split(".");
-        let x = y;
-        const w = [];
-        for (let k = g.length - 1; k > 0 && b.includes(g[k]); k--)
-          w.unshift(g[k]), x = g.slice(0, k).join(".");
-        y = x, a.push(...w);
-      }
-      s[m] = {
-        value: y,
-        modifiers: a
-      };
-    } else d === "ref" ? r.ref = f : o[d] = f;
-  }
-  return { props: r, attrs: o, directives: s };
+function te(e, t) {
+  return t.split(".").reduce((r, n) => r?.[n], e);
 }
-function fe(e, t, n) {
-  function r(a, b) {
-    return P("#text", {}, a, b);
-  }
-  let o = "";
-  for (let a = 0; a < e.length; a++)
-    o += e[a], a < t.length && (o += `{{${a}}}`);
-  const s = /<\/?([a-zA-Z0-9-]+)([^>]*)\/?>|{{(\d+)}}|([^<]+)/g, i = [];
-  let l = null, c, d = [], p = null, u = {}, f, m = 0, h = [];
-  function S(a) {
-    !a || typeof a != "object" || I(a) || (a.props || a.attrs ? (a.props && (u.props || (u.props = {}), Object.assign(u.props, a.props)), a.attrs && (u.attrs || (u.attrs = {}), Object.keys(a.attrs).forEach((b) => {
-      if (b === "style" && u.attrs.style) {
-        const g = u.attrs.style.replace(
-          /;?\s*$/,
-          ""
-        ), x = a.attrs.style.replace(/^;?\s*/, "");
-        u.attrs.style = g + "; " + x;
-      } else if (b === "class" && u.attrs.class) {
-        const g = u.attrs.class.trim().split(/\s+/).filter(Boolean), x = a.attrs.class.trim().split(/\s+/).filter(Boolean), w = [
-          .../* @__PURE__ */ new Set([...g, ...x])
-        ];
-        u.attrs.class = w.join(" ");
-      } else
-        u.attrs[b] = a.attrs[b];
-    }))) : (u.props || (u.props = {}), Object.assign(u.props, a)));
-  }
-  function y(a, b) {
-    const g = p ? d : h;
-    if (I(a)) {
-      const x = a.key ?? b;
-      let w = a.children;
-      g.push({
-        ...a,
-        key: x,
-        children: w
-      });
-      return;
-    }
-    if (R(a)) {
-      g.push(le(a, void 0));
-      return;
+function we(e, t, r, n) {
+  const o = (i, a) => {
+    if (i === a) return !0;
+    if (typeof i != typeof a || typeof i != "object" || i === null || a === null) return !1;
+    if (Array.isArray(i) && Array.isArray(a))
+      return i.length !== a.length ? !1 : i.every((p, d) => o(p, a[d]));
+    const l = Object.keys(i), f = Object.keys(a);
+    return l.length !== f.length ? !1 : l.every((p) => o(i[p], a[p]));
+  }, s = t.get(r);
+  if (s && !o(n, s.oldValue))
+    try {
+      s.callback(n, s.oldValue, e), s.oldValue = n;
+    } catch (i) {
+      console.error(`Error in watcher for "${r}":`, i);
     }
-    if (Array.isArray(a)) {
-      if (a.length === 0) return;
-      for (let x = 0; x < a.length; x++) {
-        const w = a[x];
-        I(w) || R(w) || Array.isArray(w) ? y(w, `${b}-${x}`) : w !== null && typeof w == "object" ? S(w) : g.push(r(String(w), `${b}-${x}`));
+  for (const [i, a] of t.entries())
+    if (a.options.deep && r.startsWith(i + "."))
+      try {
+        const l = te(e, i);
+        o(l, a.oldValue) || (a.callback(l, a.oldValue, e), a.oldValue = l);
+      } catch (l) {
+        console.error(`Error in deep watcher for "${i}":`, l);
       }
-      return;
-    }
-    if (a !== null && typeof a == "object") {
-      S(a);
-      return;
-    }
-    g.push(r(String(a), b));
+}
+function ke(e, t, r) {
+  if (!t.props) return;
+  function n(o, s) {
+    return s === Boolean ? o === "true" : s === Number ? Number(o) : o;
   }
-  for (; c = s.exec(o); )
-    if (c[1]) {
-      const a = c[1], b = c[0][1] === "/", g = c[0][c[0].length - 2] === "/", {
-        props: x,
-        attrs: w,
-        directives: k
-      } = ce(c[2] || "", t, n), $ = { props: {}, attrs: {} };
-      for (const v in x) $.props[v] = x[v];
-      for (const v in w) $.attrs[v] = w[v];
-      for (const [v, _] of Object.entries(k))
-        if (v === "bind")
-          if (typeof _.value == "object" && _.value !== null)
-            for (const [A, E] of Object.entries(_.value))
-              typeof E == "boolean" ? $.attrs[A] = E : E != null && ($.attrs[A] = String(E));
-          else _.value != null && ($.attrs[v] = String(_.value));
-        else if (v === "show") {
-          const A = !!_.value;
-          $.attrs.style = ($.attrs.style || "") + (A ? "" : "; display: none !important");
-        } else if (v === "class") {
-          const A = _.value;
-          let E = [];
-          if (typeof A == "string")
-            E = A.split(/\s+/).filter(Boolean);
-          else if (Array.isArray(A)) {
-            for (const j of A)
-              if (typeof j == "string")
-                E.push(...j.split(/\s+/).filter(Boolean));
-              else if (j && typeof j == "object")
-                for (const [L, N] of Object.entries(j))
-                  N && E.push(...L.split(/\s+/).filter(Boolean));
-          } else if (A && typeof A == "object")
-            for (const [j, L] of Object.entries(A))
-              L && E.push(...j.split(/\s+/).filter(Boolean));
-          const O = $.attrs.class || "", M = [
-            .../* @__PURE__ */ new Set([
-              ...O.split(/\s+/).filter(Boolean),
-              ...E
-            ])
-          ];
-          $.attrs.class = M.join(" ");
-        } else if (v === "style") {
-          const A = _.value;
-          let E = "";
-          if (typeof A == "string")
-            E = A;
-          else if (A && typeof A == "object") {
-            const M = [];
-            for (const [j, L] of Object.entries(A))
-              if (L != null && L !== "") {
-                const N = j.replace(
-                  /[A-Z]/g,
-                  (ae) => `-${ae.toLowerCase()}`
-                ), se = [
-                  "width",
-                  "height",
-                  "top",
-                  "right",
-                  "bottom",
-                  "left",
-                  "margin",
-                  "margin-top",
-                  "margin-right",
-                  "margin-bottom",
-                  "margin-left",
-                  "padding",
-                  "padding-top",
-                  "padding-right",
-                  "padding-bottom",
-                  "padding-left",
-                  "font-size",
-                  "line-height",
-                  "border-width",
-                  "border-radius",
-                  "min-width",
-                  "max-width",
-                  "min-height",
-                  "max-height"
-                ];
-                let X = String(L);
-                typeof L == "number" && se.includes(N) && (X = `${L}px`), M.push(`${N}: ${X}`);
-              }
-            E = M.join("; ") + (M.length > 0 ? ";" : "");
-          }
-          const O = $.attrs.style || "";
-          $.attrs.style = O + (O && !O.endsWith(";") ? "; " : "") + E;
-        }
-      const C = {};
-      for (const [v, _] of Object.entries(k))
-        ["bind", "show", "class", "style"].includes(v) || (C[v] = _);
-      if (Object.keys(C).length > 0 && ($.directives = C), b) {
-        const v = P(
-          p,
-          u,
-          d.length === 1 && R(d[0]) && d[0].tag === "#text" ? typeof d[0].children == "string" ? d[0].children : "" : d.length ? d : void 0,
-          f
-        ), _ = i.pop();
-        _ ? (p = _.tag, u = _.props, f = _.key, d = _.children, d.push(v)) : l = v;
-      } else g ? (p ? d : h).push(P(a, $, void 0, void 0)) : (p && i.push({
-        tag: p,
-        props: u,
-        children: d,
-        key: f
-      }), p = a, u = $, d = []);
-    } else if (typeof c[3] < "u") {
-      const a = Number(c[3]), b = t[a], g = `interp-${a}`;
-      y(b, g);
-    } else if (c[4]) {
-      const a = c[4], b = p ? d : h, g = a.split(/({{\d+}})/);
-      for (const x of g) {
-        if (!x) continue;
-        const w = x.match(/^{{(\d+)}}$/);
-        if (w) {
-          const k = Number(w[1]), $ = t[k], C = `interp-${k}`;
-          y($, C);
-        } else {
-          const k = `text-${m++}`;
-          b.push(r(x, k));
-        }
-      }
+  Object.entries(t.props).forEach(([o, s]) => {
+    if (s.type === Function && typeof e[o] == "function")
+      r[o] = e[o];
+    else {
+      const i = e.getAttribute(ne(o));
+      i !== null ? r[o] = ee(n(i, s.type)) : "default" in s && s.default !== void 0 && (r[o] = ee(s.default));
     }
-  if (l)
-    return R(l) && Array.isArray(l.children) && (l.children = l.children.filter(
-      (a) => R(a) ? a.tag !== "#text" || typeof a.children == "string" && a.children.trim() !== "" : !0
-      // keep non-element VNodes (including anchors) as-is
-    )), l;
-  if (h.length > 0) {
-    const a = h.filter(
-      (b) => R(b) ? b.tag !== "#text" || typeof b.children == "string" && b.children.trim() !== "" : !0
-    );
-    return a.length === 1 ? a[0] : a;
-  }
-  return P("div", {}, "", "fallback-root");
-}
-function Oe(e, ...t) {
-  const n = t[t.length - 1], r = typeof n == "object" && n && !Array.isArray(n) ? n : void 0;
-  return fe(e, t, r);
-}
-function Me(e, t) {
-  return K(e ? t : [], "when-block");
-}
-function Ne(e, t) {
-  return e.map((n, r) => {
-    const o = typeof n == "object" ? n?.key ?? n?.id ?? `idx-${r}` : String(n);
-    return K(t(n, r), `each-${o}`);
   });
 }
-function Pe() {
-  const e = [];
-  return {
-    when(t, n) {
-      return e.push([t, n]), this;
-    },
-    otherwise(t) {
-      return e.push([!0, t]), this;
-    },
-    done() {
-      return ue(...e);
-    }
-  };
+function $e(e, t, r, n) {
+  e.onConnected && !r && (e.onConnected(t), n(!0));
 }
-function ue(...e) {
-  for (let t = 0; t < e.length; t++) {
-    const [n, r] = e[t];
-    if (n) return [K(r, `whenChain-branch-${t}`)];
-  }
-  return [K([], "whenChain-empty")];
+function Ce(e, t, r, n, o, s, i, a) {
+  e.onDisconnected && e.onDisconnected(t), r.forEach((l) => l()), n(), o(), s(!1), i(null), a(!1);
 }
-function K(e, t) {
-  const n = e ? Array.isArray(e) ? e.filter(Boolean) : [e].filter(Boolean) : [];
-  return {
-    tag: "#anchor",
-    key: t,
-    children: n
-  };
+function Se(e, t, r, n, o) {
+  e.onAttributeChanged && e.onAttributeChanged(t, r, n, o);
 }
 function z(e, t) {
-  return t.split(".").reduce((n, r) => n?.[r], e);
+  if (t && e instanceof HTMLElement) {
+    for (const r in t)
+      t[r] === e && delete t[r];
+    for (const r of Array.from(e.childNodes))
+      z(r, t);
+  }
+}
+function R(e, t) {
+  return t.split(".").reduce((r, n) => r?.[n], e);
 }
-function Y(e, t, n) {
-  const r = t.split("."), o = r.pop();
+function se(e, t, r) {
+  const n = t.split("."), o = n.pop();
   if (!o) return;
-  const s = r.reduce((i, l) => (l in i || (i[l] = {}), i[l]), e);
-  s[o] = n;
+  const s = n.reduce((i, a) => (a in i || (i[a] = {}), i[a]), e);
+  s[o] = r;
 }
-function de(e, t, n, r, o, s, i) {
+function _e(e, t, r, n, o, s, i) {
   if (!s) return;
-  const l = t.includes("lazy"), c = t.includes("trim"), d = t.includes("number"), p = () => {
+  const a = t.includes("lazy"), l = t.includes("trim"), f = t.includes("number"), p = () => {
     const y = s._state || s;
-    return z(y, e);
-  }, u = p();
-  let f = "text";
-  const m = r?.type;
-  if (i instanceof HTMLInputElement ? f = m || i.type || "text" : i instanceof HTMLSelectElement ? f = "select" : i instanceof HTMLTextAreaElement && (f = "textarea"), f === "checkbox")
-    if (Array.isArray(u)) {
-      const y = i?.getAttribute("value") || r?.value || "", a = u.includes(y);
-      i && i.checked !== a && (n.checked = a);
+    return R(y, e);
+  }, d = p();
+  let u = "text";
+  const m = n?.type;
+  if (i instanceof HTMLInputElement ? u = m || i.type || "text" : i instanceof HTMLSelectElement ? u = "select" : i instanceof HTMLTextAreaElement && (u = "textarea"), u === "checkbox")
+    if (Array.isArray(d)) {
+      const y = i?.getAttribute("value") || n?.value || "", c = d.includes(y);
+      i && i.checked !== c && (r.checked = c);
     } else {
-      const y = i?.getAttribute("true-value") || !0, a = u === y;
-      i && i.checked !== a && (n.checked = a);
+      const y = i?.getAttribute("true-value") || !0, c = d === y;
+      i && i.checked !== c && (r.checked = c);
     }
-  else if (f === "radio") {
-    const y = r?.value || "", a = u === y;
-    i && i.checked !== a && (n.checked = a);
-  } else if (f === "select")
+  else if (u === "radio") {
+    const y = n?.value || "", c = d === y;
+    i && i.checked !== c && (r.checked = c);
+  } else if (u === "select")
     if (i && i.hasAttribute("multiple")) {
-      const y = i, a = Array.isArray(u) ? u : [];
+      const y = i, c = Array.isArray(d) ? d : [];
       setTimeout(() => {
         Array.from(y.options).forEach((b) => {
-          const g = a.includes(b.value);
+          const g = c.includes(b.value);
           b.selected !== g && (b.selected = g);
         });
       }, 0);
     } else
       setTimeout(() => {
-        i instanceof HTMLSelectElement && i.value !== String(u) && (i.value = String(u));
+        i instanceof HTMLSelectElement && i.value !== String(d) && (i.value = String(d));
       }, 0);
   else {
-    const y = String(u ?? "");
-    (!i || i.value !== y) && (n.value = u);
+    const y = String(d ?? "");
+    (!i || i.value !== y) && (r.value = d);
   }
-  const h = l || f === "checkbox" || f === "radio" || f === "select" ? "change" : "input", S = (y) => {
+  const h = a || u === "checkbox" || u === "radio" || u === "select" ? "change" : "input", C = (y) => {
     if (y.isComposing || o._isComposing || y.isTrusted === !1) return;
-    const a = y.target;
-    if (a._modelUpdating) return;
+    const c = y.target;
+    if (c._modelUpdating) return;
     const b = p();
-    let g = a.value;
-    if (f === "checkbox")
+    let g = c.value;
+    if (u === "checkbox")
       if (Array.isArray(b)) {
-        const $ = a.getAttribute("value") || "", C = [...b];
-        if (a.checked)
-          C.includes($) || C.push($);
+        const S = c.getAttribute("value") || "", _ = [...b];
+        if (c.checked)
+          _.includes(S) || _.push(S);
         else {
-          const v = C.indexOf($);
-          v > -1 && C.splice(v, 1);
+          const x = _.indexOf(S);
+          x > -1 && _.splice(x, 1);
         }
-        g = C;
+        g = _;
       } else {
-        const $ = a.getAttribute("true-value") || !0, C = a.getAttribute("false-value") || !1;
-        g = a.checked ? $ : C;
+        const S = c.getAttribute("true-value") || !0, _ = c.getAttribute("false-value") || !1;
+        g = c.checked ? S : _;
       }
-    else if (f === "radio")
-      g = a.getAttribute("value") || a.value;
-    else if (f === "select" && a.multiple) {
-      const $ = a;
-      g = Array.from($.selectedOptions).map(
-        (C) => C.value
+    else if (u === "radio")
+      g = c.getAttribute("value") || c.value;
+    else if (u === "select" && c.multiple) {
+      const S = c;
+      g = Array.from(S.selectedOptions).map(
+        (_) => _.value
       );
-    } else if (c && (g = g.trim()), d) {
-      const $ = Number(g);
-      isNaN($) || (g = $);
+    } else if (l && (g = g.trim()), f) {
+      const S = Number(g);
+      isNaN(S) || (g = S);
     }
-    const x = s._state || s, w = z(x, e);
+    const v = s._state || s, w = R(v, e);
     if (Array.isArray(g) && Array.isArray(w) ? JSON.stringify([...g].sort()) !== JSON.stringify([...w].sort()) : g !== w) {
-      const $ = y.target;
-      $._modelUpdating = !0, Y(x, e, g), setTimeout(() => {
-        $._modelUpdating = !1;
+      const S = y.target;
+      S._modelUpdating = !0, se(v, e, g), setTimeout(() => {
+        S._modelUpdating = !1;
       }, 0), s._requestRender && s._requestRender();
     }
   };
-  if (o[h] = S, f === "text" || f === "textarea") {
+  if (o[h] = C, u === "text" || u === "textarea") {
     const y = () => {
       o._isComposing = !0;
-    }, a = (b) => {
+    }, c = (b) => {
       o._isComposing = !1;
       const g = b.target;
       setTimeout(() => {
         if (g) {
-          let x = g.value;
-          if (c && (x = x.trim()), d) {
-            const C = Number(x);
-            isNaN(C) || (x = C);
+          let v = g.value;
+          if (l && (v = v.trim()), f) {
+            const _ = Number(v);
+            isNaN(_) || (v = _);
           }
-          const w = s._state || s, k = z(w, e);
-          (Array.isArray(x) && Array.isArray(k) ? JSON.stringify([...x].sort()) !== JSON.stringify([...k].sort()) : x !== k) && (g && (g._modelUpdating = !0, setTimeout(() => {
+          const w = s._state || s, k = R(w, e);
+          (Array.isArray(v) && Array.isArray(k) ? JSON.stringify([...v].sort()) !== JSON.stringify([...k].sort()) : v !== k) && (g && (g._modelUpdating = !0, setTimeout(() => {
             g._modelUpdating = !1;
-          }, 0)), Y(w, e, x), s._requestRender && s._requestRender());
+          }, 0)), se(w, e, v), s._requestRender && s._requestRender());
         }
       }, 0);
     };
-    o.compositionstart = y, o.compositionend = a;
+    o.compositionstart = y, o.compositionend = c;
   }
 }
-function pe(e, t, n, r) {
-  if (r)
+function Ae(e, t, r, n) {
+  if (n)
     try {
       const o = JSON.parse(e);
       if (typeof o == "object")
         for (const [s, i] of Object.entries(o))
           t[s] = i;
     } catch {
-      const o = z(r, e);
-      n[e] = o;
+      const o = R(n, e);
+      r[e] = o;
     }
 }
-function he(e, t, n) {
-  if (!n) return;
-  const r = z(n, e), o = t.style || "", s = r ? "" : "none";
+function Ee(e, t, r) {
+  if (!r) return;
+  const n = R(r, e), o = t.style || "", s = n ? "" : "none";
   if (o) {
-    const i = o.split(";").filter(Boolean), l = i.findIndex(
-      (c) => c.trim().startsWith("display:")
+    const i = o.split(";").filter(Boolean), a = i.findIndex(
+      (l) => l.trim().startsWith("display:")
     );
-    l >= 0 ? i[l] = `display: ${s}` : i.push(`display: ${s}`), t.style = i.join("; ");
+    a >= 0 ? i[a] = `display: ${s}` : i.push(`display: ${s}`), t.style = i.join("; ");
   } else
     t.style = `display: ${s}`;
 }
-function ge(e, t, n) {
-  if (!n) return;
-  const r = z(n, e);
+function Te(e, t, r) {
+  if (!r) return;
+  const n = R(r, e);
   let o = [];
-  typeof r == "string" ? o = [r] : Array.isArray(r) ? o = r.filter(Boolean) : typeof r == "object" && (o = Object.entries(r).filter(([, l]) => !!l).map(([l]) => l));
+  typeof n == "string" ? o = [n] : Array.isArray(n) ? o = n.filter(Boolean) : typeof n == "object" && (o = Object.entries(n).filter(([, a]) => !!a).map(([a]) => a));
   const s = t.class || "", i = s ? `${s} ${o.join(" ")}`.trim() : o.join(" ");
   i && (t.class = i);
 }
-function me(e, t, n) {
-  let r;
+function je(e, t, r) {
+  let n;
   if (typeof e == "string") {
-    if (!n) return;
-    r = z(n, e);
+    if (!r) return;
+    n = R(r, e);
   } else
-    r = e;
+    n = e;
   let o = "";
-  if (typeof r == "string")
-    o = r;
-  else if (r && typeof r == "object") {
+  if (typeof n == "string")
+    o = n;
+  else if (n && typeof n == "object") {
     const i = [];
-    for (const [l, c] of Object.entries(r))
-      if (c != null && c !== "") {
-        const d = l.replace(
+    for (const [a, l] of Object.entries(n))
+      if (l != null && l !== "") {
+        const f = a.replace(
           /[A-Z]/g,
-          (f) => `-${f.toLowerCase()}`
+          (u) => `-${u.toLowerCase()}`
         ), p = [
           "width",
           "height",
@@ -594,336 +448,334 @@ function me(e, t, n) {
           "min-height",
           "max-height"
         ];
-        let u = String(c);
-        typeof c == "number" && p.includes(d) && (u = `${c}px`), i.push(`${d}: ${u}`);
+        let d = String(l);
+        typeof l == "number" && p.includes(f) && (d = `${l}px`), i.push(`${f}: ${d}`);
       }
     o = i.join("; ") + (i.length > 0 ? ";" : "");
   }
   const s = t.style || "";
   t.style = s + (s && !s.endsWith(";") ? "; " : "") + o;
 }
-function ie(e, t, n, r) {
-  const o = {}, s = { ...r || {} }, i = {};
-  for (const [l, c] of Object.entries(e)) {
-    const { value: d, modifiers: p } = c;
-    switch (l) {
+function pe(e, t, r, n) {
+  const o = {}, s = { ...n || {} }, i = {};
+  for (const [a, l] of Object.entries(e)) {
+    const { value: f, modifiers: p } = l;
+    switch (a) {
       case "model":
-        de(
-          typeof d == "string" ? d : String(d),
+        _e(
+          typeof f == "string" ? f : String(f),
           p,
           o,
           s,
           i,
           t,
-          n
+          r
         );
         break;
       case "bind":
-        pe(d, o, s, t);
+        Ae(f, o, s, t);
         break;
       case "show":
-        he(d, s, t);
+        Ee(f, s, t);
         break;
       case "class":
-        ge(d, s, t);
+        Te(f, s, t);
         break;
       case "style":
-        me(d, s, t);
+        je(f, s, t);
         break;
     }
   }
   return { props: o, attrs: s, listeners: i };
 }
-function Z(e, t) {
+function re(e, t) {
   if (Array.isArray(e)) {
     const s = /* @__PURE__ */ new Set();
     return e.map((i) => {
       if (!i || typeof i != "object") return i;
-      let l = i.props?.key ?? i.key;
-      if (!l) {
-        const u = i.tag || "node", f = i.props?.attrs?.id ?? i.props?.attrs?.name ?? i.props?.attrs?.["data-key"] ?? "";
-        l = f ? `${t}:${u}:${f}` : `${t}:${u}`;
+      let a = i.props?.key ?? i.key;
+      if (!a) {
+        const d = i.tag || "node", u = i.props?.attrs?.id ?? i.props?.attrs?.name ?? i.props?.attrs?.["data-key"] ?? "";
+        a = u ? `${t}:${d}:${u}` : `${t}:${d}`;
       }
-      let c = l, d = 1;
-      for (; s.has(c); )
-        c = `${l}#${d++}`;
-      s.add(c);
+      let l = a, f = 1;
+      for (; s.has(l); )
+        l = `${a}#${f++}`;
+      s.add(l);
       let p = i.children;
-      return Array.isArray(p) && (p = Z(p, c)), { ...i, key: c, children: p };
+      return Array.isArray(p) && (p = re(p, l)), { ...i, key: l, children: p };
     });
   }
-  const n = e;
-  let r = n.props?.key ?? n.key ?? t, o = n.children;
-  return Array.isArray(o) && (o = Z(o, r)), { ...n, key: r, children: o };
+  const r = e;
+  let n = r.props?.key ?? r.key ?? t, o = r.children;
+  return Array.isArray(o) && (o = re(o, n)), { ...r, key: n, children: o };
 }
-function ye(e, t, n, r) {
-  const o = n.directives ?? {}, s = ie(
+function Le(e, t, r, n) {
+  const o = r.directives ?? {}, s = pe(
     o,
-    r,
+    n,
     e,
-    n.attrs
+    r.attrs
   ), i = {
     ...t.props,
-    ...n.props,
+    ...r.props,
     ...s.props
-  }, l = {
+  }, a = {
     ...t.attrs,
-    ...n.attrs,
+    ...r.attrs,
     ...s.attrs
-  }, c = t.props ?? {}, d = i;
-  for (const f in { ...c, ...d }) {
-    const m = c[f], h = d[f];
-    m !== h && (f === "value" && (e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement || e instanceof HTMLSelectElement) ? e.value !== h && (e.value = h ?? "") : f === "checked" && e instanceof HTMLInputElement ? e.checked = !!h : f.startsWith("on") && typeof h == "function" ? (typeof m == "function" && e.removeEventListener(f.slice(2).toLowerCase(), m), e.addEventListener(f.slice(2).toLowerCase(), h)) : h == null || h === !1 ? e.removeAttribute(f) : e.setAttribute(f, String(h)));
+  }, l = t.props ?? {}, f = i;
+  for (const u in { ...l, ...f }) {
+    const m = l[u], h = f[u];
+    m !== h && (u === "value" && (e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement || e instanceof HTMLSelectElement) ? e.value !== h && (e.value = h ?? "") : u === "checked" && e instanceof HTMLInputElement ? e.checked = !!h : u.startsWith("on") && typeof h == "function" ? (typeof m == "function" && e.removeEventListener(u.slice(2).toLowerCase(), m), e.addEventListener(u.slice(2).toLowerCase(), h)) : h == null || h === !1 ? e.removeAttribute(u) : e.setAttribute(u, String(h)));
   }
-  for (const [f, m] of Object.entries(
+  for (const [u, m] of Object.entries(
     s.listeners || {}
   ))
-    e.addEventListener(f, m);
-  const p = t.attrs ?? {}, u = l;
-  for (const f in { ...p, ...u }) {
-    const m = p[f], h = u[f];
-    m !== h && (h == null || h === !1 ? e.removeAttribute(f) : e.setAttribute(f, String(h)));
+    e.addEventListener(u, m);
+  const p = t.attrs ?? {}, d = a;
+  for (const u in { ...p, ...d }) {
+    const m = p[u], h = d[u];
+    m !== h && (h == null || h === !1 ? e.removeAttribute(u) : e.setAttribute(u, String(h)));
   }
 }
-function T(e, t, n) {
+function T(e, t, r) {
   if (typeof e == "string")
     return document.createTextNode(e);
   if (e.tag === "#text") {
-    const u = document.createTextNode(
+    const d = document.createTextNode(
       typeof e.children == "string" ? e.children : ""
     );
-    return e.key != null && (u.key = e.key), u;
+    return e.key != null && (d.key = e.key), d;
   }
   if (e.tag === "#anchor") {
-    const u = e, f = Array.isArray(u.children) ? u.children : [], m = document.createTextNode(""), h = document.createTextNode("");
-    u.key != null && (m.key = `${u.key}:start`, h.key = `${u.key}:end`), u._startNode = m, u._endNode = h;
-    const S = document.createDocumentFragment();
-    S.appendChild(m);
-    for (const y of f)
-      S.appendChild(T(y, t));
-    return S.appendChild(h), S;
-  }
-  const r = document.createElement(e.tag);
-  e.key != null && (r.key = e.key);
-  const { props: o = {}, attrs: s = {}, directives: i = {} } = e.props ?? {}, l = ie(i, t, r, s), c = {
+    const d = e, u = Array.isArray(d.children) ? d.children : [], m = document.createTextNode(""), h = document.createTextNode("");
+    d.key != null && (m.key = `${d.key}:start`, h.key = `${d.key}:end`), d._startNode = m, d._endNode = h;
+    const C = document.createDocumentFragment();
+    C.appendChild(m);
+    for (const y of u)
+      C.appendChild(T(y, t));
+    return C.appendChild(h), C;
+  }
+  const n = document.createElement(e.tag);
+  e.key != null && (n.key = e.key);
+  const { props: o = {}, attrs: s = {}, directives: i = {} } = e.props ?? {}, a = pe(i, t, n, s), l = {
     ...o,
-    ...l.props
-  }, d = {
+    ...a.props
+  }, f = {
     ...s,
-    ...l.attrs
+    ...a.attrs
   };
-  for (const u in d) {
-    const f = d[u];
-    typeof f == "boolean" ? f && r.setAttribute(u, "") : f != null && r.setAttribute(u, String(f));
-  }
-  for (const u in c) {
-    const f = c[u];
-    if (u === "value" && (r instanceof HTMLInputElement || r instanceof HTMLTextAreaElement || r instanceof HTMLSelectElement))
-      r.value = f ?? "";
-    else if (u === "checked" && r instanceof HTMLInputElement)
-      r.checked = !!f;
-    else if (u.startsWith("on") && typeof f == "function")
-      r.addEventListener(u.slice(2).toLowerCase(), f);
+  for (const d in f) {
+    const u = f[d];
+    typeof u == "boolean" ? u && n.setAttribute(d, "") : u != null && n.setAttribute(d, String(u));
+  }
+  for (const d in l) {
+    const u = l[d];
+    if (d === "value" && (n instanceof HTMLInputElement || n instanceof HTMLTextAreaElement || n instanceof HTMLSelectElement))
+      n.value = u ?? "";
+    else if (d === "checked" && n instanceof HTMLInputElement)
+      n.checked = !!u;
+    else if (d.startsWith("on") && typeof u == "function")
+      n.addEventListener(d.slice(2).toLowerCase(), u);
     else {
-      if (u.startsWith("on") && f === void 0)
+      if (d.startsWith("on") && u === void 0)
         continue;
-      f == null || f === !1 ? r.removeAttribute(u) : r.setAttribute(u, String(f));
+      u == null || u === !1 ? n.removeAttribute(d) : n.setAttribute(d, String(u));
     }
   }
-  for (const [u, f] of Object.entries(
-    l.listeners || {}
+  for (const [d, u] of Object.entries(
+    a.listeners || {}
   ))
-    r.addEventListener(u, f);
+    n.addEventListener(d, u);
   const p = e.props?.ref ?? (e.props?.props && e.props.props.ref);
-  if (typeof e != "string" && p && n && (n[p] = r), Array.isArray(e.children))
-    for (const u of e.children)
-      r.appendChild(T(u, t, n));
-  else typeof e.children == "string" && (r.textContent = e.children);
-  return r;
+  if (typeof e != "string" && p && r && (r[p] = n), Array.isArray(e.children))
+    for (const d of e.children)
+      n.appendChild(T(d, t, r));
+  else typeof e.children == "string" && (n.textContent = e.children);
+  return n;
 }
-function be(e, t, n, r, o) {
-  if (typeof n == "string") {
-    e.textContent !== n && (e.textContent = n);
+function Be(e, t, r, n, o) {
+  if (typeof r == "string") {
+    e.textContent !== r && (e.textContent = r);
     return;
   }
-  if (!Array.isArray(n)) return;
-  const s = Array.from(e.childNodes), i = Array.isArray(t) ? t : [], l = /* @__PURE__ */ new Map();
+  if (!Array.isArray(r)) return;
+  const s = Array.from(e.childNodes), i = Array.isArray(t) ? t : [], a = /* @__PURE__ */ new Map();
   for (const m of i)
-    m && m.key != null && l.set(m.key, m);
-  const c = /* @__PURE__ */ new Map();
+    m && m.key != null && a.set(m.key, m);
+  const l = /* @__PURE__ */ new Map();
   for (const m of s) {
     const h = m.key;
-    h != null && c.set(h, m);
+    h != null && l.set(h, m);
   }
-  const d = /* @__PURE__ */ new Set();
+  const f = /* @__PURE__ */ new Set();
   let p = e.firstChild;
-  function u(m, h) {
-    let S = m;
-    for (; S && (d.add(S), S !== h); )
-      S = S.nextSibling;
+  function d(m, h) {
+    let C = m;
+    for (; C && (f.add(C), C !== h); )
+      C = C.nextSibling;
   }
-  function f(m, h, S, y) {
-    const a = [];
+  function u(m, h, C, y) {
+    const c = [];
     let b = m.nextSibling;
     for (; b && b !== h; )
-      a.push(b), b = b.nextSibling;
-    const g = Array.isArray(S) ? S : [];
+      c.push(b), b = b.nextSibling;
+    const g = Array.isArray(C) ? C : [];
     if (y.some((w) => w && w.key != null) || g.some((w) => w && w.key != null)) {
       const w = /* @__PURE__ */ new Map(), k = /* @__PURE__ */ new Map();
-      for (const v of g)
-        v && v.key != null && w.set(v.key, v);
-      for (const v of a) {
-        const _ = v.key;
-        _ != null && k.set(_, v);
+      for (const x of g)
+        x && x.key != null && w.set(x.key, x);
+      for (const x of c) {
+        const $ = x.key;
+        $ != null && k.set($, x);
       }
-      const $ = /* @__PURE__ */ new Set();
-      let C = m.nextSibling;
-      for (const v of y) {
-        let _;
-        if (v.key != null && k.has(v.key)) {
-          const A = w.get(v.key);
-          _ = D(
-            k.get(v.key),
+      const S = /* @__PURE__ */ new Set();
+      let _ = m.nextSibling;
+      for (const x of y) {
+        let $;
+        if (x.key != null && k.has(x.key)) {
+          const A = w.get(x.key);
+          $ = K(
+            k.get(x.key),
             A,
-            v,
-            r
-          ), $.add(_), _ !== C && e.contains(_) && e.insertBefore(_, C);
+            x,
+            n
+          ), S.add($), $ !== _ && e.contains($) && e.insertBefore($, _);
         } else
-          _ = T(v, r), e.insertBefore(_, C), $.add(_);
-        C = _.nextSibling;
+          $ = T(x, n), e.insertBefore($, _), S.add($);
+        _ = $.nextSibling;
       }
-      for (const v of a)
-        !$.has(v) && e.contains(v) && e.removeChild(v);
+      for (const x of c)
+        !S.has(x) && e.contains(x) && e.removeChild(x);
     } else {
       const w = Math.min(
         g.length,
         y.length
       );
       for (let k = 0; k < w; k++) {
-        const $ = g[k], C = y[k], v = D(a[k], $, C, r);
-        v !== a[k] && (e.insertBefore(v, a[k]), e.removeChild(a[k]));
+        const S = g[k], _ = y[k], x = K(c[k], S, _, n);
+        x !== c[k] && (e.insertBefore(x, c[k]), e.removeChild(c[k]));
       }
       for (let k = w; k < y.length; k++)
-        e.insertBefore(T(y[k], r), h);
-      for (let k = w; k < a.length; k++)
-        e.removeChild(a[k]);
+        e.insertBefore(T(y[k], n), h);
+      for (let k = w; k < c.length; k++)
+        e.removeChild(c[k]);
     }
   }
-  for (const m of n) {
+  for (const m of r) {
     let h;
     if (m.tag === "#anchor") {
-      const S = m.key, y = `${S}:start`, a = `${S}:end`;
-      let b = c.get(y), g = c.get(a);
-      const x = Array.isArray(m.children) ? m.children : [];
-      if (b || (b = document.createTextNode(""), b.key = y), g || (g = document.createTextNode(""), g.key = a), m._startNode = b, m._endNode = g, !e.contains(b) || !e.contains(g)) {
+      const C = m.key, y = `${C}:start`, c = `${C}:end`;
+      let b = l.get(y), g = l.get(c);
+      const v = Array.isArray(m.children) ? m.children : [];
+      if (b || (b = document.createTextNode(""), b.key = y), g || (g = document.createTextNode(""), g.key = c), m._startNode = b, m._endNode = g, !e.contains(b) || !e.contains(g)) {
         e.insertBefore(b, p);
-        for (const w of x)
-          e.insertBefore(T(w, r), p);
+        for (const w of v)
+          e.insertBefore(T(w, n), p);
         e.insertBefore(g, p);
       } else
-        f(
+        u(
           b,
           g,
-          l.get(S)?.children,
-          x
+          a.get(C)?.children,
+          v
         );
-      u(b, g), p = g.nextSibling;
+      d(b, g), p = g.nextSibling;
       continue;
     }
-    if (m.key != null && c.has(m.key)) {
-      const S = l.get(m.key);
-      h = D(
-        c.get(m.key),
-        S,
+    if (m.key != null && l.has(m.key)) {
+      const C = a.get(m.key);
+      h = K(
+        l.get(m.key),
+        C,
         m,
-        r,
+        n,
         o
-      ), d.add(h), h !== p && e.contains(h) && (p && !e.contains(p) && (p = null), e.insertBefore(h, p));
+      ), f.add(h), h !== p && e.contains(h) && (p && !e.contains(p) && (p = null), e.insertBefore(h, p));
     } else
-      h = T(m, r, o), p && !e.contains(p) && (p = null), e.insertBefore(h, p), d.add(h);
+      h = T(m, n, o), p && !e.contains(p) && (p = null), e.insertBefore(h, p), f.add(h);
     p = h.nextSibling;
   }
   for (const m of s)
-    if (!d.has(m) && e.contains(m)) {
-      if (m instanceof HTMLElement && o)
-        for (const h in o)
-          o[h] === m && delete o[h];
-      e.removeChild(m);
-    }
+    !f.has(m) && e.contains(m) && (z(m, o), e.removeChild(m));
 }
-function D(e, t, n, r, o) {
-  if (t && typeof t != "string" && t.props?.ref && o && delete o[t.props.ref], t === n) return e;
-  if (typeof n == "string") {
+function K(e, t, r, n, o) {
+  if (t && typeof t != "string" && t.props?.ref && o && z(e, o), t === r) return e;
+  if (typeof r == "string") {
     if (e.nodeType === Node.TEXT_NODE)
-      return e.textContent !== n && (e.textContent = n), e;
+      return e.textContent !== r && (e.textContent = r), e;
     {
-      const i = document.createTextNode(n);
+      const i = document.createTextNode(r);
       return e.parentNode?.replaceChild(i, e), i;
     }
   }
-  if (n && typeof n != "string" && n.tag === "#anchor") {
-    const i = n, l = Array.isArray(i.children) ? i.children : [], c = i._startNode ?? document.createTextNode(""), d = i._endNode ?? document.createTextNode("");
-    i.key != null && (c.key = `${i.key}:start`, d.key = `${i.key}:end`), i._startNode = c, i._endNode = d;
+  if (r && typeof r != "string" && r.tag === "#anchor") {
+    const i = r, a = Array.isArray(i.children) ? i.children : [], l = i._startNode ?? document.createTextNode(""), f = i._endNode ?? document.createTextNode("");
+    i.key != null && (l.key = `${i.key}:start`, f.key = `${i.key}:end`), i._startNode = l, i._endNode = f;
     const p = document.createDocumentFragment();
-    p.appendChild(c);
-    for (const u of l)
-      p.appendChild(T(u, r));
-    return p.appendChild(d), e.parentNode?.replaceChild(p, e), c;
+    p.appendChild(l);
+    for (const d of a)
+      p.appendChild(T(d, n));
+    return p.appendChild(f), e.parentNode?.replaceChild(p, e), l;
   }
-  if (!n) {
+  if (!r) {
+    z(e, o);
     const i = document.createComment("removed");
     return e.parentNode?.replaceChild(i, e), i;
   }
   if (!t || typeof t == "string") {
-    const i = T(n, r, o);
-    return typeof n != "string" && n.props?.ref && o && (o[n.props.ref] = i), e.parentNode?.replaceChild(i, e), i;
-  }
-  if (n.tag === "#anchor") {
-    const i = Array.isArray(n.children) ? n.children : [], l = n._startNode ?? document.createTextNode(""), c = n._endNode ?? document.createTextNode("");
-    n.key != null && (l.key = `${n.key}:start`, c.key = `${n.key}:end`), n._startNode = l, n._endNode = c;
-    const d = document.createDocumentFragment();
-    d.appendChild(l);
+    z(e, o);
+    const i = T(r, n, o);
+    return typeof r != "string" && r.props?.ref && o && (o[r.props.ref] = i), e.parentNode?.replaceChild(i, e), i;
+  }
+  if (r.tag === "#anchor") {
+    const i = Array.isArray(r.children) ? r.children : [], a = r._startNode ?? document.createTextNode(""), l = r._endNode ?? document.createTextNode("");
+    r.key != null && (a.key = `${r.key}:start`, l.key = `${r.key}:end`), r._startNode = a, r._endNode = l;
+    const f = document.createDocumentFragment();
+    f.appendChild(a);
     for (const p of i)
-      d.appendChild(T(p, r));
-    return d.appendChild(c), e.parentNode?.replaceChild(d, e), l;
+      f.appendChild(T(p, n));
+    return f.appendChild(l), e.parentNode?.replaceChild(f, e), a;
   }
-  if (typeof t != "string" && typeof n != "string" && t.tag === n.tag && t.key === n.key) {
+  if (typeof t != "string" && typeof r != "string" && t.tag === r.tag && t.key === r.key) {
     const i = e;
-    return ye(i, t.props || {}, n.props || {}, r), be(i, t.children, n.children, r, o), typeof n != "string" && n.props?.ref && o && (o[n.props.ref] = i), i;
+    return Le(i, t.props || {}, r.props || {}, n), Be(i, t.children, r.children, n, o), typeof r != "string" && r.props?.ref && o && (o[r.props.ref] = i), i;
   }
-  const s = T(n, r, o);
-  return typeof n != "string" && n.props?.ref && o && (o[n.props.ref] = s), e.parentNode?.replaceChild(s, e), s;
+  z(e, o);
+  const s = T(r, n, o);
+  return typeof r != "string" && r.props?.ref && o && (o[r.props.ref] = s), e.parentNode?.replaceChild(s, e), s;
 }
-function xe(e, t, n, r) {
-  const o = (p) => p.key == null ? { ...p, key: "__root__" } : p;
-  let s = Array.isArray(t) ? { tag: "div", key: "__root__", children: t } : o(t);
-  s = Z(s, String(s.key ?? "root"));
-  const i = e._prevVNode ?? null, l = e._prevDom ?? e.firstChild ?? null;
-  let c;
-  i && l ? typeof i != "string" && typeof s != "string" && i.tag === s.tag && i.key === s.key ? c = D(l, i, s, n, r) : (c = T(s, n, r), e.replaceChild(c, l)) : (c = T(s, n, r), e.firstChild ? e.replaceChild(c, e.firstChild) : e.appendChild(c));
-  const d = [];
-  for (let p = 0; p < e.childNodes.length; p++) {
-    const u = e.childNodes[p];
-    if (u !== c && u.nodeName !== "STYLE") {
-      if (u instanceof HTMLElement && r)
-        for (const f in r)
-          r[f] === u && delete r[f];
-      d.push(u);
-    }
+function ze(e, t, r, n) {
+  let o;
+  Array.isArray(t) ? t.length === 1 ? (o = t[0], o && typeof o == "object" && o.key == null && (o = { ...o, key: "__root__" })) : o = { tag: "div", key: "__root__", children: t } : (o = t, o && typeof o == "object" && o.key == null && (o = { ...o, key: "__root__" })), o = re(o, String(o.key ?? "root"));
+  const s = e._prevVNode ?? null, i = e._prevDom ?? e.firstChild ?? null;
+  let a;
+  s && i ? typeof s != "string" && typeof o != "string" && s.tag === o.tag && s.key === o.key ? a = K(i, s, o, r, n) : (a = T(o, r, n), e.replaceChild(a, i)) : (a = T(o, r, n), e.firstChild ? e.replaceChild(a, e.firstChild) : e.appendChild(a));
+  const l = [];
+  for (let f = 0; f < e.childNodes.length; f++) {
+    const p = e.childNodes[f];
+    p !== a && p.nodeName !== "STYLE" && (z(p, n), l.push(p));
   }
-  d.forEach((p) => e.removeChild(p)), e._prevVNode = s, e._prevDom = c;
+  l.forEach((f) => e.removeChild(f)), e._prevVNode = o, e._prevDom = a;
+}
+function he(e, ...t) {
+  let r = "";
+  for (let n = 0; n < e.length; n++)
+    r += e[n], n < t.length && (r += t[n]);
+  return r;
 }
-function oe(e) {
+function ge(e) {
   return e.replace(/\/\*[\s\S]*?\*\//g, "").replace(/\s+/g, " ").replace(/\s*([{}:;,>+~])\s*/g, "$1").replace(/;}/g, "}").trim();
 }
-let H = null;
-function G() {
-  return H || (H = new CSSStyleSheet(), H.replaceSync(oe(we))), H;
+let q = null;
+function ae() {
+  return q || (q = new CSSStyleSheet(), q.replaceSync(ge(Me))), q;
 }
-function ve(e) {
+function Re(e) {
   return e.replace(/url\s*\(\s*['"]?javascript:[^)]*\)/gi, "").replace(/<script[\s\S]*?>[\s\S]*?<\/script>/gi, "").replace(/expression\s*\([^)]*\)/gi, "");
 }
-const we = `
+const Me = he`
   :host, *, ::before, ::after {
     all: isolate;
     box-sizing: border-box;
@@ -981,7 +833,7 @@ const we = `
   sup { top: -.5em }
   [disabled], [aria-disabled=true] { cursor: not-allowed }
   [hidden] { display: none }
-`, ke = {
+`, Ne = {
   gray: {
     50: "var(--color-gray-50, #f9fafb)",
     100: "var(--color-gray-100, #f3f4f6)",
@@ -1116,7 +968,7 @@ const we = `
   },
   white: { DEFAULT: "var(--color-white, #ffffff)" },
   black: { DEFAULT: "var(--color-black, #000000)" }
-}, F = {
+}, Q = {
   /* Display */
   block: "display:block;",
   inline: "display:inline;",
@@ -1290,7 +1142,7 @@ const we = `
   "transition-colors": "transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;",
   "transition-opacity": "transition-property:opacity;",
   "transition-transform": "transition-property:transform;"
-}, _e = "var(--spacing, 0.25rem)", ee = {
+}, Pe = "var(--spacing, 0.25rem)", le = {
   m: ["margin"],
   mx: ["margin-inline"],
   my: ["margin-block"],
@@ -1321,7 +1173,7 @@ const we = `
   gap: ["gap"],
   "gap-x": ["column-gap"],
   "gap-y": ["row-gap"]
-}, $e = {
+}, Oe = {
   // State variants
   before: (e, t) => `${e}::before{${t}}`,
   after: (e, t) => `${e}::after{${t}}`,
@@ -1347,7 +1199,7 @@ const we = `
   "peer-focus": (e, t) => `.peer:focus ~ ${e}{${t}}`,
   "peer-checked": (e, t) => `.peer:checked ~ ${e}{${t}}`,
   "peer-disabled": (e, t) => `.peer:disabled ~ ${e}{${t}}`
-}, te = {
+}, ce = {
   // Responsive
   sm: "(min-width:640px)",
   md: "(min-width:768px)",
@@ -1356,23 +1208,23 @@ const we = `
   "2xl": "(min-width:1536px)",
   // Dark mode (now plain string)
   dark: "(prefers-color-scheme: dark)"
-}, V = ["sm", "md", "lg", "xl", "2xl"];
-function U(e) {
-  const t = e.startsWith("-"), r = (t ? e.slice(1) : e).split("-");
-  if (r.length < 2) return null;
-  const o = r.slice(0, -1).join("-"), s = r[r.length - 1], i = parseFloat(s);
-  if (Number.isNaN(i) || !ee[o]) return null;
-  const l = t ? "-" : "";
-  return ee[o].map((c) => `${c}:calc(${l}${_e} * ${i});`).join("");
+}, Z = ["sm", "md", "lg", "xl", "2xl"];
+function X(e) {
+  const t = e.startsWith("-"), n = (t ? e.slice(1) : e).split("-");
+  if (n.length < 2) return null;
+  const o = n.slice(0, -1).join("-"), s = n[n.length - 1], i = parseFloat(s);
+  if (Number.isNaN(i) || !le[o]) return null;
+  const a = t ? "-" : "";
+  return le[o].map((l) => `${l}:calc(${a}${Pe} * ${i});`).join("");
 }
-function re(e) {
-  const t = e.replace("#", ""), n = parseInt(t, 16), r = n >> 16 & 255, o = n >> 8 & 255, s = n & 255;
-  return `${r} ${o} ${s}`;
+function fe(e) {
+  const t = e.replace("#", ""), r = parseInt(t, 16), n = r >> 16 & 255, o = r >> 8 & 255, s = r & 255;
+  return `${n} ${o} ${s}`;
 }
-function Se(e) {
+function We(e) {
   const t = /^(bg|text|border|shadow|outline|caret|accent)-([a-z]+)-?(\d{2,3}|DEFAULT)?$/.exec(e);
   if (!t) return null;
-  const [, n, r, o = "DEFAULT"] = t, s = ke[r]?.[o];
+  const [, r, n, o = "DEFAULT"] = t, s = Ne[n]?.[o];
   return s ? `${{
     bg: "background-color",
     text: "color",
@@ -1381,40 +1233,40 @@ function Se(e) {
     outline: "outline-color",
     caret: "caret-color",
     accent: "accent-color"
-  }[n]}:${s};` : null;
+  }[r]}:${s};` : null;
 }
-function Ce(e) {
-  const [t, n] = e.split("/");
-  if (!n) return { base: t };
-  const r = parseInt(n, 10);
-  return isNaN(r) || r < 0 || r > 100 ? { base: t } : { base: t, opacity: r / 100 };
+function De(e) {
+  const [t, r] = e.split("/");
+  if (!r) return { base: t };
+  const n = parseInt(r, 10);
+  return isNaN(n) || n < 0 || n > 100 ? { base: t } : { base: t, opacity: n / 100 };
 }
-function q(e) {
-  const { base: t, opacity: n } = Ce(e), r = Se(t);
-  if (r) {
-    if (n !== void 0) {
-      const s = /#([0-9a-f]{6})/i.exec(r);
+function Y(e) {
+  const { base: t, opacity: r } = De(e), n = We(t);
+  if (n) {
+    if (r !== void 0) {
+      const s = /#([0-9a-f]{6})/i.exec(n);
       if (s) {
-        const i = re(s[0]);
-        return r.replace(/#([0-9a-f]{6})/i, `rgb(${i} / ${n})`);
+        const i = fe(s[0]);
+        return n.replace(/#([0-9a-f]{6})/i, `rgb(${i} / ${r})`);
       }
     }
-    return r;
+    return n;
   }
-  const o = W(t);
-  if (o && n !== void 0) {
+  const o = V(t);
+  if (o && r !== void 0) {
     const s = /#([0-9a-f]{6})/i.exec(o);
     if (s) {
-      const i = re(s[0]);
-      return o.replace(/#([0-9a-f]{6})/i, `rgb(${i} / ${n})`);
+      const i = fe(s[0]);
+      return o.replace(/#([0-9a-f]{6})/i, `rgb(${i} / ${r})`);
     }
   }
   return o;
 }
-function W(e) {
-  const t = e.indexOf("-["), n = e.endsWith("]");
-  if (t > 0 && n) {
-    const r = e.slice(0, t);
+function V(e) {
+  const t = e.indexOf("-["), r = e.endsWith("]");
+  if (t > 0 && r) {
+    const n = e.slice(0, t);
     let o = e.slice(t + 2, -1);
     o = o.replace(/_/g, " ");
     const i = {
@@ -1456,108 +1308,145 @@ function W(e) {
       weight: "font-weight",
       leading: "line-height",
       z: "z-index"
-    }[r] ?? r.replace(/_/g, "-");
+    }[n] ?? n.replace(/_/g, "-");
     if (i && o) return `${i}:${o};`;
   }
   return null;
 }
-function Ae(e) {
+function He(e) {
   return e.replace(/([!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~])/g, "\\$1");
 }
-function Ee(e) {
-  const t = /class\s*=\s*["']([^"']+)["']/g, n = [];
-  let r;
-  for (; r = t.exec(e); ) {
+function Ie(e) {
+  const t = /class\s*=\s*["']([^"']+)["']/g, r = [];
+  let n;
+  for (; n = t.exec(e); ) {
     let o = "", s = !1;
-    for (const i of r[1])
-      i === "[" && (s = !0), i === "]" && (s = !1), i === " " && !s ? (o && n.push(o), o = "") : o += i;
-    o && n.push(o);
+    for (const i of n[1])
+      i === "[" && (s = !0), i === "]" && (s = !1), i === " " && !s ? (o && r.push(o), o = "") : o += i;
+    o && r.push(o);
   }
-  return n.filter(Boolean);
+  return r.filter(Boolean);
 }
-const ne = /* @__PURE__ */ new Map(), Te = 16;
-function je(e) {
-  const t = Date.now(), n = ne.get(e);
-  if (n && t - n.timestamp < Te) return n.css;
-  const r = Ee(e), o = new Set(r), s = [], i = [], l = [], c = [], d = {};
-  function p(h, S = !1) {
-    const y = (S ? "dark|" : "") + h;
-    if (y in d) return d[y];
-    const a = f(h, S);
-    return d[y] = a, a;
-  }
-  function u(h) {
-    const S = h.some((a) => V.includes(a)), y = h.includes("dark");
-    return h.length === 0 ? 1 : !S && !y ? 2 : S && !y ? 3 : 4;
-  }
-  function f(h, S = !1) {
-    const y = h.split(":"), a = y.find(
-      (_) => F[_] || U(_) || q(_) || W(_)
+const ue = /* @__PURE__ */ new Map(), qe = 16;
+function Fe(e) {
+  const t = Date.now(), r = ue.get(e);
+  if (r && t - r.timestamp < qe) return r.css;
+  const n = Ie(e), o = new Set(n), s = [], i = [], a = [], l = [], f = {};
+  function p(h, C = !1) {
+    const y = (C ? "dark|" : "") + h;
+    if (y in f) return f[y];
+    const c = u(h, C);
+    return f[y] = c, c;
+  }
+  function d(h) {
+    const C = h.some((c) => Z.includes(c)), y = h.includes("dark");
+    return h.length === 0 ? 1 : !C && !y ? 2 : C && !y ? 3 : 4;
+  }
+  function u(h, C = !1) {
+    const y = h.split(":"), c = y.find(
+      ($) => Q[$] || X($) || Y($) || V($)
     );
-    if (!a) return null;
-    const b = F[a] ?? U(a) ?? q(a) ?? W(a);
+    if (!c) return null;
+    const b = Q[c] ?? X(c) ?? Y(c) ?? V(c);
     if (!b) return null;
-    let g = `.${Ae(h)}`, x = b;
-    const w = y.indexOf(a);
+    let g = `.${He(h)}`, v = b;
+    const w = y.indexOf(c);
     let k = w >= 0 ? y.slice(0, w) : [];
-    S && (k = k.filter((_) => _ !== "dark"));
-    const $ = k.filter((_) => V.includes(_)), C = $.length ? $[$.length - 1] : null;
-    for (const _ of k) {
-      if (V.includes(_)) continue;
-      const A = $e[_];
-      typeof A == "function" && (g = A(g, x).replace(/\{.*$/, ""));
+    C && (k = k.filter(($) => $ !== "dark"));
+    const S = k.filter(($) => Z.includes($)), _ = S.length ? S[S.length - 1] : null;
+    for (const $ of k) {
+      if (Z.includes($)) continue;
+      const A = Oe[$];
+      typeof A == "function" && (g = A(g, v).replace(/\{.*$/, ""));
     }
-    let v = `${g}{${x}}`;
-    return S && C ? v = `@media (prefers-color-scheme: dark) and ${te[C]}{${v}}` : S ? v = `@media (prefers-color-scheme: dark){${v}}` : C && (v = `@media ${te[C]}{${v}}`), v;
+    let x = `${g}{${v}}`;
+    return C && _ ? x = `@media (prefers-color-scheme: dark) and ${ce[_]}{${x}}` : C ? x = `@media (prefers-color-scheme: dark){${x}}` : _ && (x = `@media ${ce[_]}{${x}}`), x;
   }
   for (const h of o) {
-    const S = h.split(":"), y = S.find(
-      (x) => F[x] || U(x) || q(x) || W(x)
+    const C = h.split(":"), y = C.find(
+      (v) => Q[v] || X(v) || Y(v) || V(v)
     );
     if (!y) continue;
-    const a = S.indexOf(y), b = a >= 0 ? S.slice(0, a) : [], g = u(b);
+    const c = C.indexOf(y), b = c >= 0 ? C.slice(0, c) : [], g = d(b);
     if (g === 4) {
-      const x = p(h, !0);
-      x && c.push(x);
+      const v = p(h, !0);
+      v && l.push(v);
     } else {
-      const x = p(h);
-      x && (g === 1 ? s.push(x) : g === 2 ? i.push(x) : g === 3 && l.push(x));
+      const v = p(h);
+      v && (g === 1 ? s.push(v) : g === 2 ? i.push(v) : g === 3 && a.push(v));
     }
   }
-  const m = [...s, ...i, ...l, ...c].join("");
-  return ne.set(e, { css: m, timestamp: t }), m;
+  const m = [...s, ...i, ...a, ...l].join("");
+  return ue.set(e, { css: m, timestamp: t }), m;
 }
-const Le = /* @__PURE__ */ new Map();
-function Q(e) {
-  return e.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
+function Ke(e, t, r, n, o, s, i, a) {
+  if (!e) return;
+  if (t.loadingTemplate && r.isLoading) {
+    M(e, t.loadingTemplate(r), r, n, o);
+    return;
+  }
+  if (t.errorTemplate && r.hasError) {
+    r.error instanceof Error && M(e, t.errorTemplate(r.error, r), r, n, o);
+    return;
+  }
+  const l = t.render(r);
+  if (l instanceof Promise) {
+    s(!0), l.then((f) => {
+      s(!1), i(null), M(e, f, r, n, o), a(e.innerHTML);
+    }).catch((f) => {
+      s(!1), i(f), t.errorTemplate && M(e, t.errorTemplate(f, r), r, n, o);
+    }), t.loadingTemplate && M(e, t.loadingTemplate(r), r, n, o);
+    return;
+  }
+  M(e, l, r, n, o), a(e.innerHTML);
 }
-function J(e) {
-  return typeof e == "string" ? e.replace(
-    /[&<>"']/g,
-    (t) => ({
-      "&": "&amp;",
-      "<": "&lt;",
-      ">": "&gt;",
-      '"': "&quot;",
-      "'": "&#39;"
-    })[t]
-  ) : e;
+function M(e, t, r, n, o) {
+  e && (ze(
+    e,
+    Array.isArray(t) ? t : [t],
+    r,
+    n
+  ), o(e.innerHTML));
 }
-function He(e, ...t) {
-  let n = "";
-  for (let r = 0; r < e.length; r++)
-    n += e[r], r < t.length && (n += t[r]);
-  return n;
+function Ve(e, t, r, n, o, s, i) {
+  if (s !== null && clearTimeout(s), Date.now() - t < 16) {
+    if (o(r + 1), r > 10) {
+      console.warn("Potential infinite render loop detected. Skipping render."), i(null);
+      return;
+    }
+  } else
+    o(0);
+  const l = setTimeout(() => {
+    n(Date.now()), e(), i(null);
+  }, 0);
+  i(l);
 }
-function Ie(e, t, n) {
-  let r = Q(e);
-  r.includes("-") || (r = `cer-${r}`);
+function Ue(e, t, r, n, o, s) {
+  if (!e) return;
+  const i = Fe(n);
+  if (!t.style && (!i || i.trim() === "")) {
+    s(null), e.adoptedStyleSheets = [ae()];
+    return;
+  }
+  let a = "";
+  t.style && (typeof t.style == "string" ? a = t.style : typeof t.style == "function" && (a = t.style(r)));
+  let l = Re(`${a}
+${i}
+`);
+  l = ge(l);
+  let f = o;
+  f || (f = new CSSStyleSheet()), (f.cssRules.length === 0 || f.toString() !== l) && f.replaceSync(l), e.adoptedStyleSheets = [ae(), f], s(f);
+}
+const Je = /* @__PURE__ */ new Map();
+function de(e, t, r) {
+  let n = ne(e);
+  n.includes("-") || (n = `cer-${n}`);
   let o;
-  typeof t == "function" ? o = { ...n, render: t } : o = t, typeof o.onError != "function" && (o.onError = (s, i) => {
-    console.error(`[${r}] Error:`, s, i);
-  }), Le.set(r, o), typeof window < "u" && !customElements.get(r) && customElements.define(r, ze(o));
+  typeof t == "function" ? o = { ...r, render: t } : o = t, typeof o.onError != "function" && (o.onError = (s, i) => {
+    console.error(`[${n}] Error:`, s, i);
+  }), Je.set(n, o), typeof window < "u" && !customElements.get(n) && customElements.define(n, Qe(o));
 }
-function ze(e) {
+function Qe(e) {
   if (!e.render)
     throw new Error(
       "Component must have a render function"
@@ -1577,6 +1466,24 @@ function ze(e) {
     _initializing = !0;
     _styleSheet = null;
     _lastHtmlStringForJitCSS = "";
+    /**
+     * Returns the last rendered HTML string for JIT CSS.
+     */
+    get lastHtmlStringForJitCSS() {
+      return this._lastHtmlStringForJitCSS;
+    }
+    /**
+     * Returns true if the component is currently loading.
+     */
+    get isLoading() {
+      return this._templateLoading;
+    }
+    /**
+     * Returns the last error thrown during rendering, or null if none.
+     */
+    get lastError() {
+      return this._templateError;
+    }
     _cfg;
     _lastRenderTime = 0;
     _renderCount = 0;
@@ -1590,30 +1497,35 @@ function ze(e) {
         writable: !1,
         enumerable: !1,
         configurable: !1
+      }), Object.defineProperty(t, "requestRender", {
+        value: () => this.requestRender(),
+        writable: !1,
+        enumerable: !1,
+        configurable: !1
       }), this.context = t, this._applyProps(e), Object.defineProperty(this.context, "emit", {
-        value: (n, r, o) => {
+        value: (r, n, o) => {
           this.dispatchEvent(
-            new CustomEvent(n, {
-              detail: r,
+            new CustomEvent(r, {
+              detail: n,
               bubbles: !0,
               composed: !0,
               ...o || {}
             })
           );
-          const s = `on${n.charAt(0).toUpperCase()}${n.slice(1)}`, i = typeof this[s] == "function" ? this[s] : void 0, l = typeof this.context[s] == "function" ? this.context[s] : void 0, c = typeof e[s] == "function" ? e[s] : void 0;
-          i && i(r, this.context), l && l !== i && l(r, this.context), c && c !== i && c !== l && c(r, this.context);
+          const s = `on${r.charAt(0).toUpperCase()}${r.slice(1)}`, i = typeof this[s] == "function" ? this[s] : void 0, a = typeof this.context[s] == "function" ? this.context[s] : void 0, l = typeof e[s] == "function" ? e[s] : void 0;
+          i && i(n, this.context), a && a !== i && a(n, this.context), l && l !== i && l !== a && l(n, this.context);
         },
         writable: !1,
         enumerable: !1,
         configurable: !1
-      }), Object.keys(e).forEach((n) => {
-        const r = e[n];
-        if (typeof r == "function" && !n.startsWith("on"))
-          this.context[n] = (...o) => r(...o, this.context);
-        else if (n.startsWith("on") && n.length > 2 && n[2] === n[2].toUpperCase()) {
-          const o = n.slice(2, 3).toLowerCase() + n.slice(3);
+      }), Object.keys(e).forEach((r) => {
+        const n = e[r];
+        if (typeof n == "function" && !r.startsWith("on"))
+          this.context[r] = (...o) => n(...o, this.context);
+        else if (r.startsWith("on") && r.length > 2 && r[2] === r[2].toUpperCase()) {
+          const o = r.slice(2, 3).toLowerCase() + r.slice(3);
           this.addEventListener(o, (s) => {
-            const i = typeof this[n] == "function" ? this[n] : this.context[n];
+            const i = typeof this[r] == "function" ? this[r] : this.context[r];
             typeof i == "function" && i(s.detail, this.context);
           });
         }
@@ -1621,34 +1533,61 @@ function ze(e) {
     }
     connectedCallback() {
       this._runLogicWithinErrorBoundary(e, () => {
-        e.onConnected && !this._mounted && (e.onConnected(this.context), this._mounted = !0);
+        $e(
+          e,
+          this.context,
+          this._mounted,
+          (t) => {
+            this._mounted = t;
+          }
+        );
       });
     }
     disconnectedCallback() {
       this._runLogicWithinErrorBoundary(e, () => {
-        e.onDisconnected && e.onDisconnected(this.context), this._listeners.forEach((t) => t()), this._listeners = [], this._watchers.clear(), this._templateLoading = !1, this._templateError = null, this._mounted = !1;
+        Ce(
+          e,
+          this.context,
+          this._listeners,
+          () => {
+            this._listeners = [];
+          },
+          () => {
+            this._watchers.clear();
+          },
+          (t) => {
+            this._templateLoading = t;
+          },
+          (t) => {
+            this._templateError = t;
+          },
+          (t) => {
+            this._mounted = t;
+          }
+        );
       });
     }
-    attributeChangedCallback(t, n, r) {
+    attributeChangedCallback(t, r, n) {
       this._runLogicWithinErrorBoundary(e, () => {
-        this._applyProps(e), e.onAttributeChanged && e.onAttributeChanged(
+        this._applyProps(e), Se(
+          e,
           t,
-          n,
           r,
+          n,
           this.context
         );
       });
     }
     static get observedAttributes() {
-      return e.props ? Object.keys(e.props).map(Q) : [];
+      return e.props ? Object.keys(e.props).map(ne) : [];
     }
     _applyComputed(t) {
       this._runLogicWithinErrorBoundary(e, () => {
-        t.computed && Object.entries(t.computed).forEach(([n, r]) => {
-          Object.defineProperty(this.context, n, {
+        t.computed && Object.entries(t.computed).forEach(([r, n]) => {
+          Object.defineProperty(this.context, r, {
             get: () => {
-              const o = r(this.context);
-              return J(o);
+              const o = n(this.context);
+              return ee(o);
             },
             enumerable: !0
           });
@@ -1658,90 +1597,69 @@ function ze(e) {
     // --- Render ---
     _render(t) {
       this._runLogicWithinErrorBoundary(t, () => {
-        if (!this.shadowRoot) return;
-        if (this._templateLoading && t.loadingTemplate) {
-          this._renderOutput(t.loadingTemplate(this.context));
-          return;
-        }
-        if (this._templateError && t.errorTemplate) {
-          this._renderOutput(t.errorTemplate(this._templateError, this.context));
-          return;
-        }
-        const n = t.render(this.context);
-        if (n instanceof Promise) {
-          this._templateLoading = !0, n.then((r) => (this._templateLoading = !1, this._templateError = null, this._renderOutput(r), r)).catch((r) => {
-            if (this._templateLoading = !1, this._templateError = r, t.errorTemplate) {
-              const o = t.errorTemplate(r, this.context);
-              return this._renderOutput(o), o;
-            }
-            throw r;
-          }), t.loadingTemplate && this._renderOutput(t.loadingTemplate(this.context));
-          return;
-        }
-        this._renderOutput(n), this._applyStyle(t);
+        Ke(
+          this.shadowRoot,
+          t,
+          this.context,
+          this._refs,
+          (r) => {
+            this._lastHtmlStringForJitCSS = r, typeof this.onHtmlStringUpdate == "function" && this.onHtmlStringUpdate(r);
+          },
+          (r) => {
+            this._templateLoading = r, typeof this.onLoadingStateChange == "function" && this.onLoadingStateChange(r);
+          },
+          (r) => {
+            this._templateError = r, typeof this.onErrorStateChange == "function" && this.onErrorStateChange(r);
+          },
+          (r) => this._applyStyle(t, r)
+        );
       });
     }
-    // --- Helper to render output ---
-    _renderOutput(t) {
-      if (!this.shadowRoot) return;
-      const n = new Proxy(this.context, {
-        get: (r, o) => o === "_requestRender" ? () => this._requestRender() : o === "context" ? r : typeof o == "string" && o.includes(".") ? o.split(".").reduce((s, i) => s?.[i], r) : r[o],
-        set: (r, o, s) => {
-          if (typeof o == "string" && o.includes(".")) {
-            const i = o.split("."), l = i.pop();
-            if (!l) return !1;
-            const c = i.reduce((d, p) => (p in d || (d[p] = {}), d[p]), r);
-            return c[l] = s, !0;
-          }
-          return r[o] = s, !0;
-        }
-      });
-      xe(
-        this.shadowRoot,
-        Array.isArray(t) ? t : [t],
-        n,
-        this._refs
-      ), this._lastHtmlStringForJitCSS = this.shadowRoot.innerHTML;
+    requestRender() {
+      this._requestRender();
     }
     _requestRender() {
-      if (this._renderTimeoutId !== null && clearTimeout(this._renderTimeoutId), Date.now() - this._lastRenderTime < 16) {
-        if (this._renderCount++, this._renderCount > 10) {
-          console.warn(
-            `[${this.tagName}] Potential infinite render loop detected. Skipping render.`
-          ), this._renderTimeoutId = null;
-          return;
-        }
-      } else
-        this._renderCount = 0;
-      this._renderTimeoutId = setTimeout(() => {
-        this._lastRenderTime = Date.now(), this._render(this._cfg), this._renderTimeoutId = null;
-      }, 0);
+      this._runLogicWithinErrorBoundary(this._cfg, () => {
+        Ve(
+          () => this._render(this._cfg),
+          this._lastRenderTime,
+          this._renderCount,
+          (t) => {
+            this._lastRenderTime = t;
+          },
+          (t) => {
+            this._renderCount = t;
+          },
+          this._renderTimeoutId,
+          (t) => {
+            this._renderTimeoutId = t;
+          }
+        );
+      });
     }
     // --- Style ---
-    _applyStyle(t) {
+    _applyStyle(t, r) {
       this._runLogicWithinErrorBoundary(t, () => {
-        if (!this.shadowRoot) return;
-        const n = je(this._lastHtmlStringForJitCSS);
-        if (!t.style && (!n || n.trim() === "")) {
-          this._styleSheet = null, this.shadowRoot.adoptedStyleSheets = [G()];
-          return;
-        }
-        let r = "";
-        t.style && (typeof t.style == "string" ? r = t.style : typeof t.style == "function" && (r = t.style(this.context)));
-        let o = ve(`${r}
-${n}
-`);
-        o = oe(o), this._styleSheet || (this._styleSheet = new CSSStyleSheet()), (this._styleSheet.cssRules.length === 0 || this._styleSheet.toString() !== o) && this._styleSheet.replaceSync(o), this.shadowRoot.adoptedStyleSheets = [G(), this._styleSheet];
+        Ue(
+          this.shadowRoot,
+          t,
+          this.context,
+          r,
+          this._styleSheet,
+          (n) => {
+            this._styleSheet = n;
+          }
+        );
       });
     }
     // --- Error Boundary function ---
-    _runLogicWithinErrorBoundary(t, n) {
+    _runLogicWithinErrorBoundary(t, r) {
       this._hasError && (this._hasError = !1);
       try {
-        n();
-      } catch (r) {
-        this._hasError = !0, t.onError && t.onError(r, this.context), t.errorFallback && this.shadowRoot && (this.shadowRoot.innerHTML = t.errorFallback(
-          r,
+        r();
+      } catch (n) {
+        this._hasError = !0, t.onError && t.onError(n, this.context), t.errorFallback && this.shadowRoot && (this.shadowRoot.innerHTML = t.errorFallback(
+          n,
           this.context
         ));
       }
@@ -1749,11 +1667,11 @@ ${n}
     // --- State, props, computed ---
     _initContext(t) {
       try {
-        let n = function(o, s = "") {
+        let r = function(o, s = "") {
           return Array.isArray(o) ? new Proxy(o, {
-            get(i, l, c) {
-              const d = Reflect.get(i, l, c);
-              return typeof d == "function" && typeof l == "string" && [
+            get(i, a, l) {
+              const f = Reflect.get(i, a, l);
+              return typeof f == "function" && typeof a == "string" && [
                 "push",
                 "pop",
                 "shift",
@@ -1761,132 +1679,477 @@ ${n}
                 "splice",
                 "sort",
                 "reverse"
-              ].includes(l) ? function(...u) {
-                const f = d.apply(i, u);
-                if (!r._initializing) {
+              ].includes(a) ? function(...d) {
+                const u = f.apply(i, d);
+                if (!n._initializing) {
                   const m = s || "root";
-                  r._triggerWatchers(m, i), r._render(t);
+                  n._triggerWatchers(m, i), n._render(t);
                 }
-                return f;
-              } : d;
+                return u;
+              } : f;
             },
-            set(i, l, c) {
-              if (i[l] = c, !r._initializing) {
-                const d = s ? `${s}.${String(l)}` : String(l);
-                r._triggerWatchers(d, c), r._render(t);
+            set(i, a, l) {
+              if (i[a] = l, !n._initializing) {
+                const f = s ? `${s}.${String(a)}` : String(a);
+                n._triggerWatchers(f, l), n._render(t);
               }
               return !0;
             },
-            deleteProperty(i, l) {
-              if (delete i[l], !r._initializing) {
-                const c = s ? `${s}.${String(l)}` : String(l);
-                r._triggerWatchers(c, void 0), r._render(t);
+            deleteProperty(i, a) {
+              if (delete i[a], !n._initializing) {
+                const l = s ? `${s}.${String(a)}` : String(a);
+                n._triggerWatchers(l, void 0), n._render(t);
               }
               return !0;
             }
           }) : o && typeof o == "object" ? (Object.keys(o).forEach((i) => {
-            const l = s ? `${s}.${i}` : i;
-            o[i] = n(o[i], l);
+            const a = s ? `${s}.${i}` : i;
+            o[i] = r(o[i], a);
           }), new Proxy(o, {
-            set(i, l, c) {
-              const d = s ? `${s}.${String(l)}` : String(l);
-              return i[l] = n(c, d), r._initializing || (r._triggerWatchers(
-                d,
-                i[l]
-              ), r._render(t)), !0;
+            set(i, a, l) {
+              const f = s ? `${s}.${String(a)}` : String(a);
+              return i[a] = r(l, f), n._initializing || (n._triggerWatchers(
+                f,
+                i[a]
+              ), n._render(t)), !0;
             },
-            get(i, l, c) {
-              return Reflect.get(i, l, c);
+            get(i, a, l) {
+              return Reflect.get(i, a, l);
             }
           })) : o;
         };
-        const r = this;
-        return n({ ...t.state });
+        const n = this;
+        return r({ ...t.state });
       } catch {
         return {};
       }
     }
     _initWatchers(t) {
-      if (t.watch)
-        for (const [n, r] of Object.entries(t.watch)) {
-          let o, s = {};
-          if (Array.isArray(r) ? (o = r[0], s = r[1] || {}) : o = r, this._watchers.set(n, {
-            callback: o,
-            options: s,
-            oldValue: this._getNestedValue(n)
-          }), s.immediate)
-            try {
-              const i = this._getNestedValue(n);
-              o(i, void 0, this.context);
-            } catch (i) {
-              console.error(`Error in immediate watcher for "${n}":`, i);
-            }
-        }
+      this._runLogicWithinErrorBoundary(t, () => {
+        xe(
+          this.context,
+          this._watchers,
+          t.watch || {}
+        );
+      });
     }
-    _getNestedValue(t) {
-      return t.split(".").reduce(
-        (n, r) => n?.[r],
-        this.context
-      );
+    _triggerWatchers(t, r) {
+      we(this.context, this._watchers, t, r);
     }
-    _triggerWatchers(t, n) {
-      const r = (s, i) => {
-        if (s === i) return !0;
-        if (typeof s != typeof i || typeof s != "object" || s === null || i === null) return !1;
-        if (Array.isArray(s) && Array.isArray(i))
-          return s.length !== i.length ? !1 : s.every((d, p) => r(d, i[p]));
-        const l = Object.keys(s), c = Object.keys(i);
-        return l.length !== c.length ? !1 : l.every((d) => r(s[d], i[d]));
-      }, o = this._watchers.get(t);
-      if (o && !r(n, o.oldValue))
+    _applyProps(t) {
+      this._runLogicWithinErrorBoundary(t, () => {
         try {
-          o.callback(n, o.oldValue, this.context), o.oldValue = n;
-        } catch (s) {
-          console.error(`Error in watcher for "${t}":`, s);
+          ke(this, t, this.context);
+        } catch (r) {
+          this._hasError = !0, t.onError && t.onError(r, this.context), t.errorFallback && this.shadowRoot && (this.shadowRoot.innerHTML = t.errorFallback(r, this.context));
         }
-      for (const [s, i] of this._watchers.entries())
-        if (i.options.deep && t.startsWith(s + "."))
-          try {
-            const l = this._getNestedValue(s);
-            r(l, i.oldValue) || (i.callback(l, i.oldValue, this.context), i.oldValue = l);
-          } catch (l) {
-            console.error(`Error in deep watcher for "${s}":`, l);
-          }
+      });
     }
-    _applyProps(t) {
-      try {
-        let n = function(r, o) {
-          return o === Boolean ? r === "true" : o === Number ? Number(r) : r;
-        };
-        if (!t.props) return;
-        Object.entries(t.props).forEach(([r, o]) => {
-          if (o.type === Function && typeof this[r] == "function")
-            this.context[r] = this[r];
-          else {
-            const s = this.getAttribute(Q(r));
-            s !== null ? this.context[r] = J(
-              n(s, o.type)
-            ) : "default" in o && o.default !== void 0 && (this.context[r] = J(o.default));
+  };
+}
+function F(e, t = {}, r, n) {
+  const o = n ?? t.key;
+  return { tag: e, key: o, props: t, children: r };
+}
+function U(e) {
+  return !!e && typeof e == "object" && (e.type === "AnchorBlock" || e.tag === "#anchor");
+}
+function N(e) {
+  return typeof e == "object" && e !== null && "tag" in e && !U(e);
+}
+function Ze(e, t) {
+  return e.key != null ? e : { ...e, key: t };
+}
+function Xe(e, t = [], r = {}) {
+  const n = {}, o = {}, s = {}, i = /([:@#]?)([a-zA-Z0-9-:\.]+)=("([^"\\]*(\\.[^"\\]*)*)"|'([^'\\]*(\\.[^'\\]*)*)')/g;
+  let a;
+  for (; a = i.exec(e); ) {
+    const l = a[1], f = a[2], p = (a[4] || a[6]) ?? "", d = p.match(/^{{(\d+)}}$/);
+    let u = d ? t[Number(d[1])] ?? null : p;
+    if (d || (u === "true" ? u = !0 : u === "false" ? u = !1 : u === "null" ? u = null : isNaN(Number(u)) || (u = Number(u))), l === ":")
+      typeof u == "boolean" ? o[f] = u : u != null && (n[f] = u);
+    else if (l === "@") {
+      const m = "on" + f.charAt(0).toUpperCase() + f.slice(1);
+      n[m] = typeof u == "function" ? u : typeof r[u] == "function" ? r[u] : void 0;
+    } else if (l === "#") {
+      const [m, ...h] = f.split("."), C = [...h];
+      let y = u, c = [...C];
+      if (m === "model" && typeof y == "string" && y.includes(".")) {
+        const b = ["trim", "number", "lazy"], g = y.split(".");
+        let v = y;
+        const w = [];
+        for (let k = g.length - 1; k > 0 && b.includes(g[k]); k--)
+          w.unshift(g[k]), v = g.slice(0, k).join(".");
+        y = v, c.push(...w);
+      }
+      s[m] = {
+        value: y,
+        modifiers: c
+      };
+    } else f === "ref" ? n.ref = u : o[f] = u;
+  }
+  return { props: n, attrs: o, directives: s };
+}
+function Ye(e, t, r) {
+  function n(c, b) {
+    return F("#text", {}, c, b);
+  }
+  let o = "";
+  for (let c = 0; c < e.length; c++)
+    o += e[c], c < t.length && (o += `{{${c}}}`);
+  const s = /<\/?([a-zA-Z0-9-]+)([^>]*)\/?>|{{(\d+)}}|([^<]+)/g, i = [];
+  let a = null, l, f = [], p = null, d = {}, u, m = 0, h = [];
+  function C(c) {
+    !c || typeof c != "object" || U(c) || (c.props || c.attrs ? (c.props && (d.props || (d.props = {}), Object.assign(d.props, c.props)), c.attrs && (d.attrs || (d.attrs = {}), Object.keys(c.attrs).forEach((b) => {
+      if (b === "style" && d.attrs.style) {
+        const g = d.attrs.style.replace(
+          /;?\s*$/,
+          ""
+        ), v = c.attrs.style.replace(/^;?\s*/, "");
+        d.attrs.style = g + "; " + v;
+      } else if (b === "class" && d.attrs.class) {
+        const g = d.attrs.class.trim().split(/\s+/).filter(Boolean), v = c.attrs.class.trim().split(/\s+/).filter(Boolean), w = [
+          .../* @__PURE__ */ new Set([...g, ...v])
+        ];
+        d.attrs.class = w.join(" ");
+      } else
+        d.attrs[b] = c.attrs[b];
+    }))) : (d.props || (d.props = {}), Object.assign(d.props, c)));
+  }
+  function y(c, b) {
+    const g = p ? f : h;
+    if (U(c)) {
+      const v = c.key ?? b;
+      let w = c.children;
+      g.push({
+        ...c,
+        key: v,
+        children: w
+      });
+      return;
+    }
+    if (N(c)) {
+      g.push(Ze(c, void 0));
+      return;
+    }
+    if (Array.isArray(c)) {
+      if (c.length === 0) return;
+      for (let v = 0; v < c.length; v++) {
+        const w = c[v];
+        U(w) || N(w) || Array.isArray(w) ? y(w, `${b}-${v}`) : w !== null && typeof w == "object" ? C(w) : g.push(n(String(w), `${b}-${v}`));
+      }
+      return;
+    }
+    if (c !== null && typeof c == "object") {
+      C(c);
+      return;
+    }
+    g.push(n(String(c), b));
+  }
+  for (; l = s.exec(o); )
+    if (l[1]) {
+      const c = l[1], b = l[0][1] === "/", g = l[0][l[0].length - 2] === "/", {
+        props: v,
+        attrs: w,
+        directives: k
+      } = Xe(l[2] || "", t, r), S = { props: {}, attrs: {} };
+      for (const x in v) S.props[x] = v[x];
+      for (const x in w) S.attrs[x] = w[x];
+      for (const [x, $] of Object.entries(k))
+        if (x === "bind")
+          if (typeof $.value == "object" && $.value !== null)
+            for (const [A, E] of Object.entries($.value))
+              typeof E == "boolean" ? S.attrs[A] = E : E != null && (S.attrs[A] = String(E));
+          else $.value != null && (S.attrs[x] = String($.value));
+        else if (x === "show") {
+          const A = !!$.value;
+          S.attrs.style = (S.attrs.style || "") + (A ? "" : "; display: none !important");
+        } else if (x === "class") {
+          const A = $.value;
+          let E = [];
+          if (typeof A == "string")
+            E = A.split(/\s+/).filter(Boolean);
+          else if (Array.isArray(A)) {
+            for (const j of A)
+              if (typeof j == "string")
+                E.push(...j.split(/\s+/).filter(Boolean));
+              else if (j && typeof j == "object")
+                for (const [L, I] of Object.entries(j))
+                  I && E.push(...L.split(/\s+/).filter(Boolean));
+          } else if (A && typeof A == "object")
+            for (const [j, L] of Object.entries(A))
+              L && E.push(...j.split(/\s+/).filter(Boolean));
+          const O = S.attrs.class || "", W = [
+            .../* @__PURE__ */ new Set([
+              ...O.split(/\s+/).filter(Boolean),
+              ...E
+            ])
+          ];
+          S.attrs.class = W.join(" ");
+        } else if (x === "style") {
+          const A = $.value;
+          let E = "";
+          if (typeof A == "string")
+            E = A;
+          else if (A && typeof A == "object") {
+            const W = [];
+            for (const [j, L] of Object.entries(A))
+              if (L != null && L !== "") {
+                const I = j.replace(
+                  /[A-Z]/g,
+                  (ye) => `-${ye.toLowerCase()}`
+                ), me = [
+                  "width",
+                  "height",
+                  "top",
+                  "right",
+                  "bottom",
+                  "left",
+                  "margin",
+                  "margin-top",
+                  "margin-right",
+                  "margin-bottom",
+                  "margin-left",
+                  "padding",
+                  "padding-top",
+                  "padding-right",
+                  "padding-bottom",
+                  "padding-left",
+                  "font-size",
+                  "line-height",
+                  "border-width",
+                  "border-radius",
+                  "min-width",
+                  "max-width",
+                  "min-height",
+                  "max-height"
+                ];
+                let oe = String(L);
+                typeof L == "number" && me.includes(I) && (oe = `${L}px`), W.push(`${I}: ${oe}`);
+              }
+            E = W.join("; ") + (W.length > 0 ? ";" : "");
           }
-        });
-      } catch (n) {
-        this._hasError = !0, t.onError && t.onError(n, this.context), t.errorFallback && this.shadowRoot && (this.shadowRoot.innerHTML = t.errorFallback(
-          n,
-          this.context
-        ));
+          const O = S.attrs.style || "";
+          S.attrs.style = O + (O && !O.endsWith(";") ? "; " : "") + E;
+        }
+      const _ = {};
+      for (const [x, $] of Object.entries(k))
+        ["bind", "show", "class", "style"].includes(x) || (_[x] = $);
+      if (Object.keys(_).length > 0 && (S.directives = _), b) {
+        const x = F(
+          p,
+          d,
+          f.length === 1 && N(f[0]) && f[0].tag === "#text" ? typeof f[0].children == "string" ? f[0].children : "" : f.length ? f : void 0,
+          u
+        ), $ = i.pop();
+        $ ? (p = $.tag, d = $.props, u = $.key, f = $.children, f.push(x)) : a = x;
+      } else g ? (p ? f : h).push(F(c, S, void 0, void 0)) : (p && i.push({
+        tag: p,
+        props: d,
+        children: f,
+        key: u
+      }), p = c, d = S, f = []);
+    } else if (typeof l[3] < "u") {
+      const c = Number(l[3]), b = t[c], g = `interp-${c}`;
+      y(b, g);
+    } else if (l[4]) {
+      const c = l[4], b = p ? f : h, g = c.split(/({{\d+}})/);
+      for (const v of g) {
+        if (!v) continue;
+        const w = v.match(/^{{(\d+)}}$/);
+        if (w) {
+          const k = Number(w[1]), S = t[k], _ = `interp-${k}`;
+          y(S, _);
+        } else {
+          const k = `text-${m++}`;
+          b.push(n(v, k));
+        }
       }
     }
+  if (a)
+    return N(a) && Array.isArray(a.children) && (a.children = a.children.filter(
+      (c) => N(c) ? c.tag !== "#text" || typeof c.children == "string" && c.children.trim() !== "" : !0
+      // keep non-element VNodes (including anchors) as-is
+    )), a;
+  if (h.length > 0) {
+    const c = h.filter(
+      (b) => N(b) ? b.tag !== "#text" || typeof b.children == "string" && b.children.trim() !== "" : !0
+    );
+    return c.length === 1 ? c[0] : c;
+  }
+  return F("div", {}, "", "fallback-root");
+}
+function B(e, ...t) {
+  const r = t[t.length - 1], n = typeof r == "object" && r && !Array.isArray(r) ? r : void 0;
+  return Ye(e, t, n);
+}
+const Ge = (e) => e ? typeof URLSearchParams > "u" ? {} : Object.fromEntries(new URLSearchParams(e)) : {}, D = (e, t) => {
+  for (const r of e) {
+    const n = [], o = r.path.replace(/:[^/]+/g, (a) => (n.push(a.slice(1)), "([^/]+)")), s = new RegExp(`^${o}$`), i = t.match(s);
+    if (i) {
+      const a = {};
+      return n.forEach((l, f) => {
+        a[l] = i[f + 1];
+      }), { route: r, params: a };
+    }
+  }
+  return { route: null, params: {} };
+}, G = {};
+async function et(e) {
+  if (e.component) return e.component;
+  if (e.load) {
+    if (G[e.path]) return G[e.path];
+    try {
+      const t = await e.load();
+      return G[e.path] = t.default, t.default;
+    } catch {
+      throw new Error(`Failed to load component for route: ${e.path}`);
+    }
+  }
+  throw new Error(`No component or loader defined for route: ${e.path}`);
+}
+function tt(e) {
+  const { routes: t, base: r = "" } = e;
+  let n, o, s, i, a, l, f;
+  if (typeof window < "u" && typeof document < "u") {
+    n = () => {
+      const d = new URL(window.location.href), u = d.pathname.replace(r, "") || "/", m = Ge(d.search);
+      return { path: u, query: m };
+    }, o = n();
+    const p = D(t, o.path);
+    s = ie({
+      path: o.path,
+      params: p.params,
+      query: o.query
+    }), i = () => {
+      const d = n(), u = D(t, d.path), m = s.getState();
+      m.path = d.path, m.params = u.params, m.query = d.query;
+    }, window.addEventListener("popstate", i), a = (d) => {
+      window.history.pushState({}, "", r + d), i();
+    }, l = (d) => {
+      window.history.replaceState({}, "", r + d), i();
+    }, f = () => window.history.back();
+  } else {
+    n = () => ({ path: "/", query: {} }), o = n();
+    const p = D(t, o.path);
+    s = ie({
+      path: o.path,
+      params: p.params,
+      query: o.query
+    }), i = () => {
+    }, a = () => {
+    }, l = () => {
+    }, f = () => {
+    };
+  }
+  return {
+    store: s,
+    push: a,
+    replace: l,
+    back: f,
+    subscribe: s.subscribe,
+    matchRoute: (p) => D(t, p),
+    getCurrent: () => s.getState(),
+    resolveRouteComponent: et
   };
 }
+function ct(e, t) {
+  return D(e, t);
+}
+function ft(e) {
+  const t = tt(e);
+  return de("router-view", {
+    async render() {
+      if (!t) return B`<div>Router not initialized.</div>`;
+      const r = t.getCurrent(), { path: n } = r, o = t.matchRoute(n);
+      if (!o.route) return B`<div>Not found</div>`;
+      let s = o.route.component;
+      if (o.route.load) {
+        const i = await o.route.load();
+        typeof i.default == "string" && (s = i.default);
+      }
+      return typeof s == "string" ? B`<${s}></${s}>` : B`<div>Invalid route component</div>`;
+    },
+    onConnected(r) {
+      t && typeof t.subscribe == "function" && t.subscribe(() => {
+        typeof r.requestRender == "function" && r.requestRender();
+      });
+    }
+  }), de("router-link", {
+    state: {},
+    props: {
+      to: { type: String, default: "" },
+      tag: { type: String, default: "a" },
+      replace: { type: Boolean, default: !1 },
+      exact: { type: Boolean, default: !1 },
+      activeClass: { type: String, default: "active" },
+      exactActiveClass: { type: String, default: "exact-active" },
+      ariaCurrentValue: { type: String, default: "page" },
+      disabled: { type: Boolean, default: !1 },
+      external: { type: Boolean, default: !1 },
+      style: { type: String, default: he`
+        [aria-disabled="true"] {
+          pointer-events: none;
+          opacity: 0.5;
+        }
+      ` }
+    },
+    style: (r) => r.props.style,
+    render: (r) => {
+      const n = t.getCurrent(), o = r.props.to, s = r.props.exact, i = r.props.exactActiveClass, a = r.props.activeClass, l = r.props.ariaCurrentValue, f = r.props.tag, p = r.props.disabled, d = r.props.external, u = n.path === o, m = s ? u : n && typeof n.path == "string" ? n.path.startsWith(o) : !1, h = u ? i : m ? a : "", C = u ? `aria-current="${l}"` : "", y = f === "button", c = p ? y ? 'disabled aria-disabled="true" tabindex="-1"' : 'aria-disabled="true" tabindex="-1"' : "", b = d && (f === "a" || !f) ? 'target="_blank" rel="noopener noreferrer"' : "";
+      return B`
+        ${be().when(y, B`
+            <button
+              part="button"
+              class="${h}"
+              ${C}
+              ${c}
+              ${b}
+              data-on-click="navigate"
+            ><slot></slot></button>
+          `).otherwise(B`
+            <a
+              part="link"
+              href="${o}"
+              class="${h}"
+              ${C}
+              ${c}
+              ${b}
+              data-on-click="navigate"
+            ><slot></slot></a>
+          `).done()}
+      `;
+    },
+    navigate: (r, n) => {
+      const { disabled: o, external: s, tag: i, replace: a, to: l } = n.props;
+      if (o) {
+        r.preventDefault();
+        return;
+      }
+      s && (i === "a" || !i) || (r.preventDefault(), a ? t.replace(l) : t.push(l));
+    }
+  }), t;
+}
 export {
-  Ie as component,
-  ze as createElementClass,
-  Re as createStore,
-  He as css,
-  Ne as each,
-  Be as eventBus,
-  Oe as html,
-  Pe as match,
-  Me as when
+  P as GlobalEventBus,
+  de as component,
+  ie as createStore,
+  he as css,
+  nt as each,
+  ot as emit,
+  H as eventBus,
+  B as html,
+  ft as initRouter,
+  lt as listen,
+  be as match,
+  D as matchRoute,
+  ct as matchRouteSSR,
+  st as off,
+  it as on,
+  at as once,
+  Ge as parseQuery,
+  et as resolveRouteComponent,
+  tt as useRouter,
+  rt as when
 };
 //# sourceMappingURL=custom-elements-runtime.es.js.map