@jasonshimmy/custom-elements-runtime 0.1.18 → 0.1.19

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

@@ -252,10 +252,10 @@ function Pe(e, t, r) {
     }
   });
 }
-function Me(e, t, r, n) {
+function Oe(e, t, r, n) {
   e.onConnected && !r && (e.onConnected(t), n(!0));
 }
-function Oe(e, t, r, n, o, s, i, a) {
+function Me(e, t, r, n, o, s, i, a) {
   e.onDisconnected && e.onDisconnected(t), r.forEach((c) => c()), n(), o(), s(!1), i(null), a(!1);
 }
 function We(e, t, r, n, o) {
@@ -314,7 +314,7 @@ function Ne(e, t, r, n, o, s, i) {
     const p = String(g ?? "");
     (!i || i.value !== p) && (r.value = g);
   }
-  const w = a || l === "checkbox" || l === "radio" || l === "select" ? "change" : "input", $ = (p) => {
+  const w = a || l === "checkbox" || l === "radio" || l === "select" ? "change" : "input", S = (p) => {
     if (p.isComposing || o._isComposing || p.isTrusted === !1) return;
     const u = p.target;
     if (u._modelUpdating) return;
@@ -353,7 +353,7 @@ function Ne(e, t, r, n, o, s, i) {
       }, 0), s._requestRender && s._requestRender();
     }
   };
-  if (o[w] = $, l === "text" || l === "textarea") {
+  if (o[w] = S, l === "text" || l === "textarea") {
     const p = () => {
       o._isComposing = !0;
     }, u = (h) => {
@@ -560,13 +560,13 @@ function P(e, t, r) {
   if (e.tag === "#anchor") {
     const g = e, l = Array.isArray(g.children) ? g.children : [], x = document.createTextNode(""), w = document.createTextNode("");
     g.key != null && (x.key = `${g.key}:start`, w.key = `${g.key}:end`), g._startNode = x, g._endNode = w;
-    const $ = document.createDocumentFragment();
-    $.appendChild(x);
+    const S = document.createDocumentFragment();
+    S.appendChild(x);
     for (const p of l) {
       const u = P(p, t);
-      $.appendChild(u);
+      S.appendChild(u);
     }
-    return $.appendChild(w), $;
+    return S.appendChild(w), S;
   }
   const n = document.createElement(e.tag);
   e.key != null && (n.key = e.key);
@@ -631,16 +631,16 @@ function Fe(e, t, r, n, o) {
   const f = /* @__PURE__ */ new Set();
   let y = e.firstChild;
   function g(x, w) {
-    let $ = x;
-    for (; $ && (f.add($), $ !== w); )
-      $ = $.nextSibling;
+    let S = x;
+    for (; S && (f.add(S), S !== w); )
+      S = S.nextSibling;
   }
-  function l(x, w, $, p) {
+  function l(x, w, S, p) {
     const u = [];
     let h = x.nextSibling;
     for (; h && h !== w; )
       u.push(h), h = h.nextSibling;
-    const b = Array.isArray($) ? $ : [];
+    const b = Array.isArray(S) ? S : [];
     if (p.some((v) => v && v.key != null) || b.some((v) => v && v.key != null)) {
       const v = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map();
       for (const C of b)
@@ -685,7 +685,7 @@ function Fe(e, t, r, n, o) {
   for (const x of r) {
     let w;
     if (x.tag === "#anchor") {
-      const $ = x.key, p = `${$}:start`, u = `${$}:end`;
+      const S = x.key, p = `${S}:start`, u = `${S}:end`;
       let h = c.get(p), b = c.get(u);
       const d = Array.isArray(x.children) ? x.children : [];
       if (h || (h = document.createTextNode(""), h.key = p), b || (b = document.createTextNode(""), b.key = u), x._startNode = h, x._endNode = b, !e.contains(h) || !e.contains(b)) {
@@ -697,17 +697,17 @@ function Fe(e, t, r, n, o) {
         l(
           h,
           b,
-          a.get($)?.children,
+          a.get(S)?.children,
           d
         );
       g(h, b), y = b.nextSibling;
       continue;
     }
     if (x.key != null && c.has(x.key)) {
-      const $ = a.get(x.key);
+      const S = a.get(x.key);
       w = Y(
         c.get(x.key),
-        $,
+        S,
         x,
         n,
         o
@@ -1460,74 +1460,74 @@ function ot(e) {
   function w(p, u = !1) {
     const h = l(p);
     (p.includes("mask-image") || p.includes("sm: hover") || p.includes("sm:hover") || p.includes("mask.svg")) && console.error("DEBUG generateRule:", p, h);
-    let b = !1, d = h.find((S) => (S.startsWith("!") && (b = !0, S = S.slice(1)), se[S] || ce(S) || ue(S) || fe(S) || G(S)));
+    let b = !1, d = h.find(($) => ($.startsWith("!") && (b = !0, $ = $.slice(1)), se[$] || ce($) || ue($) || fe($) || G($)));
     if (!d) return null;
     const v = d.replace(/^!/, ""), m = se[v] ?? ce(v) ?? ue(v) ?? fe(v) ?? G(v);
     if (!m) return null;
     const k = h.indexOf(d);
     let _ = k >= 0 ? h.slice(0, k) : [];
-    u && (_ = _.filter((S) => S !== "dark"));
+    u && (_ = _.filter(($) => $ !== "dark"));
     const C = `.${tt(p)}`, E = "__SUBJECT__", j = b ? m.replace(/;$/, " !important;") : m;
     let A = E;
     const re = [];
-    for (const S of _)
-      S.startsWith("group-") ? (A = `.group:${S.slice(6)} ${A}`, re.push(S)) : S.startsWith("peer-") && (A = A.replace(E, `.peer:${S.slice(5)}~${E}`), re.push(S));
-    _ = _.filter((S) => !re.includes(S));
+    for (const $ of _)
+      $.startsWith("group-") ? (A = `.group:${$.slice(6)} ${A}`, re.push($)) : $.startsWith("peer-") && (A = A.replace(E, `.peer:${$.slice(5)}~${E}`), re.push($));
+    _ = _.filter(($) => !re.includes($));
     const ne = [], me = [];
     let N = null;
-    for (const S of _) {
-      if (S === "dark" || le.includes(S)) continue;
-      const O = et(S);
-      if (O) {
-        N = O;
+    for (const $ of _) {
+      if ($ === "dark" || le.includes($)) continue;
+      const M = et($);
+      if (M) {
+        N = M;
         continue;
       }
-      const L = x(S);
+      const L = x($);
       if (L) {
         N ? me.push(L) : ne.push(L);
         continue;
       }
-      const B = Xe[S];
+      const B = Xe[$];
       typeof B == "function" && (A = B(A, j).split("{")[0]);
     }
-    function je(S, O) {
-      if (!O) return S;
+    function je($, M) {
+      if (!M) return $;
       let L = 0, B = 0;
-      if (S.length && (S[0] === ">" || S[0] === "+" || S[0] === "~" || S[0] === " ")) {
+      if ($.length && ($[0] === ">" || $[0] === "+" || $[0] === "~" || $[0] === " ")) {
         let T = 1;
-        for (; T < S.length && S[T] === " "; ) T++;
-        for (; T < S.length; T++) {
-          const z = S[T];
-          if (z === "[" ? L++ : z === "]" && L > 0 ? L-- : z === "(" ? B++ : z === ")" && B > 0 && B--, L === 0 && B === 0 && (S[T] === ">" || S[T] === "+" || S[T] === "~" || S[T] === " "))
-            return S.slice(0, T) + O + S.slice(T);
+        for (; T < $.length && $[T] === " "; ) T++;
+        for (; T < $.length; T++) {
+          const z = $[T];
+          if (z === "[" ? L++ : z === "]" && L > 0 ? L-- : z === "(" ? B++ : z === ")" && B > 0 && B--, L === 0 && B === 0 && ($[T] === ">" || $[T] === "+" || $[T] === "~" || $[T] === " "))
+            return $.slice(0, T) + M + $.slice(T);
         }
-        return S + O;
+        return $ + M;
       }
-      for (let T = 0; T < S.length; T++) {
-        const z = S[T];
+      for (let T = 0; T < $.length; T++) {
+        const z = $[T];
         if (z === "[" ? L++ : z === "]" && L > 0 ? L-- : z === "(" ? B++ : z === ")" && B > 0 && B--, L === 0 && B === 0 && (z === ">" || z === "+" || z === "~" || z === " "))
-          return S.slice(0, T) + O + S.slice(T);
+          return $.slice(0, T) + M + $.slice(T);
       }
-      return S + O;
+      return $ + M;
     }
     const oe = ne.join(""), K = me.join("");
     if (N)
       if (N.includes("&")) {
-        const S = N.indexOf("&"), O = N.slice(0, S), L = N.slice(S + 1), B = E + oe, T = A;
+        const $ = N.indexOf("&"), M = N.slice(0, $), L = N.slice($ + 1), B = E + oe, T = A;
         if (ne.length === 0)
-          A = T.replace(E, O + B + K + L);
+          A = T.replace(E, M + B + K + L);
         else {
           const z = je(L, K);
-          A = T.replace(E, O + B + z);
+          A = T.replace(E, M + B + z);
         }
       } else
         A = A.replace(E, `${N}${E + oe}`), K && (A = A.replace(E, `${E}${K}`));
     else
       A = E + oe + K;
     A = A.replace(new RegExp(E, "g"), C);
-    let M = `${A}{${j}}`;
-    const ie = _.filter((S) => le.includes(S)), H = ie.length ? ie[ie.length - 1] : null, be = _.includes("dark");
-    return u && H ? M = `@media (prefers-color-scheme: dark) and ${ae[H]}{${M}}` : u ? M = `@media (prefers-color-scheme: dark){${M}}` : be && H ? M = `@media (prefers-color-scheme: dark) and ${ae[H]}{${M}}` : be ? M = `@media (prefers-color-scheme: dark){${M}}` : H && (M = `@media ${ae[H]}{${M}}`), M;
+    let O = `${A}{${j}}`;
+    const ie = _.filter(($) => le.includes($)), H = ie.length ? ie[ie.length - 1] : null, be = _.includes("dark");
+    return u && H ? O = `@media (prefers-color-scheme: dark) and ${ae[H]}{${O}}` : u ? O = `@media (prefers-color-scheme: dark){${O}}` : be && H ? O = `@media (prefers-color-scheme: dark) and ${ae[H]}{${O}}` : be ? O = `@media (prefers-color-scheme: dark){${O}}` : H && (O = `@media ${ae[H]}{${O}}`), O;
   }
   for (const p of o) {
     const u = l(p), h = u.find(
@@ -1543,8 +1543,8 @@ function ot(e) {
       m && (v === 1 ? s.push(m) : v === 2 ? i.push(m) : v === 3 && a.push(m));
     }
   }
-  const $ = [...s, ...i, ...a, ...c].join("");
-  return Se.set(e, { css: $, timestamp: t }), $;
+  const S = [...s, ...i, ...a, ...c].join("");
+  return Se.set(e, { css: S, timestamp: t }), S;
 }
 const J = [];
 function it(e, t, r, n, o, s, i, a) {
@@ -1707,7 +1707,7 @@ function ct(e) {
     }
     connectedCallback() {
       this._runLogicWithinErrorBoundary(e, () => {
-        Me(
+        Oe(
           e,
           this.context,
           this._mounted,
@@ -1719,7 +1719,7 @@ function ct(e) {
     }
     disconnectedCallback() {
       this._runLogicWithinErrorBoundary(e, () => {
-        Oe(
+        Me(
           e,
           this.context,
           this._listeners,
@@ -1943,9 +1943,9 @@ function ut(e, t = [], r = {}) {
     g || (l === "true" ? l = !0 : l === "false" ? l = !1 : l === "null" ? l = null : isNaN(Number(l)) || (l = Number(l)));
     const x = ["model", "bind", "show", "class", "style"];
     if (c === ":") {
-      const [w, ...$] = f.split(".");
+      const [w, ...S] = f.split(".");
       if (x.includes(w)) {
-        const p = [...$];
+        const p = [...S];
         s[w] = {
           value: l,
           modifiers: p
@@ -1968,7 +1968,7 @@ function dt(e, t, r) {
   for (let d = 0; d < e.length; d++)
     i += e[d], d < t.length && (i += `{{${d}}}`);
   const a = /<\/?([a-zA-Z0-9-]+)((?:\s+[^\s=>/]+(?:\s*=\s*(?:"(?:\\.|[^"])*"|'(?:\\.|[^'])*'|[^\s>]+))?)*)\s*\/?>|{{(\d+)}}|([^<]+)/g, c = [];
-  let f, y = [], g = null, l = {}, x, w = 0, $ = [];
+  let f, y = [], g = null, l = {}, x, w = 0, S = [];
   function p(d) {
     !d || typeof d != "object" || ee(d) || (d.props || d.attrs ? (d.props && (l.props || (l.props = {}), Object.assign(l.props, d.props)), d.attrs && (l.attrs || (l.attrs = {}), Object.keys(d.attrs).forEach((v) => {
       if (v === "style" && l.attrs.style) {
@@ -1987,7 +1987,7 @@ function dt(e, t, r) {
     }))) : (l.props || (l.props = {}), Object.assign(l.props, d)));
   }
   function u(d, v) {
-    const m = g ? y : $;
+    const m = g ? y : S;
     if (ee(d)) {
       const k = d.key ?? v;
       let _ = d.children;
@@ -2048,8 +2048,8 @@ function dt(e, t, r) {
           y.length === 1 && X(y[0]) && y[0].tag === "#text" ? typeof y[0].children == "string" ? y[0].children : "" : y.length ? y : void 0,
           x
         ), A = c.pop();
-        A ? (g = A.tag, l = A.props, x = A.key, y = A.children, y.push(j)) : ($.push(j), g = null, l = {}, x = void 0, y = []);
-      } else m ? g ? y.push(V(d, E, void 0, void 0)) : $.push(V(d, E, void 0, void 0)) : (g && c.push({
+        A ? (g = A.tag, l = A.props, x = A.key, y = A.children, y.push(j)) : (S.push(j), g = null, l = {}, x = void 0, y = []);
+      } else m ? g ? y.push(V(d, E, void 0, void 0)) : S.push(V(d, E, void 0, void 0)) : (g && c.push({
         tag: g,
         props: l,
         children: y,
@@ -2059,7 +2059,7 @@ function dt(e, t, r) {
       const d = Number(f[3]), v = t[d], m = `interp-${d}`;
       u(v, m);
     } else if (f[4]) {
-      const d = f[4], v = g ? y : $, m = d.split(/({{\d+}})/);
+      const d = f[4], v = g ? y : S, m = d.split(/({{\d+}})/);
       for (const k of m) {
         if (!k) continue;
         const _ = k.match(/^{{(\d+)}}$/);
@@ -2072,7 +2072,7 @@ function dt(e, t, r) {
         }
       }
     }
-  const b = $.filter((d) => X(d) && d.tag === "#text" ? typeof d.children == "string" && d.children.trim() !== "" : !0);
+  const b = S.filter((d) => X(d) && d.tag === "#text" ? typeof d.children == "string" && d.children.trim() !== "" : !0);
   return b.length === 1 ? b[0] : b.length > 1 ? b : V("div", {}, "", "fallback-root");
 }
 function U(e, ...t) {
@@ -2107,38 +2107,38 @@ async function pt(e) {
 function ht(e) {
   const { routes: t, base: r = "", initialUrl: n } = e;
   let o, s, i, a, c, f, y;
-  const g = async ($, p) => {
-    const u = t.find((h) => W([h], $.path).route !== null);
+  const g = async (S, p) => {
+    const u = t.find((h) => W([h], S.path).route !== null);
     if (u?.beforeEnter)
       try {
-        const h = await u.beforeEnter($, p);
+        const h = await u.beforeEnter(S, p);
         return typeof h == "string" ? (await w(h, !0), !1) : h !== !1;
       } catch (h) {
         return console.error("beforeEnter error", h), !1;
       }
     return !0;
-  }, l = async ($, p) => {
-    const u = t.find((h) => W([h], $.path).route !== null);
+  }, l = async (S, p) => {
+    const u = t.find((h) => W([h], S.path).route !== null);
     if (u?.onEnter)
       try {
-        const h = await u.onEnter($, p);
+        const h = await u.onEnter(S, p);
         return typeof h == "string" ? (await w(h, !0), !1) : h !== !1;
       } catch (h) {
         return console.error("onEnter error", h), !1;
       }
     return !0;
-  }, x = ($, p) => {
-    const u = t.find((h) => W([h], $.path).route !== null);
+  }, x = (S, p) => {
+    const u = t.find((h) => W([h], S.path).route !== null);
     if (u?.afterEnter)
       try {
-        u.afterEnter($, p);
+        u.afterEnter(S, p);
       } catch (h) {
         console.error("afterEnter error", h);
       }
-  }, w = async ($, p = !1) => {
+  }, w = async (S, p = !1) => {
     try {
       const u = {
-        path: $.replace(r, "") || "/",
+        path: S.replace(r, "") || "/",
         query: {}
       }, h = W(t, u.path);
       if (!h) throw new Error(`No route found for ${u.path}`);
@@ -2148,7 +2148,7 @@ function ht(e) {
         query: u.query
       };
       if (!await g(d, b) || !await l(d, b)) return;
-      typeof window < "u" && typeof document < "u" && (p ? window.history.replaceState({}, "", r + $) : window.history.pushState({}, "", r + $)), i.setState(d), x(d, b);
+      typeof window < "u" && typeof document < "u" && (p ? window.history.replaceState({}, "", r + S) : window.history.pushState({}, "", r + S)), i.setState(d), x(d, b);
     } catch (u) {
       console.error("Navigation error:", u);
     }
@@ -2158,10 +2158,10 @@ function ht(e) {
       const p = new URL(window.location.href), u = p.pathname.replace(r, "") || "/", h = Ce(p.search);
       return { path: u, query: h };
     }, s = o();
-    const $ = W(t, s.path);
+    const S = W(t, s.path);
     i = ve({
       path: s.path,
-      params: $.params,
+      params: S.params,
       query: s.query
     }), a = async (p = !1) => {
       const u = o();
@@ -2172,10 +2172,10 @@ function ht(e) {
       const u = new URL(n || "/", "http://localhost"), h = u.pathname.replace(r, "") || "/", b = Ce(u.search);
       return { path: h, query: b };
     }, s = o();
-    const $ = W(t, s.path);
+    const S = W(t, s.path);
     i = ve({
       path: s.path,
-      params: $.params,
+      params: S.params,
       query: s.query
     }), a = async () => {
       const u = o();
@@ -2232,7 +2232,7 @@ function ht(e) {
     replace: f,
     back: y,
     subscribe: i.subscribe,
-    matchRoute: ($) => W(t, $),
+    matchRoute: (S) => W(t, S),
     getCurrent: () => i.getState(),
     resolveRouteComponent: pt
   };
@@ -2281,25 +2281,32 @@ function $t(e) {
     },
     style: (r) => r.style,
     render: (r) => {
-      const n = t.getCurrent(), o = r.to, s = r.exact, i = r.exactActiveClass, a = r.activeClass, c = r.ariaCurrentValue, f = r.tag, y = r.disabled, g = r.external, l = n.path === o, x = s ? l : n && typeof n.path == "string" ? n.path.startsWith(o) : !1, w = l ? i : x ? a : "", $ = l ? `aria-current="${c}"` : "", p = f === "button", u = y ? p ? 'disabled aria-disabled="true" tabindex="-1"' : 'aria-disabled="true" tabindex="-1"' : "", h = g && (f === "a" || !f) ? 'target="_blank" rel="noopener noreferrer"' : "";
+      const n = t.getCurrent(), o = r.to, s = r.exact, i = r.exactActiveClass, a = r.activeClass, c = r.ariaCurrentValue, f = r.tag, y = r.disabled, g = r.external, l = n.path === o, x = s ? l : n && typeof n.path == "string" ? n.path.startsWith(o) : !1, w = l ? `aria-current="${c}"` : "", S = (r.class || "").split(/\s+/).filter(Boolean), p = {};
+      for (const v of S) p[v] = !0;
+      const u = {
+        ...p,
+        // Also include the configurable names (may duplicate the above)
+        [a]: x,
+        [i]: l
+      }, h = f === "button", b = y ? h ? 'disabled aria-disabled="true" tabindex="-1"' : 'aria-disabled="true" tabindex="-1"' : "", d = g && (f === "a" || !f) ? 'target="_blank" rel="noopener noreferrer"' : "";
       return U`
-        ${Le().when(p, U`
+        ${Le().when(h, U`
             <button
               part="button"
-              :class="${r.class} ${w}"
-              ${$}
-              ${u}
-              ${h}
+              :class="${u}"
+              ${w}
+              ${b}
+              ${d}
               @click="navigate"
             ><slot></slot></button>
           `).otherwise(U`
             <a
               part="link"
               href="${o}"
-              :class="${r.class} ${w}"
-              ${$}
-              ${u}
-              ${h}
+              :class="${u}"
+              ${w}
+              ${b}
+              ${d}
               @click="navigate"
             ><slot></slot></a>
           `).done()}