@jasonshimmy/custom-elements-runtime 3.1.1 → 3.1.3

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

@@ -1,4 +1,4 @@
-import { a as g, d as q } from "./logger-BvkEbVM4.js";
+import { a as g, d as _ } from "./logger-BvkEbVM4.js";
 import { j as nt, r as et, w as it, x as lt, b as St, z as Rt, d as I } from "./hooks-xWZhQHco.js";
 import { c as ut, h as U } from "./template-compiler-ZhSg1yPh.js";
 import { createStore as ft } from "./custom-elements-runtime.store.es.js";
@@ -36,10 +36,10 @@ function xt(t) {
 }
 function Pt(t) {
   const r = t.path || "/", d = C(r), a = d === "/" ? [] : d.split("/").filter(Boolean), c = [], o = [];
-  for (let i = 0; i < a.length; i++) {
-    const l = a[i];
-    if (l === "*") {
-      if (i !== a.length - 1)
+  for (let l = 0; l < a.length; l++) {
+    const i = a[l];
+    if (i === "*") {
+      if (l !== a.length - 1)
         return g(
           `Route '${t.path}' contains a '*' splat in a non-terminal position; splats must be the last segment. This route will be ignored.`
         ), { invalid: !0 };
@@ -47,30 +47,30 @@ function Pt(t) {
       c.push(A), o.push("__SPLAT__");
       continue;
     }
-    const y = l.match(/^:([A-Za-z0-9_-]+)(\*)?$/);
+    const y = i.match(/^:([A-Za-z0-9_-]+)(\*)?$/);
     if (y) {
       const A = y[1], x = !!y[2];
-      if (x && i !== a.length - 1)
+      if (x && l !== a.length - 1)
         return g(
           `Route '${t.path}' contains a splat param ':${A}*' in a non-terminal position; splats must be the last segment. This route will be ignored.`
         ), { invalid: !0 };
       c.push(A), o.push(x ? "__SPLAT__" : "([^/]+)");
       continue;
     }
-    o.push(xt(l));
+    o.push(xt(i));
   }
   let w;
   if (o.length === 0)
     w = "^/$";
   else if (o[o.length - 1] === "__SPLAT__") {
-    const l = o.slice(0, -1).join("/");
-    l ? w = `^/${l}(?:/(.*))?(?:/)?$` : w = "^(?:/(.*))?(?:/)?$";
+    const i = o.slice(0, -1).join("/");
+    i ? w = `^/${i}(?:/(.*))?(?:/)?$` : w = "^(?:/(.*))?(?:/)?$";
   } else
     w = `^/${o.join("/")}(?:/)?$`;
   try {
     return { regex: new RegExp(w), paramNames: c };
-  } catch (i) {
-    return g(`Failed to compile route regex for '${t.path}': ${String(i)}`), { invalid: !0 };
+  } catch (l) {
+    return g(`Failed to compile route regex for '${t.path}': ${String(l)}`), { invalid: !0 };
   }
 }
 const Q = (t, r) => {
@@ -78,14 +78,14 @@ const Q = (t, r) => {
   for (const a of t) {
     let c = dt.get(a);
     if (c || (c = Pt(a), dt.set(a, c)), c.invalid) continue;
-    const { regex: o, paramNames: w } = c, i = o.exec(d);
-    if (i) {
-      const l = {};
+    const { regex: o, paramNames: w } = c, l = o.exec(d);
+    if (l) {
+      const i = {};
       for (let y = 0; y < w.length; y++) {
-        const A = i[y + 1] || "";
-        l[w[y]] = A ? Ct(A) : "";
+        const A = l[y + 1] || "";
+        i[w[y]] = A ? Ct(A) : "";
       }
-      return { route: a, params: l };
+      return { route: a, params: i };
     }
   }
   return { route: null, params: {} };
@@ -136,7 +136,7 @@ async function qt(t) {
       }).catch((c) => {
         delete B[t.path];
         const o = c instanceof Error ? c.message : String(c);
-        throw d && q(
+        throw d && _(
           `SSR component load failed for route: ${t.path}. ${o}`
         ), new Error(
           `Failed to load component for route: ${t.path}. ${o}`
@@ -299,10 +299,10 @@ const E = {
 };
 function Mt(t) {
   const { routes: r, base: d = "", initialUrl: a, scrollToFragment: c = !0 } = t, o = At(d), w = typeof c == "boolean" ? { ...ht, enabled: c } : { ...ht, ...c };
-  let i, l, y, A, x, F, V, X = () => {
+  let l, i, y, A, x, F, V, X = () => {
   };
   const T = /* @__PURE__ */ new Set(), j = 10;
-  let k = 0;
+  let q = 0;
   const G = async (s, u) => {
     const e = rt(r, s.path);
     if (!e || !e.beforeEnter) return !0;
@@ -310,11 +310,11 @@ function Mt(t) {
       const n = await e.beforeEnter(s, u);
       if (typeof n == "string") {
         const h = `${s.path}->${n}`;
-        return T.has(h) || k >= j ? (q(`Redirect loop detected: ${h}`), !1) : n;
+        return T.has(h) || q >= j ? (_(`Redirect loop detected: ${h}`), !1) : n;
       }
       return n !== !1;
     } catch (n) {
-      q("beforeEnter error", n);
+      _("beforeEnter error", n);
       try {
         y.setState(u);
       } catch {
@@ -328,11 +328,11 @@ function Mt(t) {
       const n = await e.onEnter(s, u);
       if (typeof n == "string") {
         const h = `${s.path}->${n}`;
-        return T.has(h) || k >= j ? (q(`Redirect loop detected: ${h}`), !1) : n;
+        return T.has(h) || q >= j ? (_(`Redirect loop detected: ${h}`), !1) : n;
       }
       return n !== !1;
     } catch (n) {
-      q("onEnter error", n);
+      _("onEnter error", n);
       try {
         y.setState(u);
       } catch {
@@ -345,10 +345,10 @@ function Mt(t) {
       try {
         const n = e.afterEnter(s, u);
         n instanceof Promise && n.catch((h) => {
-          q("afterEnter async error", h);
+          _("afterEnter async error", h);
         });
       } catch (n) {
-        q("afterEnter error", n);
+        _("afterEnter error", n);
       }
   }, P = /* @__PURE__ */ new Map(), W = 100, M = (s) => {
     if (P.has(s))
@@ -432,16 +432,16 @@ function Mt(t) {
     });
   }
   let f = !1;
-  const _ = async (s, u = !1) => {
+  const k = async (s, u = !1) => {
     if (f) {
       g(`Navigation to ${s} blocked - navigation already in progress`);
       return;
     }
-    f = !0, k = 0, T.clear();
+    f = !0, q = 0, T.clear();
     try {
       await L(s, u);
     } finally {
-      f = !1, k = 0, T.clear();
+      f = !1, q = 0, T.clear();
     }
   }, O = (s) => {
     const u = s.indexOf("#"), e = u >= 0 ? s.slice(u + 1) : "", n = u >= 0 ? s.slice(0, u) : s, h = n.indexOf("?"), v = h >= 0 ? n.slice(0, h) : n, b = h >= 0 ? st(n.slice(h)) : {}, $ = v.startsWith(o) ? v.slice(o.length) : v;
@@ -462,7 +462,7 @@ function Mt(t) {
       }, b = await G(v, h);
       if (b === !1) return;
       if (typeof b == "string") {
-        k++;
+        q++;
         const S = `${v.path}->${b}`;
         T.add(S), await L(b, !0);
         return;
@@ -470,7 +470,7 @@ function Mt(t) {
       const $ = await at(v, h);
       if ($ === !1) return;
       if (typeof $ == "string") {
-        k++;
+        q++;
         const S = `${v.path}->${$}`;
         T.add(S), await L($, !0);
         return;
@@ -491,7 +491,7 @@ function Mt(t) {
         } catch {
         }
     } catch (e) {
-      if (q("Navigation error:", e), e instanceof Error && (e.stack?.includes("runBeforeEnter") || e.stack?.includes("runOnEnter")))
+      if (_("Navigation error:", e), e instanceof Error && (e.stack?.includes("runBeforeEnter") || e.stack?.includes("runOnEnter")))
         throw e;
       try {
         const n = y.getState();
@@ -507,7 +507,7 @@ function Mt(t) {
               query: {}
             });
           } else
-            q("No fallback route available for error recovery");
+            _("No fallback route available for error recovery");
         }
       } catch (n) {
         g(
@@ -519,11 +519,11 @@ function Mt(t) {
   };
   if (((s) => {
     if (!s || s.length === 0)
-      return q("Router configuration error: No routes provided"), !1;
+      return _("Router configuration error: No routes provided"), !1;
     const u = /* @__PURE__ */ new Set();
     for (const e of s) {
       if (!e.path)
-        return q("Router configuration error: Route missing path", e), !1;
+        return _("Router configuration error: Route missing path", e), !1;
       u.has(e.path) && g(`Duplicate route path detected: ${e.path}`), u.add(e.path), !e.component && !e.load && g(`Route '${e.path}' has no component or load function`);
     }
     return !0;
@@ -533,28 +533,32 @@ function Mt(t) {
     g(`Pre-compiled ${r.length} routes for SSR`);
   }
   if (typeof window < "u" && typeof document < "u" && typeof a > "u") {
-    i = () => {
+    l = () => {
       try {
         const e = new URL(window.location.href), n = e.pathname, h = n.startsWith(o) ? n.slice(o.length) : n, v = C(h || "/"), b = st(e.search), $ = e.hash && e.hash.length ? e.hash.slice(1) : "";
         return { path: v, query: b, fragment: $ };
       } catch (e) {
         return g("Invalid URL detected, falling back to safe defaults", e), { path: "/", query: {}, fragment: "" };
       }
-    }, l = i();
-    const s = M(l.path);
+    }, i = l();
+    const s = M(i.path);
     y = ft({
-      path: l.path,
+      path: i.path,
       params: s.params,
-      query: l.query,
-      fragment: l.fragment
+      query: i.query,
+      fragment: i.fragment
     }), A = async (e = !1) => {
-      const n = i();
-      await _(n.path, e);
+      const n = l();
+      await k(n.path, e);
     };
     const u = () => A(!0);
-    window.addEventListener("popstate", u), X = () => window.removeEventListener("popstate", u), x = (e) => _(e, !1), F = (e) => _(e, !0), V = () => window.history.back();
+    window.addEventListener("popstate", u), X = () => window.removeEventListener("popstate", u), x = (e) => k(e, !1), F = (e) => k(e, !0), V = () => window.history.back(), queueMicrotask(() => {
+      k(i.path, !0).catch((e) => {
+        _("Initial navigation error:", e);
+      });
+    });
   } else {
-    i = () => {
+    l = () => {
       try {
         const e = new URL(a || "/", "http://localhost"), n = e.pathname, h = n.startsWith(o) ? n.slice(o.length) : n, v = C(h || "/"), b = st(e.search), $ = e.hash && e.hash.length ? e.hash.slice(1) : "";
         return { path: v, query: b, fragment: $ };
@@ -564,20 +568,20 @@ function Mt(t) {
           e
         ), { path: "/", query: {}, fragment: "" };
       }
-    }, l = i();
-    const s = M(l.path);
+    }, i = l();
+    const s = M(i.path);
     y = ft({
-      path: l.path,
+      path: i.path,
       params: s.params,
-      query: l.query,
-      fragment: l.fragment
+      query: i.query,
+      fragment: i.fragment
     }), A = async () => {
-      const e = i();
+      const e = l();
       await u(e.path);
     };
     const u = async (e) => {
-      if (k++, k > j) {
-        q(`SSR redirect depth exceeded for path: ${e}`);
+      if (q++, q > j) {
+        _(`SSR redirect depth exceeded for path: ${e}`);
         return;
       }
       try {
@@ -609,10 +613,10 @@ function Mt(t) {
         }
         y.setState(b), $?.afterEnter && $.afterEnter(b, v);
       } catch (n) {
-        throw q("SSR navigation error:", n), n;
+        throw _("SSR navigation error:", n), n;
       }
     };
-    x = async (e) => (k = 0, T.clear(), u(e)), F = async (e) => (k = 0, T.clear(), u(e)), V = () => {
+    x = async (e) => (q = 0, T.clear(), u(e)), F = async (e) => (q = 0, T.clear(), u(e)), V = () => {
     };
   }
   return {
@@ -676,26 +680,26 @@ function jt(t) {
     let o;
     c || (it(() => {
       try {
-        typeof E.subscribe == "function" && (o = E.subscribe((i) => {
+        typeof E.subscribe == "function" && (o = E.subscribe((l) => {
           try {
-            i && typeof i == "object" && typeof i.path == "string" ? a.value = i : (g("router-view received invalid state", i), a.value = { path: "/", params: {}, query: {} });
-          } catch (l) {
-            g("router-view subscription update failed", l);
+            l && typeof l == "object" && typeof l.path == "string" ? a.value = l : (g("router-view received invalid state", l), a.value = { path: "/", params: {}, query: {} });
+          } catch (i) {
+            g("router-view subscription update failed", i);
             try {
               a.value = { path: "/", params: {}, query: {} };
             } catch {
             }
           }
         }));
-      } catch (i) {
-        g("router-view subscribe failed", i);
+      } catch (l) {
+        g("router-view subscribe failed", l);
       }
     }), lt(() => {
       if (typeof o == "function") {
         try {
           o();
-        } catch (i) {
-          g("router-view unsubscribe failed", i);
+        } catch (l) {
+          g("router-view unsubscribe failed", l);
         }
         o = void 0;
       }
@@ -703,13 +707,13 @@ function jt(t) {
     const w = E.matchRoute(a.value.path);
     if (!w || !w.route) return U`<div>Not found</div>`;
     try {
-      const l = await E.resolveRouteComponent(
+      const i = await E.resolveRouteComponent(
         w.route
       );
-      if (typeof l == "string")
-        return { tag: l, props: {}, children: [] };
-      if (typeof l == "function") {
-        const y = l();
+      if (typeof i == "string")
+        return { tag: i, props: { attrs: { ...a.value.params } }, children: [] };
+      if (typeof i == "function") {
+        const y = i();
         return (y instanceof Promise ? y : Promise.resolve(y)).then((x) => typeof x == "string" ? { tag: x, props: {}, children: [] } : x);
       }
       return U`<div>Invalid route component</div>`;
@@ -730,18 +734,18 @@ function jt(t) {
       // allow host `class` and `style` attributes to be read via useProps
       class: "",
       style: ""
-    }), c = typeof window > "u", o = et(E.getCurrent()), w = o.value?.path || "/", i = String(a.to || ""), l = c ? {
+    }), c = typeof window > "u", o = et(E.getCurrent()), w = o.value?.path || "/", l = String(a.to || ""), i = c ? {
       isExactActive: gt(
         w,
-        i,
+        l,
         E.base
       ),
       isActive: vt(
         w,
-        i,
+        l,
         E.base
       ),
-      isExternal: Z(i) || !!a.external
+      isExternal: Z(l) || !!a.external
     } : null;
     let y;
     Rt(() => "a,button{display:inline-block;}");
@@ -754,8 +758,8 @@ function jt(t) {
             y = E.subscribe((f) => {
               try {
                 f && typeof f == "object" && typeof f.path == "string" ? o.value = f : (g("router-link received invalid state", f), o.value = { path: "/", params: {}, query: {} });
-              } catch (_) {
-                g("router-link subscription update failed", _);
+              } catch (k) {
+                g("router-link subscription update failed", k);
                 try {
                   o.value = { path: "/", params: {}, query: {} };
                 } catch {
@@ -782,8 +786,8 @@ function jt(t) {
         try {
           const f = R?._host;
           if (f instanceof HTMLElement) {
-            const _ = f.getAttribute("class"), O = f.getAttribute("style");
-            _ && (A.value = _), O && (x.value = O), _ !== null && f.removeAttribute("class"), O !== null && f.removeAttribute("style");
+            const k = f.getAttribute("class"), O = f.getAttribute("style");
+            k && (A.value = k), O && (x.value = O), k !== null && f.removeAttribute("class"), O !== null && f.removeAttribute("style");
             try {
               R?._requestRender?.();
               try {
@@ -816,8 +820,8 @@ function jt(t) {
       });
     }
     const F = I(() => {
-      if (c && l)
-        return l.isExactActive;
+      if (c && i)
+        return i.isExactActive;
       try {
         const p = E.base ?? "", R = a.to || "";
         return !o.value || typeof o.value.path != "string" ? !1 : gt(o.value.path, R, p);
@@ -825,8 +829,8 @@ function jt(t) {
         return g("isExactActive computation error", p), !1;
       }
     }), V = I(() => {
-      if (c && l)
-        return l.isActive;
+      if (c && i)
+        return i.isActive;
       try {
         const p = E.base ?? "", R = a.to || "";
         return !o.value || typeof o.value.path != "string" ? !1 : a.exact ? F.value : vt(o.value.path, R, p);
@@ -837,8 +841,8 @@ function jt(t) {
       const p = String(a.to || "");
       if (pt(p)) return null;
       if (Z(p)) return p;
-      const [R, f] = p.split("#"), [_, O] = (R || "").split("?"), L = E.base ?? "";
-      let H = _ || "/";
+      const [R, f] = p.split("#"), [k, O] = (R || "").split("?"), L = E.base ?? "";
+      let H = k || "/";
       if (L && L !== "/") {
         const ot = C(L), s = C(H);
         s.startsWith(ot) ? H = s.slice(ot.length) || "/" : H = s;
@@ -847,13 +851,13 @@ function jt(t) {
       return L + ct + (O ? "?" + O : "") + (f ? "#" + f : "");
     }), T = I(() => {
       const R = (A && A.value || a.class || "").split(/\s+/).filter(Boolean), f = {};
-      for (const _ of R) f[_] = !0;
+      for (const k of R) f[k] = !0;
       return f;
     }), j = I(() => ({
       ...T.value,
       [a.activeClass || "active"]: V.value,
       [a.exactActiveClass || "exact-active"]: F.value
-    })), k = I(
+    })), q = I(
       () => Object.keys(j.value).filter((p) => j.value[p]).join(" ")
     ), G = I(() => a.tag || "a"), at = I(() => G.value === "button"), Y = I(
       () => F.value ? a.ariaCurrentValue : null
@@ -886,7 +890,7 @@ function jt(t) {
       U`
             <button
               part="button"
-              class="${k.value}"
+              class="${q.value}"
               style="${M.value || null}"
               aria-current="${Y.value}"
               disabled="${P.value ? "" : null}"
@@ -901,7 +905,7 @@ function jt(t) {
           <a
             part="link"
             href="${P.value ? null : X.value}"
-            class="${k.value}"
+            class="${q.value}"
             style="${M.value || null}"
             aria-current="${Y.value}"
             aria-disabled="${P.value ? "true" : null}"
@@ -919,8 +923,8 @@ function gt(t, r, d) {
   if (Z(r)) return !1;
   let c = (r.split("#")[0] || "/").split("?")[0];
   if (d && d !== "/") {
-    const i = C(d), l = C(c);
-    l.startsWith(i) ? c = l.slice(i.length) || "/" : c = l;
+    const l = C(d), i = C(c);
+    i.startsWith(l) ? c = i.slice(l.length) || "/" : c = i;
   }
   const o = C(t), w = C(c);
   return o === w;
@@ -929,8 +933,8 @@ function vt(t, r, d) {
   if (Z(r)) return !1;
   let c = (r.split("#")[0] || "/").split("?")[0];
   if (d && d !== "/") {
-    const i = C(d), l = C(c);
-    l.startsWith(i) ? c = l.slice(i.length) || "/" : c = l;
+    const l = C(d), i = C(c);
+    i.startsWith(l) ? c = i.slice(l.length) || "/" : c = i;
   }
   const o = C(t), w = C(c);
   return w === "/" ? o === "/" : o === w ? !0 : o.startsWith(w.endsWith("/") ? w : w + "/");