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

package/dist/collection/components/searchbar/searchbar.js

@@ -378,8 +378,8 @@ export 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' && (h("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" }, h("div", { key: '3a516c3fdd35256eb79639fd340afcdd92cfd7aa', "aria-hidden": "true" }, mode === 'md' ? (h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
-        return (h(Host, { key: '34878db21f63a9bdffca0446d8ad5619ff04cac3', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses(this.color, {
+        const cancelButton = this.showCancelButton !== 'never' && (h("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" }, h("div", { key: '27191efe3a68b7fb95d3fe255976e51bd23a3f1d', "aria-hidden": "true" }, mode === 'md' ? (h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
+        return (h(Host, { key: 'a78bcd0b065c8541fa7823c152947547722f710b', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses(this.color, {
                 [mode]: true,
                 'searchbar-animated': animated,
                 'searchbar-disabled': this.disabled,
@@ -389,14 +389,14 @@ export class Searchbar {
                 'searchbar-has-focus': this.focused,
                 'searchbar-should-show-clear': this.shouldShowClearButton(),
                 'searchbar-should-show-cancel': this.shouldShowCancelButton(),
-            }) }, h("div", { key: 'faa7b011206a8359b1963368c65988e506b260cb', class: "searchbar-input-container" }, h("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, h("ion-icon", { key: '767dca971849f221dde220deae728b41bf764b98', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), h("button", { key: '9941b5de1ed9ebcf3e81de8e0731c09dea5a89d9', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
+            }) }, h("div", { key: '078379182377093c24f9478f6d5fd3fbd069f041', class: "searchbar-input-container" }, h("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, h("ion-icon", { key: 'f8a4c480aa139518b34498a765abe30db39e5105', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), h("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) }, h("ion-icon", { key: 'cb2b543d286373a84e2c6c2a959f92b045bbd7dd', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
+            }, onClick: () => this.onClearInput(true) }, h("ion-icon", { key: 'ad4ee1d23c6b53e90aa10e2050c1e4361167413f', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
     }
     static get is() { return "ion-searchbar"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/segment/segment.js

@@ -434,14 +434,14 @@ export class Segment {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: 'f1f7103b4c298e037df850ac809a1a7c6e9987a7', role: "tablist", onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: '09a493ee1d13e4ac49e93b029ef0b017db113d9d', role: "tablist", onClick: this.onClick, class: createColorClasses(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,
-            }) }, h("slot", { key: '6efdb318b13da8d21687084aa0761728fdf12579', onSlotchange: this.onSlottedItemsChange })));
+            }) }, h("slot", { key: 'f3984c69f44f5dec65668ee450787f3b78c30f43', onSlotchange: this.onSlottedItemsChange })));
     }
     static get is() { return "ion-segment"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segment-button/segment-button.js

@@ -78,7 +78,7 @@ export class SegmentButton {
         const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
         const mode = getIonMode(this);
         const hasSegmentColor = () => (segmentEl === null || segmentEl === void 0 ? void 0 : segmentEl.color) !== undefined;
-        return (h(Host, { key: '70cf5c7a3ae2620222c5250c644faf3cfc3b3e4e', class: {
+        return (h(Host, { key: '61df40030388f8c9780bbb06b8242a41ea328813', class: {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
@@ -94,10 +94,10 @@ export class SegmentButton {
                 'ion-activatable': true,
                 'ion-activatable-instant': true,
                 'ion-focusable': true,
-            } }, h("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), h("span", { key: '7d8feda840d389941cc693f500b5eba0b39b41da', class: "button-inner" }, h("slot", { key: 'd9ae1eec45db253cbf573d29cd545658dd595d87' })), mode === 'md' && h("ion-ripple-effect", { key: '49e6a16968709dc9b3fc77bc9fb99acb42fda88c' })), h("div", { key: '4e3ea0989ed5205dbb03586e4facb439b05a92de', part: "indicator", class: {
+            } }, h("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), h("span", { key: 'ab1da974b4496916bcd8aec30191d30195e3521a', class: "button-inner" }, h("slot", { key: 'dbbacd855740405ac018c92af645da4f3bac8740' })), mode === 'md' && h("ion-ripple-effect", { key: 'c02aba98ae37a03721aa704b2534198706f5bf17' })), h("div", { key: '826f9bb7e561c83aee0d83305351e6e95f6ed9a9', part: "indicator", class: {
                 'segment-button-indicator': true,
                 'segment-button-indicator-animated': true,
-            } }, h("div", { key: '65c72a151080998c1e548c87d4d4ebd5c7dda72f', part: "indicator-background", class: "segment-button-indicator-background" }))));
+            } }, h("div", { key: 'c57b0ad417b1f0150d3e3c90f49c6619819237f8', part: "indicator-background", class: "segment-button-indicator-background" }))));
     }
     static get is() { return "ion-segment-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select/select.js

@@ -623,7 +623,7 @@ export class Select {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
-        return (h(Host, { key: '73c571c1f8468e1c3f4fe02fbbb33ba9cbc8e989', onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: '4944d9a179ff9bf9c1cafd97111be3ab5fcad5f5', onClick: this.onClick, class: createColorClasses(this.color, {
                 [mode]: true,
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', el),
@@ -639,7 +639,7 @@ export class Select {
                 [`select-justify-${justify}`]: justifyEnabled,
                 [`select-shape-${shape}`]: shape !== undefined,
                 [`select-label-placement-${labelPlacement}`]: true,
-            }) }, h("label", { key: '2b08538cba0b9f747541d57ac18fb6a1ea658878', class: "select-wrapper", id: "select-label" }, this.renderLabelContainer(), h("div", { key: '33f54373bcb02c72a9d0af2efffebc27ee2c69fe', class: "select-wrapper-inner" }, h("slot", { key: 'd1c93aec99dc1cd6410f93309cef615fe04b541b', name: "start" }), h("div", { key: '493d1a3cad9565516f855bef75685b020785ffd3', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: '353a3ee5635f8a8f3be411efd6caef6c2ad74a89', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'fd5f85555db02affe954f9f4f2876ac8fe676234', class: "select-highlight" }))));
+            }) }, h("label", { key: 'fb46a9a64d453fb2a4633c0cb0ffbe4e1a96f6fc', class: "select-wrapper", id: "select-label" }, this.renderLabelContainer(), h("div", { key: 'e1daec1284b45633d1d9357afe2d43867f405867', class: "select-wrapper-inner" }, h("slot", { key: '14ea11c993d8277d81f0e514dc049af5b12d9471', name: "start" }), h("div", { key: '40ea56ec358c10b84a2978ba43c6498a6a52853c', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: '5ec8b23ced33853f045fe5de20bc4a15d5b31404', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'fc903843063a2fb464dee5002fab9397cfc5f8f1', class: "select-highlight" }))));
     }
     static get is() { return "ion-select"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select-option/select-option.js

@@ -10,7 +10,7 @@ export class SelectOption {
         this.value = undefined;
     }
     render() {
-        return h(Host, { key: 'ba5a9c695c53fe0802af11a49f4305a9b8f71773', role: "option", id: this.inputId, class: getIonMode(this) });
+        return h(Host, { key: '153935936f9a981f379a1aa99a055c551909b1fc', role: "option", id: this.inputId, class: getIonMode(this) });
     }
     static get is() { return "ion-select-option"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select-popover/select-popover.js

@@ -102,7 +102,7 @@ export class SelectPopover {
     render() {
         const { header, message, options, subHeader } = this;
         const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
-        return (h(Host, { key: '302553a2eec4d1442751b8af28b7c9bd3487fd5d', class: getIonMode(this) }, h("ion-list", { key: '39ae8579e6fe3bae2c7504147268ad5c82fd27e6' }, header !== undefined && h("ion-list-header", { key: 'e0e6686380d188f46c593e1bb25287dcf08c75c2' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: '8a2d8652db269593c0ba7d767277e12c2b06144d' }, h("ion-label", { key: 'a30cc0ecf95d5bdd6421ee1683922c1b853e98ea', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'c298459ca450123808a08d65660825b2c26d00e5' }, subHeader), message !== undefined && h("p", { key: 'ed895fbaec020e809021138401341b6fd7675035' }, message)))), this.renderOptions(options))));
+        return (h(Host, { key: '6018658d32978124074984f13ce2e58be0e3e576', class: getIonMode(this) }, h("ion-list", { key: 'e1bf0601e9ea4b17cfe11ff6834baee52a75ad72' }, header !== undefined && h("ion-list-header", { key: '277a8426c43a698c330715a32858669666cd43bd' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: '9ef017fcf57ab00f456cfca4e096174e89a08749' }, h("ion-label", { key: 'e3840cabfc7ba50cb3e224d5b54015092d86f092', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'acfc22382f238da790e78a1404a6ac061ff866ad' }, subHeader), message !== undefined && h("p", { key: '95b675cd72607372f63ba729eaa26161f69de5dd' }, message)))), this.renderOptions(options))));
     }
     static get is() { return "ion-select-popover"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/skeleton-text/skeleton-text.js

@@ -25,11 +25,11 @@ export 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(this);
-        return (h(Host, { key: '1a3e78e9a6f740d609d1f0b7a16cb6eff4a2d617', class: {
+        return (h(Host, { key: '7b38f6a10dca8a32792b14f284dfd79dfe1cd383', class: {
                 [mode]: true,
                 'skeleton-text-animated': animated,
                 'in-media': inMedia,
-            } }, h("span", { key: 'be3eabe196ec6e8ec19857375ba30f4c8aa58e7f' }, "\u00A0")));
+            } }, h("span", { key: 'e7c31e8b979292b923ef7f2f5fbfd3a64f00953b' }, "\u00A0")));
     }
     static get is() { return "ion-skeleton-text"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spinner/spinner.js

@@ -39,7 +39,7 @@ export class Spinner {
                 svgs.push(buildLine(spinner, duration, i, spinner.lines));
             }
         }
-        return (h(Host, { key: '50cbaed55eeab15292447d106a80b93db4cb40de', class: createColorClasses(self.color, {
+        return (h(Host, { key: 'ca7ed6a7ab4ee000db78b248e4db28f024a3e732', class: createColorClasses(self.color, {
                 [mode]: true,
                 [`spinner-${spinnerName}`]: true,
                 'spinner-paused': self.paused || config.getBoolean('_testing'),

package/dist/collection/components/split-pane/split-pane.js

@@ -118,12 +118,12 @@ export class SplitPane {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: 'd54c356cd4bff7e55325160882dea8249f47f388', class: {
+        return (h(Host, { key: 'f13d1621f50d9cf09657e09ab56a09999135dfbb', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`split-pane-${mode}`]: true,
                 'split-pane-visible': this.visible,
-            } }, h("slot", { key: 'af62690d0fd686cfbd29d888c79eda9001f13e2f' })));
+            } }, h("slot", { key: 'b986420fbb0b9aeb92b6c14c594148958bca66c4' })));
     }
     static get is() { return "ion-split-pane"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tab/tab.js

@@ -48,10 +48,10 @@ export class Tab {
     }
     render() {
         const { tab, active, component } = this;
-        return (h(Host, { key: '46d5498418f5379861c3d7465e8021dec45f1200', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (h(Host, { key: '50dd3d7e0877fa4d4394c8ffd9b97e874b07361a', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'ion-page': component === undefined,
                 'tab-hidden': !active,
-            } }, h("slot", { key: 'b45045dccb87dfe75e3f5a5a474bb48b6c98e922' })));
+            } }, h("slot", { key: '3c11ae1d402e65019d9958dc2a379bd2e15b37a0' })));
     }
     static get is() { return "ion-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tab-bar/tab-bar.js

@@ -51,11 +51,11 @@ export class TabBar {
         const { color, translucent, keyboardVisible } = this;
         const mode = getIonMode(this);
         const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
-        return (h(Host, { key: '3a8595dd83f89e8319471a7a7f9f64b2565b384c', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
+        return (h(Host, { key: '37fc1d9e065a2abc6f3f549f3be3dd90035665f1', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
                 [mode]: true,
                 'tab-bar-translucent': translucent,
                 'tab-bar-hidden': shouldHide,
-            }) }, h("slot", { key: '8b65eceb922f6abfa15f41046261586fb94b981f' })));
+            }) }, h("slot", { key: 'd62ae7247b77df6175364ed1e28986b631f3a9f4' })));
     }
     static get is() { return "ion-tab-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tab-button/tab-button.js

@@ -70,7 +70,7 @@ export class TabButton {
             rel,
             target,
         };
-        return (h(Host, { key: '4b528ce31f67e10ad849e0c99bd034bba675c227', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (h(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,
@@ -82,7 +82,7 @@ export class TabButton {
                 'ion-activatable': true,
                 'ion-selectable': true,
                 'ion-focusable': true,
-            } }, h("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), h("span", { key: '2c628e8f1ebc129f84876c01530468cb97d8bf3a', class: "button-inner" }, h("slot", { key: '8052a171d197a7de1a7eb12b091c35f73ae1ee21' })), mode === 'md' && h("ion-ripple-effect", { key: '4186bdb5ed045ec16f495a14fa30ac864c576227', type: "unbounded" }))));
+            } }, h("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), h("span", { key: 'c8597bc938d9e335b5a352478083ee2c073863b7', class: "button-inner" }, h("slot", { key: '8a098c255fcc1c96177150c613a39526df9308d5' })), mode === 'md' && h("ion-ripple-effect", { key: '0dc91b68002fca4577a182fa391aad585fc29f68', type: "unbounded" }))));
     }
     static get is() { return "ion-tab-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/tabs.js

@@ -145,7 +145,7 @@ export class Tabs {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
     render() {
-        return (h(Host, { key: 'eb094c9bd15b7777c53bd0bd6d225784fa472849', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: 'a516ca6915bf26e77eeeb0ff684c4fcc7d4420a7', name: "top" }), h("div", { key: 'dd2a32a072d77afe216abc4958c1d686405fb780', class: "tabs-inner" }, h("slot", { key: '222c20ba862068f5c78e7bbef4fa213499fb2fa5' })), h("slot", { key: '3e76dcb1b21873aa137d095c56131514054ead3a', name: "bottom" })));
+        return (h(Host, { key: 'f9844fac600af29c7b916a3cc444c659a4b78101', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: 'ad0af6c9b8531b7f263506839d5738620d03279d', name: "top" }), h("div", { key: 'df6808235d626c88c7304fec12e1e9dbfce40417', class: "tabs-inner" }, h("slot", { key: '9723d085d8107adacf61f1ef1550304ed89f46a7' })), h("slot", { key: 'ada75b7ca121fdcecc6da21e2c81d486b5fe93b2', name: "bottom" })));
     }
     static get is() { return "ion-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/text/text.js

@@ -13,9 +13,9 @@ export class Text {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '4b76333b1ea5cab134b9dc1f5670c0d5a253fc32', class: createColorClasses(this.color, {
+        return (h(Host, { key: '2dfb2fb2732e675b116ffb00b85612b759bf0a8d', class: createColorClasses(this.color, {
                 [mode]: true,
-            }) }, h("slot", { key: '3dee5f16bc58b3d92547d910bd4f441a00ce2039' })));
+            }) }, h("slot", { key: 'cdd8504c81bd1d3eac4dfb95e066ecee6b1158de' })));
     }
     static get is() { return "ion-text"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/textarea/textarea.js

@@ -359,7 +359,7 @@ export class Textarea {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (h(Host, { key: '37595a18d77dea1a337ac1c672e5f08a4128111d', class: createColorClasses(this.color, {
+        return (h(Host, { key: '8c2ec8899cf29f34ce29b5f9a250f363922bb7a0', class: createColorClasses(this.color, {
                 [mode]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -368,7 +368,7 @@ export class Textarea {
                 [`textarea-shape-${shape}`]: shape !== undefined,
                 [`textarea-label-placement-${labelPlacement}`]: true,
                 'textarea-disabled': disabled,
-            }) }, h("label", { key: '67342758743e5a40448a32ff695876d39778621f', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: 'a994be8264bf5652811cf816d79a04178954e83f', class: "textarea-wrapper-inner" }, h("div", { key: 'e09c93ebcd5b3d227d51e682ca23dfc7fd7027ad', class: "start-slot-wrapper" }, h("slot", { key: 'd39758f21f19ae70aea21e9a9a7b7c20991fe593', name: "start" })), h("div", { key: '6a4e10e53de4bb235ee30def4c9ae5bdee888816', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("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)), h("div", { key: 'a66aa2d2bc4778a0bec56a8b9ec9052a832eb3b2', class: "end-slot-wrapper" }, h("slot", { key: '8e6a90b4475de32e23afc593da4108610dcca663', name: "end" }))), shouldRenderHighlight && h("div", { key: '6da03205a8daff45581b20f0af3938634a9d5f8c', class: "textarea-highlight" })), this.renderBottomContent()));
+            }) }, h("label", { key: '585df696cd803471d11e3ab889e1cf14623901fe', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: '2867aa6c5cc9b5112b007d212690239bf82d1b31', class: "textarea-wrapper-inner" }, h("div", { key: '73e8de11eda0750481485df6573d9605d7055573', class: "start-slot-wrapper" }, h("slot", { key: '9519fda2283b01e9897c1003898caa4af65ae769', name: "start" })), h("div", { key: 'a16958a1e4cb6a2b12aea13a6902780bd3f6632d', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("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)), h("div", { key: '5f7e30b8bba71faa93aedff3351861cc7fd13c22', class: "end-slot-wrapper" }, h("slot", { key: '763f49e617daab4269a85d8d8a76cc46ea1c68c8', name: "end" }))), shouldRenderHighlight && h("div", { key: '2e8528dd95126ac08aa5bd171ec186fab222f930', class: "textarea-highlight" })), this.renderBottomContent()));
     }
     static get is() { return "ion-textarea"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/thumbnail/thumbnail.js

@@ -5,7 +5,7 @@ import { Host, h } from "@stencil/core";
 import { getIonMode } from "../../global/ionic-global";
 export class Thumbnail {
     render() {
-        return (h(Host, { key: 'ea55000055f941b0c79561e8934be6242ec8e114', class: getIonMode(this) }, h("slot", { key: 'a4f934f442797f5c66a77e0ef8920fdd07c204f2' })));
+        return (h(Host, { key: 'a7ed84e603255f01f5ba4572dd833bf925c86644', class: getIonMode(this) }, h("slot", { key: 'bac55d84562c7d633022d7ccc9c41f3a8a75c962' })));
     }
     static get is() { return "ion-thumbnail"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/title/title.js

@@ -27,11 +27,11 @@ export class ToolbarTitle {
     render() {
         const mode = getIonMode(this);
         const size = this.getSize();
-        return (h(Host, { key: '5a58dc437a6f4257244bbdd7e9a682a17d8c9a6b', class: createColorClasses(this.color, {
+        return (h(Host, { key: '638800421eeb868c5bd6fc1eb8442c036c4bd16d', class: createColorClasses(this.color, {
                 [mode]: true,
                 [`title-${size}`]: true,
                 'title-rtl': document.dir === 'rtl',
-            }) }, h("div", { key: '58682ea7b8f47a08adfad419b5c76b34784c6501', class: "toolbar-title" }, h("slot", { key: '8a9248534e4c3076f5e2dfda38ef86069796851c' }))));
+            }) }, h("div", { key: 'e9e32095992e9c668f6fb24a3484f36c86f1f2ce', class: "toolbar-title" }, h("slot", { key: 'ee8179303624a818abd3c24cb3e73513d2c7960f' }))));
     }
     static get is() { return "ion-title"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toast/toast.js

@@ -391,9 +391,9 @@ export 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 (h(Host, Object.assign({ key: '68c336f80af04ba484ca9899bae8f40c0d9b7691', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'd42bc965eb7ec284eec1355f5f9b27c19e20617b', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '3483b188f14b700964a123997a60a43a2023a1b6', class: wrapperClass }, h("div", { key: '1b88544a9b87253b364cbec6285625388979b560', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'bd1c42e3b14af66b880dfe283e3ae910075c0f70', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("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(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '68fd532b24a55559713ee85979f0d9608196e572', class: wrapperClass }, h("div", { key: 'ae726bae5975b90717341ffafe8f9c29964437c0', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: '3fc0ba9f21c0f8ca42e303b625c3d004cbfc38fd', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("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')))));
     }
     static get is() { return "ion-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggle/toggle.js

@@ -157,7 +157,7 @@ export class Toggle {
         const value = this.getValue();
         const rtl = isRTL(el) ? 'rtl' : 'ltr';
         renderHiddenInput(true, el, name, checked ? value : '', disabled);
-        return (h(Host, { key: '8f024fb0fbc2d4442be0574b03450426e8e4fc9e', onClick: this.onClick, class: createColorClasses(color, {
+        return (h(Host, { key: '243dede2a82aa14da2b5106984249ac34342365e', onClick: this.onClick, class: createColorClasses(color, {
                 [mode]: true,
                 'in-item': hostContext('ion-item', el),
                 'toggle-activated': activated,
@@ -167,10 +167,10 @@ export class Toggle {
                 [`toggle-alignment-${alignment}`]: alignment !== undefined,
                 [`toggle-label-placement-${labelPlacement}`]: true,
                 [`toggle-${rtl}`]: true,
-            }) }, h("label", { key: '0492f009cd89755adf41f60925028002df0e67b1', class: "toggle-wrapper" }, h("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)), h("div", { key: 'bcbde055ad9450319ae41e8956a1e8cc0a7796a4', class: {
+            }) }, h("label", { key: '9e7832c828b6cb94fdfe132d51b461fa52d85984', class: "toggle-wrapper" }, h("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)), h("div", { key: '5e05b8bf086d5f83e72f930bb24d723c43bfa9e6', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !this.hasLabel,
-            }, part: "label" }, h("slot", { key: '7a6ea9515d454d80615f0622f361c5f91b41345c' })), h("div", { key: '6d3670b81b8f809092c98b3f3b8e483ddf6a7cac', class: "native-wrapper" }, this.renderToggleControl()))));
+            }, part: "label" }, h("slot", { key: 'd65bbe0d752208f4ff5d0190aaf5b21875162edc' })), h("div", { key: 'a79e5cbc7dd4dfd34557c1d8a5ddb0516522b6b1', class: "native-wrapper" }, this.renderToggleControl()))));
     }
     static get is() { return "ion-toggle"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toolbar/toolbar.js

@@ -62,10 +62,10 @@ export class Toolbar {
         this.childrenStyles.forEach((value) => {
             Object.assign(childStyles, value);
         });
-        return (h(Host, { key: '4bb3a55001408a3bdf033af76b9196cb96c07c09', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
+        return (h(Host, { key: '09e563d51ee01a9be4d845a2f0f64ff621d5dd73', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
-            })) }, h("div", { key: '0891db157d6e028c6d03696f13fb510ea91b0296', class: "toolbar-background" }), h("div", { key: '95fbc870d808f74af4bb18cd8f8ec8c7828a9e0b', class: "toolbar-container" }, h("slot", { key: '84d4a9644660fe00ca085055ca8d12f3647531ad', name: "start" }), h("slot", { key: 'fd361dc9c9979f59aed2fedcf94629506fae62b0', name: "secondary" }), h("div", { key: '54d2b28616a4627c55766f66dc453707752758a6', class: "toolbar-content" }, h("slot", { key: '8f65e0830cce7135640b90eb694e282cb7e5efd2' })), h("slot", { key: 'c78be11a207c8674f222543646398636956087e6', name: "primary" }), h("slot", { key: 'ab25e1601ccaa8cb0d81921b849bcb7402aa7826', name: "end" }))));
+            })) }, h("div", { key: 'ed57f3b784863b63880e1b64a500c94db59bdb28', class: "toolbar-background" }), h("div", { key: '21a8bd8a721a90542fa5b069f7f616b9b8dd8aad', class: "toolbar-container" }, h("slot", { key: 'bbd435e48be8022c017490ec7354218b8667271c', name: "start" }), h("slot", { key: 'ad6847c7ed2574c31f77b8ada0033b5be8d2069b', name: "secondary" }), h("div", { key: 'ade21d93934b20d6387d7e962180087bc5f596c5', class: "toolbar-content" }, h("slot", { key: '4a009a8345a43b3397b4370a4a7495774aba88e3' })), h("slot", { key: '332b1d7f6d9a12fdcbf61ba41d97ff7751feb959', name: "primary" }), h("slot", { key: 'bdea0ff4a283b9700e25348f57e6d62c471da06d', name: "end" }))));
     }
     static get is() { return "ion-toolbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-10-15T00:17:34",
+  "timestamp": "2024-10-15T15:53:05",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.20.0",

package/dist/esm/ion-action-sheet.entry.js

@@ -298,10 +298,10 @@ const ActionSheet = class {
         const headerID = `action-sheet-${overlayIndex}-header`;
         return (h(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 }), h("ion-backdrop", { key: '23344a9221a2e6720d7b9de5249dc37256cafa7b', tappable: this.backdropDismiss }), h("div", { key: 'd46361bb5cdc32a7922dcf76b566f358a6174bfa', tabindex: "0" }), h("div", { key: '136c3f2e77c8a2eac8e9ae4bb13d735e1d62598d', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '6168ea8b2be42020b2edeb8ff3a0f3d1254be37a', class: "action-sheet-container" }, h("div", { key: '29b9e6619dc54574733a704d6bf885839151bd84', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (h("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 }), h("ion-backdrop", { key: '23344a9221a2e6720d7b9de5249dc37256cafa7b', tappable: this.backdropDismiss }), h("div", { key: 'd46361bb5cdc32a7922dcf76b566f358a6174bfa', tabindex: "0" }), h("div", { key: '136c3f2e77c8a2eac8e9ae4bb13d735e1d62598d', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: 'a1042362d7f96fcc2e5a9917dd3913ccb4cfb5e7', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (h("div", { key: 'b28fa57fac9bcb304d87e409e84c028c5b8e4f8d', id: headerID, class: {
                 'action-sheet-title': true,
                 'action-sheet-has-sub-title': this.subHeader !== undefined,
-            } }, header, this.subHeader && h("div", { key: '6d888219145824fd36cdfe0d3c8388bbf2769777', class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b), disabled: b.disabled, tabIndex: b.disabled ? -1 : 0 }), h("span", { class: "action-sheet-button-inner" }, b.icon && h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && h("ion-ripple-effect", null))))), cancelButton && (h("div", { key: '2c01bb727d9339371cf82393be2f7c52eb70c321', class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({ key: '3df9aaaa63848407d3d012467ee8dab75e6aa274' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { key: '1bd3a70026596d857df242fe89ec83cb492f2611', class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { key: 'a654c83116c1174d4bb64b69ff20279a9255c479', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", { key: '9a4e60d7667157835f067127a85c9d7b97445803' })))))), h("div", { key: '5a1fc3ef1572dc871c834175f561af151a57f7e7', tabindex: "0" })));
+            } }, header, this.subHeader && h("div", { key: '5d6a1d0da6d452124edaa5e6942837397b5e4144', class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b), disabled: b.disabled }), h("span", { class: "action-sheet-button-inner" }, b.icon && h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && h("ion-ripple-effect", null))))), cancelButton && (h("div", { key: '88b321544967dc609a4251551644742277571426', class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({ key: '653a18195272fff6e7cacbeacddbc27ba17dcdcc' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { key: '179d1a0df7902e8b1c61ba8a2535a964095925b6', class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { key: '54bc72244484fa41b81cf75734731b437883834b', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", { key: 'ebf43217bbc385bfdc7eefb05638df9fc93c311d' }))))), h("div", { key: 'c14d5e83f62e1406e2ff2023596bcac1db348af6', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ion-alert.entry.js

@@ -494,9 +494,9 @@ const Alert = class {
          * If neither is defined, don't set aria-labelledby.
          */
         const ariaLabelledBy = header ? hdrId : subHeader ? subHdrId : null;
-        return (h(Host, Object.assign({ key: 'c7d53f48b359f2bc3480a2e1ba34948fc9378fb0', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(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 }), h("ion-backdrop", { key: '18c7e6b5d63435d9a6a82bda951158e7e1af6e92', tappable: this.backdropDismiss }), h("div", { key: 'e35e1a4b81286976c8a6bab570c986f3196b21f4', tabindex: "0" }), h("div", { key: '9089864c80d96ed834bf723f3de863cf1c4a5b97', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: 'dd600f02c84352059c6cdf98821b9c9a831bcdcb', class: "alert-head" }, header && (h("h2", { key: '11afb605e1ccefc889fbdd2533d491bea8fbf183', id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { key: 'e53b0613d09d26e5a2cd7c9c6e63ec2535625ce5', id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("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 }), h("ion-backdrop", { key: '80f013f82366c791de7e6cbfdc2e6a626e3e0856', tappable: this.backdropDismiss }), h("div", { key: '9b047740bfe248e3070fd75ff251585152fef5b4', tabindex: "0" }), h("div", { key: '4c01326962b7cb8d2e8b6a95df441f8d97819262', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: 'd8938474cd117318c50ff4d6f632175c97d7601c', class: "alert-head" }, header && (h("h2", { key: '36105d7b4380b474fc1a2a7e2226fe8f51907fb6', id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { key: '20f4cd8ece278d98f1f1840b8436f66e352533ff', id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: '91ee9e638045fc10f7e41fd40a48e56149b58937', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ion-app_8.entry.js

@@ -81,7 +81,7 @@ const App = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: 'e95cdeb2709edbc74f4e6ebf77cb110154605b72', class: {
+        return (h(Host, { key: '00c2095a8306a9f4cda622ecab034ce1719bcb50', class: {
                 [mode]: true,
                 'ion-page': true,
                 'force-statusbar-padding': config.getBoolean('_forceStatusbarPadding'),
@@ -131,10 +131,10 @@ const Buttons = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '4e5ce9abb3f56e8c91e3eb58c2819300e61eba24', class: {
+        return (h(Host, { key: 'b80d227f62086dffcf39b72475baf0e3e227fe6c', class: {
                 [mode]: true,
                 ['buttons-collapse']: this.collapse,
-            } }, h("slot", { key: 'f2f360ec888b6e946b512fed07431fab47c61482' })));
+            } }, h("slot", { key: '31eda2f4a6686c86b2614401c7c81a26b4a77d76' })));
     }
 };
 Buttons.style = {
@@ -475,7 +475,7 @@ const Content = class {
         const forceOverscroll = this.shouldForceOverscroll();
         const transitionShadow = mode === 'ios';
         this.resize();
-        return (h(Host, Object.assign({ key: '92a7cbc2e9c812930f4231bd846411933a5dded6', role: isMainContent ? 'main' : undefined, class: createColorClasses(this.color, {
+        return (h(Host, Object.assign({ key: '265de111a33510d3eba45da107e59e628228da9c', role: isMainContent ? 'main' : undefined, class: createColorClasses(this.color, {
                 [mode]: true,
                 'content-sizing': hostContext('ion-popover', this.el),
                 overscroll: forceOverscroll,
@@ -483,12 +483,12 @@ const Content = class {
             }), style: {
                 '--offset-top': `${this.cTop}px`,
                 '--offset-bottom': `${this.cBottom}px`,
-            } }, inheritedAttributes), h("div", { key: '52498d8874b9944b8245e448ea9dfc75b3929c2d', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), fixedSlotPlacement === 'before' ? h("slot", { name: "fixed" }) : null, h("div", { key: '00e157a53485b285300404178436276afceb63f5', class: {
+            } }, inheritedAttributes), h("div", { key: '24e879228c51dfedd7f9e7699b50d683d01c0254', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), fixedSlotPlacement === 'before' ? h("slot", { name: "fixed" }) : null, h("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" }, h("slot", { key: '8522320514a2e8a63f7dc9ade6c1fb3fb00f454e' })), transitionShadow ? (h("div", { class: "transition-effect" }, h("div", { class: "transition-cover" }), h("div", { class: "transition-shadow" }))) : null, fixedSlotPlacement === 'after' ? h("slot", { name: "fixed" }) : null));
+            }, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, h("slot", { key: 'b70e63b2517abe078405679a13582021ba953b9c' })), transitionShadow ? (h("div", { class: "transition-effect" }, h("div", { class: "transition-cover" }), h("div", { class: "transition-shadow" }))) : null, fixedSlotPlacement === 'after' ? h("slot", { name: "fixed" }) : null));
     }
     get el() { return getElement(this); }
 };
@@ -656,7 +656,7 @@ const Footer = class {
         const mode = getIonMode(this);
         const tabs = this.el.closest('ion-tabs');
         const tabBar = tabs === null || tabs === void 0 ? void 0 : tabs.querySelector(':scope > ion-tab-bar');
-        return (h(Host, { key: '5da19dc38ba73e1ddfd1bef3ebd485105d77c751', role: "contentinfo", class: {
+        return (h(Host, { key: 'bc89fabb9ddd59ba3c680ace612d1b9f8eb04b5d', role: "contentinfo", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`footer-${mode}`]: true,
@@ -664,7 +664,7 @@ const Footer = class {
                 [`footer-translucent-${mode}`]: translucent,
                 ['footer-toolbar-padding']: !this.keyboardVisible && (!tabBar || tabBar.slot !== 'bottom'),
                 [`footer-collapse-${collapse}`]: collapse !== undefined,
-            } }, mode === 'ios' && translucent && h("div", { key: 'fafad08090a33d8c4e8a5b63d61929dcb89aab47', class: "footer-background" }), h("slot", { key: 'e0a443d346afa55e4317c0bc1263fdbe3c619559' })));
+            } }, mode === 'ios' && translucent && h("div", { key: '3066c23f89ac0ee60d091c28f3377790308e96bd', class: "footer-background" }), h("slot", { key: 'ee843100a3ee759a5217b1264fb6a5c8f39099ea' })));
     }
     get el() { return getElement(this); }
 };
@@ -986,14 +986,14 @@ const Header = class {
         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 (h(Host, Object.assign({ key: 'c687314ef290793a9d633ad20cfc5eeb47621e31', role: roleType, class: {
+        return (h(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 && h("div", { key: 'b429996046082405a91e7c23f95516db0b736f12', class: "header-background" }), h("slot", { key: 'e17a8965f8d3a33c1bfcb056c153d8242e5229fa' })));
+            } }, inheritedAttributes), mode === 'ios' && translucent && h("div", { key: 'f6c96a94bfbac645acef00598fee3d0658d0ce0f', class: "header-background" }), h("slot", { key: '1d8db34d84e5a361cdab23c17e52ca106b9cc2f9' })));
     }
     get el() { return getElement(this); }
 };
@@ -1177,7 +1177,7 @@ const RouterOutlet = class {
         return true;
     }
     render() {
-        return h("slot", { key: '8279a453c66a766e6e383ff59842b4ae070c13a9' });
+        return h("slot", { key: '5f2be0c7d417dd8421efdd85730afa9e781713b2' });
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -1217,11 +1217,11 @@ const ToolbarTitle = class {
     render() {
         const mode = getIonMode(this);
         const size = this.getSize();
-        return (h(Host, { key: '5a58dc437a6f4257244bbdd7e9a682a17d8c9a6b', class: createColorClasses(this.color, {
+        return (h(Host, { key: '638800421eeb868c5bd6fc1eb8442c036c4bd16d', class: createColorClasses(this.color, {
                 [mode]: true,
                 [`title-${size}`]: true,
                 'title-rtl': document.dir === 'rtl',
-            }) }, h("div", { key: '58682ea7b8f47a08adfad419b5c76b34784c6501', class: "toolbar-title" }, h("slot", { key: '8a9248534e4c3076f5e2dfda38ef86069796851c' }))));
+            }) }, h("div", { key: 'e9e32095992e9c668f6fb24a3484f36c86f1f2ce', class: "toolbar-title" }, h("slot", { key: 'ee8179303624a818abd3c24cb3e73513d2c7960f' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -1289,10 +1289,10 @@ const Toolbar = class {
         this.childrenStyles.forEach((value) => {
             Object.assign(childStyles, value);
         });
-        return (h(Host, { key: '4bb3a55001408a3bdf033af76b9196cb96c07c09', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
+        return (h(Host, { key: '09e563d51ee01a9be4d845a2f0f64ff621d5dd73', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
-            })) }, h("div", { key: '0891db157d6e028c6d03696f13fb510ea91b0296', class: "toolbar-background" }), h("div", { key: '95fbc870d808f74af4bb18cd8f8ec8c7828a9e0b', class: "toolbar-container" }, h("slot", { key: '84d4a9644660fe00ca085055ca8d12f3647531ad', name: "start" }), h("slot", { key: 'fd361dc9c9979f59aed2fedcf94629506fae62b0', name: "secondary" }), h("div", { key: '54d2b28616a4627c55766f66dc453707752758a6', class: "toolbar-content" }, h("slot", { key: '8f65e0830cce7135640b90eb694e282cb7e5efd2' })), h("slot", { key: 'c78be11a207c8674f222543646398636956087e6', name: "primary" }), h("slot", { key: 'ab25e1601ccaa8cb0d81921b849bcb7402aa7826', name: "end" }))));
+            })) }, h("div", { key: 'ed57f3b784863b63880e1b64a500c94db59bdb28', class: "toolbar-background" }), h("div", { key: '21a8bd8a721a90542fa5b069f7f616b9b8dd8aad', class: "toolbar-container" }, h("slot", { key: 'bbd435e48be8022c017490ec7354218b8667271c', name: "start" }), h("slot", { key: 'ad6847c7ed2574c31f77b8ada0033b5be8d2069b', name: "secondary" }), h("div", { key: 'ade21d93934b20d6387d7e962180087bc5f596c5', class: "toolbar-content" }, h("slot", { key: '4a009a8345a43b3397b4370a4a7495774aba88e3' })), h("slot", { key: '332b1d7f6d9a12fdcbf61ba41d97ff7751feb959', name: "primary" }), h("slot", { key: 'bdea0ff4a283b9700e25348f57e6d62c471da06d', name: "end" }))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/ion-avatar_3.entry.js

@@ -16,7 +16,7 @@ const Avatar = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: 'dc1e3cd535e419eebe5599574fd2393ebfde8bbc', class: getIonMode(this) }, h("slot", { key: 'edb8441c063ea592b41345ea97d88ecd90cb3052' })));
+        return (h(Host, { key: 'c914962b1c2af1f7643937821ac3736ebe07fa92', class: getIonMode(this) }, h("slot", { key: '4b87a204138a4de14ecd1d4332d99beb114eb29f' })));
     }
 };
 Avatar.style = {
@@ -37,9 +37,9 @@ const Badge = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '1253618692342bcf9487188402dc3d49ae0de480', class: createColorClasses(this.color, {
+        return (h(Host, { key: '0067922ba0b10a35ea1ffb4fcfcbccf429c158d7', class: createColorClasses(this.color, {
                 [mode]: true,
-            }) }, h("slot", { key: '71d65e203965ea37b94504a8a0a96beb52d4e356' })));
+            }) }, h("slot", { key: '6bb7ff181ba1c514da1075f2c9648b91f89da80e' })));
     }
 };
 Badge.style = {
@@ -55,7 +55,7 @@ const Thumbnail = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: 'ea55000055f941b0c79561e8934be6242ec8e114', class: getIonMode(this) }, h("slot", { key: 'a4f934f442797f5c66a77e0ef8920fdd07c204f2' })));
+        return (h(Host, { key: 'a7ed84e603255f01f5ba4572dd833bf925c86644', class: getIonMode(this) }, h("slot", { key: 'bac55d84562c7d633022d7ccc9c41f3a8a75c962' })));
     }
 };
 Thumbnail.style = IonThumbnailStyle0;

package/dist/esm/ion-back-button.entry.js

@@ -72,7 +72,7 @@ const BackButton = class {
         const showBackButton = defaultHref !== undefined;
         const mode = getIonMode(this);
         const ariaLabel = inheritedAttributes['aria-label'] || backButtonText || 'back';
-        return (h(Host, { key: '8351c93a1812c94c979fb115f07a9ad7b3152188', onClick: this.onClick, class: createColorClasses(color, {
+        return (h(Host, { key: 'ad3f81e3004b50a381c11f776aca6bf79bf3bc05', onClick: this.onClick, class: createColorClasses(color, {
                 [mode]: true,
                 button: true, // ion-buttons target .button
                 'back-button-disabled': disabled,
@@ -82,7 +82,7 @@ const BackButton = class {
                 'ion-activatable': true,
                 'ion-focusable': true,
                 'show-back-button': showBackButton,
-            }) }, h("button", { key: '991b8baa784dbfbdf8d3581cbbf6a858ac1f1e6e', type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, h("span", { key: '929fcd83a4fdb00cf97ca803f234719171602a5e', class: "button-inner" }, backButtonIcon && (h("ion-icon", { key: '0c10d412ae8342d96f221e626b421c9abadac748', part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false, "flip-rtl": icon === undefined })), backButtonText && (h("span", { key: '96f505880a80f36ee8b8c78268b450f3629ee613', part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText))), mode === 'md' && h("ion-ripple-effect", { key: '0aecf5d415c608069eb1a10043530bd0929b6383', type: this.rippleType }))));
+            }) }, h("button", { key: 'a6b5657680df9140622a0f19c955bc1af3e89241', type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, h("span", { key: '9b4dd3a7270816161c3cffac4bd1b0983491fd39', class: "button-inner" }, backButtonIcon && (h("ion-icon", { key: '5b41f3e8d3d458c443d5dfd60b0ef6b7afb2e09f', part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false, "flip-rtl": icon === undefined })), backButtonText && (h("span", { key: '54356420086994095593377e48c517a0e910932a', part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText))), mode === 'md' && h("ion-ripple-effect", { key: 'f45085d43d7eefa904c0509c3968aeded90e1ae1', type: this.rippleType }))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/ion-backdrop.entry.js

@@ -32,7 +32,7 @@ const Backdrop = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: 'c803b4302c8e722064feb03dafe3cb6e190b4f2b', tabindex: "-1", "aria-hidden": "true", class: {
+        return (h(Host, { key: '40f001f1d8b75c7d3e5a1ecdd540498dd185e7bc', tabindex: "-1", "aria-hidden": "true", class: {
                 [mode]: true,
                 'backdrop-hide': !this.visible,
                 'backdrop-no-tappable': !this.tappable,