@ionic/core 8.7.6-nightly.20251006 → 8.7.6-nightly.20251008

package/hydrate/index.js

@@ -392,7 +392,7 @@ const initialize = (userConfig = {}) => {
 const globalScripts = initialize;
 
 /*
- Stencil Hydrate Platform v4.36.2 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Platform v4.38.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -990,7 +990,7 @@ var convertToPrivate = (node) => {
 
 // src/runtime/client-hydrate.ts
 var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
-  var _a, _b, _c;
+  var _a, _b;
   const endHydrate = createTime("hydrateClient", tagName);
   const shadowRoot = hostElm.shadowRoot;
   const childRenderNodes = [];
@@ -999,21 +999,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 _b2;
-    if (!(memberFlags & 31 /* Prop */)) {
-      return;
-    }
-    const attributeName = metaAttributeName || memberName;
-    const attrVal = hostElm.getAttribute(attributeName);
-    if (attrVal !== null) {
-      const attrPropVal = parsePropertyValue(
-        attrVal,
-        memberFlags);
-      (_b2 = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _b2.set(memberName, attrPropVal);
-    }
-  });
   let scopeId2;
   {
     const cmpMeta = hostRef.$cmpMeta$;
@@ -1052,7 +1037,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       if (childRenderNode.$tag$ === "slot") {
         node["s-cr"] = hostElm["s-cr"];
       }
-    } else if (((_b = childRenderNode.$tag$) == null ? void 0 : _b.toString().includes("-")) && childRenderNode.$tag$ !== "slot-fb" && !childRenderNode.$elm$.shadowRoot) {
+    } 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(
@@ -1123,7 +1108,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
           }
         }
         addSlotRelocateNode(slottedItem.node, slottedItem.slot, false, slottedItem.node["s-oo"]);
-        if (((_c = slottedItem.node.parentElement) == null ? void 0 : _c.shadowRoot) && slottedItem.node["getAttribute"] && slottedItem.node.getAttribute("slot")) {
+        if (((_b = slottedItem.node.parentElement) == null ? void 0 : _b.shadowRoot) && slottedItem.node["getAttribute"] && slottedItem.node.getAttribute("slot")) {
           slottedItem.node.removeAttribute("slot");
         }
       }
@@ -1839,12 +1824,6 @@ var parsePropertyValue = (propValue, propType, isFormAssociated) => {
     propValue = deserializeProperty(propValue);
     return propValue;
   }
-  if (typeof propValue === "string" && (propType & 16 /* Unknown */ || propType & 8 /* Any */) && (propValue.startsWith("{") && propValue.endsWith("}") || propValue.startsWith("[") && propValue.endsWith("]"))) {
-    try {
-      return JSON.parse(propValue);
-    } catch (e) {
-    }
-  }
   if (propValue != null && !isComplexType(propValue)) {
     if (propType & 4 /* Boolean */) {
       {
@@ -2440,9 +2419,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$)) {
@@ -2570,10 +2551,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);
@@ -2786,9 +2772,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]]) => {
@@ -2823,8 +2817,6 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
               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(
@@ -2870,6 +2862,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;
@@ -3209,6 +3203,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;
   }
@@ -3222,7 +3219,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);
@@ -3230,7 +3227,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;
@@ -3241,7 +3244,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() {
@@ -3255,21 +3258,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 == null ? void 0 : 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) {
@@ -3285,7 +3285,6 @@ function proxyHostElement(elm, cstr) {
         });
       }
     });
-    cstr.prototype.__stencilAugmented = true;
   }
 }
 function componentOnReady$1() {
@@ -3645,6 +3644,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;
@@ -3655,8 +3655,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"] = [];
@@ -7745,8 +7747,8 @@ class ActionSheet {
             "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"],
@@ -7754,7 +7756,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],
@@ -8478,8 +8480,8 @@ class Alert {
             "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"],
@@ -8489,7 +8491,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],
@@ -8679,7 +8681,7 @@ class BackButton {
             "icon": [1],
             "text": [1],
             "type": [1],
-            "routerAnimation": [16, "router-animation"]
+            "routerAnimation": [16]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -8890,7 +8892,7 @@ class Breadcrumb {
             "separator": [4],
             "target": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"]
+            "routerAnimation": [16]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -9315,7 +9317,7 @@ class Button {
             "expand": [513],
             "fill": [1537],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "download": [1],
             "href": [1],
             "rel": [1],
@@ -9456,7 +9458,7 @@ class Card {
             "href": [1],
             "rel": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "target": [1]
         },
         "$listeners$": undefined,
@@ -11364,17 +11366,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 = {
@@ -11384,12 +11387,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
@@ -11401,7 +11405,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
@@ -14056,9 +14061,9 @@ class Datetime {
             "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],
@@ -14073,9 +14078,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"],
@@ -14665,7 +14670,7 @@ class FabButton {
             "href": [1],
             "rel": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "target": [1],
             "show": [4],
             "translucent": [4],
@@ -17058,7 +17063,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],
@@ -18115,7 +18120,7 @@ class Item {
             "href": [1],
             "rel": [1],
             "lines": [1],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "routerDirection": [1, "router-direction"],
             "target": [1],
             "type": [1],
@@ -19295,8 +19300,8 @@ class Loading {
             "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],
@@ -19305,7 +19310,7 @@ class Loading {
             "spinner": [1025],
             "translucent": [4],
             "animated": [4],
-            "htmlAttributes": [16, "html-attributes"],
+            "htmlAttributes": [16],
             "isOpen": [4, "is-open"],
             "trigger": [1],
             "present": [64],
@@ -23212,8 +23217,8 @@ class Modal {
             "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"],
@@ -23221,13 +23226,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"],
@@ -24156,7 +24161,7 @@ class Nav {
             "swipeGesture": [1028, "swipe-gesture"],
             "animated": [4],
             "animation": [16],
-            "rootParams": [16, "root-params"],
+            "rootParams": [16],
             "root": [1],
             "push": [64],
             "insert": [64],
@@ -24221,9 +24226,9 @@ class NavLink {
         "$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$": "-",
@@ -25029,8 +25034,8 @@ class Picker {
             "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"],
@@ -25038,7 +25043,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],
@@ -27529,10 +27534,10 @@ class Popover {
             "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"],
@@ -27540,7 +27545,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],
@@ -28835,7 +28840,7 @@ class Range {
             "min": [2],
             "max": [2],
             "pin": [4],
-            "pinFormatter": [16, "pin-formatter"],
+            "pinFormatter": [16],
             "snaps": [4],
             "step": [2],
             "ticks": [4],
@@ -30501,9 +30506,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$": "-",
@@ -31399,7 +31404,7 @@ class RouterLink {
             "href": [1],
             "rel": [1],
             "routerDirection": [1, "router-direction"],
-            "routerAnimation": [16, "router-animation"],
+            "routerAnimation": [16],
             "target": [1]
         },
         "$listeners$": undefined,
@@ -31600,7 +31605,7 @@ class RouterOutlet {
             "delegate": [16],
             "animated": [4],
             "animation": [16],
-            "swipeHandler": [16, "swipe-handler"],
+            "swipeHandler": [16],
             "commit": [64],
             "setRouteId": [64],
             "getRouteId": [64]
@@ -34381,6 +34386,7 @@ class TabBar {
         this.ionTabBarChanged = createEvent(this, "ionTabBarChanged", 7);
         this.ionTabBarLoaded = createEvent(this, "ionTabBarLoaded", 7);
         this.keyboardCtrl = null;
+        this.didLoad = false;
         this.keyboardVisible = false;
         /**
          * If `true`, the tab bar will be translucent.
@@ -34390,14 +34396,29 @@ class TabBar {
         this.translucent = false;
     }
     selectedTabChanged() {
+        // Skip the initial watcher call that happens during component load
+        // We handle that in componentDidLoad to ensure children are ready
+        if (!this.didLoad) {
+            return;
+        }
         if (this.selectedTab !== undefined) {
             this.ionTabBarChanged.emit({
                 tab: this.selectedTab,
             });
         }
     }
-    componentWillLoad() {
-        this.selectedTabChanged();
+    componentDidLoad() {
+        this.ionTabBarLoaded.emit();
+        // Set the flag to indicate the component has loaded
+        // This allows the watcher to emit changes from this point forward
+        this.didLoad = true;
+        // Emit the initial selected tab after the component is fully loaded
+        // This ensures all child components (ion-tab-button) are ready
+        if (this.selectedTab !== undefined) {
+            this.ionTabBarChanged.emit({
+                tab: this.selectedTab,
+            });
+        }
     }
     async connectedCallback() {
         this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
@@ -34417,18 +34438,15 @@ class TabBar {
             this.keyboardCtrl.destroy();
         }
     }
-    componentDidLoad() {
-        this.ionTabBarLoaded.emit();
-    }
     render() {
         const { color, translucent, keyboardVisible } = this;
         const mode = getIonMode$1(this);
         const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
-        return (hAsync(Host, { key: '275dc6c1b30f6928ce9039b2f445208bb3500ddc', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '388ec37ce308035bab78d6c9a016bb616e9517a9', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses$1(color, {
                 [mode]: true,
                 'tab-bar-translucent': translucent,
                 'tab-bar-hidden': shouldHide,
-            }) }, hAsync("slot", { key: 'ceac20128d75c6a4a0f445f2df8deb8cc71fc4da' })));
+            }) }, hAsync("slot", { key: 'ce10ade2b86725e24f3254516483eeedd8ecb16a' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -34613,29 +34631,27 @@ class Tabs {
         }
         this.ionNavWillLoad.emit();
     }
-    componentWillRender() {
+    componentDidLoad() {
+        this.updateTabBar();
+    }
+    componentDidUpdate() {
+        this.updateTabBar();
+    }
+    updateTabBar() {
         const tabBar = this.el.querySelector('ion-tab-bar');
-        if (tabBar) {
-            let tab = this.selectedTab ? this.selectedTab.tab : undefined;
-            // Fallback: if no selectedTab is set but we're using router mode,
-            // determine the active tab from the current URL. This works around
-            // timing issues in React Router integration where setRouteId may not
-            // be called in time for the initial render.
-            // TODO(FW-6724): Remove this with React Router upgrade
-            if (!tab && this.useRouter && typeof window !== 'undefined') {
-                const currentPath = window.location.pathname;
-                const tabButtons = this.el.querySelectorAll('ion-tab-button');
-                // Look for a tab button that matches the current path pattern
-                for (const tabButton of tabButtons) {
-                    const tabId = tabButton.getAttribute('tab');
-                    if (tabId && currentPath.includes(tabId)) {
-                        tab = tabId;
-                        break;
-                    }
-                }
-            }
-            tabBar.selectedTab = tab;
+        if (!tabBar) {
+            return;
+        }
+        const tab = this.selectedTab ? this.selectedTab.tab : undefined;
+        // If tabs has no selected tab but tab-bar already has a selected-tab set,
+        // don't overwrite it. This handles cases where tab-bar is used without ion-tab elements.
+        if (tab === undefined) {
+            return;
+        }
+        if (tabBar.selectedTab === tab) {
+            return;
         }
+        tabBar.selectedTab = tab;
     }
     /**
      * Select a tab by the value of its `tab` property or an element reference. This method is only available for vanilla JavaScript projects. The Angular, React, and Vue implementations of tabs are coupled to each framework's router.
@@ -34694,6 +34710,7 @@ class Tabs {
         this.selectedTab = selectedTab;
         this.ionTabsWillChange.emit({ tab: selectedTab.tab });
         selectedTab.active = true;
+        this.updateTabBar();
         return Promise.resolve();
     }
     tabSwitch() {
@@ -34728,7 +34745,7 @@ class Tabs {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
     render() {
-        return (hAsync(Host, { key: '6dd1d17cc5a7aff4b910303006b4478080ca97af', onIonTabButtonClick: this.onTabClicked }, hAsync("slot", { key: 'db54a692d1a825498a116f090eb305f7cceceb5a', name: "top" }), hAsync("div", { key: 'e1b7d49ba7032e9071de2029695254e2a8303be9', class: "tabs-inner" }, hAsync("slot", { key: '4c3b58d5292c8c834e7532c51de0861068943d79' })), hAsync("slot", { key: 'dd59c0b9b217dfbfb0fccdbc6896b593278549cc', name: "bottom" })));
+        return (hAsync(Host, { key: '7b4b302f2942d8d131f6fc24e817989a8be08867', onIonTabButtonClick: this.onTabClicked }, hAsync("slot", { key: '2c51cf14c0f17a8ddf2d879858c984cdf8fd3147', name: "top" }), hAsync("div", { key: '7e9d6055092d41bd9bc80ae15965f77e216feb84', class: "tabs-inner" }, hAsync("slot", { key: 'c308a787e37ff7f6653531d70deca597a7602d26' })), hAsync("slot", { key: 'd5f5e693710c853570811602f859cf3e88272684', name: "bottom" })));
     }
     get el() { return getElement(this); }
     static get style() { return tabsCss; }
@@ -35286,7 +35303,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],
@@ -36191,8 +36208,8 @@ class Toast {
             "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],
@@ -36205,7 +36222,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],
@@ -37621,7 +37638,7 @@ var BUILD = {
   vdomRender: true,
   vdomStyle: true,
   vdomText: true,
-  watchCallback: true,
+  propChangeCallback: true,
   taskQueue: true,
   hotModuleReplacement: false,
   isDebug: false,
@@ -37669,7 +37686,7 @@ var NAMESPACE = (
 );
 
 /*
- Stencil Hydrate Runner v4.36.2 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Runner v4.38.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -52346,6 +52363,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) => {