@sula-tech/webcomponents 0.2.0 → 0.3.0

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

@@ -63,7 +63,7 @@ const t = /* webcomponents */ {
   scriptDataOpts: false,
   shadowDelegatesFocus: false,
   shadowDom: true,
-  slot: false,
+  slot: true,
   slotChildNodesFix: false,
   slotRelocation: false,
   state: true,
@@ -80,7 +80,7 @@ const t = /* webcomponents */ {
   vdomPropOrAttr: true,
   vdomRef: true,
   vdomRender: true,
-  vdomStyle: false,
+  vdomStyle: true,
   vdomText: true,
   vdomXlink: false,
   watchCallback: false
@@ -91,19 +91,19 @@ const t = /* webcomponents */ {
  */ var n = Object.defineProperty;
 
 var __export = (e, t) => {
-  for (var r in t) n(e, r, {
-    get: t[r],
+  for (var s in t) n(e, s, {
+    get: t[s],
     enumerable: true
   });
 };
 
 // src/client/client-host-ref.ts
-var r =  new WeakMap;
+var s =  new WeakMap;
 
-var getHostRef = e => r.get(e);
+var getHostRef = e => s.get(e);
 
 var registerInstance = (e, t) => {
-  r.set(t._$$lazyInstance$$_ = e, t);
+  s.set(t._$$lazyInstance$$_ = e, t);
 };
 
 var registerHost = (e, t) => {
@@ -118,8 +118,8 @@ var registerHost = (e, t) => {
     e["s-p"] = [];
     e["s-rc"] = [];
   }
-  const s = r.set(e, n);
-  return s;
+  const r = s.set(e, n);
+  return r;
 };
 
 var isMemberInElement = (e, t) => t in e;
@@ -128,17 +128,17 @@ var consoleError = (e, t) => (0, console.error)(e, t)
 // src/client/client-load-module.ts
 ;
 
-var s =  new Map;
+var r =  new Map;
 
 var loadModule = (e, t, n) => {
-  const r = e._$$tagName$$_.replace(/-/g, "_");
+  const s = e._$$tagName$$_.replace(/-/g, "_");
   const l = e._$$lazyBundleId$$_;
   if (!l) {
     return void 0;
   }
-  const o = s.get(l);
+  const o = r.get(l);
   if (o) {
-    return o[r];
+    return o[s];
   }
   /*!__STENCIL_STATIC_IMPORT_SWITCH__*/  return import(
   /* @vite-ignore */
@@ -147,9 +147,9 @@ var loadModule = (e, t, n) => {
   /* webpackMode: "lazy" */
   `./${l}.entry.js${""}`).then((e => {
     {
-      s.set(l, e);
+      r.set(l, e);
     }
-    return e[r];
+    return e[s];
   }), (e => {
     consoleError(e, t.$hostElement$);
   }));
@@ -175,8 +175,8 @@ var u = {
   _$$resourcesUrl$$_: "",
   jmp: e => e(),
   raf: e => requestAnimationFrame(e),
-  ael: (e, t, n, r) => e.addEventListener(t, n, r),
-  rel: (e, t, n, r) => e.removeEventListener(t, n, r),
+  ael: (e, t, n, s) => e.addEventListener(t, n, s),
+  rel: (e, t, n, s) => e.removeEventListener(t, n, s),
   ce: (e, t) => new CustomEvent(e, t)
 };
 
@@ -252,8 +252,8 @@ var isComplexType = e => {
 
 // src/utils/query-nonce-meta-tag-content.ts
 function queryNonceMetaTagContent(e) {
-  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;
+  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;
 }
 
 // src/utils/result.ts
@@ -324,24 +324,24 @@ var uniqueTime = (e, t) => {
 };
 
 var h = (e, t, ...n) => {
-  let r = null;
   let s = null;
+  let r = null;
   let l = false;
   let o = false;
   const i = [];
   const walk = t => {
     for (let n = 0; n < t.length; n++) {
-      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);
+      s = t[n];
+      if (Array.isArray(s)) {
+        walk(s);
+      } else if (s != null && typeof s !== "boolean") {
+        if (l = typeof e !== "function" && !isComplexType(s)) {
+          s = String(s);
         }
         if (l && o) {
-          i[i.length - 1]._$$text$$_ += r;
+          i[i.length - 1]._$$text$$_ += s;
         } else {
-          i.push(l ? newVNode(null, r) : r);
+          i.push(l ? newVNode(null, s) : s);
         }
         o = l;
       }
@@ -350,7 +350,7 @@ var h = (e, t, ...n) => {
   walk(n);
   if (t) {
     if (t.key) {
-      s = t.key;
+      r = t.key;
     }
     {
       const e = t.className || t.class;
@@ -365,7 +365,7 @@ var h = (e, t, ...n) => {
     a._$$children$$_ = i;
   }
   {
-    a._$$key$$_ = s;
+    a._$$key$$_ = r;
   }
   return a;
 };
@@ -412,9 +412,9 @@ var getElement = e => getHostRef(e).$hostElement$
 ;
 
 var createEvent = (e, t, n) => {
-  const r = getElement(e);
+  const s = getElement(e);
   return {
-    emit: e => emitEvent(r, t, {
+    emit: e => emitEvent(s, t, {
       bubbles: !!(n & 4 /* Bubbles */),
       composed: !!(n & 2 /* Composed */),
       cancelable: !!(n & 1 /* Cancellable */),
@@ -424,32 +424,32 @@ var createEvent = (e, t, n) => {
 };
 
 var emitEvent = (e, t, n) => {
-  const r = u.ce(t, n);
-  e.dispatchEvent(r);
-  return r;
+  const s = u.ce(t, n);
+  e.dispatchEvent(s);
+  return s;
 };
 
 var g =  new WeakMap;
 
 var registerStyle = (e, t, n) => {
-  let r = l.get(e);
+  let s = l.get(e);
   if (v && n) {
-    r = r || new CSSStyleSheet;
-    if (typeof r === "string") {
-      r = t;
+    s = s || new CSSStyleSheet;
+    if (typeof s === "string") {
+      s = t;
     } else {
-      r.replaceSync(t);
+      s.replaceSync(t);
     }
   } else {
-    r = t;
+    s = t;
   }
-  l.set(e, r);
+  l.set(e, s);
 };
 
 var addStyle = (e, t, n) => {
-  var r;
-  const s = getScopeId(t);
-  const i = l.get(s);
+  var s;
+  const r = getScopeId(t);
+  const i = l.get(r);
   e = e.nodeType === 11 /* DocumentFragment */ ? e : c;
   if (i) {
     if (typeof i === "string") {
@@ -459,11 +459,11 @@ var addStyle = (e, t, n) => {
       if (!n) {
         g.set(e, n =  new Set);
       }
-      if (!n.has(s)) {
+      if (!n.has(r)) {
         {
-          l = document.querySelector(`[${o}="${s}"]`) || c.createElement("style");
+          l = document.querySelector(`[${o}="${r}"]`) || c.createElement("style");
           l.innerHTML = i;
-          const n = (r = u._$$nonce$$_) != null ? r : queryNonceMetaTagContent(c);
+          const n = (s = u._$$nonce$$_) != null ? s : queryNonceMetaTagContent(c);
           if (n != null) {
             l.setAttribute("nonce", n);
           }
@@ -497,46 +497,67 @@ var addStyle = (e, t, n) => {
           l.innerHTML += a;
         }
         if (n) {
-          n.add(s);
+          n.add(r);
         }
       }
     } else if (!e.adoptedStyleSheets.includes(i)) {
       e.adoptedStyleSheets = [ ...e.adoptedStyleSheets, i ];
     }
   }
-  return s;
+  return r;
 };
 
 var attachStyles = e => {
   const t = e._$$cmpMeta$$_;
   const n = e.$hostElement$;
-  const r = t._$$flags$$_;
-  const s = createTime("attachStyles", t._$$tagName$$_);
+  const s = t._$$flags$$_;
+  const r = createTime("attachStyles", t._$$tagName$$_);
   const l = addStyle(n.shadowRoot ? n.shadowRoot : n.getRootNode(), t);
-  if (r & 10 /* needsScopedEncapsulation */ && r & 2 /* scopedCssEncapsulation */ || r & 128 /* shadowNeedsScopedCss */) {
+  if (s & 10 /* needsScopedEncapsulation */ && s & 2 /* scopedCssEncapsulation */ || s & 128 /* shadowNeedsScopedCss */) {
     n["s-sc"] = l;
     n.classList.add(l + "-h");
   }
-  s();
+  r();
 };
 
 var getScopeId = (e, t) => "sc-" + e._$$tagName$$_;
 
-var setAccessor = (e, t, n, r, s, l, o) => {
-  if (n !== r) {
+var setAccessor = (e, t, n, s, r, l, o) => {
+  if (n !== s) {
     let o = isMemberInElement(e, t);
     let i = t.toLowerCase();
     if (t === "class") {
       const t = e.classList;
-      const s = parseClassList(n);
-      let l = parseClassList(r);
+      const r = parseClassList(n);
+      let l = parseClassList(s);
       {
-        t.remove(...s.filter((e => e && !l.includes(e))));
-        t.add(...l.filter((e => e && !s.includes(e))));
+        t.remove(...r.filter((e => e && !l.includes(e))));
+        t.add(...l.filter((e => e && !r.includes(e))));
+      }
+    } else if (t === "style") {
+      {
+        for (const t in n) {
+          if (!s || s[t] == null) {
+            if (t.includes("-")) {
+              e.style.removeProperty(t);
+            } else {
+              e.style[t] = "";
+            }
+          }
+        }
+      }
+      for (const t in s) {
+        if (!n || s[t] !== n[t]) {
+          if (t.includes("-")) {
+            e.style.setProperty(t, s[t]);
+          } else {
+            e.style[t] = s[t];
+          }
+        }
       }
     } else if (t === "key") ; else if (t === "ref") {
-      if (r) {
-        r(e);
+      if (s) {
+        s(e);
       }
     } else if (!o && t[0] === "o" && t[1] === "n") {
       if (t[2] === "-") {
@@ -546,46 +567,46 @@ var setAccessor = (e, t, n, r, s, l, o) => {
       } else {
         t = i[2] + t.slice(3);
       }
-      if (n || r) {
-        const s = t.endsWith(C);
+      if (n || s) {
+        const r = t.endsWith(C);
         t = t.replace(j, "");
         if (n) {
-          u.rel(e, t, n, s);
+          u.rel(e, t, n, r);
         }
-        if (r) {
-          u.ael(e, t, r, s);
+        if (s) {
+          u.ael(e, t, s, r);
         }
       }
     } else {
-      const i = isComplexType(r);
-      if ((o || i && r !== null) && !s) {
+      const i = isComplexType(s);
+      if ((o || i && s !== null) && !r) {
         try {
           if (!e.tagName.includes("-")) {
-            const s = r == null ? "" : r;
+            const r = s == null ? "" : s;
             if (t === "list") {
               o = false;
-            } else if (n == null || e[t] != s) {
+            } else if (n == null || e[t] != r) {
               if (typeof e.__lookupSetter__(t) === "function") {
-                e[t] = s;
+                e[t] = r;
               } else {
-                e.setAttribute(t, s);
+                e.setAttribute(t, r);
               }
             }
-          } else if (e[t] !== r) {
-            e[t] = r;
+          } else if (e[t] !== s) {
+            e[t] = s;
           }
         } catch (e) {}
       }
-      if (r == null || r === false) {
-        if (r !== false || e.getAttribute(t) === "") {
+      if (s == null || s === false) {
+        if (s !== false || e.getAttribute(t) === "") {
           {
             e.removeAttribute(t);
           }
         }
-      } else if ((!o || l & 4 /* isHost */ || s) && !i) {
-        r = r === true ? "" : r;
+      } else if ((!o || l & 4 /* isHost */ || r) && !i) {
+        s = s === true ? "" : s;
         {
-          e.setAttribute(t, r);
+          e.setAttribute(t, s);
         }
       }
     }
@@ -609,19 +630,19 @@ var C = "Capture";
 var j = new RegExp(C + "$");
 
 // src/runtime/vdom/update-element.ts
-var updateElement = (e, t, n, r) => {
-  const s = t._$$elm$$_.nodeType === 11 /* DocumentFragment */ && t._$$elm$$_.host ? t._$$elm$$_.host : t._$$elm$$_;
+var updateElement = (e, t, n, s) => {
+  const r = 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(l))) {
       if (!(e in o)) {
-        setAccessor(s, e, l[e], void 0, n, t._$$flags$$_);
+        setAccessor(r, e, l[e], void 0, n, t._$$flags$$_);
       }
     }
   }
   for (const e of sortedAttrNames(Object.keys(o))) {
-    setAccessor(s, e, l[e], o[e], n, t._$$flags$$_);
+    setAccessor(r, e, l[e], o[e], n, t._$$flags$$_);
   }
 };
 
@@ -639,21 +660,21 @@ var O = false;
 
 var D = false;
 
-var createElm = (e, n, r) => {
-  const s = n._$$children$$_[r];
+var createElm = (e, n, s) => {
+  const r = n._$$children$$_[s];
   let l = 0;
   let o;
   let i;
-  if (s._$$text$$_ !== null) {
-    o = s._$$elm$$_ = c.createTextNode(s._$$text$$_);
+  if (r._$$text$$_ !== null) {
+    o = r._$$elm$$_ = c.createTextNode(r._$$text$$_);
   } else {
-    o = s._$$elm$$_ = c.createElement(!O && t.slotRelocation && s._$$flags$$_ & 2 /* isSlotFallback */ ? "slot-fb" : s._$$tag$$_);
+    o = r._$$elm$$_ = c.createElement(!O && t.slotRelocation && r._$$flags$$_ & 2 /* isSlotFallback */ ? "slot-fb" : r._$$tag$$_);
     {
-      updateElement(null, s, D);
+      updateElement(null, r, D);
     }
-    if (s._$$children$$_) {
-      for (l = 0; l < s._$$children$$_.length; ++l) {
-        i = createElm(e, s, l);
+    if (r._$$children$$_) {
+      for (l = 0; l < r._$$children$$_.length; ++l) {
+        i = createElm(e, r, l);
         if (i) {
           o.appendChild(i);
         }
@@ -664,17 +685,17 @@ var createElm = (e, n, r) => {
   return o;
 };
 
-var addVnodes = (e, t, n, r, s, l) => {
+var addVnodes = (e, t, n, s, r, l) => {
   let o = e;
   let i;
   if (o.shadowRoot && o.tagName === k) {
     o = o.shadowRoot;
   }
-  for (;s <= l; ++s) {
-    if (r[s]) {
-      i = createElm(null, n, s);
+  for (;r <= l; ++r) {
+    if (s[r]) {
+      i = createElm(null, n, r);
       if (i) {
-        r[s]._$$elm$$_ = i;
+        s[r]._$$elm$$_ = i;
         insertBefore(o, i, t);
       }
     }
@@ -682,8 +703,8 @@ var addVnodes = (e, t, n, r, s, l) => {
 };
 
 var removeVnodes = (e, t, n) => {
-  for (let r = t; r <= n; ++r) {
-    const t = e[r];
+  for (let s = t; s <= n; ++s) {
+    const t = e[s];
     if (t) {
       const e = t._$$elm$$_;
       nullifyVNodeRefs(t);
@@ -694,7 +715,7 @@ var removeVnodes = (e, t, n) => {
   }
 };
 
-var updateChildren = (e, t, n, r, s = false) => {
+var updateChildren = (e, t, n, s, r = false) => {
   let l = 0;
   let o = 0;
   let i = 0;
@@ -702,9 +723,9 @@ var updateChildren = (e, t, n, r, s = false) => {
   let f = t.length - 1;
   let c = t[0];
   let u = t[f];
-  let d = r.length - 1;
-  let v = r[0];
-  let p = r[d];
+  let d = s.length - 1;
+  let v = s[0];
+  let p = s[d];
   let m;
   let y;
   while (l <= f && o <= d) {
@@ -713,27 +734,27 @@ var updateChildren = (e, t, n, r, s = false) => {
     } else if (u == null) {
       u = t[--f];
     } else if (v == null) {
-      v = r[++o];
+      v = s[++o];
     } else if (p == null) {
-      p = r[--d];
-    } else if (isSameVnode(c, v, s)) {
-      patch(c, v, s);
+      p = s[--d];
+    } else if (isSameVnode(c, v, r)) {
+      patch(c, v, r);
       c = t[++l];
-      v = r[++o];
-    } else if (isSameVnode(u, p, s)) {
-      patch(u, p, s);
+      v = s[++o];
+    } else if (isSameVnode(u, p, r)) {
+      patch(u, p, r);
       u = t[--f];
-      p = r[--d];
-    } else if (isSameVnode(c, p, s)) {
-      patch(c, p, s);
+      p = s[--d];
+    } else if (isSameVnode(c, p, r)) {
+      patch(c, p, r);
       insertBefore(e, c._$$elm$$_, u._$$elm$$_.nextSibling);
       c = t[++l];
-      p = r[--d];
-    } else if (isSameVnode(u, v, s)) {
-      patch(u, v, s);
+      p = s[--d];
+    } else if (isSameVnode(u, v, r)) {
+      patch(u, v, r);
       insertBefore(e, u._$$elm$$_, c._$$elm$$_);
       u = t[--f];
-      v = r[++o];
+      v = s[++o];
     } else {
       i = -1;
       {
@@ -749,14 +770,14 @@ var updateChildren = (e, t, n, r, s = false) => {
         if (y._$$tag$$_ !== v._$$tag$$_) {
           m = createElm(t && t[o], n, i);
         } else {
-          patch(y, v, s);
+          patch(y, v, r);
           t[i] = void 0;
           m = y._$$elm$$_;
         }
-        v = r[++o];
+        v = s[++o];
       } else {
         m = createElm(t && t[o], n, o);
-        v = r[++o];
+        v = s[++o];
       }
       if (m) {
         {
@@ -766,7 +787,7 @@ var updateChildren = (e, t, n, r, s = false) => {
     }
   }
   if (l > f) {
-    addVnodes(e, r[d + 1] == null ? null : r[d + 1]._$$elm$$_, n, r, o, d);
+    addVnodes(e, s[d + 1] == null ? null : s[d + 1]._$$elm$$_, n, s, o, d);
   } else if (o > d) {
     removeVnodes(t, l, f);
   }
@@ -785,31 +806,32 @@ var isSameVnode = (e, t, n = false) => {
   return false;
 };
 
-var patch = (e, n, r = false) => {
-  const s = n._$$elm$$_ = e._$$elm$$_;
+var patch = (e, n, s = false) => {
+  const r = n._$$elm$$_ = e._$$elm$$_;
   const l = e._$$children$$_;
   const o = n._$$children$$_;
-  const i = n._$$text$$_;
-  if (i === null) {
+  const i = n._$$tag$$_;
+  const a = n._$$text$$_;
+  if (a === null) {
     {
-      {
+      if (i === "slot" && !O) ; else {
         updateElement(e, n, D);
       }
     }
     if (l !== null && o !== null) {
-      updateChildren(s, l, n, o, r);
+      updateChildren(r, l, n, o, s);
     } else if (o !== null) {
       if (e._$$text$$_ !== null) {
-        s.textContent = "";
+        r.textContent = "";
       }
-      addVnodes(s, null, n, o, 0, o.length - 1);
+      addVnodes(r, 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
-    !r && t.updatable && l !== null) {
+    !s && t.updatable && l !== null) {
       removeVnodes(l, 0, l.length - 1);
     }
-  } else if (e._$$text$$_ !== i) {
-    s.data = i;
+  } else if (e._$$text$$_ !== a) {
+    r.data = a;
   }
 };
 
@@ -827,32 +849,32 @@ var insertBefore = (e, t, n) => {
 };
 
 var renderVdom = (e, t, n = false) => {
-  const r = e.$hostElement$;
-  const s = e._$$cmpMeta$$_;
+  const s = e.$hostElement$;
+  const r = e._$$cmpMeta$$_;
   const l = e._$$vnode$$_ || newVNode(null, null);
   const o = isHost(t) ? t : h(null, null, t);
-  k = r.tagName;
+  k = s.tagName;
   if (n && o._$$attrs$$_) {
     for (const e of Object.keys(o._$$attrs$$_)) {
-      if (r.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e)) {
-        o._$$attrs$$_[e] = r[e];
+      if (s.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e)) {
+        o._$$attrs$$_[e] = s[e];
       }
     }
   }
   o._$$tag$$_ = null;
   o._$$flags$$_ |= 4 /* isHost */;
   e._$$vnode$$_ = o;
-  o._$$elm$$_ = l._$$elm$$_ = r.shadowRoot || r;
-  O = !!(s._$$flags$$_ & 1 /* shadowDomEncapsulation */) && !(s._$$flags$$_ & 128 /* shadowNeedsScopedCss */);
+  o._$$elm$$_ = l._$$elm$$_ = s.shadowRoot || s;
+  O = !!(r._$$flags$$_ & 1 /* shadowDomEncapsulation */) && !(r._$$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((r => e._$$onRenderResolve$$_ = () => {
+    const n = t["s-p"].push(new Promise((s => e._$$onRenderResolve$$_ = () => {
       t["s-p"].splice(n - 1, 1);
-      r();
+      s();
     })));
   }
 };
@@ -872,9 +894,9 @@ var scheduleUpdate = (e, t) => {
 
 var dispatchHooks = (e, t) => {
   const n = e.$hostElement$;
-  const r = createTime("scheduleUpdate", e._$$cmpMeta$$_._$$tagName$$_);
-  const s = e._$$lazyInstance$$_;
-  if (!s) {
+  const s = createTime("scheduleUpdate", e._$$cmpMeta$$_._$$tagName$$_);
+  const r = e._$$lazyInstance$$_;
+  if (!r) {
     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 l;
@@ -882,20 +904,20 @@ var dispatchHooks = (e, t) => {
     {
       e._$$flags$$_ |= 256 /* isListenReady */;
       if (e._$$queuedListeners$$_) {
-        e._$$queuedListeners$$_.map((([e, t]) => safeCall(s, e, t, n)));
+        e._$$queuedListeners$$_.map((([e, t]) => safeCall(r, e, t, n)));
         e._$$queuedListeners$$_ = void 0;
       }
     }
     emitLifecycleEvent(n, "componentWillLoad");
     {
-      l = safeCall(s, "componentWillLoad", void 0, n);
+      l = safeCall(r, "componentWillLoad", void 0, n);
     }
   } else {
     emitLifecycleEvent(n, "componentWillUpdate");
   }
   emitLifecycleEvent(n, "componentWillRender");
-  r();
-  return enqueue(l, (() => updateComponent(e, s, t)));
+  s();
+  return enqueue(l, (() => updateComponent(e, r, t)));
 };
 
 var enqueue = (e, t) => isPromisey(e) ? e.then(t).catch((e => {
@@ -906,25 +928,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 r;
-  const s = e.$hostElement$;
+  var s;
+  const r = e.$hostElement$;
   const l = createTime("update", e._$$cmpMeta$$_._$$tagName$$_);
-  const o = s["s-rc"];
+  const o = r["s-rc"];
   if (n) {
     attachStyles(e);
   }
   const i = createTime("render", e._$$cmpMeta$$_._$$tagName$$_);
   {
-    callRender(e, t, s, n);
+    callRender(e, t, r, n);
   }
   if (o) {
     o.map((e => e()));
-    s["s-rc"] = void 0;
+    r["s-rc"] = void 0;
   }
   i();
   l();
   {
-    const t = (r = s["s-p"]) != null ? r : [];
+    const t = (s = r["s-p"]) != null ? s : [];
     const postUpdate = () => postUpdateComponent(e);
     if (t.length === 0) {
       postUpdate();
@@ -936,7 +958,7 @@ var updateComponent = async (e, t, n) => {
   }
 };
 
-var callRender = (e, t, n, r) => {
+var callRender = (e, t, n, s) => {
   try {
     t = t.render();
     {
@@ -948,7 +970,7 @@ var callRender = (e, t, n, r) => {
     {
       {
         {
-          renderVdom(e, t, r);
+          renderVdom(e, t, s);
         }
       }
     }
@@ -961,8 +983,8 @@ var callRender = (e, t, n, r) => {
 var postUpdateComponent = e => {
   const t = e._$$cmpMeta$$_._$$tagName$$_;
   const n = e.$hostElement$;
-  const r = createTime("postUpdate", t);
-  const s = e._$$lazyInstance$$_;
+  const s = createTime("postUpdate", t);
+  const r = e._$$lazyInstance$$_;
   const l = e._$$ancestorComponent$$_;
   emitLifecycleEvent(n, "componentDidRender");
   if (!(e._$$flags$$_ & 64 /* hasLoadedComponent */)) {
@@ -971,10 +993,10 @@ var postUpdateComponent = e => {
       addHydratedFlag(n);
     }
     {
-      safeCall(s, "componentDidLoad", void 0, n);
+      safeCall(r, "componentDidLoad", void 0, n);
     }
     emitLifecycleEvent(n, "componentDidLoad");
-    r();
+    s();
     {
       e._$$onReadyResolve$$_(n);
       if (!l) {
@@ -983,7 +1005,7 @@ var postUpdateComponent = e => {
     }
   } else {
     emitLifecycleEvent(n, "componentDidUpdate");
-    r();
+    s();
   }
   {
     if (e._$$onRenderResolve$$_) {
@@ -1005,12 +1027,12 @@ var appDidLoad = t => {
   })));
 };
 
-var safeCall = (e, t, n, r) => {
+var safeCall = (e, t, n, s) => {
   if (e && e[t]) {
     try {
       return e[t](n);
     } catch (e) {
-      consoleError(e, r);
+      consoleError(e, s);
     }
   }
   return void 0;
@@ -1036,39 +1058,39 @@ var addHydratedFlag = e => {
 // src/runtime/set-value.ts
 var getValue = (e, t) => getHostRef(e)._$$instanceValues$$_.get(t);
 
-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).`);
+var setValue = (e, t, n, s) => {
+  const r = getHostRef(e);
+  if (!r) {
+    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 l = s._$$instanceValues$$_.get(t);
-  const o = s._$$flags$$_;
-  const i = s._$$lazyInstance$$_;
-  n = parsePropertyValue(n, r._$$members$$_[t][0]);
+  const l = r._$$instanceValues$$_.get(t);
+  const o = r._$$flags$$_;
+  const i = r._$$lazyInstance$$_;
+  n = parsePropertyValue(n, s._$$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);
+    r._$$instanceValues$$_.set(t, n);
     if (i) {
       if ((o & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
-        scheduleUpdate(s, false);
+        scheduleUpdate(r, false);
       }
     }
   }
 };
 
 // src/runtime/proxy-component.ts
-var proxyComponent = (e, n, r) => {
-  var s, l;
+var proxyComponent = (e, n, s) => {
+  var r, l;
   const o = e.prototype;
   if (n._$$members$$_ || t.watchCallback) {
-    const i = Object.entries((s = n._$$members$$_) != null ? s : {});
+    const i = Object.entries((r = n._$$members$$_) != null ? r : {});
     i.map((([e, [t]]) => {
-      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 (t & 31 /* Prop */ || s & 2 /* proxyState */ && t & 32 /* State */) {
+        const {get: r, set: l} = Object.getOwnPropertyDescriptor(o, e) || {};
+        if (r) n._$$members$$_[e][0] |= 2048 /* Getter */;
         if (l) n._$$members$$_[e][0] |= 4096 /* Setter */;
-        if (r & 1 /* isElementConstructor */ || !s) {
+        if (s & 1 /* isElementConstructor */ || !r) {
           Object.defineProperty(o, e, {
             get() {
               {
@@ -1076,9 +1098,9 @@ var proxyComponent = (e, n, r) => {
                   return getValue(this, e);
                 }
                 const t = getHostRef(this);
-                const r = t ? t._$$lazyInstance$$_ : o;
-                if (!r) return;
-                return r[e];
+                const s = t ? t._$$lazyInstance$$_ : o;
+                if (!s) return;
+                return s[e];
               }
             },
             configurable: true,
@@ -1086,38 +1108,38 @@ var proxyComponent = (e, n, r) => {
           });
         }
         Object.defineProperty(o, e, {
-          set(s) {
+          set(r) {
             const o = getHostRef(this);
             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);
+              const s = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
+              if (typeof s === "undefined" && o._$$instanceValues$$_.get(e)) {
+                r = o._$$instanceValues$$_.get(e);
+              } else if (!o._$$instanceValues$$_.get(e) && s) {
+                o._$$instanceValues$$_.set(e, s);
               }
-              l.apply(this, [ parsePropertyValue(s, t) ]);
-              s = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
-              setValue(this, e, s, n);
+              l.apply(this, [ parsePropertyValue(r, t) ]);
+              r = t & 32 /* State */ ? this[e] : o.$hostElement$[e];
+              setValue(this, e, r, n);
               return;
             }
             {
-              if ((r & 1 /* isElementConstructor */) === 0 || (n._$$members$$_[e][0] & 4096 /* Setter */) === 0) {
-                setValue(this, e, s, n);
-                if (r & 1 /* isElementConstructor */ && !o._$$lazyInstance$$_) {
+              if ((s & 1 /* isElementConstructor */) === 0 || (n._$$members$$_[e][0] & 4096 /* Setter */) === 0) {
+                setValue(this, e, r, n);
+                if (s & 1 /* isElementConstructor */ && !o._$$lazyInstance$$_) {
                   o._$$onReadyPromise$$_.then((() => {
                     if (n._$$members$$_[e][0] & 4096 /* Setter */ && o._$$lazyInstance$$_[e] !== o._$$instanceValues$$_.get(e)) {
-                      o._$$lazyInstance$$_[e] = s;
+                      o._$$lazyInstance$$_[e] = r;
                     }
                   }));
                 }
                 return;
               }
               const setterSetVal = () => {
-                const r = o._$$lazyInstance$$_[e];
-                if (!o._$$instanceValues$$_.get(e) && r) {
-                  o._$$instanceValues$$_.set(e, r);
+                const s = o._$$lazyInstance$$_[e];
+                if (!o._$$instanceValues$$_.get(e) && s) {
+                  o._$$instanceValues$$_.set(e, s);
                 }
-                o._$$lazyInstance$$_[e] = parsePropertyValue(s, t);
+                o._$$lazyInstance$$_[e] = parsePropertyValue(r, t);
                 setValue(this, e, o._$$lazyInstance$$_[e], n);
               };
               if (o._$$lazyInstance$$_) {
@@ -1130,12 +1152,12 @@ var proxyComponent = (e, n, r) => {
         });
       }
     }));
-    if (r & 1 /* isElementConstructor */) {
-      const r =  new Map;
-      o.attributeChangedCallback = function(e, s, l) {
+    if (s & 1 /* isElementConstructor */) {
+      const s =  new Map;
+      o.attributeChangedCallback = function(e, r, l) {
         u.jmp((() => {
           var i;
-          const a = r.get(e);
+          const a = s.get(e);
           if (this.hasOwnProperty(a) && t.lazyLoad) {
             l = this[a];
             delete this[a];
@@ -1144,13 +1166,13 @@ var proxyComponent = (e, n, r) => {
             return;
           } else if (a == null) {
             const t = getHostRef(this);
-            const r = t == null ? void 0 : t._$$flags$$_;
-            if (r && !(r & 8 /* isConstructingInstance */) && r & 128 /* isWatchReady */ && l !== s) {
-              const r = t._$$lazyInstance$$_;
+            const s = t == null ? void 0 : t._$$flags$$_;
+            if (s && !(s & 8 /* isConstructingInstance */) && s & 128 /* isWatchReady */ && l !== r) {
+              const s = t._$$lazyInstance$$_;
               const o = (i = n._$$watchers$$_) == null ? void 0 : i[e];
               o == null ? void 0 : o.forEach((t => {
-                if (r[t] != null) {
-                  r[t].call(r, l, s, e);
+                if (s[t] != null) {
+                  s[t].call(s, l, r, e);
                 }
               }));
             }
@@ -1166,7 +1188,7 @@ var proxyComponent = (e, n, r) => {
       e.observedAttributes = Array.from(
        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;
-        r.set(n, e);
+        s.set(n, e);
         return n;
       })) ]));
     }
@@ -1175,33 +1197,33 @@ var proxyComponent = (e, n, r) => {
 };
 
 // src/runtime/initialize-component.ts
-var initializeComponent = async (e, t, n, r) => {
-  let s;
+var initializeComponent = async (e, t, n, s) => {
+  let r;
   if ((t._$$flags$$_ & 32 /* hasInitializedComponent */) === 0) {
     t._$$flags$$_ |= 32 /* hasInitializedComponent */;
-    const r = n._$$lazyBundleId$$_;
-    if (r) {
-      const r = loadModule(n, t);
-      if (r && "then" in r) {
+    const s = n._$$lazyBundleId$$_;
+    if (s) {
+      const s = loadModule(n, t);
+      if (s && "then" in s) {
         const e = uniqueTime();
-        s = await r;
+        r = await s;
         e();
       } else {
-        s = r;
+        r = s;
       }
-      if (!s) {
+      if (!r) {
         throw new Error(`Constructor for "${n._$$tagName$$_}#${t._$$modeName$$_}" was not found`);
       }
-      if (!s.isProxied) {
-        proxyComponent(s, n, 2 /* proxyState */);
-        s.isProxied = true;
+      if (!r.isProxied) {
+        proxyComponent(r, n, 2 /* proxyState */);
+        r.isProxied = true;
       }
       const l = createTime("createInstance", n._$$tagName$$_);
       {
         t._$$flags$$_ |= 8 /* isConstructingInstance */;
       }
       try {
-        new s(t);
+        new r(t);
       } catch (t) {
         consoleError(t, e);
       }
@@ -1210,20 +1232,20 @@ var initializeComponent = async (e, t, n, r) => {
       }
       l();
     } else {
-      s = e.constructor;
+      r = e.constructor;
       const n = e.localName;
       customElements.whenDefined(n).then((() => t._$$flags$$_ |= 128 /* isWatchReady */));
     }
-    if (s && s.style) {
+    if (r && r.style) {
       let e;
-      if (typeof s.style === "string") {
-        e = s.style;
+      if (typeof r.style === "string") {
+        e = r.style;
       }
       const t = getScopeId(n);
       if (!l.has(t)) {
-        const r = createTime("registerStyles", n._$$tagName$$_);
+        const s = createTime("registerStyles", n._$$tagName$$_);
         registerStyle(t, e, !!(n._$$flags$$_ & 1 /* shadowDomEncapsulation */));
-        r();
+        s();
       }
     }
   }
@@ -1243,7 +1265,7 @@ var connectedCallback = e => {
   if ((u._$$flags$$_ & 1 /* isTmpDisconnected */) === 0) {
     const t = getHostRef(e);
     const n = t._$$cmpMeta$$_;
-    const r = createTime("connectedCallback", n._$$tagName$$_);
+    const s = createTime("connectedCallback", n._$$tagName$$_);
     if (!(t._$$flags$$_ & 1 /* hasConnected */)) {
       t._$$flags$$_ |= 1 /* hasConnected */;
       {
@@ -1273,7 +1295,7 @@ var connectedCallback = e => {
         t._$$onReadyPromise$$_.then((() => fireConnectedCallback()));
       }
     }
-    r();
+    s();
   }
 };
 
@@ -1303,8 +1325,8 @@ var disconnectedCallback = async e => {
 // src/runtime/bootstrap-lazy.ts
 var bootstrapLazy = (e, t = {}) => {
   var n;
-  const r = createTime();
-  const s = [];
+  const s = createTime();
+  const r = [];
   const l = t.exclude || [];
   const o = f.customElements;
   const d = c.head;
@@ -1333,7 +1355,7 @@ var bootstrapLazy = (e, t = {}) => {
       {
         n._$$listeners$$_ = t[3];
       }
-      const r = n._$$tagName$$_;
+      const s = n._$$tagName$$_;
       const i = class extends HTMLElement {
         // StencilLazyHost
         constructor(e) {
@@ -1392,18 +1414,18 @@ var bootstrapLazy = (e, t = {}) => {
         }
       };
       n._$$lazyBundleId$$_ = e[0];
-      if (!l.includes(r) && !o.get(r)) {
-        s.push(r);
-        o.define(r, proxyComponent(i, n, 1 /* isElementConstructor */));
+      if (!l.includes(s) && !o.get(s)) {
+        r.push(s);
+        o.define(s, proxyComponent(i, n, 1 /* isElementConstructor */));
       }
     }));
   }));
-  if (s.length > 0) {
+  if (r.length > 0) {
     if (w) {
       p.textContent += a;
     }
     {
-      p.textContent += s.sort() + i;
+      p.textContent += r.sort() + i;
     }
     if (p.innerHTML.length) {
       p.setAttribute("data-styles", "");
@@ -1422,27 +1444,27 @@ var bootstrapLazy = (e, t = {}) => {
       u.jmp((() => y = setTimeout(appDidLoad, 30)));
     }
   }
-  r();
+  s();
 };
 
-var addHostEventListeners = (e, t, n, r) => {
+var addHostEventListeners = (e, t, n, s) => {
   if (n) {
-    n.map((([n, r, s]) => {
+    n.map((([n, s, r]) => {
       const l = getHostListenerTarget(e, n);
-      const o = hostListenerProxy(t, s);
+      const o = hostListenerProxy(t, r);
       const i = hostListenerOpts(n);
-      u.ael(l, r, o, i);
-      (t._$$rmListeners$$_ = t._$$rmListeners$$_ || []).push((() => u.rel(l, r, o, i)));
+      u.ael(l, s, o, i);
+      (t._$$rmListeners$$_ = t._$$rmListeners$$_ || []).push((() => u.rel(l, s, o, i)));
     }));
   }
 };
 
 var hostListenerProxy = (e, t) => n => {
-  var r;
+  var s;
   try {
     {
       if (e._$$flags$$_ & 256 /* isListenReady */) {
-        (r = e._$$lazyInstance$$_) == null ? void 0 : r[t](n);
+        (s = e._$$lazyInstance$$_) == null ? void 0 : s[t](n);
       } else {
         (e._$$queuedListeners$$_ = e._$$queuedListeners$$_ || []).push([ t, n ]);
       }
@@ -1466,5 +1488,5 @@ var hostListenerOpts = e => d ? {
 
 var setNonce = e => u._$$nonce$$_ = e;
 
-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
+export { S as H, bootstrapLazy as b, createEvent as c, getElement as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
+//# sourceMappingURL=p-5a36af0f.js.map