@sula-tech/webcomponents 0.1.1 → 0.2.0

package/dist/webcomponents/{p-cca32e44.js → p-fbee9d79.js}

@@ -7,12 +7,12 @@ const t = /* webcomponents */ {
   asyncQueue: false,
   attachStyles: true,
   cloneNodeFix: false,
-  cmpDidLoad: false,
+  cmpDidLoad: true,
   cmpDidRender: false,
   cmpDidUnload: false,
   cmpDidUpdate: false,
   cmpShouldUpdate: false,
-  cmpWillLoad: false,
+  cmpWillLoad: true,
   cmpWillRender: false,
   cmpWillUpdate: false,
   connectedCallback: false,
@@ -26,10 +26,10 @@ const t = /* webcomponents */ {
   experimentalSlotFixes: false,
   formAssociated: false,
   hasRenderFn: true,
-  hostListener: false,
-  hostListenerTarget: false,
+  hostListener: true,
+  hostListenerTarget: true,
   hostListenerTargetBody: false,
-  hostListenerTargetDocument: false,
+  hostListenerTargetDocument: true,
   hostListenerTargetParent: false,
   hostListenerTargetWindow: false,
   hotModuleReplacement: false,
@@ -44,7 +44,7 @@ const t = /* webcomponents */ {
   isDev: false,
   isTesting: false,
   lazyLoad: true,
-  lifecycle: false,
+  lifecycle: true,
   lifecycleDOMEvents: true,
   member: true,
   method: false,
@@ -55,7 +55,7 @@ const t = /* webcomponents */ {
   prop: true,
   propBoolean: true,
   propMutable: true,
-  propNumber: false,
+  propNumber: true,
   propString: true,
   reflect: false,
   scoped: false,
@@ -66,7 +66,7 @@ const t = /* webcomponents */ {
   slot: false,
   slotChildNodesFix: false,
   slotRelocation: false,
-  state: false,
+  state: true,
   style: true,
   svg: false,
   taskQueue: true,
@@ -78,7 +78,7 @@ const t = /* webcomponents */ {
   vdomKey: true,
   vdomListener: true,
   vdomPropOrAttr: true,
-  vdomRef: false,
+  vdomRef: true,
   vdomRender: true,
   vdomStyle: false,
   vdomText: true,
@@ -91,19 +91,19 @@ const t = /* webcomponents */ {
  */ var n = Object.defineProperty;
 
 var __export = (e, t) => {
-  for (var s in t) n(e, s, {
-    get: t[s],
+  for (var r in t) n(e, r, {
+    get: t[r],
     enumerable: true
   });
 };
 
 // src/client/client-host-ref.ts
-var s =  new WeakMap;
+var r =  new WeakMap;
 
-var getHostRef = e => s.get(e);
+var getHostRef = e => r.get(e);
 
 var registerInstance = (e, t) => {
-  s.set(t._$$lazyInstance$$_ = e, t);
+  r.set(t._$$lazyInstance$$_ = e, t);
 };
 
 var registerHost = (e, t) => {
@@ -118,8 +118,8 @@ var registerHost = (e, t) => {
     e["s-p"] = [];
     e["s-rc"] = [];
   }
-  const l = s.set(e, n);
-  return l;
+  const s = r.set(e, n);
+  return s;
 };
 
 var isMemberInElement = (e, t) => t in e;
@@ -128,35 +128,35 @@ var consoleError = (e, t) => (0, console.error)(e, t)
 // src/client/client-load-module.ts
 ;
 
-var l =  new Map;
+var s =  new Map;
 
 var loadModule = (e, t, n) => {
-  const s = e._$$tagName$$_.replace(/-/g, "_");
-  const r = e._$$lazyBundleId$$_;
-  if (!r) {
+  const r = e._$$tagName$$_.replace(/-/g, "_");
+  const l = e._$$lazyBundleId$$_;
+  if (!l) {
     return void 0;
   }
-  const o = l.get(r);
+  const o = s.get(l);
   if (o) {
-    return o[s];
+    return o[r];
   }
   /*!__STENCIL_STATIC_IMPORT_SWITCH__*/  return import(
   /* @vite-ignore */
   /* webpackInclude: /\.entry\.js$/ */
   /* webpackExclude: /\.system\.entry\.js$/ */
   /* webpackMode: "lazy" */
-  `./${r}.entry.js${""}`).then((e => {
+  `./${l}.entry.js${""}`).then((e => {
     {
-      l.set(r, e);
+      s.set(l, e);
     }
-    return e[s];
+    return e[r];
   }), (e => {
     consoleError(e, t.$hostElement$);
   }));
 };
 
 // src/client/client-style.ts
-var r =  new Map;
+var l =  new Map;
 
 var o = "sty-id";
 
@@ -175,14 +175,26 @@ var u = {
   _$$resourcesUrl$$_: "",
   jmp: e => e(),
   raf: e => requestAnimationFrame(e),
-  ael: (e, t, n, s) => e.addEventListener(t, n, s),
-  rel: (e, t, n, s) => e.removeEventListener(t, n, s),
+  ael: (e, t, n, r) => e.addEventListener(t, n, r),
+  rel: (e, t, n, r) => e.removeEventListener(t, n, r),
   ce: (e, t) => new CustomEvent(e, t)
 };
 
+var d =  (() => {
+  let e = false;
+  try {
+    c.addEventListener("e", null, Object.defineProperty({}, "passive", {
+      get() {
+        e = true;
+      }
+    }));
+  } catch (e) {}
+  return e;
+})();
+
 var promiseResolve = e => Promise.resolve(e);
 
-var d =  (() => {
+var v =  (() => {
   try {
     new CSSStyleSheet;
     return typeof (new CSSStyleSheet).replaceSync === "function";
@@ -190,16 +202,16 @@ var d =  (() => {
   return false;
 })();
 
-var v = false;
-
-var p = [];
+var p = false;
 
 var m = [];
 
+var y = [];
+
 var queueTask = (e, t) => n => {
   e.push(n);
-  if (!v) {
-    v = true;
+  if (!p) {
+    p = true;
     if (t && u._$$flags$$_ & 4 /* queueSync */) {
       nextTick(flush);
     } else {
@@ -220,10 +232,10 @@ var consume = e => {
 };
 
 var flush = () => {
-  consume(p);
+  consume(m);
   {
-    consume(m);
-    if (v = p.length > 0) {
+    consume(y);
+    if (p = m.length > 0) {
       u.raf(flush);
     }
   }
@@ -231,7 +243,7 @@ var flush = () => {
 
 var nextTick = e => promiseResolve().then(e);
 
-var y =  queueTask(m, true);
+var b =  queueTask(y, true);
 
 var isComplexType = e => {
   e = typeof e;
@@ -240,14 +252,14 @@ var isComplexType = e => {
 
 // src/utils/query-nonce-meta-tag-content.ts
 function queryNonceMetaTagContent(e) {
-  var t, n, s;
-  return (s = (n = (t = e.head) == null ? void 0 : t.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : n.getAttribute("content")) != null ? s : void 0;
+  var t, n, r;
+  return (r = (n = (t = e.head) == null ? void 0 : t.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : n.getAttribute("content")) != null ? r : void 0;
 }
 
 // src/utils/result.ts
-var b = {};
+var w = {};
 
-__export(b, {
+__export(w, {
   err: () => err,
   map: () => map,
   ok: () => ok,
@@ -312,33 +324,33 @@ var uniqueTime = (e, t) => {
 };
 
 var h = (e, t, ...n) => {
+  let r = null;
   let s = null;
-  let l = null;
-  let r = false;
+  let l = false;
   let o = false;
   const i = [];
   const walk = t => {
     for (let n = 0; n < t.length; n++) {
-      s = t[n];
-      if (Array.isArray(s)) {
-        walk(s);
-      } else if (s != null && typeof s !== "boolean") {
-        if (r = typeof e !== "function" && !isComplexType(s)) {
-          s = String(s);
+      r = t[n];
+      if (Array.isArray(r)) {
+        walk(r);
+      } else if (r != null && typeof r !== "boolean") {
+        if (l = typeof e !== "function" && !isComplexType(r)) {
+          r = String(r);
         }
-        if (r && o) {
-          i[i.length - 1]._$$text$$_ += s;
+        if (l && o) {
+          i[i.length - 1]._$$text$$_ += r;
         } else {
-          i.push(r ? newVNode(null, s) : s);
+          i.push(l ? newVNode(null, r) : r);
         }
-        o = r;
+        o = l;
       }
     }
   };
   walk(n);
   if (t) {
     if (t.key) {
-      l = t.key;
+      s = t.key;
     }
     {
       const e = t.className || t.class;
@@ -353,7 +365,7 @@ var h = (e, t, ...n) => {
     a._$$children$$_ = i;
   }
   {
-    a._$$key$$_ = l;
+    a._$$key$$_ = s;
   }
   return a;
 };
@@ -375,15 +387,18 @@ var newVNode = (e, t) => {
   return n;
 };
 
-var w = {};
+var S = {};
 
-var isHost = e => e && e._$$tag$$_ === w;
+var isHost = e => e && e._$$tag$$_ === S;
 
 var parsePropertyValue = (e, t) => {
   if (e != null && !isComplexType(e)) {
     if (t & 4 /* Boolean */) {
       return e === "false" ? false : e === "" || !!e;
     }
+    if (t & 2 /* Number */) {
+      return parseFloat(e);
+    }
     if (t & 1 /* String */) {
       return String(e);
     }
@@ -397,9 +412,9 @@ var getElement = e => getHostRef(e).$hostElement$
 ;
 
 var createEvent = (e, t, n) => {
-  const s = getElement(e);
+  const r = getElement(e);
   return {
-    emit: e => emitEvent(s, t, {
+    emit: e => emitEvent(r, t, {
       bubbles: !!(n & 4 /* Bubbles */),
       composed: !!(n & 2 /* Composed */),
       cancelable: !!(n & 1 /* Cancellable */),
@@ -409,56 +424,56 @@ var createEvent = (e, t, n) => {
 };
 
 var emitEvent = (e, t, n) => {
-  const s = u.ce(t, n);
-  e.dispatchEvent(s);
-  return s;
+  const r = u.ce(t, n);
+  e.dispatchEvent(r);
+  return r;
 };
 
-var S =  new WeakMap;
+var g =  new WeakMap;
 
 var registerStyle = (e, t, n) => {
-  let s = r.get(e);
-  if (d && n) {
-    s = s || new CSSStyleSheet;
-    if (typeof s === "string") {
-      s = t;
+  let r = l.get(e);
+  if (v && n) {
+    r = r || new CSSStyleSheet;
+    if (typeof r === "string") {
+      r = t;
     } else {
-      s.replaceSync(t);
+      r.replaceSync(t);
     }
   } else {
-    s = t;
+    r = t;
   }
-  r.set(e, s);
+  l.set(e, r);
 };
 
 var addStyle = (e, t, n) => {
-  var s;
-  const l = getScopeId(t);
-  const i = r.get(l);
+  var r;
+  const s = getScopeId(t);
+  const i = l.get(s);
   e = e.nodeType === 11 /* DocumentFragment */ ? e : c;
   if (i) {
     if (typeof i === "string") {
       e = e.head || e;
-      let n = S.get(e);
-      let r;
+      let n = g.get(e);
+      let l;
       if (!n) {
-        S.set(e, n =  new Set);
+        g.set(e, n =  new Set);
       }
-      if (!n.has(l)) {
+      if (!n.has(s)) {
         {
-          r = document.querySelector(`[${o}="${l}"]`) || c.createElement("style");
-          r.innerHTML = i;
-          const n = (s = u._$$nonce$$_) != null ? s : queryNonceMetaTagContent(c);
+          l = document.querySelector(`[${o}="${s}"]`) || c.createElement("style");
+          l.innerHTML = i;
+          const n = (r = u._$$nonce$$_) != null ? r : queryNonceMetaTagContent(c);
           if (n != null) {
-            r.setAttribute("nonce", n);
+            l.setAttribute("nonce", n);
           }
           if (!(t._$$flags$$_ & 1 /* shadowDomEncapsulation */)) {
             if (e.nodeName === "HEAD") {
               const t = e.querySelectorAll("link[rel=preconnect]");
               const n = t.length > 0 ? t[t.length - 1].nextSibling : e.querySelector("style");
-              e.insertBefore(r, (n == null ? void 0 : n.parentNode) === e ? n : null);
+              e.insertBefore(l, (n == null ? void 0 : n.parentNode) === e ? n : null);
             } else if ("host" in e) {
-              if (d) {
+              if (v) {
                 const t = new CSSStyleSheet;
                 t.replaceSync(i);
                 e.adoptedStyleSheets = [ t, ...e.adoptedStyleSheets ];
@@ -467,59 +482,63 @@ var addStyle = (e, t, n) => {
                 if (t) {
                   t.innerHTML = i + t.innerHTML;
                 } else {
-                  e.prepend(r);
+                  e.prepend(l);
                 }
               }
             } else {
-              e.append(r);
+              e.append(l);
             }
           }
           if (t._$$flags$$_ & 1 /* shadowDomEncapsulation */) {
-            e.insertBefore(r, null);
+            e.insertBefore(l, null);
           }
         }
         if (t._$$flags$$_ & 4 /* hasSlotRelocation */) {
-          r.innerHTML += a;
+          l.innerHTML += a;
         }
         if (n) {
-          n.add(l);
+          n.add(s);
         }
       }
     } else if (!e.adoptedStyleSheets.includes(i)) {
       e.adoptedStyleSheets = [ ...e.adoptedStyleSheets, i ];
     }
   }
-  return l;
+  return s;
 };
 
 var attachStyles = e => {
   const t = e._$$cmpMeta$$_;
   const n = e.$hostElement$;
-  const s = t._$$flags$$_;
-  const l = createTime("attachStyles", t._$$tagName$$_);
-  const r = addStyle(n.shadowRoot ? n.shadowRoot : n.getRootNode(), t);
-  if (s & 10 /* needsScopedEncapsulation */ && s & 2 /* scopedCssEncapsulation */ || s & 128 /* shadowNeedsScopedCss */) {
-    n["s-sc"] = r;
-    n.classList.add(r + "-h");
+  const r = t._$$flags$$_;
+  const s = createTime("attachStyles", t._$$tagName$$_);
+  const l = addStyle(n.shadowRoot ? n.shadowRoot : n.getRootNode(), t);
+  if (r & 10 /* needsScopedEncapsulation */ && r & 2 /* scopedCssEncapsulation */ || r & 128 /* shadowNeedsScopedCss */) {
+    n["s-sc"] = l;
+    n.classList.add(l + "-h");
   }
-  l();
+  s();
 };
 
 var getScopeId = (e, t) => "sc-" + e._$$tagName$$_;
 
-var setAccessor = (e, t, n, s, l, r, o) => {
-  if (n !== s) {
+var setAccessor = (e, t, n, r, s, l, o) => {
+  if (n !== r) {
     let o = isMemberInElement(e, t);
     let i = t.toLowerCase();
     if (t === "class") {
       const t = e.classList;
-      const l = parseClassList(n);
-      let r = parseClassList(s);
+      const s = parseClassList(n);
+      let l = parseClassList(r);
       {
-        t.remove(...l.filter((e => e && !r.includes(e))));
-        t.add(...r.filter((e => e && !l.includes(e))));
+        t.remove(...s.filter((e => e && !l.includes(e))));
+        t.add(...l.filter((e => e && !s.includes(e))));
+      }
+    } else if (t === "key") ; else if (t === "ref") {
+      if (r) {
+        r(e);
       }
-    } else if (t === "key") ; else if (!o && t[0] === "o" && t[1] === "n") {
+    } else if (!o && t[0] === "o" && t[1] === "n") {
       if (t[2] === "-") {
         t = t.slice(3);
       } else if (isMemberInElement(f, i)) {
@@ -527,53 +546,53 @@ var setAccessor = (e, t, n, s, l, r, o) => {
       } else {
         t = i[2] + t.slice(3);
       }
-      if (n || s) {
-        const l = t.endsWith($);
-        t = t.replace(C, "");
+      if (n || r) {
+        const s = t.endsWith(C);
+        t = t.replace(j, "");
         if (n) {
-          u.rel(e, t, n, l);
+          u.rel(e, t, n, s);
         }
-        if (s) {
-          u.ael(e, t, s, l);
+        if (r) {
+          u.ael(e, t, r, s);
         }
       }
     } else {
-      const i = isComplexType(s);
-      if ((o || i && s !== null) && !l) {
+      const i = isComplexType(r);
+      if ((o || i && r !== null) && !s) {
         try {
           if (!e.tagName.includes("-")) {
-            const l = s == null ? "" : s;
+            const s = r == null ? "" : r;
             if (t === "list") {
               o = false;
-            } else if (n == null || e[t] != l) {
+            } else if (n == null || e[t] != s) {
               if (typeof e.__lookupSetter__(t) === "function") {
-                e[t] = l;
+                e[t] = s;
               } else {
-                e.setAttribute(t, l);
+                e.setAttribute(t, s);
               }
             }
-          } else if (e[t] !== s) {
-            e[t] = s;
+          } else if (e[t] !== r) {
+            e[t] = r;
           }
         } catch (e) {}
       }
-      if (s == null || s === false) {
-        if (s !== false || e.getAttribute(t) === "") {
+      if (r == null || r === false) {
+        if (r !== false || e.getAttribute(t) === "") {
           {
             e.removeAttribute(t);
           }
         }
-      } else if ((!o || r & 4 /* isHost */ || l) && !i) {
-        s = s === true ? "" : s;
+      } else if ((!o || l & 4 /* isHost */ || s) && !i) {
+        r = r === true ? "" : r;
         {
-          e.setAttribute(t, s);
+          e.setAttribute(t, r);
         }
       }
     }
   }
 };
 
-var g = /\s/;
+var $ = /\s/;
 
 var parseClassList = e => {
   if (typeof e === "object" && e && "baseVal" in e) {
@@ -582,27 +601,27 @@ var parseClassList = e => {
   if (!e || typeof e !== "string") {
     return [];
   }
-  return e.split(g);
+  return e.split($);
 };
 
-var $ = "Capture";
+var C = "Capture";
 
-var C = new RegExp($ + "$");
+var j = new RegExp(C + "$");
 
 // src/runtime/vdom/update-element.ts
-var updateElement = (e, t, n, s) => {
-  const l = t._$$elm$$_.nodeType === 11 /* DocumentFragment */ && t._$$elm$$_.host ? t._$$elm$$_.host : t._$$elm$$_;
-  const r = e && e._$$attrs$$_ || {};
+var updateElement = (e, t, n, r) => {
+  const s = t._$$elm$$_.nodeType === 11 /* DocumentFragment */ && t._$$elm$$_.host ? t._$$elm$$_.host : t._$$elm$$_;
+  const l = e && e._$$attrs$$_ || {};
   const o = t._$$attrs$$_ || {};
   {
-    for (const e of sortedAttrNames(Object.keys(r))) {
+    for (const e of sortedAttrNames(Object.keys(l))) {
       if (!(e in o)) {
-        setAccessor(l, e, r[e], void 0, n, t._$$flags$$_);
+        setAccessor(s, e, l[e], void 0, n, t._$$flags$$_);
       }
     }
   }
   for (const e of sortedAttrNames(Object.keys(o))) {
-    setAccessor(l, e, r[e], o[e], n, t._$$flags$$_);
+    setAccessor(s, e, l[e], o[e], n, t._$$flags$$_);
   }
 };
 
@@ -616,25 +635,25 @@ function sortedAttrNames(e) {
 
 var k;
 
-var j = false;
-
 var O = false;
 
-var createElm = (e, n, s) => {
-  const l = n._$$children$$_[s];
-  let r = 0;
+var D = false;
+
+var createElm = (e, n, r) => {
+  const s = n._$$children$$_[r];
+  let l = 0;
   let o;
   let i;
-  if (l._$$text$$_ !== null) {
-    o = l._$$elm$$_ = c.createTextNode(l._$$text$$_);
+  if (s._$$text$$_ !== null) {
+    o = s._$$elm$$_ = c.createTextNode(s._$$text$$_);
   } else {
-    o = l._$$elm$$_ = c.createElement(!j && t.slotRelocation && l._$$flags$$_ & 2 /* isSlotFallback */ ? "slot-fb" : l._$$tag$$_);
+    o = s._$$elm$$_ = c.createElement(!O && t.slotRelocation && s._$$flags$$_ & 2 /* isSlotFallback */ ? "slot-fb" : s._$$tag$$_);
     {
-      updateElement(null, l, O);
+      updateElement(null, s, D);
     }
-    if (l._$$children$$_) {
-      for (r = 0; r < l._$$children$$_.length; ++r) {
-        i = createElm(e, l, r);
+    if (s._$$children$$_) {
+      for (l = 0; l < s._$$children$$_.length; ++l) {
+        i = createElm(e, s, l);
         if (i) {
           o.appendChild(i);
         }
@@ -645,17 +664,17 @@ var createElm = (e, n, s) => {
   return o;
 };
 
-var addVnodes = (e, t, n, s, l, r) => {
+var addVnodes = (e, t, n, r, s, l) => {
   let o = e;
   let i;
   if (o.shadowRoot && o.tagName === k) {
     o = o.shadowRoot;
   }
-  for (;l <= r; ++l) {
-    if (s[l]) {
-      i = createElm(null, n, l);
+  for (;s <= l; ++s) {
+    if (r[s]) {
+      i = createElm(null, n, s);
       if (i) {
-        s[l]._$$elm$$_ = i;
+        r[s]._$$elm$$_ = i;
         insertBefore(o, i, t);
       }
     }
@@ -663,10 +682,11 @@ var addVnodes = (e, t, n, s, l, r) => {
 };
 
 var removeVnodes = (e, t, n) => {
-  for (let s = t; s <= n; ++s) {
-    const t = e[s];
+  for (let r = t; r <= n; ++r) {
+    const t = e[r];
     if (t) {
       const e = t._$$elm$$_;
+      nullifyVNodeRefs(t);
       if (e) {
         e.remove();
       }
@@ -674,50 +694,50 @@ var removeVnodes = (e, t, n) => {
   }
 };
 
-var updateChildren = (e, t, n, s, l = false) => {
-  let r = 0;
+var updateChildren = (e, t, n, r, s = false) => {
+  let l = 0;
   let o = 0;
   let i = 0;
   let a = 0;
   let f = t.length - 1;
   let c = t[0];
   let u = t[f];
-  let d = s.length - 1;
-  let v = s[0];
-  let p = s[d];
+  let d = r.length - 1;
+  let v = r[0];
+  let p = r[d];
   let m;
   let y;
-  while (r <= f && o <= d) {
+  while (l <= f && o <= d) {
     if (c == null) {
-      c = t[++r];
+      c = t[++l];
     } else if (u == null) {
       u = t[--f];
     } else if (v == null) {
-      v = s[++o];
+      v = r[++o];
     } else if (p == null) {
-      p = s[--d];
-    } else if (isSameVnode(c, v, l)) {
-      patch(c, v, l);
-      c = t[++r];
-      v = s[++o];
-    } else if (isSameVnode(u, p, l)) {
-      patch(u, p, l);
+      p = r[--d];
+    } else if (isSameVnode(c, v, s)) {
+      patch(c, v, s);
+      c = t[++l];
+      v = r[++o];
+    } else if (isSameVnode(u, p, s)) {
+      patch(u, p, s);
       u = t[--f];
-      p = s[--d];
-    } else if (isSameVnode(c, p, l)) {
-      patch(c, p, l);
+      p = r[--d];
+    } else if (isSameVnode(c, p, s)) {
+      patch(c, p, s);
       insertBefore(e, c._$$elm$$_, u._$$elm$$_.nextSibling);
-      c = t[++r];
-      p = s[--d];
-    } else if (isSameVnode(u, v, l)) {
-      patch(u, v, l);
+      c = t[++l];
+      p = r[--d];
+    } else if (isSameVnode(u, v, s)) {
+      patch(u, v, s);
       insertBefore(e, u._$$elm$$_, c._$$elm$$_);
       u = t[--f];
-      v = s[++o];
+      v = r[++o];
     } else {
       i = -1;
       {
-        for (a = r; a <= f; ++a) {
+        for (a = l; a <= f; ++a) {
           if (t[a] && t[a]._$$key$$_ !== null && t[a]._$$key$$_ === v._$$key$$_) {
             i = a;
             break;
@@ -729,14 +749,14 @@ var updateChildren = (e, t, n, s, l = false) => {
         if (y._$$tag$$_ !== v._$$tag$$_) {
           m = createElm(t && t[o], n, i);
         } else {
-          patch(y, v, l);
+          patch(y, v, s);
           t[i] = void 0;
           m = y._$$elm$$_;
         }
-        v = s[++o];
+        v = r[++o];
       } else {
         m = createElm(t && t[o], n, o);
-        v = s[++o];
+        v = r[++o];
       }
       if (m) {
         {
@@ -745,10 +765,10 @@ var updateChildren = (e, t, n, s, l = false) => {
       }
     }
   }
-  if (r > f) {
-    addVnodes(e, s[d + 1] == null ? null : s[d + 1]._$$elm$$_, n, s, o, d);
+  if (l > f) {
+    addVnodes(e, r[d + 1] == null ? null : r[d + 1]._$$elm$$_, n, r, o, d);
   } else if (o > d) {
-    removeVnodes(t, r, f);
+    removeVnodes(t, l, f);
   }
 };
 
@@ -765,31 +785,38 @@ var isSameVnode = (e, t, n = false) => {
   return false;
 };
 
-var patch = (e, n, s = false) => {
-  const l = n._$$elm$$_ = e._$$elm$$_;
-  const r = e._$$children$$_;
+var patch = (e, n, r = false) => {
+  const s = n._$$elm$$_ = e._$$elm$$_;
+  const l = e._$$children$$_;
   const o = n._$$children$$_;
   const i = n._$$text$$_;
   if (i === null) {
     {
       {
-        updateElement(e, n, O);
+        updateElement(e, n, D);
       }
     }
-    if (r !== null && o !== null) {
-      updateChildren(l, r, n, o, s);
+    if (l !== null && o !== null) {
+      updateChildren(s, l, n, o, r);
     } else if (o !== null) {
       if (e._$$text$$_ !== null) {
-        l.textContent = "";
+        s.textContent = "";
       }
-      addVnodes(l, null, n, o, 0, o.length - 1);
+      addVnodes(s, null, n, o, 0, o.length - 1);
     } else if (
     // don't do this on initial render as it can cause non-hydrated content to be removed
-    !s && t.updatable && r !== null) {
-      removeVnodes(r, 0, r.length - 1);
+    !r && t.updatable && l !== null) {
+      removeVnodes(l, 0, l.length - 1);
     }
   } else if (e._$$text$$_ !== i) {
-    l.data = i;
+    s.data = i;
+  }
+};
+
+var nullifyVNodeRefs = e => {
+  {
+    e._$$attrs$$_ && e._$$attrs$$_.ref && e._$$attrs$$_.ref(null);
+    e._$$children$$_ && e._$$children$$_.map(nullifyVNodeRefs);
   }
 };
 
@@ -800,32 +827,32 @@ var insertBefore = (e, t, n) => {
 };
 
 var renderVdom = (e, t, n = false) => {
-  const s = e.$hostElement$;
-  const l = e._$$cmpMeta$$_;
-  const r = e._$$vnode$$_ || newVNode(null, null);
+  const r = e.$hostElement$;
+  const s = e._$$cmpMeta$$_;
+  const l = e._$$vnode$$_ || newVNode(null, null);
   const o = isHost(t) ? t : h(null, null, t);
-  k = s.tagName;
+  k = r.tagName;
   if (n && o._$$attrs$$_) {
     for (const e of Object.keys(o._$$attrs$$_)) {
-      if (s.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e)) {
-        o._$$attrs$$_[e] = s[e];
+      if (r.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e)) {
+        o._$$attrs$$_[e] = r[e];
       }
     }
   }
   o._$$tag$$_ = null;
   o._$$flags$$_ |= 4 /* isHost */;
   e._$$vnode$$_ = o;
-  o._$$elm$$_ = r._$$elm$$_ = s.shadowRoot || s;
-  j = !!(l._$$flags$$_ & 1 /* shadowDomEncapsulation */) && !(l._$$flags$$_ & 128 /* shadowNeedsScopedCss */);
-  patch(r, o, n);
+  o._$$elm$$_ = l._$$elm$$_ = r.shadowRoot || r;
+  O = !!(s._$$flags$$_ & 1 /* shadowDomEncapsulation */) && !(s._$$flags$$_ & 128 /* shadowNeedsScopedCss */);
+  patch(l, o, n);
 };
 
 // src/runtime/update-component.ts
 var attachToAncestor = (e, t) => {
   if (t && !e._$$onRenderResolve$$_ && t["s-p"]) {
-    const n = t["s-p"].push(new Promise((s => e._$$onRenderResolve$$_ = () => {
+    const n = t["s-p"].push(new Promise((r => e._$$onRenderResolve$$_ = () => {
       t["s-p"].splice(n - 1, 1);
-      s();
+      r();
     })));
   }
 };
@@ -840,25 +867,35 @@ var scheduleUpdate = (e, t) => {
   }
   attachToAncestor(e, e._$$ancestorComponent$$_);
   const dispatch = () => dispatchHooks(e, t);
-  return y(dispatch);
+  return b(dispatch);
 };
 
 var dispatchHooks = (e, t) => {
   const n = e.$hostElement$;
-  const s = createTime("scheduleUpdate", e._$$cmpMeta$$_._$$tagName$$_);
-  const l = e._$$lazyInstance$$_;
-  if (!l) {
+  const r = createTime("scheduleUpdate", e._$$cmpMeta$$_._$$tagName$$_);
+  const s = e._$$lazyInstance$$_;
+  if (!s) {
     throw new Error(`Can't render component <${n.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);
   }
-  let r;
+  let l;
   if (t) {
+    {
+      e._$$flags$$_ |= 256 /* isListenReady */;
+      if (e._$$queuedListeners$$_) {
+        e._$$queuedListeners$$_.map((([e, t]) => safeCall(s, e, t, n)));
+        e._$$queuedListeners$$_ = void 0;
+      }
+    }
     emitLifecycleEvent(n, "componentWillLoad");
+    {
+      l = safeCall(s, "componentWillLoad", void 0, n);
+    }
   } else {
     emitLifecycleEvent(n, "componentWillUpdate");
   }
   emitLifecycleEvent(n, "componentWillRender");
-  s();
-  return enqueue(r, (() => updateComponent(e, l, t)));
+  r();
+  return enqueue(l, (() => updateComponent(e, s, t)));
 };
 
 var enqueue = (e, t) => isPromisey(e) ? e.then(t).catch((e => {
@@ -869,25 +906,25 @@ var enqueue = (e, t) => isPromisey(e) ? e.then(t).catch((e => {
 var isPromisey = e => e instanceof Promise || e && e.then && typeof e.then === "function";
 
 var updateComponent = async (e, t, n) => {
-  var s;
-  const l = e.$hostElement$;
-  const r = createTime("update", e._$$cmpMeta$$_._$$tagName$$_);
-  const o = l["s-rc"];
+  var r;
+  const s = e.$hostElement$;
+  const l = createTime("update", e._$$cmpMeta$$_._$$tagName$$_);
+  const o = s["s-rc"];
   if (n) {
     attachStyles(e);
   }
   const i = createTime("render", e._$$cmpMeta$$_._$$tagName$$_);
   {
-    callRender(e, t, l, n);
+    callRender(e, t, s, n);
   }
   if (o) {
     o.map((e => e()));
-    l["s-rc"] = void 0;
+    s["s-rc"] = void 0;
   }
   i();
-  r();
+  l();
   {
-    const t = (s = l["s-p"]) != null ? s : [];
+    const t = (r = s["s-p"]) != null ? r : [];
     const postUpdate = () => postUpdateComponent(e);
     if (t.length === 0) {
       postUpdate();
@@ -899,7 +936,7 @@ var updateComponent = async (e, t, n) => {
   }
 };
 
-var callRender = (e, t, n, s) => {
+var callRender = (e, t, n, r) => {
   try {
     t = t.render();
     {
@@ -911,7 +948,7 @@ var callRender = (e, t, n, s) => {
     {
       {
         {
-          renderVdom(e, t, s);
+          renderVdom(e, t, r);
         }
       }
     }
@@ -924,7 +961,8 @@ var callRender = (e, t, n, s) => {
 var postUpdateComponent = e => {
   const t = e._$$cmpMeta$$_._$$tagName$$_;
   const n = e.$hostElement$;
-  const s = createTime("postUpdate", t);
+  const r = createTime("postUpdate", t);
+  const s = e._$$lazyInstance$$_;
   const l = e._$$ancestorComponent$$_;
   emitLifecycleEvent(n, "componentDidRender");
   if (!(e._$$flags$$_ & 64 /* hasLoadedComponent */)) {
@@ -932,8 +970,11 @@ var postUpdateComponent = e => {
     {
       addHydratedFlag(n);
     }
+    {
+      safeCall(s, "componentDidLoad", void 0, n);
+    }
     emitLifecycleEvent(n, "componentDidLoad");
-    s();
+    r();
     {
       e._$$onReadyResolve$$_(n);
       if (!l) {
@@ -942,7 +983,7 @@ var postUpdateComponent = e => {
     }
   } else {
     emitLifecycleEvent(n, "componentDidUpdate");
-    s();
+    r();
   }
   {
     if (e._$$onRenderResolve$$_) {
@@ -964,6 +1005,17 @@ var appDidLoad = t => {
   })));
 };
 
+var safeCall = (e, t, n, r) => {
+  if (e && e[t]) {
+    try {
+      return e[t](n);
+    } catch (e) {
+      consoleError(e, r);
+    }
+  }
+  return void 0;
+};
+
 var emitLifecycleEvent = (t, n) => {
   {
     emitEvent(t, "stencil_" + n, {
@@ -984,39 +1036,39 @@ var addHydratedFlag = e => {
 // src/runtime/set-value.ts
 var getValue = (e, t) => getHostRef(e)._$$instanceValues$$_.get(t);
 
-var setValue = (e, t, n, s) => {
-  const l = getHostRef(e);
-  if (!l) {
-    throw new Error(`Couldn't find host element for "${s._$$tagName$$_}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/ionic-team/stencil/issues/5457).`);
-  }
-  const r = l._$$instanceValues$$_.get(t);
-  const o = l._$$flags$$_;
-  const i = l._$$lazyInstance$$_;
-  n = parsePropertyValue(n, s._$$members$$_[t][0]);
-  const a = Number.isNaN(r) && Number.isNaN(n);
-  const f = n !== r && !a;
-  if ((!(o & 8 /* isConstructingInstance */) || r === void 0) && f) {
-    l._$$instanceValues$$_.set(t, n);
+var setValue = (e, t, n, r) => {
+  const s = getHostRef(e);
+  if (!s) {
+    throw new Error(`Couldn't find host element for "${r._$$tagName$$_}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/ionic-team/stencil/issues/5457).`);
+  }
+  const l = s._$$instanceValues$$_.get(t);
+  const o = s._$$flags$$_;
+  const i = s._$$lazyInstance$$_;
+  n = parsePropertyValue(n, r._$$members$$_[t][0]);
+  const a = Number.isNaN(l) && Number.isNaN(n);
+  const f = n !== l && !a;
+  if ((!(o & 8 /* isConstructingInstance */) || l === void 0) && f) {
+    s._$$instanceValues$$_.set(t, n);
     if (i) {
       if ((o & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
-        scheduleUpdate(l, false);
+        scheduleUpdate(s, false);
       }
     }
   }
 };
 
 // src/runtime/proxy-component.ts
-var proxyComponent = (e, n, s) => {
-  var l, r;
+var proxyComponent = (e, n, r) => {
+  var s, l;
   const o = e.prototype;
   if (n._$$members$$_ || t.watchCallback) {
-    const i = Object.entries((l = n._$$members$$_) != null ? l : {});
+    const i = Object.entries((s = n._$$members$$_) != null ? s : {});
     i.map((([e, [t]]) => {
-      if (t & 31 /* Prop */ || s & 2 /* proxyState */ && t & 32 /* State */) {
-        const {get: l, set: r} = Object.getOwnPropertyDescriptor(o, e) || {};
-        if (l) n._$$members$$_[e][0] |= 2048 /* Getter */;
-        if (r) n._$$members$$_[e][0] |= 4096 /* Setter */;
-        if (s & 1 /* isElementConstructor */ || !l) {
+      if (t & 31 /* Prop */ || r & 2 /* proxyState */ && t & 32 /* State */) {
+        const {get: s, set: l} = Object.getOwnPropertyDescriptor(o, e) || {};
+        if (s) n._$$members$$_[e][0] |= 2048 /* Getter */;
+        if (l) n._$$members$$_[e][0] |= 4096 /* Setter */;
+        if (r & 1 /* isElementConstructor */ || !s) {
           Object.defineProperty(o, e, {
             get() {
               {
@@ -1024,9 +1076,9 @@ var proxyComponent = (e, n, s) => {
                   return getValue(this, e);
                 }
                 const t = getHostRef(this);
-                const s = t ? t._$$lazyInstance$$_ : o;
-                if (!s) return;
-                return s[e];
+                const r = t ? t._$$lazyInstance$$_ : o;
+                if (!r) return;
+                return r[e];
               }
             },
             configurable: true,
@@ -1034,38 +1086,38 @@ var proxyComponent = (e, n, s) => {
           });
         }
         Object.defineProperty(o, e, {
-          set(l) {
+          set(s) {
             const o = getHostRef(this);
-            if (r) {
-              const s = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
-              if (typeof s === "undefined" && o._$$instanceValues$$_.get(e)) {
-                l = o._$$instanceValues$$_.get(e);
-              } else if (!o._$$instanceValues$$_.get(e) && s) {
-                o._$$instanceValues$$_.set(e, s);
+            if (l) {
+              const r = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
+              if (typeof r === "undefined" && o._$$instanceValues$$_.get(e)) {
+                s = o._$$instanceValues$$_.get(e);
+              } else if (!o._$$instanceValues$$_.get(e) && r) {
+                o._$$instanceValues$$_.set(e, r);
               }
-              r.apply(this, [ parsePropertyValue(l, t) ]);
-              l = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
-              setValue(this, e, l, n);
+              l.apply(this, [ parsePropertyValue(s, t) ]);
+              s = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
+              setValue(this, e, s, n);
               return;
             }
             {
-              if ((s & 1 /* isElementConstructor */) === 0 || (n._$$members$$_[e][0] & 4096 /* Setter */) === 0) {
-                setValue(this, e, l, n);
-                if (s & 1 /* isElementConstructor */ && !o._$$lazyInstance$$_) {
+              if ((r & 1 /* isElementConstructor */) === 0 || (n._$$members$$_[e][0] & 4096 /* Setter */) === 0) {
+                setValue(this, e, s, n);
+                if (r & 1 /* isElementConstructor */ && !o._$$lazyInstance$$_) {
                   o._$$onReadyPromise$$_.then((() => {
                     if (n._$$members$$_[e][0] & 4096 /* Setter */ && o._$$lazyInstance$$_[e] !== o._$$instanceValues$$_.get(e)) {
-                      o._$$lazyInstance$$_[e] = l;
+                      o._$$lazyInstance$$_[e] = s;
                     }
                   }));
                 }
                 return;
               }
               const setterSetVal = () => {
-                const s = o._$$lazyInstance$$_[e];
-                if (!o._$$instanceValues$$_.get(e) && s) {
-                  o._$$instanceValues$$_.set(e, s);
+                const r = o._$$lazyInstance$$_[e];
+                if (!o._$$instanceValues$$_.get(e) && r) {
+                  o._$$instanceValues$$_.set(e, r);
                 }
-                o._$$lazyInstance$$_[e] = parsePropertyValue(l, t);
+                o._$$lazyInstance$$_[e] = parsePropertyValue(s, t);
                 setValue(this, e, o._$$lazyInstance$$_[e], n);
               };
               if (o._$$lazyInstance$$_) {
@@ -1078,43 +1130,43 @@ var proxyComponent = (e, n, s) => {
         });
       }
     }));
-    if (s & 1 /* isElementConstructor */) {
-      const s =  new Map;
-      o.attributeChangedCallback = function(e, l, r) {
+    if (r & 1 /* isElementConstructor */) {
+      const r =  new Map;
+      o.attributeChangedCallback = function(e, s, l) {
         u.jmp((() => {
           var i;
-          const a = s.get(e);
+          const a = r.get(e);
           if (this.hasOwnProperty(a) && t.lazyLoad) {
-            r = this[a];
+            l = this[a];
             delete this[a];
           } else if (o.hasOwnProperty(a) && typeof this[a] === "number" && // cast type to number to avoid TS compiler issues
-          this[a] == r) {
+          this[a] == l) {
             return;
           } else if (a == null) {
             const t = getHostRef(this);
-            const s = t == null ? void 0 : t._$$flags$$_;
-            if (s && !(s & 8 /* isConstructingInstance */) && s & 128 /* isWatchReady */ && r !== l) {
-              const s = t._$$lazyInstance$$_;
+            const r = t == null ? void 0 : t._$$flags$$_;
+            if (r && !(r & 8 /* isConstructingInstance */) && r & 128 /* isWatchReady */ && l !== s) {
+              const r = t._$$lazyInstance$$_;
               const o = (i = n._$$watchers$$_) == null ? void 0 : i[e];
               o == null ? void 0 : o.forEach((t => {
-                if (s[t] != null) {
-                  s[t].call(s, r, l, e);
+                if (r[t] != null) {
+                  r[t].call(r, l, s, e);
                 }
               }));
             }
             return;
           }
           const f = Object.getOwnPropertyDescriptor(o, a);
-          r = r === null && typeof this[a] === "boolean" ? false : r;
-          if (r !== this[a] && (!f.get || !!f.set)) {
-            this[a] = r;
+          l = l === null && typeof this[a] === "boolean" ? false : l;
+          if (l !== this[a] && (!f.get || !!f.set)) {
+            this[a] = l;
           }
         }));
       };
       e.observedAttributes = Array.from(
-       new Set([ ...Object.keys((r = n._$$watchers$$_) != null ? r : {}), ...i.filter((([e, t]) => t[0] & 15 /* HasAttribute */)).map((([e, t]) => {
+       new Set([ ...Object.keys((l = n._$$watchers$$_) != null ? l : {}), ...i.filter((([e, t]) => t[0] & 15 /* HasAttribute */)).map((([e, t]) => {
         const n = t[1] || e;
-        s.set(n, e);
+        r.set(n, e);
         return n;
       })) ]));
     }
@@ -1123,55 +1175,55 @@ var proxyComponent = (e, n, s) => {
 };
 
 // src/runtime/initialize-component.ts
-var initializeComponent = async (e, t, n, s) => {
-  let l;
+var initializeComponent = async (e, t, n, r) => {
+  let s;
   if ((t._$$flags$$_ & 32 /* hasInitializedComponent */) === 0) {
     t._$$flags$$_ |= 32 /* hasInitializedComponent */;
-    const s = n._$$lazyBundleId$$_;
-    if (s) {
-      const s = loadModule(n, t);
-      if (s && "then" in s) {
+    const r = n._$$lazyBundleId$$_;
+    if (r) {
+      const r = loadModule(n, t);
+      if (r && "then" in r) {
         const e = uniqueTime();
-        l = await s;
+        s = await r;
         e();
       } else {
-        l = s;
+        s = r;
       }
-      if (!l) {
+      if (!s) {
         throw new Error(`Constructor for "${n._$$tagName$$_}#${t._$$modeName$$_}" was not found`);
       }
-      if (!l.isProxied) {
-        proxyComponent(l, n, 2 /* proxyState */);
-        l.isProxied = true;
+      if (!s.isProxied) {
+        proxyComponent(s, n, 2 /* proxyState */);
+        s.isProxied = true;
       }
-      const r = createTime("createInstance", n._$$tagName$$_);
+      const l = createTime("createInstance", n._$$tagName$$_);
       {
         t._$$flags$$_ |= 8 /* isConstructingInstance */;
       }
       try {
-        new l(t);
+        new s(t);
       } catch (t) {
         consoleError(t, e);
       }
       {
         t._$$flags$$_ &= ~8 /* isConstructingInstance */;
       }
-      r();
+      l();
     } else {
-      l = e.constructor;
+      s = e.constructor;
       const n = e.localName;
       customElements.whenDefined(n).then((() => t._$$flags$$_ |= 128 /* isWatchReady */));
     }
-    if (l && l.style) {
+    if (s && s.style) {
       let e;
-      if (typeof l.style === "string") {
-        e = l.style;
+      if (typeof s.style === "string") {
+        e = s.style;
       }
       const t = getScopeId(n);
-      if (!r.has(t)) {
-        const s = createTime("registerStyles", n._$$tagName$$_);
+      if (!l.has(t)) {
+        const r = createTime("registerStyles", n._$$tagName$$_);
         registerStyle(t, e, !!(n._$$flags$$_ & 1 /* shadowDomEncapsulation */));
-        s();
+        r();
       }
     }
   }
@@ -1191,7 +1243,7 @@ var connectedCallback = e => {
   if ((u._$$flags$$_ & 1 /* isTmpDisconnected */) === 0) {
     const t = getHostRef(e);
     const n = t._$$cmpMeta$$_;
-    const s = createTime("connectedCallback", n._$$tagName$$_);
+    const r = createTime("connectedCallback", n._$$tagName$$_);
     if (!(t._$$flags$$_ & 1 /* hasConnected */)) {
       t._$$flags$$_ |= 1 /* hasConnected */;
       {
@@ -1216,11 +1268,12 @@ var connectedCallback = e => {
         initializeComponent(e, t, n);
       }
     } else {
+      addHostEventListeners(e, t, n._$$listeners$$_);
       if (t == null ? void 0 : t._$$lazyInstance$$_) ; else if (t == null ? void 0 : t._$$onReadyPromise$$_) {
         t._$$onReadyPromise$$_.then((() => fireConnectedCallback()));
       }
     }
-    s();
+    r();
   }
 };
 
@@ -1229,24 +1282,30 @@ var disconnectInstance = (e, t) => {};
 var disconnectedCallback = async e => {
   if ((u._$$flags$$_ & 1 /* isTmpDisconnected */) === 0) {
     const t = getHostRef(e);
+    {
+      if (t._$$rmListeners$$_) {
+        t._$$rmListeners$$_.map((e => e()));
+        t._$$rmListeners$$_ = void 0;
+      }
+    }
     if (t == null ? void 0 : t._$$lazyInstance$$_) ; else if (t == null ? void 0 : t._$$onReadyPromise$$_) {
       t._$$onReadyPromise$$_.then((() => disconnectInstance()));
     }
   }
-  if (S.has(e)) {
-    S.delete(e);
+  if (g.has(e)) {
+    g.delete(e);
   }
-  if (e.shadowRoot && S.has(e.shadowRoot)) {
-    S.delete(e.shadowRoot);
+  if (e.shadowRoot && g.has(e.shadowRoot)) {
+    g.delete(e.shadowRoot);
   }
 };
 
 // src/runtime/bootstrap-lazy.ts
 var bootstrapLazy = (e, t = {}) => {
   var n;
-  const s = createTime();
-  const l = [];
-  const r = t.exclude || [];
+  const r = createTime();
+  const s = [];
+  const l = t.exclude || [];
   const o = f.customElements;
   const d = c.head;
   const v =  d.querySelector("meta[charset]");
@@ -1271,7 +1330,10 @@ var bootstrapLazy = (e, t = {}) => {
       {
         n._$$members$$_ = t[2];
       }
-      const s = n._$$tagName$$_;
+      {
+        n._$$listeners$$_ = t[3];
+      }
+      const r = n._$$tagName$$_;
       const i = class extends HTMLElement {
         // StencilLazyHost
         constructor(e) {
@@ -1296,9 +1358,10 @@ var bootstrapLazy = (e, t = {}) => {
           }
         }
         connectedCallback() {
-          getHostRef(this);
+          const e = getHostRef(this);
           if (!this.hasRegisteredEventListeners) {
             this.hasRegisteredEventListeners = true;
+            addHostEventListeners(this, e, n._$$listeners$$_);
           }
           if (y) {
             clearTimeout(y);
@@ -1329,18 +1392,18 @@ var bootstrapLazy = (e, t = {}) => {
         }
       };
       n._$$lazyBundleId$$_ = e[0];
-      if (!r.includes(s) && !o.get(s)) {
-        l.push(s);
-        o.define(s, proxyComponent(i, n, 1 /* isElementConstructor */));
+      if (!l.includes(r) && !o.get(r)) {
+        s.push(r);
+        o.define(r, proxyComponent(i, n, 1 /* isElementConstructor */));
       }
     }));
   }));
-  if (l.length > 0) {
+  if (s.length > 0) {
     if (w) {
       p.textContent += a;
     }
     {
-      p.textContent += l.sort() + i;
+      p.textContent += s.sort() + i;
     }
     if (p.innerHTML.length) {
       p.setAttribute("data-styles", "");
@@ -1359,11 +1422,49 @@ var bootstrapLazy = (e, t = {}) => {
       u.jmp((() => y = setTimeout(appDidLoad, 30)));
     }
   }
-  s();
+  r();
 };
 
+var addHostEventListeners = (e, t, n, r) => {
+  if (n) {
+    n.map((([n, r, s]) => {
+      const l = getHostListenerTarget(e, n);
+      const o = hostListenerProxy(t, s);
+      const i = hostListenerOpts(n);
+      u.ael(l, r, o, i);
+      (t._$$rmListeners$$_ = t._$$rmListeners$$_ || []).push((() => u.rel(l, r, o, i)));
+    }));
+  }
+};
+
+var hostListenerProxy = (e, t) => n => {
+  var r;
+  try {
+    {
+      if (e._$$flags$$_ & 256 /* isListenReady */) {
+        (r = e._$$lazyInstance$$_) == null ? void 0 : r[t](n);
+      } else {
+        (e._$$queuedListeners$$_ = e._$$queuedListeners$$_ || []).push([ t, n ]);
+      }
+    }
+  } catch (t) {
+    consoleError(t, e.$hostElement$);
+  }
+};
+
+var getHostListenerTarget = (e, t) => {
+  if (t & 4 /* TargetDocument */) return c;
+  return e;
+};
+
+var hostListenerOpts = e => d ? {
+  passive: (e & 1 /* Passive */) !== 0,
+  capture: (e & 2 /* Capture */) !== 0
+} : (e & 2 /* Capture */) !== 0
 // src/runtime/nonce.ts
+;
+
 var setNonce = e => u._$$nonce$$_ = e;
 
-export { w as H, bootstrapLazy as b, createEvent as c, h, promiseResolve as p, registerInstance as r, setNonce as s };
-//# sourceMappingURL=p-cca32e44.js.map
+export { S as H, bootstrapLazy as b, createEvent as c, h, promiseResolve as p, registerInstance as r, setNonce as s };
+//# sourceMappingURL=p-fbee9d79.js.map