@ionic/core 8.8.7-dev.11779400352.127ba526 → 8.8.7-dev.11779467048.1641d05e

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

@@ -112,7 +112,7 @@ export class SegmentButton {
         const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
         const theme = getIonTheme(this);
         const hasSegmentColor = () => (segmentEl === null || segmentEl === void 0 ? void 0 : segmentEl.color) !== undefined;
-        return (h(Host, { key: 'da5c8352e5e0f3a01211edbc39c5043cadc5b06f', class: {
+        return (h(Host, { key: 'bbb2ae95aa27852c31dcc0ba3ee5acce24349752', class: {
                 [theme]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
@@ -128,7 +128,7 @@ export class SegmentButton {
                 'ion-activatable': true,
                 'ion-activatable-instant': true,
                 'ion-focusable': true,
-            } }, h("button", Object.assign({ key: 'cfd963a166ebfeba590d6538069b26a107306583', "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: '845b729e96ba5b594d441ca41c73e2c33a4f5817', class: "button-inner" }, h("slot", { key: 'f38369982dd602c32dbbc6aca2fae6dbb53faa8a' })), theme === 'md' && h("ion-ripple-effect", { key: 'b1b15b731688dd02806409c9c3eda5519a958239' })), h("div", { key: 'fff597d493a85be8005ef3b9eb4f2a93c2a7a4d0', part: "indicator", class: "segment-button-indicator segment-button-indicator-animated" }, h("div", { key: 'f06b53d0ef9d08354f562ac6d3469998257dd688', part: "indicator-background", class: "segment-button-indicator-background" }))));
+            } }, h("button", Object.assign({ key: '0335787c4606314d2715062b536b544cf0fb1f27', "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: '47d06436538ed9fc97789af76b6681674a2bd0a7', class: "button-inner" }, h("slot", { key: 'de1164da25cb74e6fa3066e43744483fc5b821fa' })), theme === 'md' && h("ion-ripple-effect", { key: '82d3f9d812f851a6bbbf3603e5845e6e6e925442' })), h("div", { key: '77bbfb251707d274635f21e4cd7153791d9fdb49', part: "indicator", class: "segment-button-indicator segment-button-indicator-animated" }, h("div", { key: '2d7b64dbdb084bd3a851e215b9d049a9aff6f03f', part: "indicator-background", class: "segment-button-indicator-background" }))));
     }
     static get is() { return "ion-segment-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -4,7 +4,7 @@
 import { Host, h } from "@stencil/core";
 export class SegmentContent {
     render() {
-        return (h(Host, { key: '2f43cadcbcb1a9423b30e7abc169ff923a8c431f' }, h("slot", { key: 'c3a6d3e9c336f5124cdec9f37ef516324558073c' })));
+        return (h(Host, { key: '66e6783365c0842eb785d50191206d82321b35e7' }, h("slot", { key: '21528369e7efdb93599179720b26c3f3c3e574ed' })));
     }
     static get is() { return "ion-segment-content"; }
     static get encapsulation() { return "shadow"; }

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

@@ -110,11 +110,11 @@ export class SegmentView {
     }
     render() {
         const { disabled, isManualScroll, swipeGesture } = this;
-        return (h(Host, { key: '8d1aa594c5674bca376ee3e9b18b60b0925dd875', class: {
+        return (h(Host, { key: '48ce45ca6c45d4bbc804390c31a43729a60abb8a', class: {
                 'segment-view-disabled': disabled,
                 'segment-view-scroll-disabled': isManualScroll === false,
                 'segment-view-swipe-disabled': swipeGesture === false,
-            } }, h("slot", { key: '6375fa794ae615b74a70968718aadefa0a9fc1d6' })));
+            } }, h("slot", { key: 'e248ce5b24b355bd6b51cbfd25741addf4ffd4fb' })));
     }
     static get is() { return "ion-segment-view"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1002,7 +1002,7 @@ export class Select {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
-        return (h(Host, { key: 'c8fc8ffc5e66fa0deef9556f365d8d95ff652b5d', onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: '03fa41ce215865ceeaeddec12d9ac66b5ab18e3f', onClick: this.onClick, class: createColorClasses(this.color, {
                 [theme]: true,
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', el),
@@ -1021,7 +1021,7 @@ export class Select {
                 [`select-shape-${shape}`]: shape !== undefined,
                 [`select-label-placement-${labelPlacement}`]: true,
                 [`select-size-${size}`]: size !== undefined,
-            }) }, h("label", { key: 'dd1b83a6bfadcce8e8a9559e529c86d86a5c142d', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick, part: "wrapper" }, this.renderLabelContainer(), h("div", { key: 'c7ae6112920eb9260be01ef4a723549a71e6e275', class: "select-wrapper-inner", part: "inner" }, 
+            }) }, h("label", { key: '66808fb8c26f7a5db356b22d43751463cbb4bcaa', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick, part: "wrapper" }, this.renderLabelContainer(), h("div", { key: '3e80160009e0e5b47952d666ca621166067adbea', class: "select-wrapper-inner", part: "inner" }, 
         /**
          * For the ionic theme, we render the outline container here
          * instead of higher up, so it can be positioned relative to
@@ -1031,7 +1031,7 @@ export class Select {
          * <label> element, ensuring that clicking the label text
          * focuses the select.
          */
-        theme === 'ionic' && fill === 'outline' && h("div", { key: 'da07a6cea39e13cc62de7104ef4c06ac8b3c8fe1', class: "select-outline" }), h("slot", { key: '35c4261e4eb3f5d91e8fe61e02cfe3d93a2c6763', name: "start" }), h("div", { key: 'e70c2896f0c7ad908811f5eb19abde9a432d086e', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: 'ddb79446bfc9dc97714c0395570d67ce6a5aa1bf', name: "end" }), shouldRenderInnerIcon && this.renderSelectIcon()), shouldRenderOuterIcon && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: '297abbcf88af9911c6ecbbb27e2f37846f213bdb', class: "select-highlight" })), this.renderBottomContent()));
+        theme === 'ionic' && fill === 'outline' && h("div", { key: '8ea2530c4dc535661bf97d16724bdca3b9e23560', class: "select-outline" }), h("slot", { key: '2526c811e6f0f250421f6de9834d96d21df528b7', name: "start" }), h("div", { key: '95d0b2432c9e656166bf35ddd457a74052c91a27', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: '0864febe104e3ac77aa10ce397e7c7569855636e', name: "end" }), shouldRenderInnerIcon && this.renderSelectIcon()), shouldRenderOuterIcon && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'c83f3992d7a0ee55ca635b391421626a9131c8eb', class: "select-highlight" })), this.renderBottomContent()));
     }
     static get is() { return "ion-select"; }
     static get encapsulation() { return "shadow"; }

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

@@ -147,7 +147,7 @@ export class SelectModal {
         });
     }
     render() {
-        return (h(Host, { key: '6f1c1c0ad2dad8d4c1defc41a37e9cb4219facef', class: Object.assign({ [getIonMode(this)]: true }, this.getModalContextClasses()) }, h("ion-header", { key: 'e917416fdfb8785511abac755f9cd23e24bc2c70' }, h("ion-toolbar", { key: '7ce8116cdd882958f1c6d0abd9f6ddad60d4232b' }, this.header !== undefined && h("ion-title", { key: 'aa2be148b57b756ca1abdc4b29c26861494e9341' }, this.header), h("ion-buttons", { key: '7a9671f9426a5b9eb0fef1d4b446d2db98332f89', slot: "end" }, h("ion-button", { key: 'c5c1511bed6e3361aa740de9bcab4c7445887518', "aria-label": this.cancelIcon ? this.cancelText : undefined, onClick: () => this.closeModal() }, this.cancelIcon ? (h("ion-icon", { "aria-hidden": "true", slot: "icon-only", icon: this.cancelButtonIcon })) : (this.cancelText))))), h("ion-content", { key: 'ddabe1b04a9f65e741935e387c06ee8f749b38e1' }, h("ion-list", { key: 'cb801aecd27444fb7bb9e3bf06e5934dfd1a9606' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
+        return (h(Host, { key: '43db0bab8915e4e422acbd73d27a880935c13a38', class: Object.assign({ [getIonMode(this)]: true }, this.getModalContextClasses()) }, h("ion-header", { key: '58f462db240eb759d7be9f090ab9fba48abdea0c' }, h("ion-toolbar", { key: 'dbd4722ad8c2fc21a066b89451fdc5c0a3776808' }, this.header !== undefined && h("ion-title", { key: 'cefe16f3dff1a90d10875506a94fe1d737c67b44' }, this.header), h("ion-buttons", { key: '750ba8ac17447906cbe020d654b943a88adf8185', slot: "end" }, h("ion-button", { key: '8c075ec9d7becf25dd1307bf083bec229a0889ae', "aria-label": this.cancelIcon ? this.cancelText : undefined, onClick: () => this.closeModal() }, this.cancelIcon ? (h("ion-icon", { "aria-hidden": "true", slot: "icon-only", icon: this.cancelButtonIcon })) : (this.cancelText))))), h("ion-content", { key: '65dff8eab0158cdff103ade997246cea2b3c4b9e' }, h("ion-list", { key: 'e3556e81c97146ffda80260265294a4f8d6ebdf2' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
     }
     static get is() { return "ion-select-modal"; }
     static get encapsulation() { return "scoped"; }

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

@@ -21,7 +21,7 @@ export class SelectOption {
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: 'd7baa96e166b66c8f14c97e56674db4dfec2152c', class: {
+        return (h(Host, { key: 'f4d425097bd16997f0ea48c8896dc92408e55bb9', class: {
                 [theme]: true,
             }, role: "option", id: this.inputId }));
     }

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

@@ -149,9 +149,9 @@ export class SelectPopover {
         const { header, message, options, subHeader } = this;
         const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
         const theme = getIonTheme(this);
-        return (h(Host, { key: '47062077a192fb05f662f30c68e9c12323a69e47', class: {
+        return (h(Host, { key: 'de63245b6690ffb6201a8faac850b7e73eed8022', class: {
                 [theme]: true,
-            } }, h("ion-list", { key: '50caf4e5f70d1d7b57256f115c589d90d9cea627' }, header !== undefined && h("ion-list-header", { key: '3401a27174b687632836f086f1a367214021358c' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: '7271f08cd8bae5383bb502d9411d60a5458e18f6' }, h("ion-label", { key: 'e22c6c54f725e3fc630eed38a71afd4bb474b357', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'c0ca32ef8100d6aaa3aa2279ed1216bdb6a60b89' }, subHeader), message !== undefined && h("p", { key: '8e2e0b248a05f5483e62db8d608310078040767c' }, message)))), this.renderOptions(options))));
+            } }, h("ion-list", { key: 'a96857c064aaf9a645b9e1ee22932116b1c25d62' }, header !== undefined && h("ion-list-header", { key: '86b8c398f12cdd3e7d2a7d4c4af69029e4decdbc' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: '3bcd9c0a544e1e98243163600413d82a304081db' }, h("ion-label", { key: 'd20b933ba82913b623486c982ab094819f850565', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'c869868d89d024b5b02e6a3b626ca91e6f312036' }, subHeader), message !== undefined && h("p", { key: 'd8a26d162ba8d3b092abef38ef3c1795787e7f75' }, 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

@@ -32,11 +32,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 theme = getIonTheme(this);
-        return (h(Host, { key: '370451ee8963b776079f5df365f7bbd70a53b270', class: {
+        return (h(Host, { key: 'aa94213767105077047a369d4e4861027af96060', class: {
                 [theme]: true,
                 'skeleton-text-animated': animated,
                 'in-media': inMedia,
-            } }, h("span", { key: '2b861b4ec86cbd61927ab7b81b13517c99dc94c7' }, "\u00A0")));
+            } }, h("span", { key: 'c5dab0fb89d524827936aef5345cc0c7eda9e274' }, "\u00A0")));
     }
     static get is() { return "ion-skeleton-text"; }
     static get encapsulation() { return "shadow"; }

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

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

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

@@ -131,12 +131,12 @@ export class SplitPane {
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: 'b933156f8f9d8ce418ff0d39526967f9653d6639', class: {
+        return (h(Host, { key: 'f9f96d71771ced17604357d27ae7b4b7ed29ec9c', class: {
                 [theme]: true,
                 // Used internally for styling
                 [`split-pane-${theme}`]: true,
                 'split-pane-visible': this.visible,
-            } }, h("slot", { key: '3ec0a11e5506386747dc972ccb094359ca975bae' })));
+            } }, h("slot", { key: '4c95f5197bde73de689c3e4425c14c55412539c6' })));
     }
     static get is() { return "ion-split-pane"; }
     static get encapsulation() { return "shadow"; }

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

@@ -51,10 +51,10 @@ export class Tab {
     }
     render() {
         const { tab, active, component } = this;
-        return (h(Host, { key: '8b978f848d43898feafa7daa3e3d9819be833038', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (h(Host, { key: '5761999a97a78dda973bd39bf44f10d9637fc00c', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'ion-page': component === undefined,
                 'tab-hidden': !active,
-            } }, h("slot", { key: '96a92d86cecc8c9ef4f11d310f7f87bb99ce4e50' })));
+            } }, h("slot", { key: 'd2cc63bbd20ba5f58ef8d6b23eb50ffa7d80478a' })));
     }
     static get is() { return "ion-tab"; }
     static get encapsulation() { return "shadow"; }

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

@@ -179,7 +179,7 @@ export class TabBar {
         const theme = getIonTheme(this);
         const shape = this.getShape();
         const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
-        return (h(Host, { key: '16cd11a815d777a7517150b49b57a204c83c3c37', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
+        return (h(Host, { key: 'dd255e7c4d99f239f43c03eaef94c26ae6db4fc6', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
                 [theme]: true,
                 'tab-bar-translucent': translucent,
                 'tab-bar-hidden': shouldHide,
@@ -187,7 +187,7 @@ export class TabBar {
                 'tab-bar-scroll-hidden': scrollHidden,
                 [`tab-bar-${expand}`]: true,
                 [`tab-bar-${shape}`]: shape !== undefined,
-            }) }, h("slot", { key: 'dfdff308f24b3addaf18528a8d869b3fc64306d1' })));
+            }) }, h("slot", { key: 'f112cf52bce37b8a93f9ca6f9632e85889d2791e' })));
     }
     static get is() { return "ion-tab-bar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -93,7 +93,7 @@ export class TabButton {
             rel,
             target,
         };
-        return (h(Host, { key: 'e4d3aaefcdc42677f7818c51ec1ec0a9cbcf8bcf', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (h(Host, { key: '124248b961d34d24a3cbeeb669c672caa10f6d07', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
                 [theme]: true,
                 'tab-selected': selected,
                 'tab-disabled': disabled,
@@ -106,7 +106,7 @@ export class TabButton {
                 'ion-selectable': true,
                 [`tab-button-shape-${shape}`]: shape !== undefined,
                 'ion-focusable': true,
-            } }, h("a", Object.assign({ key: '1412d080294dd2602696c5657c71553ef35036d3' }, 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: '5daebf815b9b4f8016ce5b4b9d05148c1957a46c', class: "button-inner" }, h("slot", { key: 'e1cbabb911936d21d5b1a4f87d236b962beacbab' })), theme === 'md' && h("ion-ripple-effect", { key: 'd4544a7fb87b8559aaf9d2f0aa4d440201ebdb71', type: "unbounded" }))));
+            } }, h("a", Object.assign({ key: 'fde7dc112f62c5e1a08017f1e8665bf68658eadf' }, 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: '0912736f1e69a8da9a49c94bca1c613061bcaad1', class: "button-inner" }, h("slot", { key: '9b919361a07b62304dddc751658fca0540a3747a' })), theme === 'md' && h("ion-ripple-effect", { key: '472967f7b2b8f63d669fae542bb2eb1900955975', type: "unbounded" }))));
     }
     static get is() { return "ion-tab-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -165,7 +165,7 @@ export class Tabs {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
     render() {
-        return (h(Host, { key: 'b8c5c75469cb1f1829a217a02555a7da8556454a', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '50b74e3df8ea0e991e096c7438a65fee0ca0f6b5', name: "top" }), h("div", { key: 'ca8d4329381c4b40882bbd31b4f15264cfa2c220', class: "tabs-inner" }, h("slot", { key: '816ffd6d997530e3b100480c9a8e4a51fa51e59c' })), h("slot", { key: '280bdf5ec61789823c7772287d60a26229fe78fa', name: "bottom" })));
+        return (h(Host, { key: 'd94b2760650125d00a9bd620f367022119aba911', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: 'dfa95a272dce19af4575e4d6488962cf6c521754', name: "top" }), h("div", { key: 'd537e5212745833107c751cc6f79d12f48f5472a', class: "tabs-inner" }, h("slot", { key: '6db89721daa7ffd390586345137f1fdfcefa7910' })), h("slot", { key: '7b24f140b89e8e316f24170b29390e00c31d9a0c', name: "bottom" })));
     }
     static get is() { return "ion-tabs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -11,9 +11,9 @@ import { getIonTheme } from "../../global/ionic-global";
 export class Text {
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: '8fc5565ce579f8e2a9eddbaa7c93264291080bce', class: createColorClasses(this.color, {
+        return (h(Host, { key: '4a8be0173621ab64b2849bd02b569e479890c5c4', class: createColorClasses(this.color, {
                 [theme]: true,
-            }) }, h("slot", { key: '5be1d661ee3a6f1f9d9428b59e830672faf475b1' })));
+            }) }, h("slot", { key: 'af7771d2fd855b5de843f32d58cd33a89051fa8b' })));
     }
     static get is() { return "ion-text"; }
     static get encapsulation() { return "shadow"; }

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

@@ -565,7 +565,7 @@ export class Textarea {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (h(Host, { key: 'a67ef5f3107776dcd8490bdd2af4a373ae422899', class: createColorClasses(this.color, {
+        return (h(Host, { key: 'd4a95fcd3fe11311d779c10777421c36da20b7a6', class: createColorClasses(this.color, {
                 [theme]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -577,7 +577,7 @@ export class Textarea {
                 'in-item': inItem,
                 'textarea-disabled': disabled,
                 'textarea-readonly': readonly,
-            }) }, h("label", { key: '7a8605454eb66d87a4b49ffd28e609a633eae09c', class: "textarea-wrapper", htmlFor: inputId, onClick: this.onLabelClick, part: "wrapper" }, this.renderLabelContainer(), h("div", { key: '8b24d96089d11f659dbd5adfcbf317ec34742333', class: "textarea-wrapper-inner" }, 
+            }) }, h("label", { key: '3d21eab560550527de015d36b1c71761792aa516', class: "textarea-wrapper", htmlFor: inputId, onClick: this.onLabelClick, part: "wrapper" }, this.renderLabelContainer(), h("div", { key: '5fe9ec91ac5560d2ebbb93751dd770fe17e5f839', class: "textarea-wrapper-inner" }, 
         /**
          * For the ionic theme, we render the outline container here
          * instead of higher up, so it can be positioned relative to
@@ -587,7 +587,7 @@ export class Textarea {
          * <label> element, ensuring that clicking the label text
          * focuses the textarea.
          */
-        theme === 'ionic' && fill === 'outline' && h("div", { key: '91a7ea7b6f6fccc473b9e058281e5437c00a9b5d', class: "textarea-outline" }), h("div", { key: 'ba641e63d5aaf2ddb291c875f57181d1c93a2b26', class: "start-slot-wrapper" }, h("slot", { key: '351684d41a2b080541a29e0d9e90dd50747b52dc', name: "start" })), h("div", { key: '5c0793742ff6cc327582c3d78d85c28fa8238a40', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el), part: "container" }, h("textarea", Object.assign({ key: '9cf5c908e3fcd54af07c351dcf0bb91c853f1349', class: "native-textarea", part: "native", 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, "aria-describedby": this.getHintTextID(), "aria-invalid": this.isInvalid ? 'true' : undefined }, this.inheritedAttributes), value)), h("div", { key: 'e47ffe0bf8e460a7cb205ed35a1107b44687116d', class: "end-slot-wrapper" }, h("slot", { key: '57d035b5f1db373b8488b129c8d3552eb8e630ac', name: "end" }))), shouldRenderHighlight && h("div", { key: '1259ad761b68aea69a1ae8b61a6bbdee6c071b7b', class: "textarea-highlight" })), this.renderBottomContent()));
+        theme === 'ionic' && fill === 'outline' && h("div", { key: 'aac1db3f8a9a9d541bd0d76f17c7936daca419d7', class: "textarea-outline" }), h("div", { key: '49779a6b346b5bf2e8f98787c9159f41fd767d26', class: "start-slot-wrapper" }, h("slot", { key: '2a86311a2ee002e286d8cb1e27480364cb3eb5b1', name: "start" })), h("div", { key: '922069ecd0aa72e4294d78e02a4f216706af0d99', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el), part: "container" }, h("textarea", Object.assign({ key: 'c1cae5f0695b4d978fbbd6d0af8d3da681d2c671', class: "native-textarea", part: "native", 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, "aria-describedby": this.getHintTextID(), "aria-invalid": this.isInvalid ? 'true' : undefined }, this.inheritedAttributes), value)), h("div", { key: '6e76190d9644dd880200f28bbfdb6291362ce639', class: "end-slot-wrapper" }, h("slot", { key: 'fe9466237a1d88bf8cd534e83cca148ce6178abe', name: "end" }))), shouldRenderHighlight && h("div", { key: 'e8a158231e0dcacb4df5b94575fe54d7aff5c23f', class: "textarea-highlight" })), this.renderBottomContent()));
     }
     static get is() { return "ion-textarea"; }
     static get encapsulation() { return "shadow"; }

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

@@ -10,9 +10,9 @@ import { getIonTheme } from "../../global/ionic-global";
 export class Thumbnail {
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: 'fdf9d92949a1e8cf6faded77ffed084f74fc040b', class: {
+        return (h(Host, { key: '2fb4e6f9f650badf2bc492fc4b1c43cad64141c0', class: {
                 [theme]: true,
-            } }, h("slot", { key: 'e1b1439c035d9a9503efd1c1a04aed9f4e8e0af7' })));
+            } }, h("slot", { key: 'ea18f4572b2b019af3470c6bdb7915d4a5dd84bb' })));
     }
     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 theme = getIonTheme(this);
         const size = this.getSize();
-        return (h(Host, { key: 'd64e86bed418cba707d4a26c9274f18ed06c0e9e', class: createColorClasses(this.color, {
+        return (h(Host, { key: '87bb5264f4c13d0d6eeef874ed114539d0b59062', class: createColorClasses(this.color, {
                 [theme]: true,
                 [`title-${size}`]: true,
                 'title-rtl': document.dir === 'rtl',
-            }) }, h("div", { key: '386a71e974cde0bfbf5b655d69ed5f718de8ce48', class: "toolbar-title" }, h("slot", { key: '8aa804c9e1b11574a42268805d3117a085e699b4' }))));
+            }) }, h("div", { key: '75f2ddfaf693ffdec13d909eefdb09b441d76e80', class: "toolbar-title" }, h("slot", { key: '00539af5e250bee78fdd1c55f2ecdc8e53bc18b0' }))));
     }
     static get is() { return "ion-title"; }
     static get encapsulation() { return "shadow"; }

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

@@ -439,9 +439,9 @@ export class Toast {
         if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
             printIonWarning('[ion-toast] - 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: 'f0d62f099dd68f8f541110a60695c2a083c6a4d5', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'f8a4c4537d421e924a58f9addbb38a4a043b9f53', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true, [theme]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent, [`toast-shape-${shape}`]: shape !== undefined, [`toast-hue-${hue}`]: hue !== undefined })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '054ba519f93892a000832990097b265887272da4', class: wrapperClass, part: "wrapper" }, h("div", { key: '45fa83c1711ab98e81b8b00e0af3af436eaa5264', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'eb4143899be5259e3d933461bc4ca593c8b9dd9b', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: 'bae8a899abb9bcd4895df45def79bfe3d704e6e4', class: "toast-content", part: "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, [theme]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent, [`toast-shape-${shape}`]: shape !== undefined, [`toast-hue-${hue}`]: hue !== undefined })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '4f0b39c8e0d7aecfe81da23c3ca1591374a8afa5', class: wrapperClass, part: "wrapper" }, h("div", { key: 'a2cf3ea830d27b51ffe1158fb3f3bf87486401b5', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'bee5f21ee8df2278e20bf0565495da30c2e61963', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '40a95848e952dd587d1972487affd4b8e088209f', class: "toast-content", part: "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

@@ -338,7 +338,7 @@ export class Toggle {
         const rtl = isRTL(el) ? 'rtl' : 'ltr';
         const isIonicTheme = theme === 'ionic';
         renderHiddenInput(true, el, name, checked ? value : '', disabled);
-        return (h(Host, { key: '9e042d48d2416028c4f76fbb38fa2b26ee7512ef', role: "switch", "aria-checked": `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, onClick: this.onClick, "aria-labelledby": hasLabel ? inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, "aria-required": required ? 'true' : undefined, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, class: createColorClasses(color, {
+        return (h(Host, { key: '48744f35038be7be61fea432996440628d4f2ce9', role: "switch", "aria-checked": `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, onClick: this.onClick, "aria-labelledby": hasLabel ? inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, "aria-required": required ? 'true' : undefined, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, class: createColorClasses(color, {
                 [theme]: true,
                 'in-item': hostContext('ion-item', el),
                 'toggle-activated': activated,
@@ -350,10 +350,10 @@ export class Toggle {
                 [`toggle-${rtl}`]: true,
                 'ion-activatable': isIonicTheme,
                 'ion-focusable': isIonicTheme,
-            }) }, h("label", { key: 'f13b94af8f0b862b8390172107e75ef670fff34f', class: "toggle-wrapper", htmlFor: inputId }, h("input", Object.assign({ key: 'e6c82e4fc9fcc77ed52408a04188d5696521de0c', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, required: required }, inheritedAttributes)), h("div", { key: '5f32f194da4f83792cccaa536a211b558c5eac1c', class: {
+            }) }, h("label", { key: '43d05b9140a9ccabc3981a28b01bf2cb844050f6', class: "toggle-wrapper", htmlFor: inputId }, h("input", Object.assign({ key: '716f13f4202712d4ce22fe738879a8259102c329', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, required: required }, inheritedAttributes)), h("div", { key: '0466a7f662ec5804ecc2e22971248a86f20141c7', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !hasLabel,
-            }, part: "label", id: inputLabelId, onClick: this.onDivLabelClick }, h("slot", { key: 'c86e28aca1011a3d5a453b92ddc8b6d1ab049f0b' }), this.renderHintText()), h("div", { key: '80390009e2a3d1ad699e1b698df725449c8fab53', class: "native-wrapper" }, this.renderToggleControl()))));
+            }, part: "label", id: inputLabelId, onClick: this.onDivLabelClick }, h("slot", { key: '86b8fbbd03ee3179e84cf906ea4e6881137d798a' }), this.renderHintText()), h("div", { key: '6ccf0131e4ff14c3b1f59d218081b8da5f6b1864', class: "native-wrapper" }, this.renderToggleControl()))));
     }
     static get is() { return "ion-toggle"; }
     static get encapsulation() { return "shadow"; }

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

@@ -242,11 +242,11 @@ export class Toolbar {
             Object.assign(childStyles, style);
         });
         const titlePlacement = this.getTitlePlacement();
-        return (h(Host, { key: 'bcb621674157410d7eaeb006779bdd677346587e', class: Object.assign(Object.assign({}, createColorClasses(this.color, {
+        return (h(Host, { key: '069913e9241b8e9a2dee8e7d088d181b6faeab5e', class: Object.assign(Object.assign({}, createColorClasses(this.color, {
                 [theme]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 [`toolbar-title-placement-${titlePlacement}`]: true,
-            })), childStyles) }, h("div", { key: '0d31a98b2571b9a0ae142fbdfd83e2ebdcd8e069', class: "toolbar-background", part: "background" }), h("div", { key: 'de938534c487c6cb4060dac44b40c2d872130f50', class: "toolbar-container", part: "container" }, h("slot", { key: 'a337150d353e439eae67c31ff86e383ed51f3d8f', name: "start", onSlotchange: () => this.updateSlotClasses }), h("slot", { key: '02effd3ce0cdad5ec5645fa58ccb329321449190', name: "secondary", onSlotchange: () => this.updateSlotClasses }), h("div", { key: '3e22f5feda2aea02117bdea2fe8a4b8905ba82f6', class: "toolbar-content", part: "content" }, h("slot", { key: 'ebf828643ff05a8bf662a54715d21d0859168d31' })), h("slot", { key: 'a6940648dfe25a7aa8792a1bd9267437274f333c', name: "primary", onSlotchange: () => this.updateSlotClasses }), h("slot", { key: 'afb1d61aa0e430fcf483ba482af64762474e06fe', name: "end", onSlotchange: () => this.updateSlotClasses }))));
+            })), childStyles) }, h("div", { key: '3255531be492b9afa7b47476a805f923beea09db', class: "toolbar-background", part: "background" }), h("div", { key: '8758189374c0a12f293c30ca7f8f049b732d2cab', class: "toolbar-container", part: "container" }, h("slot", { key: '74c3705f717968893bf94ea95c99cae313ce68f3', name: "start", onSlotchange: () => this.updateSlotClasses }), h("slot", { key: '298c78f93291442f140f8c52983871215f20ea87', name: "secondary", onSlotchange: () => this.updateSlotClasses }), h("div", { key: 'f7376320b704b8ce375fe2223ae30d51bfc05acb', class: "toolbar-content", part: "content" }, h("slot", { key: 'ddaec08b1fbd13384d834ba4c3b4441c4d749faf' })), h("slot", { key: '6d5bce85159859bb548e4d3fb6b22208dcb48987', name: "primary", onSlotchange: () => this.updateSlotClasses }), h("slot", { key: 'd1d21752ed3bcc7bf15c20de1c0a6fd956373450', name: "end", onSlotchange: () => this.updateSlotClasses }))));
     }
     static get is() { return "ion-toolbar"; }
     static get encapsulation() { return "shadow"; }