@ionic/core 8.7.6-dev.11761057729.1bfdf1ab → 8.7.6-dev.11761146245.19b2e6db

package/hydrate/index.mjs

@@ -556,7 +556,7 @@ const initialize = (userConfig = {}) => {
 const globalScripts = initialize;
 
 /*
- Stencil Hydrate Platform v4.33.1 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Platform v4.38.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -761,11 +761,26 @@ function deserializeProperty(value) {
   }
   return RemoteValue.fromLocalValue(JSON.parse(atob(value.slice(SERIALIZED_PREFIX.length))));
 }
+
+// src/utils/style.ts
+function createStyleSheetIfNeededAndSupported(styles2) {
+  return void 0;
+}
+
+// src/utils/shadow-root.ts
+var globalStyleSheet;
 function createShadowRoot(cmpMeta) {
-  this.attachShadow({
+  var _a;
+  const shadowRoot = this.attachShadow({
     mode: "open",
     delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */)
   }) ;
+  if (globalStyleSheet === void 0) globalStyleSheet = (_a = createStyleSheetIfNeededAndSupported()) != null ? _a : null;
+  if (globalStyleSheet) {
+    {
+      shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, globalStyleSheet];
+    }
+  }
 }
 
 // src/runtime/runtime-constants.ts
@@ -891,7 +906,7 @@ function patchSlotNode(node) {
     const slotName = this["s-sn"];
     if (opts == null ? void 0 : opts.flatten) {
       console.error(`
-          Flattening is not supported for Stencil non-shadow slots. 
+          Flattening is not supported for Stencil non-shadow slots.
           You can use \`.childNodes\` to nested slot fallback content.
           If you have a particular use case, please open an issue on the Stencil repo.
         `);
@@ -935,6 +950,96 @@ var uniqueTime = (key, measureText) => {
     };
   }
 };
+var rootAppliedStyles = /* @__PURE__ */ new WeakMap();
+var registerStyle = (scopeId2, cssText, allowCS) => {
+  let style = styles.get(scopeId2);
+  {
+    style = cssText;
+  }
+  styles.set(scopeId2, style);
+};
+var addStyle = (styleContainerNode, cmpMeta, mode) => {
+  var _a;
+  const scopeId2 = getScopeId(cmpMeta, mode);
+  const style = styles.get(scopeId2);
+  if (!win.document) {
+    return scopeId2;
+  }
+  styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : win.document;
+  if (style) {
+    if (typeof style === "string") {
+      styleContainerNode = styleContainerNode.head || styleContainerNode;
+      let appliedStyles = rootAppliedStyles.get(styleContainerNode);
+      let styleElm;
+      if (!appliedStyles) {
+        rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
+      }
+      if (!appliedStyles.has(scopeId2)) {
+        if (styleContainerNode.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
+          styleElm.innerHTML = style;
+        } else {
+          styleElm = win.document.createElement("style");
+          styleElm.innerHTML = style;
+          const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
+          if (nonce != null) {
+            styleElm.setAttribute("nonce", nonce);
+          }
+          if ((cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */ || cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */)) {
+            styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId2);
+          }
+          if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
+            if (styleContainerNode.nodeName === "HEAD") {
+              const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
+              const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
+              styleContainerNode.insertBefore(
+                styleElm,
+                (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
+              );
+            } else if ("host" in styleContainerNode) {
+              {
+                const existingStyleContainer = styleContainerNode.querySelector("style");
+                if (existingStyleContainer) {
+                  existingStyleContainer.innerHTML = style + existingStyleContainer.innerHTML;
+                } else {
+                  styleContainerNode.prepend(styleElm);
+                }
+              }
+            } else {
+              styleContainerNode.append(styleElm);
+            }
+          }
+          if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+            styleContainerNode.insertBefore(styleElm, null);
+          }
+        }
+        if (cmpMeta.$flags$ & 4 /* hasSlotRelocation */) {
+          styleElm.innerHTML += SLOT_FB_CSS;
+        }
+        if (appliedStyles) {
+          appliedStyles.add(scopeId2);
+        }
+      }
+    }
+  }
+  return scopeId2;
+};
+var attachStyles = (hostRef) => {
+  const cmpMeta = hostRef.$cmpMeta$;
+  const elm = hostRef.$hostElement$;
+  const flags = cmpMeta.$flags$;
+  const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
+  const scopeId2 = addStyle(
+    elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
+    cmpMeta,
+    hostRef.$modeName$
+  );
+  if (flags & 10 /* needsScopedEncapsulation */) {
+    elm["s-sc"] = scopeId2;
+    elm.classList.add(scopeId2 + "-h");
+  }
+  endAttachStyles();
+};
+var getScopeId = (cmp, mode) => "sc-" + (mode && cmp.$flags$ & 32 /* hasMode */ ? cmp.$tagName$ + "-" + mode : cmp.$tagName$);
 var h = (nodeName, vnodeData, ...children) => {
   let child = null;
   let key = null;
@@ -1049,7 +1154,7 @@ var convertToPrivate = (node) => {
 
 // src/runtime/client-hydrate.ts
 var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
-  var _a;
+  var _a, _b;
   const endHydrate = createTime("hydrateClient", tagName);
   const shadowRoot = hostElm.shadowRoot;
   const childRenderNodes = [];
@@ -1058,19 +1163,6 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
   const shadowRootNodes = shadowRoot ? [] : null;
   const vnode = newVNode(tagName, null);
   vnode.$elm$ = hostElm;
-  const members = Object.entries(((_a = hostRef.$cmpMeta$) == null ? void 0 : _a.$members$) || {});
-  members.forEach(([memberName, [memberFlags, metaAttributeName]]) => {
-    var _a2;
-    if (!(memberFlags & 31 /* Prop */)) {
-      return;
-    }
-    const attributeName = metaAttributeName || memberName;
-    const attrVal = hostElm.getAttribute(attributeName);
-    if (attrVal !== null) {
-      const attrPropVal = parsePropertyValue(attrVal, memberFlags);
-      (_a2 = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _a2.set(memberName, attrPropVal);
-    }
-  });
   let scopeId2;
   {
     const cmpMeta = hostRef.$cmpMeta$;
@@ -1109,6 +1201,18 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       if (childRenderNode.$tag$ === "slot") {
         node["s-cr"] = hostElm["s-cr"];
       }
+    } else if (((_a = childRenderNode.$tag$) == null ? void 0 : _a.toString().includes("-")) && childRenderNode.$tag$ !== "slot-fb" && !childRenderNode.$elm$.shadowRoot) {
+      const cmpMeta = getHostRef(childRenderNode.$elm$);
+      if (cmpMeta) {
+        const scopeId3 = getScopeId(
+          cmpMeta.$cmpMeta$,
+          childRenderNode.$elm$.getAttribute("s-mode") 
+        );
+        const styleSheet = win.document.querySelector(`style[sty-id="${scopeId3}"]`);
+        if (styleSheet) {
+          hostElm.shadowRoot.append(styleSheet.cloneNode(true));
+        }
+      }
     }
     if (childRenderNode.$tag$ === "slot") {
       childRenderNode.$name$ = childRenderNode.$elm$["s-sn"] || childRenderNode.$elm$["name"] || null;
@@ -1124,7 +1228,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       }
     }
     if (orgLocationNode && orgLocationNode.isConnected) {
-      if (shadowRoot && orgLocationNode["s-en"] === "") {
+      if (orgLocationNode.parentElement.shadowRoot && orgLocationNode["s-en"] === "") {
         orgLocationNode.parentNode.insertBefore(node, orgLocationNode.nextSibling);
       }
       orgLocationNode.parentNode.removeChild(orgLocationNode);
@@ -1132,7 +1236,9 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
         node["s-oo"] = parseInt(childRenderNode.$nodeId$);
       }
     }
-    plt.$orgLocNodes$.delete(orgLocationId);
+    if (orgLocationNode && !orgLocationNode["s-id"]) {
+      plt.$orgLocNodes$.delete(orgLocationId);
+    }
   }
   const hosts = [];
   const snLen = slottedNodes.length;
@@ -1153,17 +1259,22 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       }
       if (!hosts[slottedItem.hostId]) continue;
       const hostEle = hosts[slottedItem.hostId];
+      if (hostEle.shadowRoot && slottedItem.node.parentElement !== hostEle) {
+        hostEle.appendChild(slottedItem.node);
+      }
       if (!hostEle.shadowRoot || !shadowRoot) {
-        slottedItem.slot["s-cr"] = hostEle["s-cr"];
-        if (!slottedItem.slot["s-cr"] && hostEle.shadowRoot) {
-          slottedItem.slot["s-cr"] = hostEle;
-        } else {
-          slottedItem.slot["s-cr"] = (hostEle.__childNodes || hostEle.childNodes)[0];
+        if (!slottedItem.slot["s-cr"]) {
+          slottedItem.slot["s-cr"] = hostEle["s-cr"];
+          if (!slottedItem.slot["s-cr"] && hostEle.shadowRoot) {
+            slottedItem.slot["s-cr"] = hostEle;
+          } else {
+            slottedItem.slot["s-cr"] = (hostEle.__childNodes || hostEle.childNodes)[0];
+          }
         }
         addSlotRelocateNode(slottedItem.node, slottedItem.slot, false, slottedItem.node["s-oo"]);
-      }
-      if (hostEle.shadowRoot && slottedItem.node.parentElement !== hostEle) {
-        hostEle.appendChild(slottedItem.node);
+        if (((_b = slottedItem.node.parentElement) == null ? void 0 : _b.shadowRoot) && slottedItem.node["getAttribute"] && slottedItem.node.getAttribute("slot")) {
+          slottedItem.node.removeAttribute("slot");
+        }
       }
     }
   }
@@ -1172,25 +1283,27 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       slot.$elm$.parentElement.classList.add(scopeId2 + "-s");
     });
   }
-  if (shadowRoot && !shadowRoot.childNodes.length) {
+  if (shadowRoot) {
     let rnIdex = 0;
     const rnLen = shadowRootNodes.length;
     if (rnLen) {
       for (rnIdex; rnIdex < rnLen; rnIdex++) {
-        shadowRoot.appendChild(shadowRootNodes[rnIdex]);
+        const node = shadowRootNodes[rnIdex];
+        if (node) {
+          shadowRoot.appendChild(node);
+        }
       }
       Array.from(hostElm.childNodes).forEach((node) => {
-        if (typeof node["s-sn"] !== "string") {
+        if (typeof node["s-en"] !== "string" && typeof node["s-sn"] !== "string") {
           if (node.nodeType === 1 /* ElementNode */ && node.slot && node.hidden) {
             node.removeAttribute("hidden");
-          } else if (node.nodeType === 8 /* CommentNode */ || node.nodeType === 3 /* TextNode */ && !node.wholeText.trim()) {
+          } else if (node.nodeType === 8 /* CommentNode */ && !node.nodeValue || node.nodeType === 3 /* TextNode */ && !node.wholeText.trim()) {
             node.parentNode.removeChild(node);
           }
         }
       });
     }
   }
-  plt.$orgLocNodes$.delete(hostElm["s-id"]);
   hostRef.$hostElement$ = hostElm;
   endHydrate();
 };
@@ -1222,7 +1335,7 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
         if (!parentVNode.$children$) {
           parentVNode.$children$ = [];
         }
-        if (scopeId2) {
+        if (scopeId2 && childIdSplt[0] === hostId) {
           node["s-si"] = scopeId2;
           childVNode.$attrs$.class += " " + scopeId2;
         }
@@ -1352,7 +1465,7 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
     vnode.$index$ = "0";
     parentVNode.$children$ = [vnode];
   } else {
-    if (node.nodeType === 3 /* TextNode */ && !node.wholeText.trim()) {
+    if (node.nodeType === 3 /* TextNode */ && !node.wholeText.trim() && !node["s-nr"]) {
       node.remove();
     }
   }
@@ -1410,10 +1523,10 @@ function addSlot(slotName, slotId, childVNode, node, parentVNode, childRenderNod
     if (childVNode.$name$) {
       childVNode.$elm$.setAttribute("name", slotName);
     }
-    if (parentNodeId && parentNodeId !== childVNode.$hostId$) {
-      parentVNode.$elm$.insertBefore(slot, parentVNode.$elm$.children[0]);
+    if (parentVNode.$elm$.shadowRoot && parentNodeId && parentNodeId !== childVNode.$hostId$) {
+      internalCall(parentVNode.$elm$, "insertBefore")(slot, internalCall(parentVNode.$elm$, "children")[0]);
     } else {
-      node.parentNode.insertBefore(childVNode.$elm$, node);
+      internalCall(internalCall(node, "parentNode"), "insertBefore")(slot, node);
     }
     addSlottedNodes(slottedNodes, slotId, slotName, node, childVNode.$hostId$);
     node.remove();
@@ -1428,8 +1541,8 @@ function addSlot(slotName, slotId, childVNode, node, parentVNode, childRenderNod
     if (shouldMove) {
       parentVNode.$elm$.insertBefore(slot, parentVNode.$elm$.children[0]);
     }
-    childRenderNodes.push(childVNode);
   }
+  childRenderNodes.push(childVNode);
   slotNodes.push(childVNode);
   if (!parentVNode.$children$) {
     parentVNode.$children$ = [];
@@ -1437,13 +1550,17 @@ function addSlot(slotName, slotId, childVNode, node, parentVNode, childRenderNod
   parentVNode.$children$[childVNode.$index$] = childVNode;
 }
 var addSlottedNodes = (slottedNodes, slotNodeId, slotName, slotNode, hostId) => {
+  var _a, _b;
   let slottedNode = slotNode.nextSibling;
   slottedNodes[slotNodeId] = slottedNodes[slotNodeId] || [];
-  while (slottedNode && ((slottedNode["getAttribute"] && slottedNode.getAttribute("slot") || slottedNode["s-sn"]) === slotName || slotName === "" && !slottedNode["s-sn"] && (slottedNode.nodeType === 8 /* CommentNode */ && slottedNode.nodeValue.indexOf(".") !== 1 || slottedNode.nodeType === 3 /* TextNode */))) {
-    slottedNode["s-sn"] = slotName;
-    slottedNodes[slotNodeId].push({ slot: slotNode, node: slottedNode, hostId });
-    slottedNode = slottedNode.nextSibling;
-  }
+  if (!slottedNode || ((_a = slottedNode.nodeValue) == null ? void 0 : _a.startsWith(SLOT_NODE_ID + "."))) return;
+  do {
+    if (slottedNode && ((slottedNode["getAttribute"] && slottedNode.getAttribute("slot") || slottedNode["s-sn"]) === slotName || slotName === "" && !slottedNode["s-sn"] && (!slottedNode["getAttribute"] || !slottedNode.getAttribute("slot")) && (slottedNode.nodeType === 8 /* CommentNode */ || slottedNode.nodeType === 3 /* TextNode */))) {
+      slottedNode["s-sn"] = slotName;
+      slottedNodes[slotNodeId].push({ slot: slotNode, node: slottedNode, hostId });
+    }
+    slottedNode = slottedNode == null ? void 0 : slottedNode.nextSibling;
+  } while (slottedNode && !((_b = slottedNode.nodeValue) == null ? void 0 : _b.startsWith(SLOT_NODE_ID + ".")));
 };
 var findCorrespondingNode = (node, type) => {
   let sibling = node;
@@ -1468,6 +1585,12 @@ var findCorrespondingNode = (node, type) => {
 var safeSelector = (selector) => {
   const placeholders = [];
   let index = 0;
+  selector = selector.replace(/(\[\s*part~=\s*("[^"]*"|'[^']*')\s*\])/g, (_, keep) => {
+    const replaceBy = `__part-${index}__`;
+    placeholders.push(keep);
+    index++;
+    return replaceBy;
+  });
   selector = selector.replace(/(\[[^\]]*\])/g, (_, keep) => {
     const replaceBy = `__ph-${index}__`;
     placeholders.push(keep);
@@ -1487,6 +1610,7 @@ var safeSelector = (selector) => {
   return ss;
 };
 var restoreSafeSelector = (placeholders, content) => {
+  content = content.replace(/__part-(\d+)__/g, (_, index) => placeholders[+index]);
   return content.replace(/__ph-(\d+)__/g, (_, index) => placeholders[+index]);
 };
 var _polyfillHost = "-shadowcsshost";
@@ -1499,6 +1623,7 @@ var _cssColonSlottedRe = new RegExp("(" + _polyfillSlotted + _parenSuffix, "gim"
 var _polyfillHostNoCombinator = _polyfillHost + "-no-combinator";
 var _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\s]*)/;
 var _shadowDOMSelectorsRe = [/::shadow/g, /::content/g];
+var _safePartRe = /__part-(\d+)__/g;
 var _selectorReSuffix = "([>\\s~+[.,{:][\\s\\S]*)?$";
 var _polyfillHostRe = /-shadowcsshost/gim;
 var createSupportsRuleRe = (selector) => {
@@ -1713,7 +1838,7 @@ var applyStrictSelectorScope = (selector, scopeSelector2, hostSelector) => {
   let scopedSelector = "";
   let startIndex = 0;
   let res;
-  const sep = /( |>|\+|~(?!=))\s*/g;
+  const sep = /( |>|\+|~(?!=))(?=(?:[^()]*\([^()]*\))*[^()]*$)\s*/g;
   const hasHost = selector.indexOf(_polyfillHostNoCombinator) > -1;
   let shouldScope = !hasHost;
   while ((res = sep.exec(selector)) !== null) {
@@ -1725,7 +1850,7 @@ var applyStrictSelectorScope = (selector, scopeSelector2, hostSelector) => {
     startIndex = sep.lastIndex;
   }
   const part = selector.substring(startIndex);
-  shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;
+  shouldScope = !part.match(_safePartRe) && (shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1);
   scopedSelector += shouldScope ? _scopeSelectorPart(part) : part;
   return restoreSafeSelector(safeContent.placeholders, scopedSelector);
 };
@@ -1782,6 +1907,36 @@ var scopeCssText = (cssText, scopeId2, hostScopeId, slotScopeId, commentOriginal
 var replaceShadowCssHost = (cssText, hostScopeId) => {
   return cssText.replace(/-shadowcsshost-no-combinator/g, `.${hostScopeId}`);
 };
+var expandPartSelectors = (cssText) => {
+  const partSelectorRe = /([^\s,{][^,{]*?)::part\(\s*([^)]+?)\s*\)((?:[:.][^,{]*)*)/g;
+  return processRules(cssText, (rule) => {
+    if (rule.selector[0] === "@") {
+      return rule;
+    }
+    const selectors = rule.selector.split(",").map((sel) => {
+      const out = [sel.trim()];
+      let m;
+      while ((m = partSelectorRe.exec(sel)) !== null) {
+        const before = m[1].trimEnd();
+        const partNames = m[2].trim().split(/\s+/);
+        const after = m[3] || "";
+        const partAttr = partNames.flatMap((p) => {
+          if (!rule.selector.includes(`[part~="${p}"]`)) {
+            return [`[part~="${p}"]`];
+          }
+          return [];
+        }).join("");
+        const expanded = `${before} ${partAttr}${after}`;
+        if (!!partAttr && expanded !== sel.trim()) {
+          out.push(expanded);
+        }
+      }
+      return out.join(", ");
+    });
+    rule.selector = selectors.join(", ");
+    return rule;
+  });
+};
 var scopeCss = (cssText, scopeId2, commentOriginalSelector) => {
   const hostScopeId = scopeId2 + "-h";
   const slotScopeId = scopeId2 + "-s";
@@ -1817,28 +1972,27 @@ var scopeCss = (cssText, scopeId2, commentOriginalSelector) => {
     const regex = new RegExp(escapeRegExpSpecialCharacters(slottedSelector.orgSelector), "g");
     cssText = cssText.replace(regex, slottedSelector.updatedSelector);
   });
+  cssText = expandPartSelectors(cssText);
   return cssText;
 };
 
 // src/runtime/mode.ts
 var computeMode = (elm) => modeResolutionChain.map((h2) => h2(elm)).find((m) => !!m);
 var setMode = (handler) => modeResolutionChain.push(handler);
-var getMode = (ref) => getHostRef(ref).$modeName$;
-var parsePropertyValue = (propValue, propType) => {
-  if (typeof propValue === "string" && (propValue.startsWith("{") && propValue.endsWith("}") || propValue.startsWith("[") && propValue.endsWith("]"))) {
-    try {
-      propValue = JSON.parse(propValue);
-      return propValue;
-    } catch (e) {
-    }
-  }
+var getMode = (ref) => {
+  var _a;
+  return (_a = getHostRef(ref)) == null ? void 0 : _a.$modeName$;
+};
+var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   if (typeof propValue === "string" && propValue.startsWith(SERIALIZED_PREFIX)) {
     propValue = deserializeProperty(propValue);
     return propValue;
   }
   if (propValue != null && !isComplexType(propValue)) {
     if (propType & 4 /* Boolean */) {
-      return propValue === "false" ? false : propValue === "" || !!propValue;
+      {
+        return propValue === "false" ? false : propValue === "" || !!propValue;
+      }
     }
     if (propType & 2 /* Number */) {
       return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
@@ -1850,7 +2004,10 @@ var parsePropertyValue = (propValue, propType) => {
   }
   return propValue;
 };
-var getElement = (ref) => getHostRef(ref).$hostElement$ ;
+var getElement = (ref) => {
+  var _a;
+  return (_a = getHostRef(ref)) == null ? void 0 : _a.$hostElement$ ;
+};
 
 // src/runtime/event-emitter.ts
 var createEvent = (ref, name, flags) => {
@@ -1871,96 +2028,6 @@ var emitEvent = (elm, name, opts) => {
   elm.dispatchEvent(ev);
   return ev;
 };
-var rootAppliedStyles = /* @__PURE__ */ new WeakMap();
-var registerStyle = (scopeId2, cssText, allowCS) => {
-  let style = styles.get(scopeId2);
-  {
-    style = cssText;
-  }
-  styles.set(scopeId2, style);
-};
-var addStyle = (styleContainerNode, cmpMeta, mode) => {
-  var _a;
-  const scopeId2 = getScopeId(cmpMeta, mode);
-  const style = styles.get(scopeId2);
-  if (!win.document) {
-    return scopeId2;
-  }
-  styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : win.document;
-  if (style) {
-    if (typeof style === "string") {
-      styleContainerNode = styleContainerNode.head || styleContainerNode;
-      let appliedStyles = rootAppliedStyles.get(styleContainerNode);
-      let styleElm;
-      if (!appliedStyles) {
-        rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
-      }
-      if (!appliedStyles.has(scopeId2)) {
-        if (styleContainerNode.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
-          styleElm.innerHTML = style;
-        } else {
-          styleElm = document.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`) || win.document.createElement("style");
-          styleElm.innerHTML = style;
-          const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
-          if (nonce != null) {
-            styleElm.setAttribute("nonce", nonce);
-          }
-          if ((cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */ || cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */)) {
-            styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId2);
-          }
-          if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
-            if (styleContainerNode.nodeName === "HEAD") {
-              const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
-              const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
-              styleContainerNode.insertBefore(
-                styleElm,
-                (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
-              );
-            } else if ("host" in styleContainerNode) {
-              {
-                const existingStyleContainer = styleContainerNode.querySelector("style");
-                if (existingStyleContainer) {
-                  existingStyleContainer.innerHTML = style + existingStyleContainer.innerHTML;
-                } else {
-                  styleContainerNode.prepend(styleElm);
-                }
-              }
-            } else {
-              styleContainerNode.append(styleElm);
-            }
-          }
-          if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
-            styleContainerNode.insertBefore(styleElm, null);
-          }
-        }
-        if (cmpMeta.$flags$ & 4 /* hasSlotRelocation */) {
-          styleElm.innerHTML += SLOT_FB_CSS;
-        }
-        if (appliedStyles) {
-          appliedStyles.add(scopeId2);
-        }
-      }
-    }
-  }
-  return scopeId2;
-};
-var attachStyles = (hostRef) => {
-  const cmpMeta = hostRef.$cmpMeta$;
-  const elm = hostRef.$hostElement$;
-  const flags = cmpMeta.$flags$;
-  const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
-  const scopeId2 = addStyle(
-    elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
-    cmpMeta,
-    hostRef.$modeName$
-  );
-  if (flags & 10 /* needsScopedEncapsulation */) {
-    elm["s-sc"] = scopeId2;
-    elm.classList.add(scopeId2 + "-h");
-  }
-  endAttachStyles();
-};
-var getScopeId = (cmp, mode) => "sc-" + (mode && cmp.$flags$ & 32 /* hasMode */ ? cmp.$tagName$ + "-" + mode : cmp.$tagName$);
 var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
   if (oldValue === newValue) {
     return;
@@ -1971,12 +2038,13 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
     const classList = elm.classList;
     const oldClasses = parseClassList(oldValue);
     let newClasses = parseClassList(newValue);
-    if (elm["s-si"] && initialRender) {
-      newClasses.push(elm["s-si"]);
+    if ((elm["s-si"] || elm["s-sc"]) && initialRender) {
+      const scopeId2 = elm["s-sc"] || elm["s-si"];
+      newClasses.push(scopeId2);
       oldClasses.forEach((c) => {
-        if (c.startsWith(elm["s-si"])) newClasses.push(c);
+        if (c.startsWith(scopeId2)) newClasses.push(c);
       });
-      newClasses = [...new Set(newClasses)];
+      newClasses = [...new Set(newClasses)].filter((c) => c);
       classList.add(...newClasses);
     } else {
       classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
@@ -2408,6 +2476,8 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
       !isInitialRender && BUILD.updatable && oldChildren !== null
     ) {
       removeVnodes(oldChildren, 0, oldChildren.length - 1);
+    } else if (isInitialRender && BUILD.updatable && oldChildren !== null && newChildren === null) {
+      newVNode2.$children$ = oldChildren;
     }
     if (isSvgMode && tag === "svg") {
       isSvgMode = false;
@@ -2513,9 +2583,11 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   hostTagName = hostElm.tagName;
   if (cmpMeta.$attrsToReflect$) {
     rootVnode.$attrs$ = rootVnode.$attrs$ || {};
-    cmpMeta.$attrsToReflect$.map(
-      ([propName, attribute]) => rootVnode.$attrs$[attribute] = hostElm[propName]
-    );
+    cmpMeta.$attrsToReflect$.forEach(([propName, attribute]) => {
+      {
+        rootVnode.$attrs$[attribute] = hostElm[propName];
+      }
+    });
   }
   if (isInitialLoad && rootVnode.$attrs$) {
     for (const key of Object.keys(rootVnode.$attrs$)) {
@@ -2623,6 +2695,12 @@ var scheduleUpdate = (hostRef, isInitialLoad) => {
   }
   attachToAncestor(hostRef, hostRef.$ancestorComponent$);
   const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
+  if (isInitialLoad) {
+    queueMicrotask(() => {
+      dispatch();
+    });
+    return;
+  }
   return writeTask(dispatch) ;
 };
 var dispatchHooks = (hostRef, isInitialLoad) => {
@@ -2637,10 +2715,15 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
   let maybePromise;
   if (isInitialLoad) {
     {
-      hostRef.$flags$ |= 256 /* isListenReady */;
-      if (hostRef.$queuedListeners$) {
-        hostRef.$queuedListeners$.map(([methodName, event]) => safeCall$1(instance, methodName, event, elm));
-        hostRef.$queuedListeners$ = void 0;
+      {
+        hostRef.$flags$ |= 256 /* isListenReady */;
+        if (hostRef.$queuedListeners$) {
+          hostRef.$queuedListeners$.map(([methodName, event]) => safeCall$1(instance, methodName, event, elm));
+          hostRef.$queuedListeners$ = void 0;
+        }
+      }
+      if (hostRef.$fetchedCbList$.length) {
+        hostRef.$fetchedCbList$.forEach((cb) => cb(elm));
       }
     }
     maybePromise = safeCall$1(instance, "componentWillLoad", void 0, elm);
@@ -2763,10 +2846,16 @@ var forceUpdate = (ref) => {
   return false;
 };
 var appDidLoad = (who) => {
+  var _a;
   if (BUILD.asyncQueue) {
     plt.$flags$ |= 2 /* appLoaded */;
   }
   nextTick(() => emitEvent(win, "appload", { detail: { namespace: NAMESPACE } }));
+  {
+    if ((_a = plt.$orgLocNodes$) == null ? void 0 : _a.size) {
+      plt.$orgLocNodes$.clear();
+    }
+  }
 };
 var safeCall$1 = (instance, method, arg, elm) => {
   if (instance && instance[method]) {
@@ -2799,6 +2888,9 @@ var serverSideConnected = (elm) => {
 var getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
 var setValue = (ref, propName, newVal, cmpMeta) => {
   const hostRef = getHostRef(ref);
+  if (!hostRef) {
+    return;
+  }
   if (!hostRef) {
     throw new Error(
       `Couldn't find host element for "${cmpMeta.$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/stenciljs/core/issues/5457).`
@@ -2808,7 +2900,9 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
   const oldVal = hostRef.$instanceValues$.get(propName);
   const flags = hostRef.$flags$;
   const instance = hostRef.$lazyInstance$ ;
-  newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
+  newVal = parsePropertyValue(
+    newVal,
+    cmpMeta.$members$[propName][0]);
   const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
   const didValueChange = newVal !== oldVal && !areBothNaN;
   if ((!(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
@@ -2842,9 +2936,17 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
 var proxyComponent = (Cstr, cmpMeta, flags) => {
   var _a;
   const prototype = Cstr.prototype;
-  if (cmpMeta.$members$ || (cmpMeta.$watchers$ || Cstr.watchers)) {
-    if (Cstr.watchers && !cmpMeta.$watchers$) {
-      cmpMeta.$watchers$ = Cstr.watchers;
+  {
+    {
+      if (Cstr.watchers && !cmpMeta.$watchers$) {
+        cmpMeta.$watchers$ = Cstr.watchers;
+      }
+      if (Cstr.deserializers && !cmpMeta.$deserializers$) {
+        cmpMeta.$deserializers$ = Cstr.deserializers;
+      }
+      if (Cstr.serializers && !cmpMeta.$serializers$) {
+        cmpMeta.$serializers$ = Cstr.serializers;
+      }
     }
     const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
     members.map(([memberName, [memberFlags]]) => {
@@ -2872,14 +2974,19 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
         Object.defineProperty(prototype, memberName, {
           set(newValue) {
             const ref = getHostRef(this);
+            if (!ref) {
+              return;
+            }
             if (origSetter) {
               const currentValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
               if (typeof currentValue === "undefined" && ref.$instanceValues$.get(memberName)) {
                 newValue = ref.$instanceValues$.get(memberName);
-              } else if (!ref.$instanceValues$.get(memberName) && currentValue) {
-                ref.$instanceValues$.set(memberName, currentValue);
               }
-              origSetter.apply(this, [parsePropertyValue(newValue, memberFlags)]);
+              origSetter.apply(this, [
+                parsePropertyValue(
+                  newValue,
+                  memberFlags)
+              ]);
               newValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
               setValue(this, memberName, newValue, cmpMeta);
               return;
@@ -2919,6 +3026,8 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
       if (!Cstr.isProxied) {
         {
           cmpMeta.$watchers$ = Cstr.watchers;
+          cmpMeta.$serializers$ = Cstr.serializers;
+          cmpMeta.$deserializers$ = Cstr.deserializers;
         }
         proxyComponent(Cstr, cmpMeta);
         Cstr.isProxied = true;
@@ -2961,8 +3070,12 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
       const scopeId2 = getScopeId(cmpMeta, hostRef.$modeName$);
       if (!styles.has(scopeId2)) {
         const endRegisterStyles = createTime("registerStyles", cmpMeta.$tagName$);
-        if (cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */) {
-          style = scopeCss(style, scopeId2);
+        {
+          if (cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */) {
+            style = scopeCss(style, scopeId2);
+          } else if (needsScopedSSR()) {
+            style = expandPartSelectors(style);
+          }
         }
         registerStyle(scopeId2, style);
         endRegisterStyles();
@@ -2987,6 +3100,9 @@ var fireConnectedCallback = (instance, elm) => {
 var connectedCallback = (elm) => {
   if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
     const hostRef = getHostRef(elm);
+    if (!hostRef) {
+      return;
+    }
     const cmpMeta = hostRef.$cmpMeta$;
     const endConnected = createTime("connectedCallback", cmpMeta.$tagName$);
     if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
@@ -3251,6 +3367,9 @@ var hAsync = (nodeName, vnodeData, ...children) => {
 // src/hydrate/platform/proxy-host-element.ts
 function proxyHostElement(elm, cstr) {
   const cmpMeta = cstr.cmpMeta;
+  cmpMeta.$watchers$ = cmpMeta.$watchers$ || cstr.watchers;
+  cmpMeta.$deserializers$ = cmpMeta.$deserializers$ || cstr.deserializers;
+  cmpMeta.$serializers$ = cmpMeta.$serializers$ || cstr.serializers;
   if (typeof elm.componentOnReady !== "function") {
     elm.componentOnReady = componentOnReady$1;
   }
@@ -3264,7 +3383,7 @@ function proxyHostElement(elm, cstr) {
     const hostRef = getHostRef(elm);
     const members = Object.entries(cmpMeta.$members$);
     members.forEach(([memberName, [memberFlags, metaAttributeName]]) => {
-      var _a;
+      var _a, _b;
       if (memberFlags & 31 /* Prop */) {
         const attributeName = metaAttributeName || memberName;
         const attrValue = elm.getAttribute(attributeName);
@@ -3272,7 +3391,13 @@ function proxyHostElement(elm, cstr) {
         let attrPropVal;
         const { get: origGetter, set: origSetter } = Object.getOwnPropertyDescriptor(cstr.prototype, memberName) || {};
         if (attrValue != null) {
-          attrPropVal = parsePropertyValue(attrValue, memberFlags);
+          if ((_a = cmpMeta.$deserializers$) == null ? void 0 : _a[memberName]) {
+            for (const methodName of cmpMeta.$deserializers$[memberName]) {
+              attrPropVal = cstr.prototype[methodName](attrValue, memberName);
+            }
+          } else {
+            attrPropVal = parsePropertyValue(attrValue, memberFlags);
+          }
         }
         if (propValue !== void 0) {
           attrPropVal = propValue;
@@ -3283,7 +3408,7 @@ function proxyHostElement(elm, cstr) {
             origSetter.apply(elm, [attrPropVal]);
             attrPropVal = origGetter ? origGetter.apply(elm) : attrPropVal;
           }
-          (_a = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _a.set(memberName, attrPropVal);
+          (_b = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _b.set(memberName, attrPropVal);
         }
         const getterSetterDescriptor = {
           get: function() {
@@ -3297,21 +3422,18 @@ function proxyHostElement(elm, cstr) {
         };
         Object.defineProperty(elm, memberName, getterSetterDescriptor);
         Object.defineProperty(elm, metaAttributeName, getterSetterDescriptor);
-        if (!cstr.prototype.__stencilAugmented) {
-          Object.defineProperty(cstr.prototype, memberName, {
-            get: function() {
-              var _a2;
-              const ref = getHostRef(this);
-              const attrPropVal2 = (_a2 = ref.$instanceValues$) == null ? void 0 : _a2.get(memberName);
-              if (origGetter && attrPropVal2 === void 0 && !getValue(this, memberName)) {
-                setValue(this, memberName, origGetter.apply(this), cmpMeta);
-              }
-              return attrPropVal2 !== void 0 ? attrPropVal2 : origGetter ? origGetter.apply(this) : getValue(this, memberName);
-            },
-            configurable: true,
-            enumerable: true
-          });
-        }
+        hostRef.$fetchedCbList$.push(() => {
+          var _a2;
+          if (!((_a2 = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _a2.has(memberName))) {
+            setValue(
+              elm,
+              memberName,
+              attrPropVal !== void 0 ? attrPropVal : hostRef.$lazyInstance$[memberName],
+              cmpMeta
+            );
+          }
+          Object.defineProperty(hostRef.$lazyInstance$, memberName, getterSetterDescriptor);
+        });
       } else if (memberFlags & 64 /* Method */) {
         Object.defineProperty(elm, memberName, {
           value(...args) {
@@ -3327,7 +3449,6 @@ function proxyHostElement(elm, cstr) {
         });
       }
     });
-    cstr.prototype.__stencilAugmented = true;
   }
 }
 function componentOnReady$1() {
@@ -3345,6 +3466,7 @@ function hydrateApp(win2, opts, results, afterHydrate, resolve) {
   const orgDocumentCreateElement = win2.document.createElement;
   const orgDocumentCreateElementNS = win2.document.createElementNS;
   const resolved2 = Promise.resolve();
+  setScopedSSR(opts);
   let tmrId;
   let ranCompleted = false;
   function hydratedComplete() {
@@ -3453,13 +3575,16 @@ async function hydrateComponent(win2, results, tagName, elm, waitingElements) {
     if (cmpMeta != null) {
       waitingElements.add(elm);
       const hostRef = getHostRef(this);
+      if (!hostRef) {
+        return;
+      }
       addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
       try {
         connectedCallback(elm);
         await elm.componentOnReady();
         results.hydratedCount++;
         const ref = getHostRef(elm);
-        const modeName = !ref.$modeName$ ? "$" : ref.$modeName$;
+        const modeName = !(ref == null ? void 0 : ref.$modeName$) ? "$" : ref == null ? void 0 : ref.$modeName$;
         if (!results.components.some((c) => c.tag === tagName && c.mode === modeName)) {
           results.components.push({
             tag: tagName,
@@ -3683,6 +3808,7 @@ var getHostRef = (ref) => {
   return void 0;
 };
 var registerInstance = (lazyInstance, hostRef) => {
+  if (!hostRef) return void 0;
   lazyInstance.__stencil__getHostRef = () => hostRef;
   hostRef.$lazyInstance$ = lazyInstance;
   return hostRef;
@@ -3693,8 +3819,10 @@ var registerHost = (elm, cmpMeta) => {
     $cmpMeta$: cmpMeta,
     $hostElement$: elm,
     $instanceValues$: /* @__PURE__ */ new Map(),
+    $serializerValues$: /* @__PURE__ */ new Map(),
     $renderCount$: 0
   };
+  hostRef.$fetchedCbList$ = [];
   hostRef.$onInstancePromise$ = new Promise((r) => hostRef.$onInstanceResolve$ = r);
   hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
   elm["s-p"] = [];
@@ -3706,6 +3834,11 @@ var Build = {
   isBrowser: false};
 var styles = /* @__PURE__ */ new Map();
 
+var setScopedSSR = (opts) => {
+  scopedSSR = opts.serializeShadowRoot !== false && opts.serializeShadowRoot !== "declarative-shadow-dom";
+};
+var needsScopedSSR = () => scopedSSR;
+var scopedSSR = false;
 
 const caretDownSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgMjU2IiBmaWxsPSJjdXJyZW50Q29sb3IiPjxwYXRoIGQ9Ik0yMTMuNjYsMTAxLjY2bC04MCw4MGE4LDgsMCwwLDEtMTEuMzIsMGwtODAtODBBOCw4LDAsMCwxLDUzLjY2LDkwLjM0TDEyOCwxNjQuNjlsNzQuMzQtNzQuMzVhOCw4LDAsMCwxLDExLjMyLDExLjMyWiIvPjwvc3ZnPg==';
 
@@ -4580,7 +4713,7 @@ class Accordion {
         md: accordionMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 57,
+        "$flags$": 313,
         "$tagName$": "ion-accordion",
         "$members$": {
             "value": [1],
@@ -4850,7 +4983,7 @@ class AccordionGroup {
         md: accordionGroupMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-accordion-group",
         "$members$": {
             "animated": [4],
@@ -7921,15 +8054,15 @@ class ActionSheet {
         md: actionSheetMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-action-sheet",
         "$members$": {
             "overlayIndex": [2, "overlay-index"],
             "delegate": [16],
             "hasController": [4, "has-controller"],
             "keyboardClose": [4, "keyboard-close"],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "buttons": [16],
             "cssClass": [1, "css-class"],
             "backdropDismiss": [4, "backdrop-dismiss"],
@@ -7937,7 +8070,7 @@ class ActionSheet {
             "subHeader": [1, "sub-header"],
             "translucent": [4],
             "animated": [4],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "isOpen": [4, "is-open"],
             "trigger": [1],
             "present": [64],
@@ -8658,15 +8791,15 @@ class Alert {
         md: alertMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-alert",
         "$members$": {
             "overlayIndex": [2, "overlay-index"],
             "delegate": [16],
             "hasController": [4, "has-controller"],
             "keyboardClose": [4, "keyboard-close"],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "cssClass": [1, "css-class"],
             "header": [1],
             "subHeader": [1, "sub-header"],
@@ -8676,7 +8809,7 @@ class Alert {
             "backdropDismiss": [4, "backdrop-dismiss"],
             "translucent": [4],
             "animated": [4],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "isOpen": [4, "is-open"],
             "trigger": [1],
             "present": [64],
@@ -8736,7 +8869,7 @@ class App {
     get el() { return getElement(this); }
     static get style() { return appCss; }
     static get cmpMeta() { return {
-        "$flags$": 0,
+        "$flags$": 256,
         "$tagName$": "ion-app",
         "$members$": {
             "setFocus": [64]
@@ -8816,7 +8949,7 @@ class Avatar {
         md: avatarMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-avatar",
         "$members$": {
             "size": [1],
@@ -8928,7 +9061,7 @@ class BackButton {
         md: backButtonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-back-button",
         "$members$": {
             "color": [513],
@@ -8937,7 +9070,7 @@ class BackButton {
             "icon": [1],
             "text": [1],
             "type": [1],
-            "routerAnimation": [16, "router-animation"]
+            "routerAnimation": [16]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -8998,7 +9131,7 @@ class Backdrop {
         md: backdropMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-backdrop",
         "$members$": {
             "visible": [4],
@@ -9094,7 +9227,7 @@ class Badge {
         md: badgeMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-badge",
         "$members$": {
             "color": [513],
@@ -9239,7 +9372,7 @@ class Breadcrumb {
         md: breadcrumbMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-breadcrumb",
         "$members$": {
             "collapsed": [4],
@@ -9254,7 +9387,7 @@ class Breadcrumb {
             "separator": [4],
             "target": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"]
+            "routerAnimation": [16]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -9396,7 +9529,7 @@ class Breadcrumbs {
         md: breadcrumbsMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-breadcrumbs",
         "$members$": {
             "color": [513],
@@ -9705,7 +9838,7 @@ class Button {
         md: buttonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-button",
         "$members$": {
             "color": [513],
@@ -9714,7 +9847,7 @@ class Button {
             "expand": [513],
             "fill": [1537],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "download": [1],
             "href": [1],
             "rel": [1],
@@ -9772,7 +9905,7 @@ class Buttons {
         md: buttonsMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 38,
+        "$flags$": 294,
         "$tagName$": "ion-buttons",
         "$members$": {
             "collapse": [4]
@@ -9863,7 +9996,7 @@ class Card {
         md: cardMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-card",
         "$members$": {
             "color": [513],
@@ -9874,7 +10007,7 @@ class Card {
             "href": [1],
             "rel": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "shape": [513],
             "target": [1]
         },
@@ -9912,7 +10045,7 @@ class CardContent {
         md: cardContentMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-card-content",
         "$members$": undefined,
         "$listeners$": undefined,
@@ -9955,7 +10088,7 @@ class CardHeader {
         md: cardHeaderMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-card-header",
         "$members$": {
             "color": [513],
@@ -9994,7 +10127,7 @@ class CardSubtitle {
         md: cardSubtitleMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-card-subtitle",
         "$members$": {
             "color": [513]
@@ -10032,7 +10165,7 @@ class CardTitle {
         md: cardTitleMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-card-title",
         "$members$": {
             "color": [513]
@@ -10244,7 +10377,7 @@ class Checkbox {
         md: checkboxMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-checkbox",
         "$members$": {
             "color": [513],
@@ -10345,7 +10478,7 @@ class Chip {
         md: chipMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-chip",
         "$members$": {
             "color": [513],
@@ -10471,7 +10604,7 @@ class Col {
     get el() { return getElement(this); }
     static get style() { return colCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-col",
         "$members$": {
             "offset": [1],
@@ -10887,7 +11020,7 @@ class Content {
     get el() { return getElement(this); }
     static get style() { return contentCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-content",
         "$members$": {
             "color": [513],
@@ -11801,17 +11934,18 @@ const getFormattedDayPeriod = (dayPeriod) => {
  * confusion.
  */
 const stripTimeZone = (formatOptions) => {
-    return Object.assign(Object.assign({}, formatOptions), { 
+    return Object.assign(Object.assign({}, formatOptions), {
         /**
          * Setting the time zone to UTC ensures that the value shown is always the
          * same as what was selected and safeguards against older Safari bugs with
          * Intl.DateTimeFormat.
          */
-        timeZone: 'UTC', 
+        timeZone: 'UTC',
         /**
          * We do not want to display the time zone name
          */
-        timeZoneName: undefined });
+        timeZoneName: undefined
+    });
 };
 const getLocalizedTime = (locale, refParts, hourCycle, formatOptions = { hour: 'numeric', minute: 'numeric' }) => {
     const timeParts = {
@@ -11821,12 +11955,13 @@ const getLocalizedTime = (locale, refParts, hourCycle, formatOptions = { hour: '
     if (timeParts.hour === undefined || timeParts.minute === undefined) {
         return 'Invalid Time';
     }
-    return new Intl.DateTimeFormat(locale, Object.assign(Object.assign({}, stripTimeZone(formatOptions)), { 
+    return new Intl.DateTimeFormat(locale, Object.assign(Object.assign({}, stripTimeZone(formatOptions)), {
         /**
          * We use hourCycle here instead of hour12 due to:
          * https://bugs.chromium.org/p/chromium/issues/detail?id=1347316&q=hour12&can=2
          */
-        hourCycle })).format(new Date(convertDataToISO(Object.assign({ 
+        hourCycle
+    })).format(new Date(convertDataToISO(Object.assign({
         /**
          * JS uses a simplified ISO 8601 format which allows for
          * date-only formats and date-time formats, but not
@@ -11838,7 +11973,8 @@ const getLocalizedTime = (locale, refParts, hourCycle, formatOptions = { hour: '
          * values, so passing these date values should have no impact
          * on the time output.
          */
-        year: 2023, day: 1, month: 1 }, timeParts)) + 'Z'));
+        year: 2023, day: 1, month: 1
+    }, timeParts)) + 'Z'));
 };
 /**
  * Adds padding to a time value so
@@ -14563,15 +14699,15 @@ class Datetime {
         md: datetimeMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-datetime",
         "$members$": {
             "color": [1],
             "name": [1],
             "disabled": [4],
-            "formatOptions": [16, "format-options"],
+            "formatOptions": [16],
             "readonly": [4],
-            "isDateEnabled": [16, "is-date-enabled"],
+            "isDateEnabled": [16],
             "showAdjacentDays": [4, "show-adjacent-days"],
             "min": [1025],
             "max": [1025],
@@ -14586,9 +14722,9 @@ class Datetime {
             "minuteValues": [8, "minute-values"],
             "locale": [1],
             "firstDayOfWeek": [2, "first-day-of-week"],
-            "titleSelectedDatesFormatter": [16, "title-selected-dates-formatter"],
+            "titleSelectedDatesFormatter": [16],
             "multiple": [4],
-            "highlightedDates": [16, "highlighted-dates"],
+            "highlightedDates": [16],
             "value": [1025],
             "showDefaultTitle": [4, "show-default-title"],
             "showDefaultButtons": [4, "show-default-buttons"],
@@ -14969,7 +15105,7 @@ class DatetimeButton {
         md: datetimeButtonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-datetime-button",
         "$members$": {
             "color": [513],
@@ -15028,7 +15164,7 @@ class Divider {
         md: dividerMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-divider",
         "$members$": {
             "spacing": [513],
@@ -15111,7 +15247,7 @@ class Fab {
     }; }
     static get style() { return fabCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-fab",
         "$members$": {
             "horizontal": [1],
@@ -15246,7 +15382,7 @@ class FabButton {
         md: fabButtonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-fab-button",
         "$members$": {
             "color": [513],
@@ -15256,7 +15392,7 @@ class FabButton {
             "href": [1],
             "rel": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "target": [1],
             "show": [4],
             "translucent": [4],
@@ -15310,7 +15446,7 @@ class FabList {
     }; }
     static get style() { return fabListCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-fab-list",
         "$members$": {
             "activated": [4],
@@ -15781,7 +15917,7 @@ class Footer {
         md: footerMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 36,
+        "$flags$": 292,
         "$tagName$": "ion-footer",
         "$members$": {
             "collapse": [1],
@@ -15817,7 +15953,7 @@ class Grid {
     }
     static get style() { return gridCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-grid",
         "$members$": {
             "fixed": [4]
@@ -16194,7 +16330,7 @@ class Header {
         md: headerMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 36,
+        "$flags$": 292,
         "$tagName$": "ion-header",
         "$members$": {
             "collapse": [1],
@@ -16403,7 +16539,7 @@ class Icon {
     }; }
     static get style() { return iconCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-icon",
         "$members$": {
             "mode": [1025],
@@ -16527,7 +16663,7 @@ class Img {
     }; }
     static get style() { return imgCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-img",
         "$members$": {
             "alt": [1],
@@ -16835,7 +16971,7 @@ class InfiniteScroll {
     }; }
     static get style() { return infiniteScrollCss; }
     static get cmpMeta() { return {
-        "$flags$": 0,
+        "$flags$": 256,
         "$tagName$": "ion-infinite-scroll",
         "$members$": {
             "threshold": [1],
@@ -16893,7 +17029,7 @@ class InfiniteScrollContent {
         md: infiniteScrollContentMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-infinite-scroll-content",
         "$members$": {
             "loadingSpinner": [1025, "loading-spinner"],
@@ -17841,7 +17977,7 @@ class Input {
         md: inputMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 38,
+        "$flags$": 294,
         "$tagName$": "ion-input",
         "$members$": {
             "color": [513],
@@ -17853,7 +17989,7 @@ class Input {
             "clearInputIcon": [1, "clear-input-icon"],
             "clearOnEdit": [4, "clear-on-edit"],
             "counter": [4],
-            "counterFormatter": [16, "counter-formatter"],
+            "counterFormatter": [16],
             "debounce": [2],
             "disabled": [516],
             "enterkeyhint": [1],
@@ -18527,7 +18663,7 @@ class InputOTP {
         md: inputOtpMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 38,
+        "$flags$": 294,
         "$tagName$": "ion-input-otp",
         "$members$": {
             "autocapitalize": [1],
@@ -18672,7 +18808,7 @@ class InputPasswordToggle {
         md: mdInputPasswordToggleNativeCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-input-password-toggle",
         "$members$": {
             "color": [513],
@@ -18686,7 +18822,7 @@ class InputPasswordToggle {
     }; }
 }
 
-const itemIonicCss = ":host{--border-radius:0px;--border-width:0px;--border-style:solid;--padding-top:0px;--padding-bottom:0px;--padding-end:0px;--padding-start:0px;--inner-border-width:0px;--inner-padding-top:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;--inner-padding-end:0px;--inner-box-shadow:none;--detail-icon-color:initial;--detail-icon-font-size:1.25em;--detail-icon-opacity:0.25;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;outline:none;color:var(--color);text-align:initial;text-decoration:none;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.ion-activated) .item-native{color:var(--color-activated)}:host(.ion-activated) .item-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.ion-focused) .item-native{color:var(--color-focused)}:host(.ion-focused) .item-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(.ion-activatable:not(.ion-focused):hover) .item-native{color:var(--color-hover)}:host(.ion-activatable:not(.ion-focused):hover) .item-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.item-control-needs-pointer-cursor){cursor:pointer}:host(.item-interactive-disabled:not(.item-multiple-inputs)){cursor:default;pointer-events:none}:host(.item-disabled){cursor:default;opacity:0.3;pointer-events:none}.item-native{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;padding-right:var(--padding-end);padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:inherit;overflow:inherit;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box}:host-context([dir=rtl]) .item-native{padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}[dir=rtl] .item-native{padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}@supports selector(:dir(rtl)){.item-native:dir(rtl){padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}}.item-native::-moz-focus-inner{border:0}.item-native::after{right:0;left:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0;-webkit-transition:var(--transition);transition:var(--transition);z-index:-1}button,a{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}.item-inner{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-left:var(--inner-padding-start);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);-webkit-box-shadow:var(--inner-box-shadow);box-shadow:var(--inner-box-shadow);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host-context([dir=rtl]) .item-inner{padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}[dir=rtl] .item-inner{padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}@supports selector(:dir(rtl)){.item-inner:dir(rtl){padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}}.item-detail-icon{-webkit-margin-start:calc(var(--inner-padding-end) / 2);margin-inline-start:calc(var(--inner-padding-end) / 2);-webkit-margin-end:-6px;margin-inline-end:-6px;color:var(--detail-icon-color);font-size:var(--detail-icon-font-size);opacity:var(--detail-icon-opacity)}::slotted(ion-icon){font-size:1.6em}::slotted(ion-button){--margin-top:0;--margin-bottom:0;--margin-start:0;--margin-end:0;z-index:1}::slotted(ion-label:not([slot=end])){-ms-flex:1;flex:1;width:-webkit-min-content;width:-moz-min-content;width:min-content;max-width:100%}:host(.item-input){-ms-flex-align:center;align-items:center}.input-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.item-label-stacked),:host(.item-label-floating){-ms-flex-align:start;align-items:start}:host(.item-label-stacked) .input-wrapper,:host(.item-label-floating) .input-wrapper{-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column}:host(.item-multiple-inputs) ::slotted(ion-checkbox),:host(.item-multiple-inputs) ::slotted(ion-datetime),:host(.item-multiple-inputs) ::slotted(ion-radio){position:relative}:host(.item-textarea){-ms-flex-align:stretch;align-items:stretch}::slotted(ion-reorder[slot]){margin-top:0;margin-bottom:0}ion-ripple-effect{color:var(--ripple-color)}:host{--background:var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));--background-activated:var(--token-bg-select-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f2f4fd)));--background-focused:var(--token-primitives-neutral-200, #efefef);--background-focused-opacity:1;--border-color:var(--token-primitives-neutral-300, #e0e0e0);--border-style:var(--token-border-style-solid, solid);--border-width:0 0 var(--token-border-size-025, var(--token-scale-025, 1px)) 0;--color:var(--token-text-default, var(--token-primitives-neutral-1200, #242424));--detail-icon-font-size:var(--token-scale-600, 24px);--detail-icon-opacity:1;--min-height:var(--token-scale-1800, 72px);--padding-top:var(--token-space-200, var(--token-scale-200, 8px));--padding-end:var(--token-space-400, var(--token-scale-400, 16px));--padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));--padding-start:var(--token-space-400, var(--token-scale-400, 16px));font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0%);line-height:var(--token-font-line-height-600, var(--token-scale-600, 24px));text-decoration:none;text-transform:none}.item-inner{min-height:initial}.item-detail-icon{-webkit-margin-end:0;margin-inline-end:0}slot[name=start]::slotted(*){-webkit-margin-end:var(--token-space-400, var(--token-scale-400, 16px));margin-inline-end:var(--token-space-400, var(--token-scale-400, 16px))}slot[name=end]::slotted(*){-webkit-margin-start:var(--token-space-400, var(--token-scale-400, 16px));margin-inline-start:var(--token-space-400, var(--token-scale-400, 16px))}::slotted(ion-icon:not(.item-detail-icon)){color:var(--token-primitives-neutral-1000, #3b3b3b);font-size:var(--token-scale-1000, 40px)}:host(.item-disabled) .item-native::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:\"\";pointer-events:none}:host(.ion-activated) .item-native{background:var(--background-activated)}:host(.ion-focused) .item-native{--border-radius:var(--token-border-radius-400, var(--token-scale-400, 16px))}:host(.ion-focused) .item-native::after{border-radius:inherit;right:0;left:0;top:0;bottom:0;position:absolute;border-width:var(--token-border-size-050, var(--token-scale-050, 2px));border-style:var(--token-border-style-solid, solid);border-color:var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));content:\"\"}:host(.item-lines-full){--border-width:var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-border-size-0, var(--token-scale-0, 0px))}:host(.item-lines-inset){--inner-border-width:var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-border-size-0, var(--token-scale-0, 0px))}:host(.item-lines-inset),:host(.item-lines-none){--border-width:var(--token-border-size-0, var(--token-scale-0, 0px))}:host(.item-lines-full),:host(.item-lines-none){--inner-border-width:var(--token-border-size-0, var(--token-scale-0, 0px))}";
+const itemIonicCss = ":host{--border-radius:0px;--border-width:0px;--border-style:solid;--padding-top:0px;--padding-bottom:0px;--padding-end:0px;--padding-start:0px;--inner-border-width:0px;--inner-padding-top:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;--inner-padding-end:0px;--inner-box-shadow:none;--detail-icon-color:initial;--detail-icon-font-size:1.25em;--detail-icon-opacity:0.25;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;outline:none;color:var(--color);text-align:initial;text-decoration:none;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.ion-activated) .item-native{color:var(--color-activated)}:host(.ion-activated) .item-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.ion-focused) .item-native{color:var(--color-focused)}:host(.ion-focused) .item-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(.ion-activatable:not(.ion-focused):hover) .item-native{color:var(--color-hover)}:host(.ion-activatable:not(.ion-focused):hover) .item-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.item-control-needs-pointer-cursor){cursor:pointer}:host(.item-interactive-disabled:not(.item-multiple-inputs)){cursor:default;pointer-events:none}:host(.item-disabled){cursor:default;opacity:0.3;pointer-events:none}.item-native{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;padding-right:var(--padding-end);padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:inherit;overflow:inherit;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box}:host-context([dir=rtl]) .item-native{padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}[dir=rtl] .item-native{padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}@supports selector(:dir(rtl)){.item-native:dir(rtl){padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}}.item-native::-moz-focus-inner{border:0}.item-native::after{right:0;left:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0;-webkit-transition:var(--transition);transition:var(--transition);z-index:-1}button,a{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}.item-inner{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-left:var(--inner-padding-start);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);-webkit-box-shadow:var(--inner-box-shadow);box-shadow:var(--inner-box-shadow);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host-context([dir=rtl]) .item-inner{padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}[dir=rtl] .item-inner{padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}@supports selector(:dir(rtl)){.item-inner:dir(rtl){padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}}.item-detail-icon{-webkit-margin-start:calc(var(--inner-padding-end) / 2);margin-inline-start:calc(var(--inner-padding-end) / 2);-webkit-margin-end:-6px;margin-inline-end:-6px;color:var(--detail-icon-color);font-size:var(--detail-icon-font-size);opacity:var(--detail-icon-opacity)}::slotted(ion-icon){font-size:1.6em}::slotted(ion-button){--margin-top:0;--margin-bottom:0;--margin-start:0;--margin-end:0;z-index:1}::slotted(ion-label:not([slot=end])){-ms-flex:1;flex:1;width:-webkit-min-content;width:-moz-min-content;width:min-content;max-width:100%}:host(.item-input){-ms-flex-align:center;align-items:center}.input-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.item-label-stacked),:host(.item-label-floating){-ms-flex-align:start;align-items:start}:host(.item-label-stacked) .input-wrapper,:host(.item-label-floating) .input-wrapper{-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column}:host(.item-multiple-inputs) ::slotted(ion-checkbox),:host(.item-multiple-inputs) ::slotted(ion-datetime),:host(.item-multiple-inputs) ::slotted(ion-radio){position:relative}:host(.item-textarea){-ms-flex-align:stretch;align-items:stretch}::slotted(ion-reorder[slot]){margin-top:0;margin-bottom:0}ion-ripple-effect{color:var(--ripple-color)}:host{--background:var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));--background-activated:var(--token-bg-select-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f2f4fd)));--border-color:var(--token-primitives-neutral-300, #e0e0e0);--border-style:var(--token-border-style-solid, solid);--border-width:0 0 var(--token-border-size-025, var(--token-scale-025, 1px)) 0;--color:var(--token-text-default, var(--token-primitives-neutral-1200, #242424));--detail-icon-font-size:var(--token-scale-600, 24px);--detail-icon-opacity:1;--min-height:var(--token-scale-1800, 72px);--padding-top:var(--token-space-200, var(--token-scale-200, 8px));--padding-end:var(--token-space-400, var(--token-scale-400, 16px));--padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));--padding-start:var(--token-space-400, var(--token-scale-400, 16px));font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0%);line-height:var(--token-font-line-height-600, var(--token-scale-600, 24px));text-decoration:none;text-transform:none}.item-inner{min-height:initial}.item-detail-icon{-webkit-margin-end:0;margin-inline-end:0}slot[name=start]::slotted(*){-webkit-margin-end:var(--token-space-400, var(--token-scale-400, 16px));margin-inline-end:var(--token-space-400, var(--token-scale-400, 16px))}slot[name=end]::slotted(*){-webkit-margin-start:var(--token-space-400, var(--token-scale-400, 16px));margin-inline-start:var(--token-space-400, var(--token-scale-400, 16px))}::slotted(ion-icon:not(.item-detail-icon)){color:var(--token-primitives-neutral-1000, #3b3b3b);font-size:var(--token-scale-1000, 40px)}:host(.item-disabled) .item-native::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:\"\";pointer-events:none}:host(.ion-activated) .item-native{background:var(--background-activated)}:host(.ion-focused) .item-native::after{border-radius:inherit;right:0;left:0;top:0;bottom:0;position:absolute;border-width:var(--token-border-size-050, var(--token-scale-050, 2px));border-style:var(--token-border-style-solid, solid);border-color:var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));content:\"\"}:host(.item-lines-full){--border-width:var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-border-size-0, var(--token-scale-0, 0px))}:host(.item-lines-inset){--inner-border-width:var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-0, var(--token-scale-0, 0px)) var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-border-size-0, var(--token-scale-0, 0px))}:host(.item-lines-inset),:host(.item-lines-none){--border-width:var(--token-border-size-0, var(--token-scale-0, 0px))}:host(.item-lines-full),:host(.item-lines-none){--inner-border-width:var(--token-border-size-0, var(--token-scale-0, 0px))}";
 
 const itemIosCss = ":host{--border-radius:0px;--border-width:0px;--border-style:solid;--padding-top:0px;--padding-bottom:0px;--padding-end:0px;--padding-start:0px;--inner-border-width:0px;--inner-padding-top:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;--inner-padding-end:0px;--inner-box-shadow:none;--detail-icon-color:initial;--detail-icon-font-size:1.25em;--detail-icon-opacity:0.25;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;outline:none;color:var(--color);text-align:initial;text-decoration:none;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.ion-activated) .item-native{color:var(--color-activated)}:host(.ion-activated) .item-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.ion-focused) .item-native{color:var(--color-focused)}:host(.ion-focused) .item-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(.ion-activatable:not(.ion-focused):hover) .item-native{color:var(--color-hover)}:host(.ion-activatable:not(.ion-focused):hover) .item-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.item-control-needs-pointer-cursor){cursor:pointer}:host(.item-interactive-disabled:not(.item-multiple-inputs)){cursor:default;pointer-events:none}:host(.item-disabled){cursor:default;opacity:0.3;pointer-events:none}.item-native{border-radius:var(--border-radius);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;padding-right:var(--padding-end);padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;min-height:var(--min-height);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:inherit;overflow:inherit;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box}:host-context([dir=rtl]) .item-native{padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}[dir=rtl] .item-native{padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}@supports selector(:dir(rtl)){.item-native:dir(rtl){padding-right:calc(var(--padding-start) + var(--ion-safe-area-right, 0px));padding-left:var(--padding-end)}}.item-native::-moz-focus-inner{border:0}.item-native::after{right:0;left:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0;-webkit-transition:var(--transition);transition:var(--transition);z-index:-1}button,a{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}.item-inner{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-left:var(--inner-padding-start);display:-ms-flexbox;display:flex;position:relative;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;min-height:inherit;border-width:var(--inner-border-width);border-style:var(--border-style);border-color:var(--border-color);-webkit-box-shadow:var(--inner-box-shadow);box-shadow:var(--inner-box-shadow);overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host-context([dir=rtl]) .item-inner{padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}[dir=rtl] .item-inner{padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}@supports selector(:dir(rtl)){.item-inner:dir(rtl){padding-right:var(--inner-padding-start);padding-left:calc(var(--ion-safe-area-left, 0px) + var(--inner-padding-end))}}.item-detail-icon{-webkit-margin-start:calc(var(--inner-padding-end) / 2);margin-inline-start:calc(var(--inner-padding-end) / 2);-webkit-margin-end:-6px;margin-inline-end:-6px;color:var(--detail-icon-color);font-size:var(--detail-icon-font-size);opacity:var(--detail-icon-opacity)}::slotted(ion-icon){font-size:1.6em}::slotted(ion-button){--margin-top:0;--margin-bottom:0;--margin-start:0;--margin-end:0;z-index:1}::slotted(ion-label:not([slot=end])){-ms-flex:1;flex:1;width:-webkit-min-content;width:-moz-min-content;width:min-content;max-width:100%}:host(.item-input){-ms-flex-align:center;align-items:center}.input-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;text-overflow:ellipsis;overflow:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.item-label-stacked),:host(.item-label-floating){-ms-flex-align:start;align-items:start}:host(.item-label-stacked) .input-wrapper,:host(.item-label-floating) .input-wrapper{-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column}:host(.item-multiple-inputs) ::slotted(ion-checkbox),:host(.item-multiple-inputs) ::slotted(ion-datetime),:host(.item-multiple-inputs) ::slotted(ion-radio){position:relative}:host(.item-textarea){-ms-flex-align:stretch;align-items:stretch}::slotted(ion-reorder[slot]){margin-top:0;margin-bottom:0}ion-ripple-effect{color:var(--ripple-color)}:host{font-family:var(--ion-font-family, inherit)}:host(.ion-color) .item-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.ion-color) .item-native,:host(.ion-color) .item-inner{border-color:var(--ion-color-shade)}:host(.ion-color.ion-activated) .item-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-focused) .item-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-focused) .item-native::after{background:var(--ion-color-contrast)}@media (any-hover: hover){:host(.ion-color.ion-activatable:not(.ion-focused):hover) .item-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-activatable:not(.ion-focused):hover) .item-native::after{background:var(--ion-color-contrast)}}:host{--min-height:44px;--transition:background-color 200ms linear, opacity 200ms linear;--padding-start:16px;--inner-padding-end:16px;--inner-border-width:0px 0px 0.55px 0px;--background:var(--ion-item-background, var(--ion-background-color, #fff));--background-activated:var(--ion-text-color, #000);--background-focused:var(--ion-text-color, #000);--background-hover:currentColor;--background-activated-opacity:0.12;--background-focused-opacity:0.15;--background-hover-opacity:0.04;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--color:var(--ion-item-color, var(--ion-text-color, #000));font-size:1rem}:host(.ion-activated){--transition:none}:host(.ion-color.ion-focused) .item-native::after{background:#000;opacity:0.15}:host(.ion-color.ion-activated) .item-native::after{background:#000;opacity:0.12}:host(.item-lines-full){--border-width:0px 0px 0.55px 0px}:host(.item-lines-inset){--inner-border-width:0px 0px 0.55px 0px}:host(.item-lines-inset),:host(.item-lines-none){--border-width:0px}:host(.item-lines-full),:host(.item-lines-none){--inner-border-width:0px}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:2px;margin-bottom:2px}::slotted(ion-icon[slot=start]),::slotted(ion-icon[slot=end]){margin-top:7px;margin-bottom:7px}::slotted(ion-toggle[slot=start]),::slotted(ion-toggle[slot=end]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host(.item-label-stacked) ::slotted([slot=end]),:host(.item-label-floating) ::slotted([slot=end]){margin-top:7px;margin-bottom:7px}::slotted(.button-small){--padding-top:1px;--padding-bottom:1px;--padding-start:0.5em;--padding-end:0.5em;min-height:24px;font-size:0.8125rem}::slotted(ion-avatar){width:36px;height:36px}::slotted(ion-thumbnail){--size:56px}::slotted(ion-avatar[slot=end]),::slotted(ion-thumbnail[slot=end]){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px;margin-bottom:8px}:host(.item-radio) ::slotted(ion-label),:host(.item-toggle) ::slotted(ion-label){-webkit-margin-start:0px;margin-inline-start:0px}::slotted(ion-label){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:10px;margin-bottom:10px}:host(.item-label-floating),:host(.item-label-stacked){--min-height:68px}";
 
@@ -18965,7 +19101,7 @@ class Item {
         md: itemMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-item",
         "$members$": {
             "color": [513],
@@ -18977,7 +19113,7 @@ class Item {
             "href": [1],
             "rel": [1],
             "lines": [1],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "routerDirection": [1, "router-direction"],
             "target": [1],
             "type": [1],
@@ -19032,7 +19168,7 @@ class ItemDivider {
         md: itemDividerMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-item-divider",
         "$members$": {
             "color": [513],
@@ -19073,7 +19209,7 @@ class ItemGroup {
         md: itemGroupMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-item-group",
         "$members$": undefined,
         "$listeners$": undefined,
@@ -19170,7 +19306,7 @@ class ItemOption {
         md: itemOptionMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-item-option",
         "$members$": {
             "color": [513],
@@ -19242,7 +19378,7 @@ class ItemOptions {
         md: itemOptionsMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-item-options",
         "$members$": {
             "side": [1],
@@ -19704,7 +19840,7 @@ class ItemSliding {
     }; }
     static get style() { return itemSlidingCss; }
     static get cmpMeta() { return {
-        "$flags$": 0,
+        "$flags$": 256,
         "$tagName$": "ion-item-sliding",
         "$members$": {
             "disabled": [4],
@@ -19816,7 +19952,7 @@ class Label {
         md: labelMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 38,
+        "$flags$": 294,
         "$tagName$": "ion-label",
         "$members$": {
             "color": [513],
@@ -19896,7 +20032,7 @@ class List {
         md: listMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-list",
         "$members$": {
             "lines": [1],
@@ -19938,7 +20074,7 @@ class ListHeader {
         md: listHeaderMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-list-header",
         "$members$": {
             "color": [513],
@@ -20234,15 +20370,15 @@ class Loading {
         md: loadingMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-loading",
         "$members$": {
             "overlayIndex": [2, "overlay-index"],
             "delegate": [16],
             "hasController": [4, "has-controller"],
             "keyboardClose": [4, "keyboard-close"],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "message": [1],
             "cssClass": [1, "css-class"],
             "duration": [2],
@@ -20251,7 +20387,7 @@ class Loading {
             "spinner": [1025],
             "translucent": [4],
             "animated": [4],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "isOpen": [4, "is-open"],
             "trigger": [1],
             "present": [64],
@@ -21300,7 +21436,7 @@ class Menu {
         md: menuMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-menu",
         "$members$": {
             "contentId": [513, "content-id"],
@@ -21429,7 +21565,7 @@ class MenuButton {
         md: menuButtonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-menu-button",
         "$members$": {
             "color": [513],
@@ -21484,7 +21620,7 @@ class MenuToggle {
     }
     static get style() { return menuToggleCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-menu-toggle",
         "$members$": {
             "menu": [1],
@@ -24209,15 +24345,15 @@ class Modal {
         md: modalMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-modal",
         "$members$": {
             "hasController": [4, "has-controller"],
             "overlayIndex": [2, "overlay-index"],
             "delegate": [16],
             "keyboardClose": [4, "keyboard-close"],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "breakpoints": [16],
             "expandToScroll": [4, "expand-to-scroll"],
             "initialBreakpoint": [2, "initial-breakpoint"],
@@ -24225,13 +24361,13 @@ class Modal {
             "handle": [4],
             "handleBehavior": [1, "handle-behavior"],
             "component": [1],
-            "componentProps": [16, "component-props"],
+            "componentProps": [16],
             "cssClass": [1, "css-class"],
             "backdropDismiss": [4, "backdrop-dismiss"],
             "showBackdrop": [4, "show-backdrop"],
             "animated": [4],
-            "presentingElement": [16, "presenting-element"],
-            "htmlAttributes": [16, "html-attributes"],
+            "presentingElement": [16],
+            "htmlAttributes": [16],
             "isOpen": [4, "is-open"],
             "trigger": [1],
             "keepContentsMounted": [4, "keep-contents-mounted"],
@@ -25160,14 +25296,14 @@ class Nav {
     }; }
     static get style() { return navCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-nav",
         "$members$": {
             "delegate": [16],
             "swipeGesture": [1028, "swipe-gesture"],
             "animated": [4],
             "animation": [16],
-            "rootParams": [16, "root-params"],
+            "rootParams": [16],
             "root": [1],
             "push": [64],
             "insert": [64],
@@ -25232,13 +25368,13 @@ class NavLink {
     }
     get el() { return getElement(this); }
     static get cmpMeta() { return {
-        "$flags$": 0,
+        "$flags$": 256,
         "$tagName$": "ion-nav-link",
         "$members$": {
             "component": [1],
-            "componentProps": [16, "component-props"],
+            "componentProps": [16],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"]
+            "routerAnimation": [16]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -25272,7 +25408,7 @@ class Note {
         md: noteMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-note",
         "$members$": {
             "color": [513]
@@ -25764,7 +25900,7 @@ let Picker$1 = class Picker {
         md: pickerMdCss$1
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-picker",
         "$members$": {
             "exitInputMode": [64]
@@ -26046,15 +26182,15 @@ class Picker {
         md: pickerMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-picker-legacy",
         "$members$": {
             "overlayIndex": [2, "overlay-index"],
             "delegate": [16],
             "hasController": [4, "has-controller"],
             "keyboardClose": [4, "keyboard-close"],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "buttons": [16],
             "columns": [16],
             "cssClass": [1, "css-class"],
@@ -26062,7 +26198,7 @@ class Picker {
             "showBackdrop": [4, "show-backdrop"],
             "backdropDismiss": [4, "backdrop-dismiss"],
             "animated": [4],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "isOpen": [4, "is-open"],
             "trigger": [1],
             "presented": [32],
@@ -26649,7 +26785,7 @@ class PickerColumn {
     }; }
     static get style() { return pickerColumnCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-picker-column",
         "$members$": {
             "disabled": [4],
@@ -27017,7 +27153,7 @@ class PickerColumnCmp {
         md: pickerColumnMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-picker-legacy-column",
         "$members$": {
             "col": [16]
@@ -27144,7 +27280,7 @@ class PickerColumnOption {
         md: pickerColumnOptionMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-picker-column-option",
         "$members$": {
             "disabled": [4],
@@ -28559,16 +28695,16 @@ class Popover {
         md: popoverMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-popover",
         "$members$": {
             "hasController": [4, "has-controller"],
             "delegate": [16],
             "overlayIndex": [2, "overlay-index"],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "component": [1],
-            "componentProps": [16, "component-props"],
+            "componentProps": [16],
             "keyboardClose": [4, "keyboard-close"],
             "cssClass": [1, "css-class"],
             "backdropDismiss": [4, "backdrop-dismiss"],
@@ -28576,7 +28712,7 @@ class Popover {
             "showBackdrop": [4, "show-backdrop"],
             "translucent": [4],
             "animated": [4],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "triggerAction": [1, "trigger-action"],
             "trigger": [1],
             "size": [1],
@@ -28682,7 +28818,7 @@ class ProgressBar {
         md: progressBarMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-progress-bar",
         "$members$": {
             "type": [1],
@@ -28884,7 +29020,7 @@ class Radio {
         md: radioMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-radio",
         "$members$": {
             "color": [513],
@@ -29116,7 +29252,7 @@ class RadioGroup {
         md: radioGroupMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 36,
+        "$flags$": 292,
         "$tagName$": "ion-radio-group",
         "$members$": {
             "allowEmptySelection": [4, "allow-empty-selection"],
@@ -29896,7 +30032,7 @@ class Range {
         md: rangeMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-range",
         "$members$": {
             "color": [513],
@@ -29907,7 +30043,7 @@ class Range {
             "min": [2],
             "max": [2],
             "pin": [4],
-            "pinFormatter": [16, "pin-formatter"],
+            "pinFormatter": [16],
             "snaps": [4],
             "step": [2],
             "ticks": [4],
@@ -30872,7 +31008,7 @@ class Refresher {
         md: refresherMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-refresher",
         "$members$": {
             "pullMin": [2, "pull-min"],
@@ -31097,7 +31233,7 @@ class RefresherContent {
         md: mdRefresherContentCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 32,
+        "$flags$": 288,
         "$tagName$": "ion-refresher-content",
         "$members$": {
             "pullingIcon": [1025, "pulling-icon"],
@@ -31168,7 +31304,7 @@ class Reorder {
         md: reorderMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-reorder",
         "$members$": undefined,
         "$listeners$": [[2, "click", "onClick"]],
@@ -31447,7 +31583,7 @@ class ReorderGroup {
     }; }
     static get style() { return reorderGroupCss; }
     static get cmpMeta() { return {
-        "$flags$": 0,
+        "$flags$": 256,
         "$tagName$": "ion-reorder-group",
         "$members$": {
             "disabled": [4],
@@ -31571,7 +31707,7 @@ class RippleEffect {
         md: mdRippleEffectCommonCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-ripple-effect",
         "$members$": {
             "type": [1],
@@ -31642,9 +31778,9 @@ class Route {
         "$members$": {
             "url": [1],
             "component": [1],
-            "componentProps": [16, "component-props"],
-            "beforeLeave": [16, "before-leave"],
-            "beforeEnter": [16, "before-enter"]
+            "componentProps": [16],
+            "beforeLeave": [16],
+            "beforeEnter": [16]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -32541,14 +32677,14 @@ class RouterLink {
     }
     static get style() { return routerLinkCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-router-link",
         "$members$": {
             "color": [513],
             "href": [1],
             "rel": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "target": [1]
         },
         "$listeners$": undefined,
@@ -32745,14 +32881,14 @@ class RouterOutlet {
     }; }
     static get style() { return routerOutletCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-router-outlet",
         "$members$": {
             "mode": [1025],
             "delegate": [16],
             "animated": [4],
             "animation": [16],
-            "swipeHandler": [16, "swipe-handler"],
+            "swipeHandler": [16],
             "commit": [64],
             "setRouteId": [64],
             "getRouteId": [64]
@@ -32781,7 +32917,7 @@ class Row {
     }
     static get style() { return rowCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-row",
         "$members$": undefined,
         "$listeners$": undefined,
@@ -33363,7 +33499,7 @@ class Searchbar {
         md: searchbarMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-searchbar",
         "$members$": {
             "color": [513],
@@ -33970,7 +34106,7 @@ class Segment {
         md: segmentMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-segment",
         "$members$": {
             "color": [513],
@@ -34127,7 +34263,7 @@ class SegmentButton {
         md: segmentButtonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-segment-button",
         "$members$": {
             "contentId": [513, "content-id"],
@@ -34155,7 +34291,7 @@ class SegmentContent {
     }
     static get style() { return segmentContentCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-segment-content",
         "$members$": undefined,
         "$listeners$": undefined,
@@ -34280,7 +34416,7 @@ class SegmentView {
         md: segmentViewMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-segment-view",
         "$members$": {
             "disabled": [4],
@@ -35137,7 +35273,7 @@ class Select {
         md: selectMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-select",
         "$members$": {
             "cancelText": [1, "cancel-text"],
@@ -35208,11 +35344,11 @@ const textForValue = (opts, value, compareWith) => {
 let selectIds = 0;
 const OPTION_CLASS = 'select-interface-option';
 
-const selectModalIonicCss = ".sc-ion-select-modal-ionic-h{height:100%}ion-item.sc-ion-select-modal-ionic{--border-width:0}ion-item.ion-focused.sc-ion-select-modal-ionic::part(native)::after{border:none}ion-toolbar.sc-ion-select-modal-ionic{font-size:var(--token-font-size-450, 1.125rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0%);line-height:var(--token-font-line-height-700, var(--token-scale-700, 28px));text-decoration:none;text-transform:none}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(container){display:none}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(label){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(label),ion-list.sc-ion-select-modal-ionic ion-checkbox.sc-ion-select-modal-ionic::part(label){font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0%);line-height:var(--token-font-line-height-600, var(--token-scale-600, 24px));text-decoration:none;text-transform:none}.item-radio-checked.sc-ion-select-modal-ionic,.item-checkbox-checked.sc-ion-select-modal-ionic{--background:var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f2f4fd));--border-radius:var(--token-border-radius-400, var(--token-scale-400, 16px))}ion-content.sc-ion-select-modal-ionic{--padding-start:var(--token-space-400, var(--token-scale-400, 16px)) !important;--padding-end:var(--token-space-400, var(--token-scale-400, 16px)) !important;--padding-bottom:var(--token-space-1200, var(--token-scale-1200, 48px)) !important}";
+const selectModalIonicCss = ".sc-ion-select-modal-ionic-h{height:100%}ion-item.sc-ion-select-modal-ionic{--border-width:0}ion-item.ion-focused.sc-ion-select-modal-ionic::part(native)::after,ion-item.ion-focused.sc-ion-select-modal-ionic [part~=\"native\"]::after{border:none}ion-toolbar.sc-ion-select-modal-ionic{font-size:var(--token-font-size-450, 1.125rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0%);line-height:var(--token-font-line-height-700, var(--token-scale-700, 28px));text-decoration:none;text-transform:none}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(container),ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic [part~=\"container\"]{display:none}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(label),ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic [part~=\"label\"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(label),ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic [part~=\"label\"],ion-list.sc-ion-select-modal-ionic ion-checkbox.sc-ion-select-modal-ionic::part(label),ion-list.sc-ion-select-modal-ionic ion-checkbox.sc-ion-select-modal-ionic [part~=\"label\"]{font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0%);line-height:var(--token-font-line-height-600, var(--token-scale-600, 24px));text-decoration:none;text-transform:none}.item-radio-checked.sc-ion-select-modal-ionic,.item-checkbox-checked.sc-ion-select-modal-ionic{--background:var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f2f4fd));--border-radius:var(--token-border-radius-400, var(--token-scale-400, 16px))}ion-content.sc-ion-select-modal-ionic{--padding-start:var(--token-space-400, var(--token-scale-400, 16px)) !important;--padding-end:var(--token-space-400, var(--token-scale-400, 16px)) !important;--padding-bottom:var(--token-space-1200, var(--token-scale-1200, 48px)) !important}";
 
 const selectModalIosCss = ".sc-ion-select-modal-ios-h{height:100%}ion-item.sc-ion-select-modal-ios{--inner-padding-end:0}ion-radio.sc-ion-select-modal-ios::after{bottom:0;position:absolute;width:calc(100% - 0.9375rem - 16px);border-width:0px 0px 0.55px 0px;border-style:solid;border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));content:\"\"}ion-radio.sc-ion-select-modal-ios::after{inset-inline-start:calc(0.9375rem + 16px)}";
 
-const selectModalMdCss = ".sc-ion-select-modal-md-h{height:100%}ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md::part(container){display:none}ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md::part(label){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-modal-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-modal-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-modal-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
+const selectModalMdCss = ".sc-ion-select-modal-md-h{height:100%}ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md::part(container),ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md [part~=\"container\"]{display:none}ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md::part(label),ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md [part~=\"label\"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-modal-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-modal-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-modal-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
 
 class SelectModal {
     constructor(hostRef) {
@@ -35292,7 +35428,7 @@ class SelectModal {
         md: selectModalMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-select-modal",
         "$members$": {
             "header": [1],
@@ -35329,7 +35465,7 @@ class SelectOption {
     get el() { return getElement(this); }
     static get style() { return selectOptionCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-select-option",
         "$members$": {
             "disabled": [4],
@@ -35342,11 +35478,11 @@ class SelectOption {
 }
 let selectOptionIds = 0;
 
-const ionicSelectPopoverMdCss = ".sc-ion-select-popover-ionic-h ion-list.sc-ion-select-popover-ionic{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-ionic,ion-label.sc-ion-select-popover-ionic{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-ionic-h{overflow-y:auto}ion-list.sc-ion-select-popover-ionic ion-radio.sc-ion-select-popover-ionic::part(container){display:none}ion-list.sc-ion-select-popover-ionic ion-radio.sc-ion-select-popover-ionic::part(label){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-popover-ionic{--inner-border-width:0}.item-radio-checked.sc-ion-select-popover-ionic{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-popover-ionic{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
+const ionicSelectPopoverMdCss = ".sc-ion-select-popover-ionic-h ion-list.sc-ion-select-popover-ionic{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-ionic,ion-label.sc-ion-select-popover-ionic{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-ionic-h{overflow-y:auto}ion-list.sc-ion-select-popover-ionic ion-radio.sc-ion-select-popover-ionic::part(container),ion-list.sc-ion-select-popover-ionic ion-radio.sc-ion-select-popover-ionic [part~=\"container\"]{display:none}ion-list.sc-ion-select-popover-ionic ion-radio.sc-ion-select-popover-ionic::part(label),ion-list.sc-ion-select-popover-ionic ion-radio.sc-ion-select-popover-ionic [part~=\"label\"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-popover-ionic{--inner-border-width:0}.item-radio-checked.sc-ion-select-popover-ionic{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-popover-ionic{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
 
 const selectPopoverIosCss = ".sc-ion-select-popover-ios-h ion-list.sc-ion-select-popover-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-ios,ion-label.sc-ion-select-popover-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-ios-h{overflow-y:auto}";
 
-const selectPopoverMdCss = ".sc-ion-select-popover-md-h ion-list.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-md,ion-label.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-md-h{overflow-y:auto}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(container){display:none}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(label){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-popover-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-popover-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-popover-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
+const selectPopoverMdCss = ".sc-ion-select-popover-md-h ion-list.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-md,ion-label.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-md-h{overflow-y:auto}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(container),ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md [part~=\"container\"]{display:none}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(label),ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md [part~=\"label\"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-popover-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-popover-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-popover-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
 
 /**
  * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
@@ -35458,7 +35594,7 @@ class SelectPopover {
         md: selectPopoverMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 34,
+        "$flags$": 290,
         "$tagName$": "ion-select-popover",
         "$members$": {
             "header": [1],
@@ -35513,7 +35649,7 @@ class SkeletonText {
     get el() { return getElement(this); }
     static get style() { return skeletonTextCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-skeleton-text",
         "$members$": {
             "animated": [4]
@@ -35594,7 +35730,7 @@ class Spinner {
         md: mdSpinnerNativeCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-spinner",
         "$members$": {
             "color": [513],
@@ -35711,7 +35847,7 @@ class SplitPane {
         md: splitPaneMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-split-pane",
         "$members$": {
             "contentId": [513, "content-id"],
@@ -35779,7 +35915,7 @@ class Tab {
     }; }
     static get style() { return tabCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-tab",
         "$members$": {
             "active": [1028],
@@ -35894,7 +36030,7 @@ class TabBar {
         md: tabBarMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-tab-bar",
         "$members$": {
             "color": [513],
@@ -36019,7 +36155,7 @@ class TabButton {
         md: tabButtonMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-tab-button",
         "$members$": {
             "disabled": [4],
@@ -36212,7 +36348,7 @@ class Tabs {
     get el() { return getElement(this); }
     static get style() { return tabsCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-tabs",
         "$members$": {
             "useRouter": [1028, "use-router"],
@@ -36254,7 +36390,7 @@ class Text {
     }
     static get style() { return textCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-text",
         "$members$": {
             "color": [513]
@@ -36782,7 +36918,7 @@ class Textarea {
         md: textareaMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 38,
+        "$flags$": 294,
         "$tagName$": "ion-textarea",
         "$members$": {
             "color": [513],
@@ -36807,7 +36943,7 @@ class Textarea {
             "autoGrow": [516, "auto-grow"],
             "value": [1025],
             "counter": [4],
-            "counterFormatter": [16, "counter-formatter"],
+            "counterFormatter": [16],
             "errorText": [1, "error-text"],
             "helperText": [1, "helper-text"],
             "label": [1],
@@ -36844,7 +36980,7 @@ class Thumbnail {
     }
     static get style() { return thumbnailCss; }
     static get cmpMeta() { return {
-        "$flags$": 9,
+        "$flags$": 265,
         "$tagName$": "ion-thumbnail",
         "$members$": undefined,
         "$listeners$": undefined,
@@ -37738,15 +37874,15 @@ class Toast {
         md: toastMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-toast",
         "$members$": {
             "overlayIndex": [2, "overlay-index"],
             "delegate": [16],
             "hasController": [4, "has-controller"],
             "color": [513],
-            "enterAnimation": [16, "enter-animation"],
-            "leaveAnimation": [16, "leave-animation"],
+            "enterAnimation": [16],
+            "leaveAnimation": [16],
             "cssClass": [1, "css-class"],
             "duration": [2],
             "header": [1],
@@ -37761,7 +37897,7 @@ class Toast {
             "translucent": [4],
             "animated": [4],
             "icon": [1],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "swipeGesture": [1, "swipe-gesture"],
             "isOpen": [4, "is-open"],
             "trigger": [1],
@@ -38111,7 +38247,7 @@ class Toggle {
         md: toggleMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-toggle",
         "$members$": {
             "color": [513],
@@ -38364,7 +38500,7 @@ class Toolbar {
         md: toolbarMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-toolbar",
         "$members$": {
             "color": [513]
@@ -38424,7 +38560,7 @@ class ToolbarTitle {
         md: titleMdCss
     }; }
     static get cmpMeta() { return {
-        "$flags$": 41,
+        "$flags$": 297,
         "$tagName$": "ion-title",
         "$members$": {
             "color": [513],
@@ -39389,7 +39525,7 @@ var BUILD = {
   vdomRender: true,
   vdomStyle: true,
   vdomText: true,
-  watchCallback: true,
+  propChangeCallback: true,
   taskQueue: true,
   hotModuleReplacement: false,
   isDebug: false,
@@ -39437,7 +39573,7 @@ var NAMESPACE = (
 );
 
 /*
- Stencil Hydrate Runner v4.33.1 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Runner v4.38.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -40162,8 +40298,21 @@ function triggerEventListener(elm, ev) {
   } else if (elm.parentElement == null && elm.tagName === "HTML") {
     triggerEventListener(elm.ownerDocument, ev);
   } else {
-    triggerEventListener(elm.parentElement, ev);
+    const nextTarget = getNextEventTarget(elm, ev);
+    triggerEventListener(nextTarget, ev);
+  }
+}
+function getNextEventTarget(elm, ev) {
+  if (elm.parentElement) {
+    return elm.parentElement;
   }
+  if (elm.host && ev.composed) {
+    return elm.host;
+  }
+  if (ev.composed && elm.parentNode && elm.parentNode.host) {
+    return elm.parentNode.host;
+  }
+  return null;
 }
 function dispatchEvent(currentTarget, ev) {
   ev.target = currentTarget;
@@ -49805,6 +49954,11 @@ function* streamToHtml(node, opts, output) {
         const mode = ` shadowrootmode="open"`;
         yield mode;
         output.currentLineWidth += mode.length;
+        if (node.delegatesFocus) {
+          const delegatesFocusAttr = " shadowrootdelegatesfocus";
+          yield delegatesFocusAttr;
+          output.currentLineWidth += delegatesFocusAttr.length;
+        }
       }
       const attrsLength = node.attributes.length;
       const attributes = opts.prettyHtml && attrsLength > 1 ? cloneAttributes(node.attributes, true) : node.attributes;
@@ -50323,6 +50477,15 @@ var MockNode2 = class {
   set textContent(value) {
     this._nodeValue = String(value);
   }
+  addEventListener(type, handler) {
+    addEventListener(this, type, handler);
+  }
+  removeEventListener(type, handler) {
+    removeEventListener(this, type, handler);
+  }
+  dispatchEvent(ev) {
+    return dispatchEvent(this, ev);
+  }
 };
 MockNode2.ELEMENT_NODE = 1;
 MockNode2.TEXT_NODE = 3;
@@ -50361,15 +50524,25 @@ var MockElement = class extends MockNode2 {
     addEventListener(this, type, handler);
   }
   attachShadow(_opts) {
+    var _a2;
     const shadowRoot = this.ownerDocument.createDocumentFragment();
+    shadowRoot.delegatesFocus = (_a2 = _opts.delegatesFocus) != null ? _a2 : false;
     this.shadowRoot = shadowRoot;
     return shadowRoot;
   }
   blur() {
-    dispatchEvent(
-      this,
-      new MockFocusEvent("blur", { relatedTarget: null, bubbles: true, cancelable: true, composed: true })
-    );
+    if (isCurrentlyDispatching(this, "blur")) {
+      return;
+    }
+    markAsDispatching(this, "blur");
+    try {
+      dispatchEvent(
+        this,
+        new MockFocusEvent("blur", { relatedTarget: null, bubbles: true, cancelable: true, composed: true })
+      );
+    } finally {
+      unmarkAsDispatching(this, "blur");
+    }
   }
   get localName() {
     if (!this.nodeName) {
@@ -51111,6 +51284,28 @@ function setTextContent(elm, text) {
   const textNode = new MockTextNode(elm.ownerDocument, text);
   elm.appendChild(textNode);
 }
+var currentlyDispatching = /* @__PURE__ */ new WeakMap();
+function isCurrentlyDispatching(target, eventType) {
+  const dispatchingEvents = currentlyDispatching.get(target);
+  return dispatchingEvents != null && dispatchingEvents.has(eventType);
+}
+function markAsDispatching(target, eventType) {
+  let dispatchingEvents = currentlyDispatching.get(target);
+  if (dispatchingEvents == null) {
+    dispatchingEvents = /* @__PURE__ */ new Set();
+    currentlyDispatching.set(target, dispatchingEvents);
+  }
+  dispatchingEvents.add(eventType);
+}
+function unmarkAsDispatching(target, eventType) {
+  const dispatchingEvents = currentlyDispatching.get(target);
+  if (dispatchingEvents != null) {
+    dispatchingEvents.delete(eventType);
+    if (dispatchingEvents.size === 0) {
+      currentlyDispatching.delete(target);
+    }
+  }
+}
 
 // src/mock-doc/comment-node.ts
 var MockComment = class _MockComment extends MockNode2 {
@@ -54055,6 +54250,9 @@ var _colonHostContextRe = createSupportsRuleRe(":host-context");
 var setMode = (handler) => modeResolutionChain.push(handler);
 var CAPTURE_EVENT_SUFFIX = "Capture";
 var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
+var baseClass = BUILD.lazyLoad ? class {
+} : globalThis.HTMLElement || class {
+};
 
 // src/compiler/html/canonical-link.ts
 var updateCanonicalLink = (doc, href) => {