@ionic/core 8.3.3-dev.11728951331.1a42ad86 → 8.3.3-dev.11729007456.16ced157

package/hydrate/index.js

@@ -6551,10 +6551,10 @@ class ActionSheet {
         const headerID = `action-sheet-${overlayIndex}-header`;
         return (hAsync(Host, Object.assign({ key: '7bbd202ca9e19727e7514abbe073687d982f80c3', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), hAsync("ion-backdrop", { key: '23344a9221a2e6720d7b9de5249dc37256cafa7b', tappable: this.backdropDismiss }), hAsync("div", { key: 'd46361bb5cdc32a7922dcf76b566f358a6174bfa', tabindex: "0" }), hAsync("div", { key: '136c3f2e77c8a2eac8e9ae4bb13d735e1d62598d', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: '6168ea8b2be42020b2edeb8ff3a0f3d1254be37a', class: "action-sheet-container" }, hAsync("div", { key: '29b9e6619dc54574733a704d6bf885839151bd84', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (hAsync("div", { key: '536ce764bfddb3816ea3512d90f4acef2ccb8589', id: headerID, class: {
+            }, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), hAsync("ion-backdrop", { key: '23344a9221a2e6720d7b9de5249dc37256cafa7b', tappable: this.backdropDismiss }), hAsync("div", { key: 'd46361bb5cdc32a7922dcf76b566f358a6174bfa', tabindex: "0" }), hAsync("div", { key: '136c3f2e77c8a2eac8e9ae4bb13d735e1d62598d', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: 'a1042362d7f96fcc2e5a9917dd3913ccb4cfb5e7', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (hAsync("div", { key: 'b28fa57fac9bcb304d87e409e84c028c5b8e4f8d', id: headerID, class: {
                 'action-sheet-title': true,
                 'action-sheet-has-sub-title': this.subHeader !== undefined,
-            } }, header, this.subHeader && hAsync("div", { key: '6d888219145824fd36cdfe0d3c8388bbf2769777', class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (hAsync("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass$3(b), onClick: () => this.buttonClick(b), disabled: b.disabled, tabIndex: b.disabled ? -1 : 0 }), hAsync("span", { class: "action-sheet-button-inner" }, b.icon && hAsync("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && hAsync("ion-ripple-effect", null))))), cancelButton && (hAsync("div", { key: '2c01bb727d9339371cf82393be2f7c52eb70c321', class: "action-sheet-group action-sheet-group-cancel" }, hAsync("button", Object.assign({ key: '3df9aaaa63848407d3d012467ee8dab75e6aa274' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass$3(cancelButton), onClick: () => this.buttonClick(cancelButton) }), hAsync("span", { key: '1bd3a70026596d857df242fe89ec83cb492f2611', class: "action-sheet-button-inner" }, cancelButton.icon && (hAsync("ion-icon", { key: 'a654c83116c1174d4bb64b69ff20279a9255c479', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && hAsync("ion-ripple-effect", { key: '9a4e60d7667157835f067127a85c9d7b97445803' })))))), hAsync("div", { key: '5a1fc3ef1572dc871c834175f561af151a57f7e7', tabindex: "0" })));
+            } }, header, this.subHeader && hAsync("div", { key: '5d6a1d0da6d452124edaa5e6942837397b5e4144', class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (hAsync("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass$3(b), onClick: () => this.buttonClick(b), disabled: b.disabled }), hAsync("span", { class: "action-sheet-button-inner" }, b.icon && hAsync("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && hAsync("ion-ripple-effect", null))))), cancelButton && (hAsync("div", { key: '88b321544967dc609a4251551644742277571426', class: "action-sheet-group action-sheet-group-cancel" }, hAsync("button", Object.assign({ key: '653a18195272fff6e7cacbeacddbc27ba17dcdcc' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass$3(cancelButton), onClick: () => this.buttonClick(cancelButton) }), hAsync("span", { key: '179d1a0df7902e8b1c61ba8a2535a964095925b6', class: "action-sheet-button-inner" }, cancelButton.icon && (hAsync("ion-icon", { key: '54bc72244484fa41b81cf75734731b437883834b', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && hAsync("ion-ripple-effect", { key: 'ebf43217bbc385bfdc7eefb05638df9fc93c311d' }))))), hAsync("div", { key: 'c14d5e83f62e1406e2ff2023596bcac1db348af6', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -7240,9 +7240,9 @@ class Alert {
          * If neither is defined, don't set aria-labelledby.
          */
         const ariaLabelledBy = header ? hdrId : subHeader ? subHdrId : null;
-        return (hAsync(Host, Object.assign({ key: 'c7d53f48b359f2bc3480a2e1ba34948fc9378fb0', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (hAsync(Host, Object.assign({ key: '867c91dbba3f6e0ec00702689ff89b393886304e', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), hAsync("ion-backdrop", { key: '18c7e6b5d63435d9a6a82bda951158e7e1af6e92', tappable: this.backdropDismiss }), hAsync("div", { key: 'e35e1a4b81286976c8a6bab570c986f3196b21f4', tabindex: "0" }), hAsync("div", { key: '9089864c80d96ed834bf723f3de863cf1c4a5b97', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: 'dd600f02c84352059c6cdf98821b9c9a831bcdcb', class: "alert-head" }, header && (hAsync("h2", { key: '11afb605e1ccefc889fbdd2533d491bea8fbf183', id: hdrId, class: "alert-title" }, header)), subHeader && (hAsync("h2", { key: 'e53b0613d09d26e5a2cd7c9c6e63ec2535625ce5', id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), hAsync("div", { key: 'cef60ec8b34c9aec8bc698f16f55324d1ce67c72', tabindex: "0" })));
+            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), hAsync("ion-backdrop", { key: '80f013f82366c791de7e6cbfdc2e6a626e3e0856', tappable: this.backdropDismiss }), hAsync("div", { key: '9b047740bfe248e3070fd75ff251585152fef5b4', tabindex: "0" }), hAsync("div", { key: '4c01326962b7cb8d2e8b6a95df441f8d97819262', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: 'd8938474cd117318c50ff4d6f632175c97d7601c', class: "alert-head" }, header && (hAsync("h2", { key: '36105d7b4380b474fc1a2a7e2226fe8f51907fb6', id: hdrId, class: "alert-title" }, header)), subHeader && (hAsync("h2", { key: '20f4cd8ece278d98f1f1840b8436f66e352533ff', id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), hAsync("div", { key: '91ee9e638045fc10f7e41fd40a48e56149b58937', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -7320,7 +7320,7 @@ class App {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'e95cdeb2709edbc74f4e6ebf77cb110154605b72', class: {
+        return (hAsync(Host, { key: '00c2095a8306a9f4cda622ecab034ce1719bcb50', class: {
                 [mode]: true,
                 'ion-page': true,
                 'force-statusbar-padding': config.getBoolean('_forceStatusbarPadding'),
@@ -7351,7 +7351,7 @@ class Avatar {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: 'dc1e3cd535e419eebe5599574fd2393ebfde8bbc', class: getIonMode$1(this) }, hAsync("slot", { key: 'edb8441c063ea592b41345ea97d88ecd90cb3052' })));
+        return (hAsync(Host, { key: 'c914962b1c2af1f7643937821ac3736ebe07fa92', class: getIonMode$1(this) }, hAsync("slot", { key: '4b87a204138a4de14ecd1d4332d99beb114eb29f' })));
     }
     static get style() { return {
         ios: IonAvatarIosStyle0,
@@ -7439,7 +7439,7 @@ class BackButton {
         const showBackButton = defaultHref !== undefined;
         const mode = getIonMode$1(this);
         const ariaLabel = inheritedAttributes['aria-label'] || backButtonText || 'back';
-        return (hAsync(Host, { key: '8351c93a1812c94c979fb115f07a9ad7b3152188', onClick: this.onClick, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'ad3f81e3004b50a381c11f776aca6bf79bf3bc05', onClick: this.onClick, class: createColorClasses$1(color, {
                 [mode]: true,
                 button: true, // ion-buttons target .button
                 'back-button-disabled': disabled,
@@ -7449,7 +7449,7 @@ class BackButton {
                 'ion-activatable': true,
                 'ion-focusable': true,
                 'show-back-button': showBackButton,
-            }) }, hAsync("button", { key: '991b8baa784dbfbdf8d3581cbbf6a858ac1f1e6e', type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, hAsync("span", { key: '929fcd83a4fdb00cf97ca803f234719171602a5e', class: "button-inner" }, backButtonIcon && (hAsync("ion-icon", { key: '0c10d412ae8342d96f221e626b421c9abadac748', part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false, "flip-rtl": icon === undefined })), backButtonText && (hAsync("span", { key: '96f505880a80f36ee8b8c78268b450f3629ee613', part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText))), mode === 'md' && hAsync("ion-ripple-effect", { key: '0aecf5d415c608069eb1a10043530bd0929b6383', type: this.rippleType }))));
+            }) }, hAsync("button", { key: 'a6b5657680df9140622a0f19c955bc1af3e89241', type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, hAsync("span", { key: '9b4dd3a7270816161c3cffac4bd1b0983491fd39', class: "button-inner" }, backButtonIcon && (hAsync("ion-icon", { key: '5b41f3e8d3d458c443d5dfd60b0ef6b7afb2e09f', part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false, "flip-rtl": icon === undefined })), backButtonText && (hAsync("span", { key: '54356420086994095593377e48c517a0e910932a', part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText))), mode === 'md' && hAsync("ion-ripple-effect", { key: 'f45085d43d7eefa904c0509c3968aeded90e1ae1', type: this.rippleType }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -7502,7 +7502,7 @@ class Backdrop {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'c803b4302c8e722064feb03dafe3cb6e190b4f2b', tabindex: "-1", "aria-hidden": "true", class: {
+        return (hAsync(Host, { key: '40f001f1d8b75c7d3e5a1ecdd540498dd185e7bc', tabindex: "-1", "aria-hidden": "true", class: {
                 [mode]: true,
                 'backdrop-hide': !this.visible,
                 'backdrop-no-tappable': !this.tappable,
@@ -7542,9 +7542,9 @@ class Badge {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '1253618692342bcf9487188402dc3d49ae0de480', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '0067922ba0b10a35ea1ffb4fcfcbccf429c158d7', class: createColorClasses$1(this.color, {
                 [mode]: true,
-            }) }, hAsync("slot", { key: '71d65e203965ea37b94504a8a0a96beb52d4e356' })));
+            }) }, hAsync("slot", { key: '6bb7ff181ba1c514da1075f2c9648b91f89da80e' })));
     }
     static get style() { return {
         ios: IonBadgeIosStyle0,
@@ -7630,7 +7630,7 @@ class Breadcrumb {
         // to show the separator as long as it isn't also the last breadcrumb
         // otherwise if not collapsed use the value in separator
         const showSeparator = last ? false : collapsed ? (showCollapsedIndicator && !last ? true : false) : separator;
-        return (hAsync(Host, { key: 'dfe55ad57f23e5da5f2e2c51fea99964812472e3', onClick: (ev) => openURL(href, ev, routerDirection, routerAnimation), "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '0a36a7db85820db8db97ec9f76d552c0ceb4589c', onClick: (ev) => openURL(href, ev, routerDirection, routerAnimation), "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
                 [mode]: true,
                 'breadcrumb-active': active,
                 'breadcrumb-collapsed': collapsed,
@@ -7640,15 +7640,15 @@ class Breadcrumb {
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'ion-activatable': clickable,
                 'ion-focusable': clickable,
-            }) }, hAsync(TagType, Object.assign({ key: 'e361b1f0e7de6dd5c5dd4f6deae72c2c8210466d' }, attrs, { class: "breadcrumb-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), hAsync("slot", { key: '9daeb45a8a28c89f3ad5751f71b8412197846371', name: "start" }), hAsync("slot", { key: '4849e63cdffd6c712292745138b68730442c8b0d' }), hAsync("slot", { key: '6edf9bac5aec06ccec2844efac2d9afa1d24cf57', name: "end" })), showCollapsedIndicator && (hAsync("button", { key: 'de7f5faea75b44011b289d259265e2435a65874f', part: "collapsed-indicator", "aria-label": "Show more breadcrumbs", onClick: () => this.collapsedIndicatorClick(), ref: (collapsedEl) => (this.collapsedRef = collapsedEl), class: {
+            }) }, hAsync(TagType, Object.assign({ key: '9947910968b2dc033b9d78aeadb11a5fdf6bf56f' }, attrs, { class: "breadcrumb-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), hAsync("slot", { key: '02d9ec747a0e946d0504546f5cf710325b40c8fa', name: "start" }), hAsync("slot", { key: '3bc1aa6fd3ba90c4886b4405874a04a8d4d2fdef' }), hAsync("slot", { key: '1fea8331db0234fab02bc8f5120d328d4b52ea9e', name: "end" })), showCollapsedIndicator && (hAsync("button", { key: 'd670ca39d9259a30d4d5784459d266c1a4af72f3', part: "collapsed-indicator", "aria-label": "Show more breadcrumbs", onClick: () => this.collapsedIndicatorClick(), ref: (collapsedEl) => (this.collapsedRef = collapsedEl), class: {
                 'breadcrumbs-collapsed-indicator': true,
-            } }, hAsync("ion-icon", { key: '957d8851af9c99dda263f34eff0b35a0fc212c32', "aria-hidden": "true", icon: ellipsisHorizontal, lazy: false }))), showSeparator && (
+            } }, hAsync("ion-icon", { key: '76e808080200488097b5cb07f6e2ef959ee7940b', "aria-hidden": "true", icon: ellipsisHorizontal, lazy: false }))), showSeparator && (
         /**
          * Separators should not be announced by narrators.
          * We add aria-hidden on the span so that this applies
          * to any custom separators too.
          */
-        hAsync("span", { key: '97d646c37c4c41ad6b12c3a543d1146fde06fc9a', class: "breadcrumb-separator", part: "separator", "aria-hidden": "true" }, hAsync("slot", { key: '0429f671a986f2d7be1b1b69fc879e80806d2916', name: "separator" }, mode === 'ios' ? (hAsync("ion-icon", { icon: chevronForwardOutline, lazy: false, "flip-rtl": true })) : (hAsync("span", null, "/")))))));
+        hAsync("span", { key: 'c1a5cf3406fd353e1195891fed7cefd61edec886', class: "breadcrumb-separator", part: "separator", "aria-hidden": "true" }, hAsync("slot", { key: '36f81c994c2b529834fa3309a11713e65264504f', name: "separator" }, mode === 'ios' ? (hAsync("ion-icon", { icon: chevronForwardOutline, lazy: false, "flip-rtl": true })) : (hAsync("span", null, "/")))))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -7788,12 +7788,12 @@ class Breadcrumbs {
     render() {
         const { color, collapsed } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '18ffba1642f10cc2bc31440e84f23aa6f042e501', class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'b849dc5081fa647304536a4df7470021b6c38642', class: createColorClasses$1(color, {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'breadcrumbs-collapsed': collapsed,
-            }) }, hAsync("slot", { key: '3db6d31590e3047889ce554d57d155c8ea2e1455', onSlotchange: this.slotChanged })));
+            }) }, hAsync("slot", { key: '929f2b08dc5f48883c65e5225722dfc26670be94', onSlotchange: this.slotChanged })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -8036,7 +8036,7 @@ class Button {
         {
             type !== 'button' && this.renderHiddenButton();
         }
-        return (hAsync(Host, { key: '8f3a0363d46ef888d22b0b0812c70cb4f79e6efa', onClick: this.handleClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'a3a2f5a1a99873627717f4d658ee98c92762101b', onClick: this.handleClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
                 [mode]: true,
                 [buttonType]: true,
                 [`${buttonType}-${expand}`]: expand !== undefined,
@@ -8051,7 +8051,7 @@ class Button {
                 'button-disabled': disabled,
                 'ion-activatable': true,
                 'ion-focusable': true,
-            }) }, hAsync(TagType, Object.assign({ key: 'a517c7d06aab15ad4c2a51b8ec224c1aeb4ed565' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), hAsync("span", { key: '127c26dd97c0bf5097433df77df7313d59784899', class: "button-inner" }, hAsync("slot", { key: '39d9a9cad8e1addbe63406062e555e05c2cb541b', name: "icon-only", onSlotchange: this.slotChanged }), hAsync("slot", { key: 'cfdebdd89155c6c21eb80e51e06456a3a6d877e0', name: "start" }), hAsync("slot", { key: 'eac497e0f97ab55baa834ae23155d89b0f7069c6' }), hAsync("slot", { key: 'c99f7900f8856b32a0b4ac11092d461f5e9a1109', name: "end" })), mode === 'md' && hAsync("ion-ripple-effect", { key: 'c681edb0480879fbd801575f2233f6e118898638', type: this.rippleType }))));
+            }) }, hAsync(TagType, Object.assign({ key: 'c67786c7552246327e63167218bf5be308604d9a' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), hAsync("span", { key: 'f363e2e9652220d30ef453fd36b484e6576f238c', class: "button-inner" }, hAsync("slot", { key: 'e4ae867002f41fdcb82aada67f789a3aa01a0815', name: "icon-only", onSlotchange: this.slotChanged }), hAsync("slot", { key: '51cd74828e30da6bec4e9a540b1cb59a28c5065c', name: "start" }), hAsync("slot", { key: '51544e8f197e0c40a8818d54d6bd09b48f3ab1ec' }), hAsync("slot", { key: '2923b78dff1008cad7d554f64b2542c21e43604d', name: "end" })), mode === 'md' && hAsync("ion-ripple-effect", { key: '8e3692a40d87cadbaadb73e284f6c5a3a6d46759', type: this.rippleType }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -8102,10 +8102,10 @@ class Buttons {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '4e5ce9abb3f56e8c91e3eb58c2819300e61eba24', class: {
+        return (hAsync(Host, { key: 'b80d227f62086dffcf39b72475baf0e3e227fe6c', class: {
                 [mode]: true,
                 ['buttons-collapse']: this.collapse,
-            } }, hAsync("slot", { key: 'f2f360ec888b6e946b512fed07431fab47c61482' })));
+            } }, hAsync("slot", { key: '31eda2f4a6686c86b2614401c7c81a26b4a77d76' })));
     }
     static get style() { return {
         ios: IonButtonsIosStyle0,
@@ -8174,7 +8174,7 @@ class Card {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '8584300522f382ee8891c039d71da82533dfa36a', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: 'ff63d4d470596814962801fdacacaf48853bdb63', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'card-disabled': this.disabled,
                 'ion-activatable': this.isClickable(),
@@ -8221,7 +8221,7 @@ class CardContent {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '2a2d0b48aad4b83990a1748fce60e772514eb223', class: {
+        return (hAsync(Host, { key: 'daea941a5d1ccccf9871758e01a333a5aa8e0eaa', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`card-content-${mode}`]: true,
@@ -8258,11 +8258,11 @@ class CardHeader {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '18d12507ec6e650a72d721e9d0f4128b5e86df1d', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: 'bd296abe7ac617738e85d472da12f3c564091fc4', class: createColorClasses$1(this.color, {
                 'card-header-translucent': this.translucent,
                 'ion-inherit-color': true,
                 [mode]: true,
-            }) }, hAsync("slot", { key: '3374c087d8c3f014082787e255432e7a335ef44f' })));
+            }) }, hAsync("slot", { key: '2f77e7b03a3f37684df9f0343423a59fbc23618a' })));
     }
     static get style() { return {
         ios: IonCardHeaderIosStyle0,
@@ -8297,10 +8297,10 @@ class CardSubtitle {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'cbcb01bd01cf6de64a0b04fb626e42b07ceb8f53', role: "heading", "aria-level": "3", class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '15a457ddb06e037b98b5ce6b7fe83aac4ceffd6f', role: "heading", "aria-level": "3", class: createColorClasses$1(this.color, {
                 'ion-inherit-color': true,
                 [mode]: true,
-            }) }, hAsync("slot", { key: 'cbcaa73aa5799882c48d6c0aabfb13651bcc91c0' })));
+            }) }, hAsync("slot", { key: '0ba40bfc0d4f9e1fa8528802541285442ddfff3f' })));
     }
     static get style() { return {
         ios: IonCardSubtitleIosStyle0,
@@ -8334,10 +8334,10 @@ class CardTitle {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'f904a0ca6489f147d03c9c5f9f2c5549cdb38d1a', role: "heading", "aria-level": "2", class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '9f3dcb491f84219bde6e46b3dbd5ff0ed693ba34', role: "heading", "aria-level": "2", class: createColorClasses$1(this.color, {
                 'ion-inherit-color': true,
                 [mode]: true,
-            }) }, hAsync("slot", { key: 'effb921de4ad8dfbbe318b3f692f4005812da7b1' })));
+            }) }, hAsync("slot", { key: '5e38bf980ea974449dec82848aba47a3b6f9e3a8' })));
     }
     static get style() { return {
         ios: IonCardTitleIosStyle0,
@@ -8432,7 +8432,7 @@ class Checkbox {
         const mode = getIonMode$1(this);
         const path = getSVGPath(mode, indeterminate);
         renderHiddenInput(true, el, name, checked ? value : '', disabled);
-        return (hAsync(Host, { key: 'd7a07fbf130413eaa4622c07786e8a00723113eb', "aria-checked": indeterminate ? 'mixed' : `${checked}`, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '7bdf60e3935baad479fb3ded0885e4883e72027e', "aria-checked": indeterminate ? 'mixed' : `${checked}`, class: createColorClasses$1(color, {
                 [mode]: true,
                 'in-item': hostContext('ion-item', el),
                 'checkbox-checked': checked,
@@ -8442,10 +8442,10 @@ class Checkbox {
                 [`checkbox-justify-${justify}`]: justify !== undefined,
                 [`checkbox-alignment-${alignment}`]: alignment !== undefined,
                 [`checkbox-label-placement-${labelPlacement}`]: true,
-            }), onClick: this.onClick }, hAsync("label", { key: '99797589ed4ea7cbac53531c85b2d4a2dcd568c4', class: "checkbox-wrapper" }, hAsync("input", Object.assign({ key: 'cc12fe7920ab23c6f21546f7b312b8f1f5671349', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, inheritedAttributes)), hAsync("div", { key: '1b087f061da5abca6129d372503d8882b77e24be', class: {
+            }), onClick: this.onClick }, hAsync("label", { key: '335fcc4c0c96a0de8a9183624ecefc0f4153fa5d', class: "checkbox-wrapper" }, hAsync("input", Object.assign({ key: 'cb6a52011f62d377940412f3b36c17820c80673c', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, inheritedAttributes)), hAsync("div", { key: 'c9ef06015aea5150882079fbadf44d0a775e4b0c', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': el.textContent === '',
-            }, part: "label" }, hAsync("slot", { key: 'bc84274c826fa1db1207230aa03bf5790afe2992' })), hAsync("div", { key: '89e9396dc9215804bd8ac42e943a292d050ef8c5', class: "native-wrapper" }, hAsync("svg", { key: '2aafac248c639074faaf17044d8d9204474a9b7b', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container" }, path)))));
+            }, part: "label" }, hAsync("slot", { key: '203e65c5bf2b99cc9227c797b847c553e335f48f' })), hAsync("div", { key: '2f48a7d88398a96a2f3e9d8f60a0b5f503aa6903', class: "native-wrapper" }, hAsync("svg", { key: '28c526530d636fc8610d2162699352e11117ab99', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container" }, path)))));
     }
     getSVGPath(mode, indeterminate) {
         let path = indeterminate ? (hAsync("path", { d: "M6 12L18 12", part: "mark" })) : (hAsync("path", { d: "M5.9,12.5l3.8,3.8l8.8-8.8", part: "mark" }));
@@ -8498,12 +8498,12 @@ class Chip {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '7dd923c1b28d1eb1efa348f66f49cec067645af9', "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: 'b8ca0c8157387675932de054f52f8dc0e9b9dc8f', "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'chip-outline': this.outline,
                 'chip-disabled': this.disabled,
                 'ion-activatable': true,
-            }) }, hAsync("slot", { key: '7ede838bf109dc27a898ee2dcdeabc3f439c8e6f' }), mode === 'md' && hAsync("ion-ripple-effect", { key: '5acb073029544e73fcc0db4cc4e661ec1df4d231' })));
+            }) }, hAsync("slot", { key: 'c8413350e5ce2728f2cbcec50a52466eed7bf109' }), mode === 'md' && hAsync("ion-ripple-effect", { key: 'dad2a0547acb640e4d30f172eea3610d0bdb5ef0' })));
     }
     static get style() { return {
         ios: IonChipIosStyle0,
@@ -8654,9 +8654,9 @@ class Col {
     render() {
         const isRTL = document.dir === 'rtl';
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'c37fa4c4c993385ccbb6f4e89b2f390b140507a0', class: {
+        return (hAsync(Host, { key: '0c220e26a83fff607cfd6f27d49a1bde89b85ce2', class: {
                 [mode]: true,
-            }, style: Object.assign(Object.assign(Object.assign(Object.assign({}, this.calculateOffset(isRTL)), this.calculatePull(isRTL)), this.calculatePush(isRTL)), this.calculateSize()) }, hAsync("slot", { key: '6a5296ff0b9dee6600c2dafe7363a065d053bac2' })));
+            }, style: Object.assign(Object.assign(Object.assign(Object.assign({}, this.calculateOffset(isRTL)), this.calculatePull(isRTL)), this.calculatePush(isRTL)), this.calculateSize()) }, hAsync("slot", { key: '154709d1b2797b17f2987d5344851c74fc8a1778' })));
     }
     static get style() { return IonColStyle0; }
     static get cmpMeta() { return {
@@ -9030,7 +9030,7 @@ class Content {
         const forceOverscroll = this.shouldForceOverscroll();
         const transitionShadow = mode === 'ios';
         this.resize();
-        return (hAsync(Host, Object.assign({ key: '92a7cbc2e9c812930f4231bd846411933a5dded6', role: isMainContent ? 'main' : undefined, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, Object.assign({ key: '265de111a33510d3eba45da107e59e628228da9c', role: isMainContent ? 'main' : undefined, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'content-sizing': hostContext('ion-popover', this.el),
                 overscroll: forceOverscroll,
@@ -9038,12 +9038,12 @@ class Content {
             }), style: {
                 '--offset-top': `${this.cTop}px`,
                 '--offset-bottom': `${this.cBottom}px`,
-            } }, inheritedAttributes), hAsync("div", { key: '52498d8874b9944b8245e448ea9dfc75b3929c2d', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), fixedSlotPlacement === 'before' ? hAsync("slot", { name: "fixed" }) : null, hAsync("div", { key: '00e157a53485b285300404178436276afceb63f5', class: {
+            } }, inheritedAttributes), hAsync("div", { key: '24e879228c51dfedd7f9e7699b50d683d01c0254', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), fixedSlotPlacement === 'before' ? hAsync("slot", { name: "fixed" }) : null, hAsync("div", { key: '4e0f28fdf9befb71e7af0130f6cda0c82cd7aaa8', class: {
                 'inner-scroll': true,
                 'scroll-x': scrollX,
                 'scroll-y': scrollY,
                 overscroll: (scrollX || scrollY) && forceOverscroll,
-            }, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, hAsync("slot", { key: '8522320514a2e8a63f7dc9ade6c1fb3fb00f454e' })), transitionShadow ? (hAsync("div", { class: "transition-effect" }, hAsync("div", { class: "transition-cover" }), hAsync("div", { class: "transition-shadow" }))) : null, fixedSlotPlacement === 'after' ? hAsync("slot", { name: "fixed" }) : null));
+            }, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, hAsync("slot", { key: 'b70e63b2517abe078405679a13582021ba953b9c' })), transitionShadow ? (hAsync("div", { class: "transition-effect" }, hAsync("div", { class: "transition-cover" }), hAsync("div", { class: "transition-shadow" }))) : null, fixedSlotPlacement === 'after' ? hAsync("slot", { name: "fixed" }) : null));
     }
     get el() { return getElement(this); }
     static get style() { return IonContentStyle0; }
@@ -12564,7 +12564,7 @@ class Datetime {
         const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
         const hasWheelVariant = hasDatePresentation && preferWheel;
         renderHiddenInput(true, el, name, formatValue(value), disabled);
-        return (hAsync(Host, { key: '2933ce5caaeb21a633b1ec4d936e86b0f0890807', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
+        return (hAsync(Host, { key: '75bd7dc09a11f9f923c0b79d1181493d289db6aa', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
                 [mode]: true,
                 ['datetime-readonly']: readonly,
                 ['datetime-disabled']: disabled,
@@ -12574,7 +12574,7 @@ class Datetime {
                 [`datetime-size-${size}`]: true,
                 [`datetime-prefer-wheel`]: hasWheelVariant,
                 [`datetime-grid`]: isGridStyle,
-            })) }, hAsync("div", { key: '0efc9ef0aa1a29234412b2eddf5d7ff899b7543f', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
+            })) }, hAsync("div", { key: '06852fb82c36122f97debdf3ab6a1491702a708e', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -12982,11 +12982,11 @@ class DatetimeButton {
     render() {
         const { color, dateText, timeText, selectedButton, datetimeActive, disabled } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '0be955404133adbb31ae16a6599014bb29765f19', class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '63af15d478eed66aa96d73dcfd29d3c67b54e8b8', class: createColorClasses$1(color, {
                 [mode]: true,
                 [`${selectedButton}-active`]: datetimeActive,
                 ['datetime-button-disabled']: disabled,
-            }) }, dateText && (hAsync("button", { key: '812dcb50b17768cc13a5cfa0bcce8b113cee0f09', class: "ion-activatable", id: "date-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleDateClick, disabled: disabled, part: "native", ref: (el) => (this.dateTargetEl = el) }, hAsync("slot", { key: '46930c740a32a78502df9e651f9bd5914d6a9fea', name: "date-target" }, dateText), mode === 'md' && hAsync("ion-ripple-effect", { key: '0602999cc8435dc37aa22da7f5531bc8cb71e1b4' }))), timeText && (hAsync("button", { key: 'ecdd21da5181ecbdce03209f9f6673b7dcbc1f78', class: "ion-activatable", id: "time-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleTimeClick, disabled: disabled, part: "native", ref: (el) => (this.timeTargetEl = el) }, hAsync("slot", { key: 'b5b093b5166d12d11e27360788edaac916d44390', name: "time-target" }, timeText), mode === 'md' && hAsync("ion-ripple-effect", { key: '70bb3a04f4748d13233eeb257503968dbd1161a9' })))));
+            }) }, dateText && (hAsync("button", { key: 'ca8a648ee86c66265fac26cf35ae7d616ea8acad', class: "ion-activatable", id: "date-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleDateClick, disabled: disabled, part: "native", ref: (el) => (this.dateTargetEl = el) }, hAsync("slot", { key: '2f81807d336e191c34d2e658475c44c5e2250592', name: "date-target" }, dateText), mode === 'md' && hAsync("ion-ripple-effect", { key: '51b6a57eb2725bfc65db7f3543d6988933142e42' }))), timeText && (hAsync("button", { key: '80a34e1b982d1221e804ecc92b0f5b3e5f37504c', class: "ion-activatable", id: "time-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleTimeClick, disabled: disabled, part: "native", ref: (el) => (this.timeTargetEl = el) }, hAsync("slot", { key: 'e2e384794608bee73317de74910f6202b70dadba', name: "time-target" }, timeText), mode === 'md' && hAsync("ion-ripple-effect", { key: 'dcb457a3da3716d33dcdde0e7042553b8e8b7ab9' })))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -13060,12 +13060,12 @@ class Fab {
     render() {
         const { horizontal, vertical, edge } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'cb44cf6486b0a6439b99da87c065b0b52e2514f4', class: {
+        return (hAsync(Host, { key: '9ee3b56a22ffc3b8d5cda8bc3860853d25441278', class: {
                 [mode]: true,
                 [`fab-horizontal-${horizontal}`]: horizontal !== undefined,
                 [`fab-vertical-${vertical}`]: vertical !== undefined,
                 'fab-edge': edge,
-            } }, hAsync("slot", { key: '1ed484c7ecb10cd81fbca9a4f5c4049bf82f9f8a' })));
+            } }, hAsync("slot", { key: '59b0d12cd35a37896bb293266b4f84623de86920' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -13155,7 +13155,7 @@ class FabButton {
                 rel: this.rel,
                 target: this.target,
             };
-        return (hAsync(Host, { key: 'eb347f7d6749c40637540d84778eb8d1b667a947', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'f207180bf6c25e2261469f6e85dde4c15d78cf34', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses$1(color, {
                 [mode]: true,
                 'fab-button-in-list': inList,
                 'fab-button-translucent-in-list': inList && translucent,
@@ -13166,7 +13166,7 @@ class FabButton {
                 'ion-activatable': true,
                 'ion-focusable': true,
                 [`fab-button-${size}`]: size !== undefined,
-            }) }, hAsync(TagType, Object.assign({ key: '83e853c8815f41543c848eb2e05ec2bb1716110a' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => openURL(href, ev, this.routerDirection, this.routerAnimation) }, inheritedAttributes), hAsync("ion-icon", { key: '798deede94de658e4345acf7c2aafe2ab2567b0b', "aria-hidden": "true", icon: this.closeIcon, part: "close-icon", class: "close-icon", lazy: false }), hAsync("span", { key: '99252fde6de1aca73fc240a6da7e29acac9acb18', class: "button-inner" }, hAsync("slot", { key: 'dc73e9b41bf1f0e385e5784f975dfb81e37c8dfb' })), mode === 'md' && hAsync("ion-ripple-effect", { key: '8413e162f44a0350f54dff06cff7aad101de3549' }))));
+            }) }, hAsync(TagType, Object.assign({ key: 'd3c47b6a14c0e9d324798d0b2a509e488182df4f' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => openURL(href, ev, this.routerDirection, this.routerAnimation) }, inheritedAttributes), hAsync("ion-icon", { key: '981560257550774815d1569e475cca7601132190', "aria-hidden": "true", icon: this.closeIcon, part: "close-icon", class: "close-icon", lazy: false }), hAsync("span", { key: 'e411b2d7e877c1f5e1d6f8801f8559bf5b934992', class: "button-inner" }, hAsync("slot", { key: 'c297006169821d43e36319a3e5d7b9287e8e6f6d' })), mode === 'md' && hAsync("ion-ripple-effect", { key: '18da253947cc21bdddeafbd3d69edd293e0a263a' }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -13217,11 +13217,11 @@ class FabList {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'fa1d195b9950654ba0e984bf61d981c977d05275', class: {
+        return (hAsync(Host, { key: '471579e7a1aa9a81864a1f5ef240fa2831302d41', class: {
                 [mode]: true,
                 'fab-list-active': this.activated,
                 [`fab-list-side-${this.side}`]: true,
-            } }, hAsync("slot", { key: '2ec738c66c05112e1e2521155d6adfc36d2fd1db' })));
+            } }, hAsync("slot", { key: 'ef37497fc5843df380f5e92b128012dc33467f99' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -13673,7 +13673,7 @@ class Footer {
         const mode = getIonMode$1(this);
         const tabs = this.el.closest('ion-tabs');
         const tabBar = tabs === null || tabs === void 0 ? void 0 : tabs.querySelector(':scope > ion-tab-bar');
-        return (hAsync(Host, { key: '5da19dc38ba73e1ddfd1bef3ebd485105d77c751', role: "contentinfo", class: {
+        return (hAsync(Host, { key: 'bc89fabb9ddd59ba3c680ace612d1b9f8eb04b5d', role: "contentinfo", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`footer-${mode}`]: true,
@@ -13681,7 +13681,7 @@ class Footer {
                 [`footer-translucent-${mode}`]: translucent,
                 ['footer-toolbar-padding']: !this.keyboardVisible && (!tabBar || tabBar.slot !== 'bottom'),
                 [`footer-collapse-${collapse}`]: collapse !== undefined,
-            } }, mode === 'ios' && translucent && hAsync("div", { key: 'fafad08090a33d8c4e8a5b63d61929dcb89aab47', class: "footer-background" }), hAsync("slot", { key: 'e0a443d346afa55e4317c0bc1263fdbe3c619559' })));
+            } }, mode === 'ios' && translucent && hAsync("div", { key: '3066c23f89ac0ee60d091c28f3377790308e96bd', class: "footer-background" }), hAsync("slot", { key: 'ee843100a3ee759a5217b1264fb6a5c8f39099ea' })));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -13712,10 +13712,10 @@ class Grid {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '930ce78b02f8360fbca08a35d364d2c09128c6c8', class: {
+        return (hAsync(Host, { key: '4fe5317df34bf6ca4299ce99eaac896afddce256', class: {
                 [mode]: true,
                 'grid-fixed': this.fixed,
-            } }, hAsync("slot", { key: 'c47bf7ef2197f5ebc42d3e2c55044276fb0db393' })));
+            } }, hAsync("slot", { key: '521e0cb682dbd1e68b9b7f6e5b4f5d85eab8bf7b' })));
     }
     static get style() { return IonGridStyle0; }
     static get cmpMeta() { return {
@@ -14046,14 +14046,14 @@ class Header {
         const collapse = this.collapse || 'none';
         // banner role must be at top level, so remove role if inside a menu
         const roleType = hostContext('ion-menu', this.el) ? 'none' : 'banner';
-        return (hAsync(Host, Object.assign({ key: 'c687314ef290793a9d633ad20cfc5eeb47621e31', role: roleType, class: {
+        return (hAsync(Host, Object.assign({ key: 'a62f957fe6dd7d784f93264a29ddf5bfc3fa5126', role: roleType, class: {
                 [mode]: true,
                 // Used internally for styling
                 [`header-${mode}`]: true,
                 [`header-translucent`]: this.translucent,
                 [`header-collapse-${collapse}`]: true,
                 [`header-translucent-${mode}`]: this.translucent,
-            } }, inheritedAttributes), mode === 'ios' && translucent && hAsync("div", { key: 'b429996046082405a91e7c23f95516db0b736f12', class: "header-background" }), hAsync("slot", { key: 'e17a8965f8d3a33c1bfcb056c153d8242e5229fa' })));
+            } }, inheritedAttributes), mode === 'ios' && translucent && hAsync("div", { key: 'f6c96a94bfbac645acef00598fee3d0658d0ce0f', class: "header-background" }), hAsync("slot", { key: '1d8db34d84e5a361cdab23c17e52ca106b9cc2f9' })));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -14332,7 +14332,7 @@ class Img {
     render() {
         const { loadSrc, alt, onLoad, loadError, inheritedAttributes } = this;
         const { draggable } = inheritedAttributes;
-        return (hAsync(Host, { key: '14d24d65ec8e5522192ca58035264971b1ab883b', class: getIonMode$1(this) }, hAsync("img", { key: '345ba155a5fdce5e66c397a599b7333d37d9cb1d', decoding: "async", src: loadSrc, alt: alt, onLoad: onLoad, onError: loadError, part: "image", draggable: isDraggable(draggable) })));
+        return (hAsync(Host, { key: 'b2aa356b4804459ff993b0f0db85ed9ac6964cbb', class: getIonMode$1(this) }, hAsync("img", { key: '540336bbc1e38cae45a6fd58b50c53041c5ce11b', decoding: "async", src: loadSrc, alt: alt, onLoad: onLoad, onError: loadError, part: "image", draggable: isDraggable(draggable) })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -14539,7 +14539,7 @@ class InfiniteScroll {
     render() {
         const mode = getIonMode$1(this);
         const disabled = this.disabled;
-        return (hAsync(Host, { key: '1444429a86950c449953cbf578436cc8cabf40ec', class: {
+        return (hAsync(Host, { key: '87cefd8576ed1b670ba4424261262366f811a924', class: {
                 [mode]: true,
                 'infinite-scroll-loading': this.isLoading,
                 'infinite-scroll-enabled': !disabled,
@@ -14595,11 +14595,11 @@ class InfiniteScrollContent {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '060278bf9cb0321e182352f9613be4ebbb028259', class: {
+        return (hAsync(Host, { key: '56e054f26cd00798d9fbf16ed5fa2a65092121cc', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`infinite-scroll-content-${mode}`]: true,
-            } }, hAsync("div", { key: '07d3cada920145f979ad315bd187fb878e0c3da3', class: "infinite-loading" }, this.loadingSpinner && (hAsync("div", { key: '6254f175d7543d09f3dd47cd0589a2809182cd8c', class: "infinite-loading-spinner" }, hAsync("ion-spinner", { key: 'a6a816d1c65b60b786333b209b63492aa716a283', name: this.loadingSpinner }))), this.loadingText !== undefined && this.renderLoadingText())));
+            } }, hAsync("div", { key: '80a25642759b8a0222b2c69decfcc79dc42111c2', class: "infinite-loading" }, this.loadingSpinner && (hAsync("div", { key: '89a0de5e1d99059994452eabc98088ba5841eb08', class: "infinite-loading-spinner" }, hAsync("ion-spinner", { key: 'b299651c51898e08be9b08dd5e15baf303d15c43', name: this.loadingSpinner }))), this.loadingText !== undefined && this.renderLoadingText())));
     }
     static get style() { return {
         ios: IonInfiniteScrollContentIosStyle0,
@@ -15331,7 +15331,7 @@ class Input {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (hAsync(Host, { key: '907ce98a82b5cfae5a08504cd79e00a2330b7444', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '2b40ea921fd8c86b1d4898f24200d32591e4e851', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -15342,7 +15342,7 @@ class Input {
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', this.el),
                 'input-disabled': disabled,
-            }) }, hAsync("label", { key: '59d5bb45d2a5b828bba0ed8687a632a551e2f4d8', class: "input-wrapper", htmlFor: inputId }, this.renderLabelContainer(), hAsync("div", { key: 'f93f129d08246d0e9a601c100d718534d6403853', class: "native-wrapper" }, hAsync("slot", { key: '54eeb1a6bace662b7eb0d7e27180ea3d7e3a3729', name: "start" }), hAsync("input", Object.assign({ key: 'b3e0be55bc1a4a539ae3b0fdcf7fc078723cca16', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.clearInput && !readonly && !disabled && (hAsync("button", { key: '5f6373504a6d0d074bfbf875c794d45ea2748175', "aria-label": "reset", type: "button", class: "input-clear-icon", onPointerDown: (ev) => {
+            }) }, hAsync("label", { key: '8044307b8636d9956d3d4aebc2268936c3e0094c', class: "input-wrapper", htmlFor: inputId }, this.renderLabelContainer(), hAsync("div", { key: '6cd7959bb15de93403769ee98f5781c07659e5ee', class: "native-wrapper" }, hAsync("slot", { key: '56dde907c6c26c7d274d93b342667c1a308183a6', name: "start" }), hAsync("input", Object.assign({ key: 'e9eb6c483a174fb4ec580e3bfba4a5e26821f5d8', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.clearInput && !readonly && !disabled && (hAsync("button", { key: 'e99d05cf63ece49e819910b612eaf30e0c02723d', "aria-label": "reset", type: "button", class: "input-clear-icon", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the clear
@@ -15357,7 +15357,7 @@ class Input {
                  * for screen readers as it means users would be unable to swipe past the clear button.
                  */
                 ev.stopPropagation();
-            }, onClick: this.clearTextInput }, hAsync("ion-icon", { key: '230d77973aa83458ceb32bf52e3abe9bc322cfe6', "aria-hidden": "true", icon: clearIconData }))), hAsync("slot", { key: '9d69ac6e8a3c4b2b303dba2478f82695d5755ed2', name: "end" })), shouldRenderHighlight && hAsync("div", { key: 'ac61f16237ce731e0745ab72d0fc3f066252464a', class: "input-highlight" })), this.renderBottomContent()));
+            }, onClick: this.clearTextInput }, hAsync("ion-icon", { key: '52407befba53c742aafdfbe0f4e2be3884020e9d', "aria-hidden": "true", icon: clearIconData }))), hAsync("slot", { key: 'f250908f3802356340c5f20604d8f7fb4646feef', name: "end" })), shouldRenderHighlight && hAsync("div", { key: 'b58b8a70aa33df9de72388c80934b624506e2937', class: "input-highlight" })), this.renderBottomContent()));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -15479,16 +15479,16 @@ class InputPasswordToggle {
         const showPasswordIcon = (_a = this.showIcon) !== null && _a !== void 0 ? _a : eye;
         const hidePasswordIcon = (_b = this.hideIcon) !== null && _b !== void 0 ? _b : eyeOff;
         const isPasswordVisible = type === 'text';
-        return (hAsync(Host, { key: 'ed1c29726ce0c91548f0e2ada61e3f8b5c813d2d', class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'ef379220807a741be9fdc861bf41565ebf6ae9e5', class: createColorClasses$1(color, {
                 [mode]: true,
-            }) }, hAsync("ion-button", { key: '9698eccdaedb86cf12d20acc53660371b3af3c55', mode: mode, color: color, fill: "clear", shape: "round", "aria-checked": isPasswordVisible ? 'true' : 'false', "aria-label": "show password", role: "switch", type: "button", onPointerDown: (ev) => {
+            }) }, hAsync("ion-button", { key: 'd157ac743d32c53dfe25536812f8039f081c3a6d', mode: mode, color: color, fill: "clear", shape: "round", "aria-checked": isPasswordVisible ? 'true' : 'false', "aria-label": "show password", role: "switch", type: "button", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the password toggle
                  * button is activated.
                  */
                 ev.preventDefault();
-            }, onClick: this.togglePasswordVisibility }, hAsync("ion-icon", { key: '1f2119c30b56c800d9af44e6499445a0ebb466cf', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? hidePasswordIcon : showPasswordIcon }))));
+            }, onClick: this.togglePasswordVisibility }, hAsync("ion-icon", { key: '425fd81c63ffa8d8a1bce1187e9cd1a487a1217e', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? hidePasswordIcon : showPasswordIcon }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -15784,11 +15784,11 @@ class ItemDivider {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '60fda1dab7dbc0038ec7ff68a661896430f7d5c5', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '65df15b66445013e5e37befc2afd134ad903da15', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'item-divider-sticky': this.sticky,
                 item: true,
-            }) }, hAsync("slot", { key: '6ce072dfc2adfa699a2c34ffe25ed221c74d9eea', name: "start" }), hAsync("div", { key: '9a441be204ee2f0b567432722407c75e3cbbe942', class: "item-divider-inner" }, hAsync("div", { key: 'fd6f2969b345dba51400a290473e594d2d019dc5', class: "item-divider-wrapper" }, hAsync("slot", { key: 'ebf5601b21c4cf199c01bf142865b8da0c1ba4a6' })), hAsync("slot", { key: '249af8f30113f2c986976d518126661f65531121', name: "end" }))));
+            }) }, hAsync("slot", { key: 'fcc1d99b6580f7b62fab84500dd3863b0ff391b1', name: "start" }), hAsync("div", { key: 'dc08e2bb92032f7351eb126b473f3bd2c70ffbb1', class: "item-divider-inner" }, hAsync("div", { key: '2e0a2ae7f865c2f4fa5ae28096e5e7fde2835b7d', class: "item-divider-wrapper" }, hAsync("slot", { key: '16893bd08c5b8620b1cad21acc45da48aacec729' })), hAsync("slot", { key: '3a803e817445137c66c0dc9484e1e2e3102d81fb', name: "end" }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -15820,7 +15820,7 @@ class ItemGroup {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '24ff047b7c45f963f0dad072c65d38a230c2bc97', role: "group", class: {
+        return (hAsync(Host, { key: '431499b4f153e3267f41f68889afbfdfaed19214', role: "group", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`item-group-${mode}`]: true,
@@ -15888,12 +15888,12 @@ class ItemOption {
                 href: this.href,
                 target: this.target,
             };
-        return (hAsync(Host, { key: '1900e015f593fefd710478a2088e052399c957eb', onClick: this.onClick, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '1dddf37f8a81f123e8d85cc2a6d6a621aa054c9c', onClick: this.onClick, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'item-option-disabled': disabled,
                 'item-option-expandable': expandable,
                 'ion-activatable': true,
-            }) }, hAsync(TagType, Object.assign({ key: '5db2bb9bc72b7b00c324e4189cd1b5f862680ebb' }, attrs, { class: "button-native", part: "native", disabled: disabled }), hAsync("span", { key: '6927e812ad001c5e7bd17f440d82c3830c58957b', class: "button-inner" }, hAsync("slot", { key: '0fde4333def94c55d1318868c2bc71e780d5876a', name: "top" }), hAsync("div", { key: '7ecc9ae8ddf66d7ed5d9f30becc9faf820e1c62e', class: "horizontal-wrapper" }, hAsync("slot", { key: 'a15567fd4bd91080e9fbb6bb0c9b0e67d8a67051', name: "start" }), hAsync("slot", { key: '7f86cdd28063e23f9d78997623333c5037c4f364', name: "icon-only" }), hAsync("slot", { key: '4abb69ce3ad6c4917dd87b7b1eb0fa1c69917d73' }), hAsync("slot", { key: '8b35a29f48722040465f182679ac17209937578d', name: "end" })), hAsync("slot", { key: 'fa15a00891b41d66a4ccb51575dec54b72d0059e', name: "bottom" })), mode === 'md' && hAsync("ion-ripple-effect", { key: '0c071910c90fafca8026f59d78f4d9d5224d150a' }))));
+            }) }, hAsync(TagType, Object.assign({ key: '37d160240c7a16d778651a1be4f808e1f7f41f85' }, attrs, { class: "button-native", part: "native", disabled: disabled }), hAsync("span", { key: '358f9b2659413b7e6da19a54084134d7e5217e91', class: "button-inner" }, hAsync("slot", { key: '86ec135ece4b18d1c787435434590722fc2bc8e8', name: "top" }), hAsync("div", { key: '892dca9edc782071aef7b2a0ad70fc65b9a4d0cf', class: "horizontal-wrapper" }, hAsync("slot", { key: '59252a0dee6ddac967f4e73d34823e8a21001756', name: "start" }), hAsync("slot", { key: '52e3cbdeb295b6b79d87d4e5a323800f34758435', name: "icon-only" }), hAsync("slot", { key: '1e4367542aa4def39d8103af72d4009696b03fe4' }), hAsync("slot", { key: 'f5626d23d0173b6fffbafca27b3d269677bd2326', name: "end" })), hAsync("slot", { key: '25c3f9d6028284e8ac2d6770d72ad4fe16699817', name: "bottom" })), mode === 'md' && hAsync("ion-ripple-effect", { key: 'b99d351d1468a29e2b078cc340182bb28f98bcb4' }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -15940,7 +15940,7 @@ class ItemOptions {
     render() {
         const mode = getIonMode$1(this);
         const isEnd = isEndSide(this.side);
-        return (hAsync(Host, { key: 'e28cd6a236323b5cc203c9b96782aa81024da924', class: {
+        return (hAsync(Host, { key: '68c19c95f265af17d1aa6862f2462ffbe0f7d681', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`item-options-${mode}`]: true,
@@ -16402,7 +16402,7 @@ class ItemSliding {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '99f87c8bd794ae69830b407ba55013ac44793c26', class: {
+        return (hAsync(Host, { key: '3e27dec82876fbfda6adefeeb736098acb1ef1aa', class: {
                 [mode]: true,
                 'item-sliding-active-slide': this.state !== 2 /* SlidingState.Disabled */,
                 'item-sliding-active-options-end': (this.state & 8 /* SlidingState.End */) !== 0,
@@ -16511,13 +16511,13 @@ class Label {
     render() {
         const position = this.position;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'c2c0f388dab910d294efb9fbb409ee4ef829c1ed', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '547f629c238d0453d1dde891180a38233e754563', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'in-item-color': hostContext('ion-item.ion-color', this.el),
                 [`label-${position}`]: position !== undefined,
                 [`label-no-animate`]: this.noAnimate,
                 'label-rtl': document.dir === 'rtl',
-            }) }, hAsync("slot", { key: '4de6b69950f417873a13c851018ec31ea2686f0a' })));
+            }) }, hAsync("slot", { key: '4ed759c0283d0147cb080fe5720b07e3fbc6e47a' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -16573,7 +16573,7 @@ class List {
     render() {
         const mode = getIonMode$1(this);
         const { lines, inset } = this;
-        return (hAsync(Host, { key: '8bde220025a7eeca6da075379c6487c4c9bdddc1', role: "list", class: {
+        return (hAsync(Host, { key: '0158aeb3a6e4949e0126517b85def986bcca2007', role: "list", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`list-${mode}`]: true,
@@ -16619,10 +16619,10 @@ class ListHeader {
     render() {
         const { lines } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '7e2e050f13722f2b870a2415d99a9e631e9ca267', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '519a0e6de36766d72a8ccfec7e49d6ed18322231', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 [`list-header-lines-${lines}`]: lines !== undefined,
-            }) }, hAsync("div", { key: '6117bebc45800d874e9b75355476fbced5cc8398', class: "list-header-inner" }, hAsync("slot", { key: '9165fb274cd2c45a5a65c271d8b1f30e8a00c890' }))));
+            }) }, hAsync("div", { key: '0f0d10d2c2db7a314836d6ea029b68a0c93d2b24', class: "list-header-inner" }, hAsync("slot", { key: '1c8e2caca87f0f96a68adc76654d80a02c0360bf' }))));
     }
     static get style() { return {
         ios: IonListHeaderIosStyle0,
@@ -16891,9 +16891,9 @@ class Loading {
          * Otherwise, don't set aria-labelledby.
          */
         const ariaLabelledBy = message !== undefined ? msgId : null;
-        return (hAsync(Host, Object.assign({ key: 'fb3d2cd7cd0539ed6540d8be50e243c7916b3ca2', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
+        return (hAsync(Host, Object.assign({ key: 'c7562170ffd49bfee7223bfc9fe0063b7b344e64', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${40000 + this.overlayIndex}`,
-            }, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), hAsync("ion-backdrop", { key: 'c8bd30782f3040b1b80e88aa924861e439d40754', visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { key: '4ebfbb67c92e8eb56c27dd7c199b35bf6be1cf63', tabindex: "0" }), hAsync("div", { key: '9492723cd87f1ef75534e449d4bc2b2deb0cb3cc', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (hAsync("div", { key: 'd9eb42454e48c82704d974a68b80ceb4de990417', class: "loading-spinner" }, hAsync("ion-spinner", { key: 'cdb046bad89872f4208ae466979315652766bf3a', name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), hAsync("div", { key: '412d1bb537dafa6e6863d07ddc15f5969fe0617d', tabindex: "0" })));
+            }, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), hAsync("ion-backdrop", { key: '2096094a1f5c7e517b08aa411f261771342eb61e', visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { key: '786a99cb01e6cbd8ab7bcdcb706694941537d6e1', tabindex: "0" }), hAsync("div", { key: '7cd7556f6d07daad506c0581387b5fbc3eee0821', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (hAsync("div", { key: 'eec11a685d8aa043d87de1b9723cee57a0c2567c', class: "loading-spinner" }, hAsync("ion-spinner", { key: '217ad6a3db2fc63e69b04fff48ae0ab503d66d25', name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), hAsync("div", { key: '912db33d4f99440f1a43eb28c3701f15bd9603f9', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -17874,14 +17874,14 @@ class Menu {
          * the ionBackButton listener in the menu controller
          * will handle closing the menu when Escape is pressed.
          */
-        return (hAsync(Host, { key: '30c0c9bfb8973e4a6feb658f8c4ee8e362f464ed', onKeyDown: shouldUseCloseWatcher() ? null : this.onKeydown, role: "navigation", "aria-label": inheritedAttributes['aria-label'] || 'menu', class: {
+        return (hAsync(Host, { key: '66f2e13acf2f0248b78c003ac9078b04b59c3244', onKeyDown: shouldUseCloseWatcher() ? null : this.onKeydown, role: "navigation", "aria-label": inheritedAttributes['aria-label'] || 'menu', class: {
                 [mode]: true,
                 [`menu-type-${type}`]: true,
                 'menu-enabled': !disabled,
                 [`menu-side-${side}`]: true,
                 'menu-pane-visible': isPaneVisible,
                 'split-pane-side': hostContext('ion-split-pane', el),
-            } }, hAsync("div", { key: '34b0e5840906862cf1bc27207e089004b0402c56', class: "menu-inner", part: "container", ref: (el) => (this.menuInnerEl = el) }, hAsync("slot", { key: '2cd7e61a8c0987ca4b3f1f8b33cba7152f1275fe' })), hAsync("ion-backdrop", { key: 'd190b1f9b66c76e276f27bfe074d3aab796180fb', ref: (el) => (this.backdropEl = el), class: "menu-backdrop", tappable: false, stopPropagation: false, part: "backdrop" })));
+            } }, hAsync("div", { key: 'e466835a426ab01e06527618f5a4e0c737e24117', class: "menu-inner", part: "container", ref: (el) => (this.menuInnerEl = el) }, hAsync("slot", { key: 'bbf6c6aa17dfda54724d35a4ae83c8cd4380b08e' })), hAsync("ion-backdrop", { key: '567a15e5b144f91efbbb343f3576099731ad0836', ref: (el) => (this.backdropEl = el), class: "menu-backdrop", tappable: false, stopPropagation: false, part: "backdrop" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -17984,7 +17984,7 @@ class MenuButton {
             type: this.type,
         };
         const ariaLabel = inheritedAttributes['aria-label'] || 'menu';
-        return (hAsync(Host, { key: '95a8b9f09c7fae9713a8dc003ed277f6f31403da', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-hidden": hidden ? 'true' : null, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'a16147368b4f5282a7a8c49c8b4d0efefc9e96c3', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-hidden": hidden ? 'true' : null, class: createColorClasses$1(color, {
                 [mode]: true,
                 button: true, // ion-buttons target .button
                 'menu-button-hidden': hidden,
@@ -17993,7 +17993,7 @@ class MenuButton {
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'ion-activatable': true,
                 'ion-focusable': true,
-            }) }, hAsync("button", Object.assign({ key: '39f3ce20c400d2fac4890a042e8e44426709fca5' }, attrs, { disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }), hAsync("span", { key: '310978dc1cdef668de6720cde2a2304253679176', class: "button-inner" }, hAsync("slot", { key: '2a2b9de524c1fc3c526fe9559cb077b976852725' }, hAsync("ion-icon", { key: '9c22d7ea9fc3d76c32ec1c1b4b13d982c60b8c2d', part: "icon", icon: menuIcon, mode: mode, lazy: false, "aria-hidden": "true" }))), mode === 'md' && hAsync("ion-ripple-effect", { key: 'c58c9e29c763070383472f65a9d322a684bcb564', type: "unbounded" }))));
+            }) }, hAsync("button", Object.assign({ key: 'f2d862ab4fbb5a3df38c3d5aa267c33f7b80664b' }, attrs, { disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }), hAsync("span", { key: '5327bed80bdcdf7752e016bd1e76733a8a546ce4', class: "button-inner" }, hAsync("slot", { key: '741de13cfcbe13ee27845629c25bd4c38942c048' }, hAsync("ion-icon", { key: 'c940aa2ffcf85435eca2d0ebec26b8b8cb3fce5d', part: "icon", icon: menuIcon, mode: mode, lazy: false, "aria-hidden": "true" }))), mode === 'md' && hAsync("ion-ripple-effect", { key: 'e3d5193d3a2be0957559bdc6b2e01c34b416c1af', type: "unbounded" }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -18042,10 +18042,10 @@ class MenuToggle {
     render() {
         const mode = getIonMode$1(this);
         const hidden = this.autoHide && !this.visible;
-        return (hAsync(Host, { key: '90e621f09792383f1badcc1b402b1ac7d08c5f98', onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
+        return (hAsync(Host, { key: '3b28da3b0e9dfb658550090dac677a8e2f1b6353', onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
                 [mode]: true,
                 'menu-toggle-hidden': hidden,
-            } }, hAsync("slot", { key: 'c0abdd1d91e9d80ee3704e3e374ebe1f29078460' })));
+            } }, hAsync("slot", { key: 'c8b48137a8d5d010804a14ba158a764f08e4a21d' })));
     }
     static get style() { return IonMenuToggleStyle0; }
     static get cmpMeta() { return {
@@ -20049,18 +20049,18 @@ class Modal {
         const mode = getIonMode$1(this);
         const isCardModal = presentingElement !== undefined && mode === 'ios';
         const isHandleCycle = handleBehavior === 'cycle';
-        return (hAsync(Host, Object.assign({ key: '013ba4864ca4d2c1052c512f6a4b0732b8decff7', "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (hAsync(Host, Object.assign({ key: '392da9274da3d5968e0430b11b6a420f11102cab', "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, 'overlay-hidden': true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }), hAsync("ion-backdrop", { key: '498b1c0a03836d6799dcf3b8e9315805c70f6480', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: 'ce22e4caf1096e87248926fe2477f0d5a4c8a5cf', class: "modal-shadow" }), hAsync("div", Object.assign({ key: '540e47b15d8290166c39b022c725182114a75682',
+            }, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, 'overlay-hidden': true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }), hAsync("ion-backdrop", { key: 'f5b60e561a1fbd1b097775809302c97779999797', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: 'ee0038100f4f32f7736612dfb74605203028cd8d', class: "modal-shadow" }), hAsync("div", Object.assign({ key: '9e307d92206d9e72aa0321a61307c5edfe94038f',
             /*
               role and aria-modal must be used on the
               same element. They must also be set inside the
               shadow DOM otherwise ion-button will not be highlighted
               when using VoiceOver: https://bugs.webkit.org/show_bug.cgi?id=247134
             */
-            role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: 'f3b352ec9a63a7ec801462aacfd8295b4302d115', class: "modal-handle",
+            role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: '9e18317a51323656750d8ff732a7d4f030954cff', class: "modal-handle",
             // Prevents the handle from receiving keyboard focus when it does not cycle
-            tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle" })), hAsync("slot", { key: '31a3f58f4c733ffdf736523c154200874a96b1d0' }))));
+            tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle" })), hAsync("slot", { key: 'aaa1c186eafc76922f7b4a178db6b72ec248b553' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -21009,7 +21009,7 @@ class Nav {
         }
     }
     render() {
-        return hAsync("slot", { key: 'e9d99a8a0b84f02f9964d8143cd5e647e43334f9' });
+        return hAsync("slot", { key: 'a7d562f108f2e797b683ae7f693003f89cb90899' });
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -21082,7 +21082,7 @@ class NavLink {
         this.routerAnimation = undefined;
     }
     render() {
-        return hAsync(Host, { key: '42c23dcdec5fdb25defebaf6e8a9fa75754ff8eb', onClick: this.onClick });
+        return hAsync(Host, { key: '48305183ab3874ab3707b7422c593e655778d005', onClick: this.onClick });
     }
     get el() { return getElement(this); }
     static get cmpMeta() { return {
@@ -21116,9 +21116,9 @@ class Note {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '90ec2fe8c9487608ed8c0bdc32c2e80a6a0890b3', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: 'b0832b2d801852dc028981f43184a511e6d52986', class: createColorClasses$1(this.color, {
                 [mode]: true,
-            }) }, hAsync("slot", { key: '115ee3f79e6c526b0644443aad468e99385d0eda' })));
+            }) }, hAsync("slot", { key: '36b274e0c471717bb9dfd265bb180ae50e00bd05' })));
     }
     static get style() { return {
         ios: IonNoteIosStyle0,
@@ -21615,7 +21615,7 @@ class Picker$1 {
         this.emitInputModeChange();
     }
     render() {
-        return (hAsync(Host, { key: '02b0687b1f80ba295a965dfba76dd59e2d1de5d3', onPointerDown: (ev) => this.onPointerDown(ev), onClick: () => this.onClick() }, hAsync("input", { key: 'f83ed84bcf9e02539c00d8a4e63e6a0d7fc4ac71', "aria-hidden": "true", tabindex: -1, inputmode: "numeric", type: "number", onKeyDown: (ev) => {
+        return (hAsync(Host, { key: 'ea494f223cc339e37881915ab8206ee56893ef81', onPointerDown: (ev) => this.onPointerDown(ev), onClick: () => this.onClick() }, hAsync("input", { key: '43fb7ac4fd4f9a19dc0580110baac24255f8b1b7', "aria-hidden": "true", tabindex: -1, inputmode: "numeric", type: "number", onKeyDown: (ev) => {
                 var _a;
                 /**
                  * The "Enter" key represents
@@ -21630,7 +21630,7 @@ class Picker$1 {
                 if (ev.key === 'Enter') {
                     (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.blur();
                 }
-            }, ref: (el) => (this.inputEl = el), onInput: () => this.onInputChange(), onBlur: () => this.exitInputMode() }), hAsync("div", { key: '45b07fb0617d8e006712776bf78302288edb3ff4', class: "picker-before" }), hAsync("div", { key: '73009229368e0d62b09c913aacade26f068a7aa9', class: "picker-after" }), hAsync("div", { key: 'b73da00e446cd1cfd511c39212e14a00d355752e', class: "picker-highlight", ref: (el) => (this.highlightEl = el) }), hAsync("slot", { key: 'd969f5efc5ddb9eda6c4828702efd1ceeb69f767' })));
+            }, ref: (el) => (this.inputEl = el), onInput: () => this.onInputChange(), onBlur: () => this.exitInputMode() }), hAsync("div", { key: '8a0b088ac11a817ccf2aaa9ad95688b5ef6ca9a7', class: "picker-before" }), hAsync("div", { key: '16484422aa562a15098fa2dda2a7705aab7e4986', class: "picker-after" }), hAsync("div", { key: '7ef61e6f41436d751be39bcc4975ab3383ef2093', class: "picker-highlight", ref: (el) => (this.highlightEl = el) }), hAsync("slot", { key: '3b09f7a21112209970d275a79394f350e7d97252' })));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -21883,11 +21883,11 @@ class Picker {
     render() {
         const { htmlAttributes } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, Object.assign({ key: '3b163ca87354a3a4f302ff016d5affd0dc97bccc', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
+        return (hAsync(Host, Object.assign({ key: '3c1d91848d07cb4646658726852738d893e3cd2f', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
             }, class: Object.assign({ [mode]: true,
                 // Used internally for styling
-                [`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), hAsync("ion-backdrop", { key: 'da4224447bdbcfbadd1bd63ebe7a7bfdb8aa3129', visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { key: '211475c859b7acf4d64556905c45993201d92d43', tabindex: "0" }), hAsync("div", { key: 'c3b3674038155809caea84ae6348ff0d66897a64', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, hAsync("div", { key: 'a21757da70dc7864945a5751d9da3ca4bf87897b', class: "picker-toolbar" }, this.buttons.map((b) => (hAsync("div", { class: buttonWrapperClass(b) }, hAsync("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass$1(b) }, b.text))))), hAsync("div", { key: '0220da1854d09ef22d2d9a32eaa3c3b222be5a0a', class: "picker-columns" }, hAsync("div", { key: '55757c165ba9e38e56b4dee76a9b13d3ff8b21e6', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => hAsync("ion-picker-legacy-column", { col: c })), hAsync("div", { key: '160092a46a48287bf75e5dfe3502f1755a2d0c70', class: "picker-below-highlight" }))), hAsync("div", { key: 'e212db6cca7d75fc0eda0baf4312dd51b9b7a4ef', tabindex: "0" })));
+                [`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), hAsync("ion-backdrop", { key: 'e4bfb44cc9ef0f5089699eabad88cd4021fcdfd6', visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { key: 'f1847f979ddcbc66864b22aaccdf815efd0142f9', tabindex: "0" }), hAsync("div", { key: 'b458b4891d54c5e22dca8b166e475743fe5b1a43', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, hAsync("div", { key: 'd6e0c7337dfd5668d3e5981eeaf6619c162b0e4d', class: "picker-toolbar" }, this.buttons.map((b) => (hAsync("div", { class: buttonWrapperClass(b) }, hAsync("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass$1(b) }, b.text))))), hAsync("div", { key: 'e9a37a062af5fb9bbbc705587f3c78b23d943830', class: "picker-columns" }, hAsync("div", { key: '4c9e6bf85b379672a84fe9a89e13a94973fd7822', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => hAsync("ion-picker-legacy-column", { col: c })), hAsync("div", { key: '8b50dd82ce2c0e01843241823ee8d2bb0de1dd1e', class: "picker-below-highlight" }))), hAsync("div", { key: '4161ccd196b6d58bdd1b8c048009e30e04820ec7', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -22469,12 +22469,12 @@ class PickerColumn {
     render() {
         const { color, disabled, isActive, numericInput } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'd60736ce74c0e8c774a163272b78fbad32993ec2', class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: 'af52b1a2690a4c693ebea6d607eb6064405b8071', class: createColorClasses$1(color, {
                 [mode]: true,
                 ['picker-column-active']: isActive,
                 ['picker-column-numeric-input']: numericInput,
                 ['picker-column-disabled']: disabled,
-            }) }, this.renderAssistiveFocusable(), hAsync("slot", { key: '74611112ef154b343ae29a773f8cd8a01cc1447d', name: "prefix" }), hAsync("div", { key: 'af772d2b61b7eb41a567593d290b80a50b7caa72', "aria-hidden": "true", class: "picker-opts", ref: (el) => {
+            }) }, this.renderAssistiveFocusable(), hAsync("slot", { key: '7a542831d5e94548b946f1d473756a2bad24ec97', name: "prefix" }), hAsync("div", { key: 'a71b9ff28e7a56a6c95f66e1db11f295406a7500', "aria-hidden": "true", class: "picker-opts", ref: (el) => {
                 this.scrollEl = el;
             },
             /**
@@ -22495,7 +22495,7 @@ class PickerColumn {
              * To prevent this, we set the tabIndex to -1. This
              * will match the behavior of the other browsers.
              */
-            tabIndex: -1 }, hAsync("div", { key: '4b646ee97bcf8ed541b9798c91dff189eec41dd1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: 'a44d1a10d20a13aeb47f9871b09e291aa7f216bd', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '6a481715bd68fa68dc2a76c2e867ce771ea680b0', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("slot", { key: '23236e731b1ad432c104761ebeec91697a6b7643' }), hAsync("div", { key: '58a6c1f35a3ff0b26acaceebfd477d74b6dcfd6d', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: 'ea864872dec6dc363406d1bd9101b1bf21944db6', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '28cc4c570d0dd59f491eef2b15a5ed706d28b7bb', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), hAsync("slot", { key: 'cff1cc0bea732a5ce22bb451c5ea404a84af1993', name: "suffix" })));
+            tabIndex: -1 }, hAsync("div", { key: 'aef66f5784d51f39e814ea3c18796f613bad94f9', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '3bc43bfecddbc2625fc0a954c26266af28e388f0', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: 'f8bcacbcb6c2969eb71b5812e4e8dc4262626fd9', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("slot", { key: 'afea4b821a7361785ff88dd91a1e9d68c0c2b6cc' }), hAsync("div", { key: '1c14f2ef29d18206b6d2bb20f51198232786d9e2', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '13113da507e70b23610170a1472379297fb8e268', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '6cab3e357dee32272522a6ded7f73be6eb68da2b', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), hAsync("slot", { key: '4634034b6260b31e1ca2aa66d4ef006e838a7561', name: "suffix" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -22862,9 +22862,9 @@ class PickerColumnCmp {
     render() {
         const col = this.col;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '56289a294e5c580f3e7fe5fc12777aa7f80ad19b', class: Object.assign({ [mode]: true, 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right' }, getClassMap(col.cssClass)), style: {
+        return (hAsync(Host, { key: '8abc109f5e591d7c9ea7cd86c04b7208f51b0562', class: Object.assign({ [mode]: true, 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right' }, getClassMap(col.cssClass)), style: {
                 'max-width': this.col.columnWidth,
-            } }, col.prefix && (hAsync("div", { key: 'd21f44667b5df567d6879723fe643ea7c2c60bef', class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), hAsync("div", { key: 'bb427e5f24fd832703926e0e847ad05567597262', class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index) => (hAsync("button", { "aria-label": o.ariaLabel, class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index }, o.text)))), col.suffix && (hAsync("div", { key: '0413f7c074b6534b8967387ecb9957a79a267aff', class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
+            } }, col.prefix && (hAsync("div", { key: '156016097610467858f11d149b1369fe5a088865', class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), hAsync("div", { key: 'f0ca19d3b05ab4b5f2d93e0776974af670559bc6', class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index) => (hAsync("button", { "aria-label": o.ariaLabel, class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index }, o.text)))), col.suffix && (hAsync("div", { key: 'a56b1619e3f456f8dec79e211d6482faaf1cacea', class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -22968,10 +22968,10 @@ class PickerColumnOption {
     render() {
         const { color, disabled, ariaLabel } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'cc4435a0ce0e55be1321bcabaf342ed68cf5ba1e', class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '89484debb60aeae61552710948abd9a7edac43a4', class: createColorClasses$1(color, {
                 [mode]: true,
                 ['option-disabled']: disabled,
-            }) }, hAsync("button", { key: '0187fb967771e0787807a8538dce4e59f6a98565', tabindex: "-1", "aria-label": ariaLabel, disabled: disabled, onClick: () => this.onClick() }, hAsync("slot", { key: 'dbe52552f3f27332816748c12d929cc81060841d' }))));
+            }) }, hAsync("button", { key: '4ee3683735e65328ac32760d5f8cb0ac0808c94c', tabindex: "-1", "aria-label": ariaLabel, disabled: disabled, onClick: () => this.onClick() }, hAsync("slot", { key: '2636190f11848180f69625ec61e1f70853474e87' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -24285,9 +24285,9 @@ class Popover {
         const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes, focusTrap } = this;
         const desktop = isPlatform('desktop');
         const enableArrow = arrow && !parentPopover;
-        return (hAsync(Host, Object.assign({ key: '3a7c4c39384bab1447c4bd6b9b06d7837a09353b', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (hAsync(Host, Object.assign({ key: 'bcb60869edbfd785675ef45e008fb47e509f2b86', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && hAsync("ion-backdrop", { key: '38a1c4ad29238d1e81cab407f099121fa4947cce', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), hAsync("div", { key: 'f825494c5e3be89d7fcf0229e29b405bccb13edb', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && hAsync("div", { key: '3acae5a0106389c776c8ffe5bf10f3ff006e0346', class: "popover-arrow", part: "arrow" }), hAsync("div", { key: '2aa73e9f06b1d2ac4c0d36c23186b9164f395079', class: "popover-content", part: "content" }, hAsync("slot", { key: '62f5713414aae47dde6a8aef1f9b69af287534ae' })))));
+            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && hAsync("ion-backdrop", { key: '16445f40f94c39110091253a01ecb4a6d3c56516', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), hAsync("div", { key: 'dfc7fae35406d3176283494a22413a61547a4278', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && hAsync("div", { key: '4ffe05cbb5223e60e877463ac5b6c28a1c93922c', class: "popover-arrow", part: "arrow" }), hAsync("div", { key: 'd6b2386437a12ed54d6bd10dad70e5051fbe9942', class: "popover-content", part: "content" }, hAsync("slot", { key: 'd0bf8256109166898d15caa6520199827e7fca6e' })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -24379,7 +24379,7 @@ class ProgressBar {
         const mode = getIonMode$1(this);
         // If the progress is displayed as a solid bar.
         const progressSolid = buffer === 1;
-        return (hAsync(Host, { key: 'b293f4475bcdaa7851b41ebfda659037f0365120', role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '54a95689d925e0af26b806805e7880fadbe7ef79', role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: createColorClasses$1(color, {
                 [mode]: true,
                 [`progress-bar-${type}`]: true,
                 'progress-paused': paused,
@@ -24547,7 +24547,7 @@ class Radio {
         const { checked, disabled, color, el, justify, labelPlacement, hasLabel, buttonTabindex, alignment } = this;
         const mode = getIonMode$1(this);
         const inItem = hostContext('ion-item', el);
-        return (hAsync(Host, { key: 'd6d9525eea9dadc3ea7060eb9b8cbb919e1d7091', onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '1bf1ab8e07d7b5fda309c38bf7f332a1e9a04fb0', onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
                 [mode]: true,
                 'in-item': inItem,
                 'radio-checked': checked,
@@ -24558,10 +24558,10 @@ class Radio {
                 // Focus and active styling should not apply when the radio is in an item
                 'ion-activatable': !inItem,
                 'ion-focusable': !inItem,
-            }), role: "radio", "aria-checked": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabindex: buttonTabindex }, hAsync("label", { key: '3ec73512bac8feb651c66e544899c6a4330d504c', class: "radio-wrapper" }, hAsync("div", { key: '9ae7ecb19c7bafe0ce3d0f717af0338251964ebf', class: {
+            }), role: "radio", "aria-checked": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabindex: buttonTabindex }, hAsync("label", { key: '789b2677f506aad6e7624cd0f574a74211418918', class: "radio-wrapper" }, hAsync("div", { key: '3e4205cc9f96e93308ea0b6171fb4050219fdaf7', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !hasLabel,
-            }, part: "label" }, hAsync("slot", { key: '2950f1579a22d4a06f9c903fd462c2b46f43bfd7' })), hAsync("div", { key: '8b19ce30b39066744108a6de2da42a7ce8ffdbec', class: "native-wrapper" }, this.renderRadioControl()))));
+            }, part: "label" }, hAsync("slot", { key: '818b03f2a0af36bc318074975af70e47502e1096' })), hAsync("div", { key: '16e12272c89bcb1488b4a6f8bf6637f8a3f2b468', class: "native-wrapper" }, this.renderRadioControl()))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -24746,7 +24746,7 @@ class RadioGroup {
         const { label, labelId, el, name, value } = this;
         const mode = getIonMode$1(this);
         renderHiddenInput(true, el, name, value, false);
-        return hAsync(Host, { key: '7a8ad7eb6a05c6f96a348dcf30fd0c610a95688c', role: "radiogroup", "aria-labelledby": label ? labelId : null, onClick: this.onClick, class: mode });
+        return hAsync(Host, { key: '553c89f51a37e7b13f072c0f78e9233aa5f4fe60', role: "radiogroup", "aria-labelledby": label ? labelId : null, onClick: this.onClick, class: mode });
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -25378,7 +25378,7 @@ class Range {
         const needsEndAdjustment = inItem && !hasEndContent;
         const mode = getIonMode$1(this);
         renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
-        return (hAsync(Host, { key: '877c9f15e62fadb184f9da82dc19898227521e07', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: 'c6f38d4d93b60718a5043bbd382a8990d940576d', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'in-item': inItem,
                 'range-disabled': disabled,
@@ -25387,10 +25387,10 @@ class Range {
                 [`range-label-placement-${labelPlacement}`]: true,
                 'range-item-start-adjustment': needsStartAdjustment,
                 'range-item-end-adjustment': needsEndAdjustment,
-            }) }, hAsync("label", { key: '2ae9088349a65e09b0e33c53442190ef563b2345', class: "range-wrapper", id: "range-label" }, hAsync("div", { key: 'c3d0ca96ceb1e57fbd383e9c7e4da14d931771b8', class: {
+            }) }, hAsync("label", { key: '237861c3cce01b5962f0142226b15906c661074a', class: "range-wrapper", id: "range-label" }, hAsync("div", { key: '3bde0ace5b696cd500ccd1f8c97944abd55a38fc', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !hasLabel,
-            }, part: "label" }, label !== undefined ? hAsync("div", { class: "label-text" }, label) : hAsync("slot", { name: "label" })), hAsync("div", { key: '25d20fd5e015931f60a8ecc5374a1c84d167af9c', class: "native-wrapper" }, hAsync("slot", { key: 'ae9f9fd92eed35b81ca97a81caa56332d8b6b2b2', name: "start" }), this.renderRangeSlider(), hAsync("slot", { key: '74b7dede566a959c9b05a6de68426c7e339d18c8', name: "end" })))));
+            }, part: "label" }, label !== undefined ? hAsync("div", { class: "label-text" }, label) : hAsync("slot", { name: "label" })), hAsync("div", { key: '08fdc62e067af217257f7344ea97601843d18252', class: "native-wrapper" }, hAsync("slot", { key: '01f141d851bd85824995bc1cbbec8bce203713c9', name: "start" }), this.renderRangeSlider(), hAsync("slot", { key: 'dd41a087b384b63d97c71310561e86bbd2e4d2b9', name: "end" })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -26291,7 +26291,7 @@ class Refresher {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '3270f181a5141e7d886ec554a3e892974446b90e', slot: "fixed", class: {
+        return (hAsync(Host, { key: '15074f60a830f7340f9a3525992dfda0c20d5ef6', slot: "fixed", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`refresher-${mode}`]: true,
@@ -26519,7 +26519,7 @@ class RefresherContent {
         const pullingIcon = this.pullingIcon;
         const hasSpinner = pullingIcon != null && SPINNERS[pullingIcon] !== undefined;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '1bec5b4da221c69d856f3f5ddf40f2e03ebf2a4c', class: mode }, hAsync("div", { key: '4fcc526c4f1881e9368d9cd16bd7030919bd3841', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (hAsync("div", { key: 'a4e9e2e12c2d7faefc8303ec8c021f999ddf308e', class: "refresher-pulling-icon" }, hAsync("div", { key: '5a2d215feb7fb4b64d540d3a65c0f24b415a2433', class: "spinner-arrow-container" }, hAsync("ion-spinner", { key: 'abef2621d671ac6ff0abac43a702cbd825b7f127', name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (hAsync("div", { key: '30087d672c3780672a05874cd93cd099b2855462', class: "arrow-container" }, hAsync("ion-icon", { key: '5e30333dee469aec0d8efc8c4e6dabb619c6f363', icon: caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (hAsync("div", { key: '48fe72b5ce8ded633c6ee799cebb520b9c8be528', class: "refresher-pulling-icon" }, hAsync("ion-icon", { key: 'd8dfd5d42056b1c0a436c5006affb255407816c0', icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), hAsync("div", { key: 'c2cbfb94f157c82601ffe7bb815ff82ebc7c0a49', class: "refresher-refreshing" }, this.refreshingSpinner && (hAsync("div", { key: '17f3ebe6a31768d5e389f45a2c12f68600185db9', class: "refresher-refreshing-icon" }, hAsync("ion-spinner", { key: 'e8e61f8d7189c9939bba184201c9509d1d5b0fad', name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
+        return (hAsync(Host, { key: 'f665397cf9f5e20af31eb4a1c8828a1f03433c40', class: mode }, hAsync("div", { key: 'fbf4c28413b25731ee435eec6cc4ec8e49881d31', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (hAsync("div", { key: 'be479f6e1a5871a5e9c0b0753d120d5ce4d7a8c3', class: "refresher-pulling-icon" }, hAsync("div", { key: '1aa4e14dbbb9483ced2d72cf1e02476397b5e571', class: "spinner-arrow-container" }, hAsync("ion-spinner", { key: 'e5f7c15d48763be85dcb2e1bc653634a5ed8da66', name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (hAsync("div", { key: '6d1e96c0ab1633705c91bf773b86f45ae47b8677', class: "arrow-container" }, hAsync("ion-icon", { key: 'e9814a3b888bb199b3e5797a067bd32611f61a2b', icon: caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (hAsync("div", { key: '8fac2caf8bf9a58762cc162cc798d04791f2f9c1', class: "refresher-pulling-icon" }, hAsync("ion-icon", { key: 'a56714723eb5cd3802304bbf973082f81278c435', icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), hAsync("div", { key: 'e82b16ab534d8127f44c73b11f26301bb7bc1120', class: "refresher-refreshing" }, this.refreshingSpinner && (hAsync("div", { key: '4097a7d0bd1a5e2b01314f31fd770d371e2ca975', class: "refresher-refreshing-icon" }, hAsync("ion-spinner", { key: '2467533c9db5b5ad258197fa12dd7caf4147cd6d', name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
     }
     get el() { return getElement(this); }
     static get cmpMeta() { return {
@@ -26562,7 +26562,7 @@ class Reorder {
     render() {
         const mode = getIonMode$1(this);
         const reorderIcon = mode === 'ios' ? reorderThreeOutline : reorderTwoSharp;
-        return (hAsync(Host, { key: '663d74e231e3af56b6298ee2539fdac9c8465839', class: mode }, hAsync("slot", { key: 'c7c384ab8c9ca8abdc89cd984a39dfde70e342ca' }, hAsync("ion-icon", { key: 'c8b6052db03d4b9e33a90e600c20861c73ee73ce', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
+        return (hAsync(Host, { key: '933f9fa38d0e7ed7222e0aa7a461e6b4f5518dca', class: mode }, hAsync("slot", { key: '906d9983766fee9917d8045651cbab72e848bc92' }, hAsync("ion-icon", { key: '970df1085d5e93940c1af77f47bd0f00e7125e75', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -26816,7 +26816,7 @@ class ReorderGroup {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '491f3e5843cf728ff4589e58bd86b8ce6709b293', class: {
+        return (hAsync(Host, { key: '73f7c716508f54415f637e75a5d3085722e8d8ac', class: {
                 [mode]: true,
                 'reorder-enabled': !this.disabled,
                 'reorder-list-active': this.state !== 0 /* ReorderGroupState.Idle */,
@@ -26924,7 +26924,7 @@ class RippleEffect {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '2302f087ab1c6755355736e4ca77309c5fdcf185', role: "presentation", class: {
+        return (hAsync(Host, { key: 'b0eee56e6a6edea9377267536dd9345fae2360a5', role: "presentation", class: {
                 [mode]: true,
                 unbounded: this.unbounded,
             } }));
@@ -27866,10 +27866,10 @@ class RouterLink {
             rel: this.rel,
             target: this.target,
         };
-        return (hAsync(Host, { key: 'f876442cab5b14b7e83c6d6ad2c2d878a9c57439', onClick: this.onClick, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: 'a79c5da802fa8b0fd33eab8bd28d456f2b2fb566', onClick: this.onClick, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'ion-activatable': true,
-            }) }, hAsync("a", Object.assign({ key: 'c44b78ec1fd10a40c23bfe548860ac2b346646a8' }, attrs), hAsync("slot", { key: 'd32180a567613f79f89885135bd0d776ffc1eb8e' }))));
+            }) }, hAsync("a", Object.assign({ key: '975b89a02aec534b91e24616d71fbbea37714571' }, attrs), hAsync("slot", { key: 'a198f804cc749cb042806189734b485dcc99cf1f' }))));
     }
     static get style() { return IonRouterLinkStyle0; }
     static get cmpMeta() { return {
@@ -28064,7 +28064,7 @@ class RouterOutlet {
         return true;
     }
     render() {
-        return hAsync("slot", { key: '8279a453c66a766e6e383ff59842b4ae070c13a9' });
+        return hAsync("slot", { key: '5f2be0c7d417dd8421efdd85730afa9e781713b2' });
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -28098,7 +28098,7 @@ class Row {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: '813c9a7f6782d2cf8eb27f30d3ab28e6f3122868', class: getIonMode$1(this) }, hAsync("slot", { key: '356bec4d4d408ea63d6b431b06465d5b7bcbff71' })));
+        return (hAsync(Host, { key: '25066034fd2926f6f41f9ac763ad33e943e6f281', class: getIonMode$1(this) }, hAsync("slot", { key: '2aafdaf74fb631b09c215ec5c2404ae1eab31fec' })));
     }
     static get style() { return IonRowStyle0; }
     static get cmpMeta() { return {
@@ -28492,8 +28492,8 @@ class Searchbar {
         const clearIcon = this.clearIcon || (mode === 'ios' ? closeCircle : closeSharp);
         const searchIcon = this.searchIcon || (mode === 'ios' ? searchOutline : searchSharp);
         const shouldShowCancelButton = this.shouldShowCancelButton();
-        const cancelButton = this.showCancelButton !== 'never' && (hAsync("button", { key: '20b2d0f2e3425eede725dbe3323c7c29cdb66f4e', "aria-label": cancelButtonText, "aria-hidden": shouldShowCancelButton ? undefined : 'true', type: "button", tabIndex: mode === 'ios' && !shouldShowCancelButton ? -1 : undefined, onMouseDown: this.onCancelSearchbar, onTouchStart: this.onCancelSearchbar, class: "searchbar-cancel-button" }, hAsync("div", { key: '3a516c3fdd35256eb79639fd340afcdd92cfd7aa', "aria-hidden": "true" }, mode === 'md' ? (hAsync("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
-        return (hAsync(Host, { key: '34878db21f63a9bdffca0446d8ad5619ff04cac3', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
+        const cancelButton = this.showCancelButton !== 'never' && (hAsync("button", { key: 'bf6a5ab978a0744905d0b844cbbd24e0900d034d', "aria-label": cancelButtonText, "aria-hidden": shouldShowCancelButton ? undefined : 'true', type: "button", tabIndex: mode === 'ios' && !shouldShowCancelButton ? -1 : undefined, onMouseDown: this.onCancelSearchbar, onTouchStart: this.onCancelSearchbar, class: "searchbar-cancel-button" }, hAsync("div", { key: '27191efe3a68b7fb95d3fe255976e51bd23a3f1d', "aria-hidden": "true" }, mode === 'md' ? (hAsync("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
+        return (hAsync(Host, { key: 'a78bcd0b065c8541fa7823c152947547722f710b', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'searchbar-animated': animated,
                 'searchbar-disabled': this.disabled,
@@ -28503,14 +28503,14 @@ class Searchbar {
                 'searchbar-has-focus': this.focused,
                 'searchbar-should-show-clear': this.shouldShowClearButton(),
                 'searchbar-should-show-cancel': this.shouldShowCancelButton(),
-            }) }, hAsync("div", { key: 'faa7b011206a8359b1963368c65988e506b260cb', class: "searchbar-input-container" }, hAsync("input", Object.assign({ key: '732d3e5a2b258da6f136a14472ac872816a9853b', "aria-label": "search text", disabled: this.disabled, ref: (el) => (this.nativeInput = el), class: "searchbar-input", inputMode: this.inputmode, enterKeyHint: this.enterkeyhint, name: this.name, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, minLength: this.minlength, maxLength: this.maxlength, placeholder: this.placeholder, type: this.type, value: this.getValue(), autoCapitalize: autocapitalize === 'default' ? undefined : autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, hAsync("ion-icon", { key: '767dca971849f221dde220deae728b41bf764b98', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), hAsync("button", { key: '9941b5de1ed9ebcf3e81de8e0731c09dea5a89d9', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
+            }) }, hAsync("div", { key: '078379182377093c24f9478f6d5fd3fbd069f041', class: "searchbar-input-container" }, hAsync("input", Object.assign({ key: '1ebb449aa0e6c418f3a6a3cd30e4526b081a977b', "aria-label": "search text", disabled: this.disabled, ref: (el) => (this.nativeInput = el), class: "searchbar-input", inputMode: this.inputmode, enterKeyHint: this.enterkeyhint, name: this.name, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, minLength: this.minlength, maxLength: this.maxlength, placeholder: this.placeholder, type: this.type, value: this.getValue(), autoCapitalize: autocapitalize === 'default' ? undefined : autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, hAsync("ion-icon", { key: 'f8a4c480aa139518b34498a765abe30db39e5105', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), hAsync("button", { key: '33d2ed31e30ea927a247aac38ff019b18f046b0f', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the clear
                  * button is activated.
                  */
                 ev.preventDefault();
-            }, onClick: () => this.onClearInput(true) }, hAsync("ion-icon", { key: 'cb2b543d286373a84e2c6c2a959f92b045bbd7dd', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
+            }, onClick: () => this.onClearInput(true) }, hAsync("ion-icon", { key: 'ad4ee1d23c6b53e90aa10e2050c1e4361167413f', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -28998,14 +28998,14 @@ class Segment {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'f1f7103b4c298e037df850ac809a1a7c6e9987a7', role: "tablist", onClick: this.onClick, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '09a493ee1d13e4ac49e93b029ef0b017db113d9d', role: "tablist", onClick: this.onClick, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'segment-activated': this.activated,
                 'segment-disabled': this.disabled,
                 'segment-scrollable': this.scrollable,
-            }) }, hAsync("slot", { key: '6efdb318b13da8d21687084aa0761728fdf12579', onSlotchange: this.onSlottedItemsChange })));
+            }) }, hAsync("slot", { key: 'f3984c69f44f5dec65668ee450787f3b78c30f43', onSlotchange: this.onSlottedItemsChange })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -29115,7 +29115,7 @@ class SegmentButton {
         const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
         const mode = getIonMode$1(this);
         const hasSegmentColor = () => (segmentEl === null || segmentEl === void 0 ? void 0 : segmentEl.color) !== undefined;
-        return (hAsync(Host, { key: '70cf5c7a3ae2620222c5250c644faf3cfc3b3e4e', class: {
+        return (hAsync(Host, { key: '61df40030388f8c9780bbb06b8242a41ea328813', class: {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
@@ -29131,10 +29131,10 @@ class SegmentButton {
                 'ion-activatable': true,
                 'ion-activatable-instant': true,
                 'ion-focusable': true,
-            } }, hAsync("button", Object.assign({ key: 'a53c9f1e360934e8d2e90476642ba4507fc38ebd', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), hAsync("span", { key: '7d8feda840d389941cc693f500b5eba0b39b41da', class: "button-inner" }, hAsync("slot", { key: 'd9ae1eec45db253cbf573d29cd545658dd595d87' })), mode === 'md' && hAsync("ion-ripple-effect", { key: '49e6a16968709dc9b3fc77bc9fb99acb42fda88c' })), hAsync("div", { key: '4e3ea0989ed5205dbb03586e4facb439b05a92de', part: "indicator", class: {
+            } }, hAsync("button", Object.assign({ key: 'b8101f21b2b91812c93fa16dca8061b25d589e0d', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), hAsync("span", { key: 'ab1da974b4496916bcd8aec30191d30195e3521a', class: "button-inner" }, hAsync("slot", { key: 'dbbacd855740405ac018c92af645da4f3bac8740' })), mode === 'md' && hAsync("ion-ripple-effect", { key: 'c02aba98ae37a03721aa704b2534198706f5bf17' })), hAsync("div", { key: '826f9bb7e561c83aee0d83305351e6e95f6ed9a9', part: "indicator", class: {
                 'segment-button-indicator': true,
                 'segment-button-indicator-animated': true,
-            } }, hAsync("div", { key: '65c72a151080998c1e548c87d4d4ebd5c7dda72f', part: "indicator-background", class: "segment-button-indicator-background" }))));
+            } }, hAsync("div", { key: 'c57b0ad417b1f0150d3e3c90f49c6619819237f8', part: "indicator-background", class: "segment-button-indicator-background" }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -29746,7 +29746,7 @@ class Select {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
-        return (hAsync(Host, { key: '73c571c1f8468e1c3f4fe02fbbb33ba9cbc8e989', onClick: this.onClick, class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '4944d9a179ff9bf9c1cafd97111be3ab5fcad5f5', onClick: this.onClick, class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', el),
@@ -29762,7 +29762,7 @@ class Select {
                 [`select-justify-${justify}`]: justifyEnabled,
                 [`select-shape-${shape}`]: shape !== undefined,
                 [`select-label-placement-${labelPlacement}`]: true,
-            }) }, hAsync("label", { key: '2b08538cba0b9f747541d57ac18fb6a1ea658878', class: "select-wrapper", id: "select-label" }, this.renderLabelContainer(), hAsync("div", { key: '33f54373bcb02c72a9d0af2efffebc27ee2c69fe', class: "select-wrapper-inner" }, hAsync("slot", { key: 'd1c93aec99dc1cd6410f93309cef615fe04b541b', name: "start" }), hAsync("div", { key: '493d1a3cad9565516f855bef75685b020785ffd3', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), hAsync("slot", { key: '353a3ee5635f8a8f3be411efd6caef6c2ad74a89', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && hAsync("div", { key: 'fd5f85555db02affe954f9f4f2876ac8fe676234', class: "select-highlight" }))));
+            }) }, hAsync("label", { key: 'fb46a9a64d453fb2a4633c0cb0ffbe4e1a96f6fc', class: "select-wrapper", id: "select-label" }, this.renderLabelContainer(), hAsync("div", { key: 'e1daec1284b45633d1d9357afe2d43867f405867', class: "select-wrapper-inner" }, hAsync("slot", { key: '14ea11c993d8277d81f0e514dc049af5b12d9471', name: "start" }), hAsync("div", { key: '40ea56ec358c10b84a2978ba43c6498a6a52853c', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), hAsync("slot", { key: '5ec8b23ced33853f045fe5de20bc4a15d5b31404', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && hAsync("div", { key: 'fc903843063a2fb464dee5002fab9397cfc5f8f1', class: "select-highlight" }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -29853,7 +29853,7 @@ class SelectOption {
         this.value = undefined;
     }
     render() {
-        return hAsync(Host, { key: 'ba5a9c695c53fe0802af11a49f4305a9b8f71773', role: "option", id: this.inputId, class: getIonMode$1(this) });
+        return hAsync(Host, { key: '153935936f9a981f379a1aa99a055c551909b1fc', role: "option", id: this.inputId, class: getIonMode$1(this) });
     }
     get el() { return getElement(this); }
     static get style() { return IonSelectOptionStyle0; }
@@ -29973,7 +29973,7 @@ class SelectPopover {
     render() {
         const { header, message, options, subHeader } = this;
         const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
-        return (hAsync(Host, { key: '302553a2eec4d1442751b8af28b7c9bd3487fd5d', class: getIonMode$1(this) }, hAsync("ion-list", { key: '39ae8579e6fe3bae2c7504147268ad5c82fd27e6' }, header !== undefined && hAsync("ion-list-header", { key: 'e0e6686380d188f46c593e1bb25287dcf08c75c2' }, header), hasSubHeaderOrMessage && (hAsync("ion-item", { key: '8a2d8652db269593c0ba7d767277e12c2b06144d' }, hAsync("ion-label", { key: 'a30cc0ecf95d5bdd6421ee1683922c1b853e98ea', class: "ion-text-wrap" }, subHeader !== undefined && hAsync("h3", { key: 'c298459ca450123808a08d65660825b2c26d00e5' }, subHeader), message !== undefined && hAsync("p", { key: 'ed895fbaec020e809021138401341b6fd7675035' }, message)))), this.renderOptions(options))));
+        return (hAsync(Host, { key: '6018658d32978124074984f13ce2e58be0e3e576', class: getIonMode$1(this) }, hAsync("ion-list", { key: 'e1bf0601e9ea4b17cfe11ff6834baee52a75ad72' }, header !== undefined && hAsync("ion-list-header", { key: '277a8426c43a698c330715a32858669666cd43bd' }, header), hasSubHeaderOrMessage && (hAsync("ion-item", { key: '9ef017fcf57ab00f456cfca4e096174e89a08749' }, hAsync("ion-label", { key: 'e3840cabfc7ba50cb3e224d5b54015092d86f092', class: "ion-text-wrap" }, subHeader !== undefined && hAsync("h3", { key: 'acfc22382f238da790e78a1404a6ac061ff866ad' }, subHeader), message !== undefined && hAsync("p", { key: '95b675cd72607372f63ba729eaa26161f69de5dd' }, message)))), this.renderOptions(options))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -30021,11 +30021,11 @@ class SkeletonText {
         const animated = this.animated && config.getBoolean('animated', true);
         const inMedia = hostContext('ion-avatar', this.el) || hostContext('ion-thumbnail', this.el);
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '1a3e78e9a6f740d609d1f0b7a16cb6eff4a2d617', class: {
+        return (hAsync(Host, { key: '7b38f6a10dca8a32792b14f284dfd79dfe1cd383', class: {
                 [mode]: true,
                 'skeleton-text-animated': animated,
                 'in-media': inMedia,
-            } }, hAsync("span", { key: 'be3eabe196ec6e8ec19857375ba30f4c8aa58e7f' }, "\u00A0")));
+            } }, hAsync("span", { key: 'e7c31e8b979292b923ef7f2f5fbfd3a64f00953b' }, "\u00A0")));
     }
     get el() { return getElement(this); }
     static get style() { return IonSkeletonTextStyle0; }
@@ -30078,7 +30078,7 @@ class Spinner {
                 svgs.push(buildLine(spinner, duration, i, spinner.lines));
             }
         }
-        return (hAsync(Host, { key: '50cbaed55eeab15292447d106a80b93db4cb40de', class: createColorClasses$1(self.color, {
+        return (hAsync(Host, { key: 'ca7ed6a7ab4ee000db78b248e4db28f024a3e732', class: createColorClasses$1(self.color, {
                 [mode]: true,
                 [`spinner-${spinnerName}`]: true,
                 'spinner-paused': self.paused || config.getBoolean('_testing'),
@@ -30178,12 +30178,12 @@ class SplitPane {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'd54c356cd4bff7e55325160882dea8249f47f388', class: {
+        return (hAsync(Host, { key: 'f13d1621f50d9cf09657e09ab56a09999135dfbb', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`split-pane-${mode}`]: true,
                 'split-pane-visible': this.visible,
-            } }, hAsync("slot", { key: 'af62690d0fd686cfbd29d888c79eda9001f13e2f' })));
+            } }, hAsync("slot", { key: 'b986420fbb0b9aeb92b6c14c594148958bca66c4' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -30252,10 +30252,10 @@ class Tab {
     }
     render() {
         const { tab, active, component } = this;
-        return (hAsync(Host, { key: '46d5498418f5379861c3d7465e8021dec45f1200', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (hAsync(Host, { key: '50dd3d7e0877fa4d4394c8ffd9b97e874b07361a', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'ion-page': component === undefined,
                 'tab-hidden': !active,
-            } }, hAsync("slot", { key: 'b45045dccb87dfe75e3f5a5a474bb48b6c98e922' })));
+            } }, hAsync("slot", { key: '3c11ae1d402e65019d9958dc2a379bd2e15b37a0' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -30333,11 +30333,11 @@ class TabBar {
         const { color, translucent, keyboardVisible } = this;
         const mode = getIonMode$1(this);
         const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
-        return (hAsync(Host, { key: '3a8595dd83f89e8319471a7a7f9f64b2565b384c', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '37fc1d9e065a2abc6f3f549f3be3dd90035665f1', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses$1(color, {
                 [mode]: true,
                 'tab-bar-translucent': translucent,
                 'tab-bar-hidden': shouldHide,
-            }) }, hAsync("slot", { key: '8b65eceb922f6abfa15f41046261586fb94b981f' })));
+            }) }, hAsync("slot", { key: 'd62ae7247b77df6175364ed1e28986b631f3a9f4' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -30435,7 +30435,7 @@ class TabButton {
             rel,
             target,
         };
-        return (hAsync(Host, { key: '4b528ce31f67e10ad849e0c99bd034bba675c227', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (hAsync(Host, { key: '53d0a61eee136c29f9ffa3390c23fafebe89cf5d', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
                 [mode]: true,
                 'tab-selected': selected,
                 'tab-disabled': disabled,
@@ -30447,7 +30447,7 @@ class TabButton {
                 'ion-activatable': true,
                 'ion-selectable': true,
                 'ion-focusable': true,
-            } }, hAsync("a", Object.assign({ key: '0da8784b1b243ffaaaf04dd7adb55d6881ed0c08' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), hAsync("span", { key: '2c628e8f1ebc129f84876c01530468cb97d8bf3a', class: "button-inner" }, hAsync("slot", { key: '8052a171d197a7de1a7eb12b091c35f73ae1ee21' })), mode === 'md' && hAsync("ion-ripple-effect", { key: '4186bdb5ed045ec16f495a14fa30ac864c576227', type: "unbounded" }))));
+            } }, hAsync("a", Object.assign({ key: '688b0faf51380ea18ff9b77131c1a5f48c8de3d8' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), hAsync("span", { key: 'c8597bc938d9e335b5a352478083ee2c073863b7', class: "button-inner" }, hAsync("slot", { key: '8a098c255fcc1c96177150c613a39526df9308d5' })), mode === 'md' && hAsync("ion-ripple-effect", { key: '0dc91b68002fca4577a182fa391aad585fc29f68', type: "unbounded" }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -30623,7 +30623,7 @@ class Tabs {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
     render() {
-        return (hAsync(Host, { key: 'eb094c9bd15b7777c53bd0bd6d225784fa472849', onIonTabButtonClick: this.onTabClicked }, hAsync("slot", { key: 'a516ca6915bf26e77eeeb0ff684c4fcc7d4420a7', name: "top" }), hAsync("div", { key: 'dd2a32a072d77afe216abc4958c1d686405fb780', class: "tabs-inner" }, hAsync("slot", { key: '222c20ba862068f5c78e7bbef4fa213499fb2fa5' })), hAsync("slot", { key: '3e76dcb1b21873aa137d095c56131514054ead3a', name: "bottom" })));
+        return (hAsync(Host, { key: 'f9844fac600af29c7b916a3cc444c659a4b78101', onIonTabButtonClick: this.onTabClicked }, hAsync("slot", { key: 'ad0af6c9b8531b7f263506839d5738620d03279d', name: "top" }), hAsync("div", { key: 'df6808235d626c88c7304fec12e1e9dbfce40417', class: "tabs-inner" }, hAsync("slot", { key: '9723d085d8107adacf61f1ef1550304ed89f46a7' })), hAsync("slot", { key: 'ada75b7ca121fdcecc6da21e2c81d486b5fe93b2', name: "bottom" })));
     }
     get el() { return getElement(this); }
     static get style() { return IonTabsStyle0; }
@@ -30665,9 +30665,9 @@ class Text {
     }
     render() {
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: '4b76333b1ea5cab134b9dc1f5670c0d5a253fc32', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '2dfb2fb2732e675b116ffb00b85612b759bf0a8d', class: createColorClasses$1(this.color, {
                 [mode]: true,
-            }) }, hAsync("slot", { key: '3dee5f16bc58b3d92547d910bd4f441a00ce2039' })));
+            }) }, hAsync("slot", { key: 'cdd8504c81bd1d3eac4dfb95e066ecee6b1158de' })));
     }
     static get style() { return IonTextStyle0; }
     static get cmpMeta() { return {
@@ -31034,7 +31034,7 @@ class Textarea {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (hAsync(Host, { key: '37595a18d77dea1a337ac1c672e5f08a4128111d', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '8c2ec8899cf29f34ce29b5f9a250f363922bb7a0', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -31043,7 +31043,7 @@ class Textarea {
                 [`textarea-shape-${shape}`]: shape !== undefined,
                 [`textarea-label-placement-${labelPlacement}`]: true,
                 'textarea-disabled': disabled,
-            }) }, hAsync("label", { key: '67342758743e5a40448a32ff695876d39778621f', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), hAsync("div", { key: 'a994be8264bf5652811cf816d79a04178954e83f', class: "textarea-wrapper-inner" }, hAsync("div", { key: 'e09c93ebcd5b3d227d51e682ca23dfc7fd7027ad', class: "start-slot-wrapper" }, hAsync("slot", { key: 'd39758f21f19ae70aea21e9a9a7b7c20991fe593', name: "start" })), hAsync("div", { key: '6a4e10e53de4bb235ee30def4c9ae5bdee888816', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, hAsync("textarea", Object.assign({ key: '9e254e551f124d972e9bc6b09ef0f2bb55890be5', class: "native-textarea", ref: (el) => (this.nativeInput = el), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, minLength: this.minlength, maxLength: this.maxlength, name: this.name, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value)), hAsync("div", { key: 'a66aa2d2bc4778a0bec56a8b9ec9052a832eb3b2', class: "end-slot-wrapper" }, hAsync("slot", { key: '8e6a90b4475de32e23afc593da4108610dcca663', name: "end" }))), shouldRenderHighlight && hAsync("div", { key: '6da03205a8daff45581b20f0af3938634a9d5f8c', class: "textarea-highlight" })), this.renderBottomContent()));
+            }) }, hAsync("label", { key: '585df696cd803471d11e3ab889e1cf14623901fe', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), hAsync("div", { key: '2867aa6c5cc9b5112b007d212690239bf82d1b31', class: "textarea-wrapper-inner" }, hAsync("div", { key: '73e8de11eda0750481485df6573d9605d7055573', class: "start-slot-wrapper" }, hAsync("slot", { key: '9519fda2283b01e9897c1003898caa4af65ae769', name: "start" })), hAsync("div", { key: 'a16958a1e4cb6a2b12aea13a6902780bd3f6632d', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, hAsync("textarea", Object.assign({ key: '8f51d651ae535bc5de5dbb80a765ef467014f159', class: "native-textarea", ref: (el) => (this.nativeInput = el), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, minLength: this.minlength, maxLength: this.maxlength, name: this.name, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value)), hAsync("div", { key: '5f7e30b8bba71faa93aedff3351861cc7fd13c22', class: "end-slot-wrapper" }, hAsync("slot", { key: '763f49e617daab4269a85d8d8a76cc46ea1c68c8', name: "end" }))), shouldRenderHighlight && hAsync("div", { key: '2e8528dd95126ac08aa5bd171ec186fab222f930', class: "textarea-highlight" })), this.renderBottomContent()));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -31105,7 +31105,7 @@ class Thumbnail {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: 'ea55000055f941b0c79561e8934be6242ec8e114', class: getIonMode$1(this) }, hAsync("slot", { key: 'a4f934f442797f5c66a77e0ef8920fdd07c204f2' })));
+        return (hAsync(Host, { key: 'a7ed84e603255f01f5ba4572dd833bf925c86644', class: getIonMode$1(this) }, hAsync("slot", { key: 'bac55d84562c7d633022d7ccc9c41f3a8a75c962' })));
     }
     static get style() { return IonThumbnailStyle0; }
     static get cmpMeta() { return {
@@ -31941,9 +31941,9 @@ class Toast {
         if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
             printIonWarning('This toast is using start and end buttons with the stacked toast layout. We recommend following the best practice of using either start or end buttons with the stacked toast layout.', el);
         }
-        return (hAsync(Host, Object.assign({ key: '68c336f80af04ba484ca9899bae8f40c0d9b7691', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (hAsync(Host, Object.assign({ key: 'd42bc965eb7ec284eec1355f5f9b27c19e20617b', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: createColorClasses$1(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), hAsync("div", { key: '3483b188f14b700964a123997a60a43a2023a1b6', class: wrapperClass }, hAsync("div", { key: '1b88544a9b87253b364cbec6285625388979b560', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (hAsync("ion-icon", { key: 'bd1c42e3b14af66b880dfe283e3ae910075c0f70', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), hAsync("div", { key: 'a5ef6cdabc1f7c70d11a5f2a0abf8737fe7550e8', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
+            }, class: createColorClasses$1(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), hAsync("div", { key: '68fd532b24a55559713ee85979f0d9608196e572', class: wrapperClass }, hAsync("div", { key: 'ae726bae5975b90717341ffafe8f9c29964437c0', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (hAsync("ion-icon", { key: '3fc0ba9f21c0f8ca42e303b625c3d004cbfc38fd', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), hAsync("div", { key: '0c7c6e9ab4a8596bf6f22f10cfb6fc035a7a83fc', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -32163,7 +32163,7 @@ class Toggle {
         const value = this.getValue();
         const rtl = isRTL$1(el) ? 'rtl' : 'ltr';
         renderHiddenInput(true, el, name, checked ? value : '', disabled);
-        return (hAsync(Host, { key: '8f024fb0fbc2d4442be0574b03450426e8e4fc9e', onClick: this.onClick, class: createColorClasses$1(color, {
+        return (hAsync(Host, { key: '243dede2a82aa14da2b5106984249ac34342365e', onClick: this.onClick, class: createColorClasses$1(color, {
                 [mode]: true,
                 'in-item': hostContext('ion-item', el),
                 'toggle-activated': activated,
@@ -32173,10 +32173,10 @@ class Toggle {
                 [`toggle-alignment-${alignment}`]: alignment !== undefined,
                 [`toggle-label-placement-${labelPlacement}`]: true,
                 [`toggle-${rtl}`]: true,
-            }) }, hAsync("label", { key: '0492f009cd89755adf41f60925028002df0e67b1', class: "toggle-wrapper" }, hAsync("input", Object.assign({ key: 'fd98b23e8adfa2630878eddc30607a0b1bf9e798', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, this.inheritedAttributes)), hAsync("div", { key: 'bcbde055ad9450319ae41e8956a1e8cc0a7796a4', class: {
+            }) }, hAsync("label", { key: '9e7832c828b6cb94fdfe132d51b461fa52d85984', class: "toggle-wrapper" }, hAsync("input", Object.assign({ key: 'f1b80e7ab2a17be69dee0a0ed8d7282ea113895d', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, this.inheritedAttributes)), hAsync("div", { key: '5e05b8bf086d5f83e72f930bb24d723c43bfa9e6', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !this.hasLabel,
-            }, part: "label" }, hAsync("slot", { key: '7a6ea9515d454d80615f0622f361c5f91b41345c' })), hAsync("div", { key: '6d3670b81b8f809092c98b3f3b8e483ddf6a7cac', class: "native-wrapper" }, this.renderToggleControl()))));
+            }, part: "label" }, hAsync("slot", { key: 'd65bbe0d752208f4ff5d0190aaf5b21875162edc' })), hAsync("div", { key: 'a79e5cbc7dd4dfd34557c1d8a5ddb0516522b6b1', class: "native-wrapper" }, this.renderToggleControl()))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -32280,10 +32280,10 @@ class Toolbar {
         this.childrenStyles.forEach((value) => {
             Object.assign(childStyles, value);
         });
-        return (hAsync(Host, { key: '4bb3a55001408a3bdf033af76b9196cb96c07c09', class: Object.assign(Object.assign({}, childStyles), createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '09e563d51ee01a9be4d845a2f0f64ff621d5dd73', class: Object.assign(Object.assign({}, childStyles), createColorClasses$1(this.color, {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
-            })) }, hAsync("div", { key: '0891db157d6e028c6d03696f13fb510ea91b0296', class: "toolbar-background" }), hAsync("div", { key: '95fbc870d808f74af4bb18cd8f8ec8c7828a9e0b', class: "toolbar-container" }, hAsync("slot", { key: '84d4a9644660fe00ca085055ca8d12f3647531ad', name: "start" }), hAsync("slot", { key: 'fd361dc9c9979f59aed2fedcf94629506fae62b0', name: "secondary" }), hAsync("div", { key: '54d2b28616a4627c55766f66dc453707752758a6', class: "toolbar-content" }, hAsync("slot", { key: '8f65e0830cce7135640b90eb694e282cb7e5efd2' })), hAsync("slot", { key: 'c78be11a207c8674f222543646398636956087e6', name: "primary" }), hAsync("slot", { key: 'ab25e1601ccaa8cb0d81921b849bcb7402aa7826', name: "end" }))));
+            })) }, hAsync("div", { key: 'ed57f3b784863b63880e1b64a500c94db59bdb28', class: "toolbar-background" }), hAsync("div", { key: '21a8bd8a721a90542fa5b069f7f616b9b8dd8aad', class: "toolbar-container" }, hAsync("slot", { key: 'bbd435e48be8022c017490ec7354218b8667271c', name: "start" }), hAsync("slot", { key: 'ad6847c7ed2574c31f77b8ada0033b5be8d2069b', name: "secondary" }), hAsync("div", { key: 'ade21d93934b20d6387d7e962180087bc5f596c5', class: "toolbar-content" }, hAsync("slot", { key: '4a009a8345a43b3397b4370a4a7495774aba88e3' })), hAsync("slot", { key: '332b1d7f6d9a12fdcbf61ba41d97ff7751feb959', name: "primary" }), hAsync("slot", { key: 'bdea0ff4a283b9700e25348f57e6d62c471da06d', name: "end" }))));
     }
     get el() { return getElement(this); }
     static get style() { return {
@@ -32333,11 +32333,11 @@ class ToolbarTitle {
     render() {
         const mode = getIonMode$1(this);
         const size = this.getSize();
-        return (hAsync(Host, { key: '5a58dc437a6f4257244bbdd7e9a682a17d8c9a6b', class: createColorClasses$1(this.color, {
+        return (hAsync(Host, { key: '638800421eeb868c5bd6fc1eb8442c036c4bd16d', class: createColorClasses$1(this.color, {
                 [mode]: true,
                 [`title-${size}`]: true,
                 'title-rtl': document.dir === 'rtl',
-            }) }, hAsync("div", { key: '58682ea7b8f47a08adfad419b5c76b34784c6501', class: "toolbar-title" }, hAsync("slot", { key: '8a9248534e4c3076f5e2dfda38ef86069796851c' }))));
+            }) }, hAsync("div", { key: 'e9e32095992e9c668f6fb24a3484f36c86f1f2ce', class: "toolbar-title" }, hAsync("slot", { key: 'ee8179303624a818abd3c24cb3e73513d2c7960f' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {