@ionic/core 8.8.20-dev.11789504012.1a675914 → 8.8.20-dev.11790000033.12788d65

package/dist/cjs/ion-col_3.cjs.entry.js

@@ -105,12 +105,12 @@ const Col = class {
         const colSize = this.getSizeClass();
         const colOrder = this.getOrderClass();
         const colOffset = this.getOffsetClass();
-        return (index.h(index.Host, { key: '3a56b2a9b995148f709dc3c0fe862ea6d1a273d8', class: {
+        return (index.h(index.Host, { key: '7fc98e15bd75e9c22fe7eaf71f2f49f5d987613a', class: {
                 [theme]: true,
                 [`${colSize}`]: colSize !== undefined,
                 [`${colOrder}`]: colOrder !== undefined,
                 [`${colOffset}`]: colOffset !== undefined,
-            } }, index.h("slot", { key: '1b7336c386b92376cd287ebf85b10d245f5c9ab4' })));
+            } }, index.h("slot", { key: '6ed04a2c2bcdb0400354368c568e58414a60fc39' })));
     }
     get el() { return index.getElement(this); }
 };
@@ -128,10 +128,10 @@ const Grid = class {
     }
     render() {
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '8211149ce14da893b47d7fb6e1f0bc194dca8490', class: {
+        return (index.h(index.Host, { key: 'e3320fc2fc5391d26898cc119505cd3be30dd48b', class: {
                 [theme]: true,
                 'grid-fixed': this.fixed,
-            } }, index.h("slot", { key: '080ef8c22898ddba8b001282778a78ed54f1e36f' })));
+            } }, index.h("slot", { key: '2000e6b336c294aadf4585269c301d734d2fe478' })));
     }
 };
 Grid.style = gridCss();
@@ -144,9 +144,9 @@ const Row = class {
     }
     render() {
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '5b29da33f0c81c893d28dcd7a5709f990955f184', class: {
+        return (index.h(index.Host, { key: '3a3c40062d2d0487c61dedbb172215b87bb425b1', class: {
                 [theme]: true,
-            } }, index.h("slot", { key: 'ca96c5069a1c7f757c68730717083db2e1348dd4' })));
+            } }, index.h("slot", { key: '164f457f6f7853ed8f7279d20bc6ede6cf9d3e5c' })));
     }
 };
 Row.style = rowCss();

package/dist/cjs/ion-datetime-button.cjs.entry.js

@@ -343,11 +343,11 @@ const DatetimeButton = class {
     render() {
         const { color, dateText, timeText, selectedButton, datetimeActive, disabled } = this;
         const theme$1 = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '5324999adc34e2f34aae2825427c28130bc399b4', class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '8cdd9935131b68d84ac601f78d5967383eaaf25e', class: theme.createColorClasses(color, {
                 [theme$1]: true,
                 [`${selectedButton}-active`]: datetimeActive,
                 ['datetime-button-disabled']: disabled,
-            }) }, dateText && (index.h("button", { key: '565c74efa16fc02a70a6f1ef6b073eb143ab9f07', class: "ion-activatable", id: "date-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleDateClick, disabled: disabled, part: "native", ref: (el) => (this.dateTargetEl = el) }, index.h("slot", { key: 'c487bd5ae42a089ce22a7cb1bb67016910e24bd0', name: "date-target" }, dateText), theme$1 === 'md' && index.h("ion-ripple-effect", { key: 'c871fee2350e3207efc2338d229b809f8b44dca9' }))), timeText && (index.h("button", { key: '7acf19c3d1446133107a622851dfff2d6088cb8d', class: "ion-activatable", id: "time-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleTimeClick, disabled: disabled, part: "native", ref: (el) => (this.timeTargetEl = el) }, index.h("slot", { key: '6091b9d32d423ce438605005077087fc009fd8e7', name: "time-target" }, timeText), theme$1 === 'md' && index.h("ion-ripple-effect", { key: 'b71f93aa14aa0b7bdfe9ad4ca9bcb90880d23b0e' })))));
+            }) }, dateText && (index.h("button", { key: 'dfd6d83cdca3673383a21e213dae825b5643600d', class: "ion-activatable", id: "date-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleDateClick, disabled: disabled, part: "native", ref: (el) => (this.dateTargetEl = el) }, index.h("slot", { key: 'f7cabbcd6474c66283fb0681a3d75f36a88750d6', name: "date-target" }, dateText), theme$1 === 'md' && index.h("ion-ripple-effect", { key: '3aace053cea80aa3bb30a06c8e1f1d18650d8796' }))), timeText && (index.h("button", { key: 'c8fac088f4e6ee2486110a59574bd95cd3be870b', class: "ion-activatable", id: "time-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleTimeClick, disabled: disabled, part: "native", ref: (el) => (this.timeTargetEl = el) }, index.h("slot", { key: '195df2d17f6bd28c9cf6ad657e55948472544985', name: "time-target" }, timeText), theme$1 === 'md' && index.h("ion-ripple-effect", { key: 'aa1a1f5ea120558174b166c2b2d5fa970ca00d2c' })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ion-datetime_3.cjs.entry.js

@@ -4,6 +4,8 @@
 'use strict';
 
 var index = require('./index-C1knGA9x.js');
+var caretLeft = require('./caret-left-CxZXLRv5.js');
+var caretRight = require('./caret-right-CRCgv98E.js');
 var focusVisible = require('./focus-visible-BIj-I3-C.js');
 var helpers = require('./helpers-Dhimwhpn.js');
 var overlays = require('./overlays-Bxjqh2m3.js');
@@ -2463,43 +2465,73 @@ const Datetime = class {
     }
     /**
      * Get the icon to use for the next icon.
-     * Use the icon set in the config.
+     * Otherwise, use the icon set in the config.
      * If no icon is set in the config, use the default icon.
      */
     get datetimeNextIcon() {
+        // Determine the theme and map to default icons
+        const theme = ionicGlobal.getIonTheme(this);
+        const defaultIcons = {
+            ios: index$1.chevronForward,
+            ionic: caretRight.caretRightSvg,
+            md: index$1.chevronForward,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured datetime next icon or the default icon
-        return index.config.get('datetimeNextIcon', index$1.chevronForward);
+        return index.config.get('datetimeNextIcon', defaultIcon);
     }
     /**
      * Get the icon to use for the previous icon.
-     * Use the icon set in the config.
+     * Otherwise, use the icon set in the config.
      * If no icon is set in the config, use the default icon.
      */
     get datetimePreviousIcon() {
+        // Determine the theme and map to default icons
+        const theme = ionicGlobal.getIonTheme(this);
+        const defaultIcons = {
+            ios: index$1.chevronBack,
+            ionic: caretLeft.caretLeftSvg,
+            md: index$1.chevronBack,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured datetime previous icon or the default icon
-        return index.config.get('datetimePreviousIcon', index$1.chevronBack);
+        return index.config.get('datetimePreviousIcon', defaultIcon);
     }
     /**
      * Get the icon to use for the show month and year icon.
-     * Use the icon set in the config.
+     * Otherwise, use the icon set in the config.
      * If no icon is set in the config, use the default icon.
      */
     get datetimeCollapsedIcon() {
-        // Determine the theme and map to the default icon
+        // Determine the theme and map to default icons
         const theme = ionicGlobal.getIonTheme(this);
-        const defaultIcon = theme === 'ios' ? index$1.chevronForward : index$1.caretDownSharp;
+        const defaultIcons = {
+            ios: index$1.chevronForward,
+            ionic: undefined,
+            md: index$1.caretDownSharp,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured datetime show month and year icon or the default icon
         return index.config.get('datetimeCollapsedIcon', defaultIcon);
     }
     /**
      * Get the icon to use for the hide month and year icon.
-     * Use the icon set in the config.
+     * Otherwise, use the icon set in the config.
      * If no icon is set in the config, use the default icon.
      */
     get datetimeExpandedIcon() {
-        // Determine the theme and map to the default icon
+        // Determine the theme and map to default icons
         const theme = ionicGlobal.getIonTheme(this);
-        const defaultIcon = theme === 'ios' ? index$1.chevronDown : index$1.caretUpSharp;
+        const defaultIcons = {
+            ios: index$1.chevronDown,
+            ionic: undefined,
+            md: index$1.caretUpSharp,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured datetime hide month and year icon or the default icon
         return index.config.get('datetimeExpandedIcon', defaultIcon);
     }
@@ -2512,7 +2544,7 @@ const Datetime = class {
         const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
         const hasWheelVariant = hasDatePresentation && preferWheel;
         helpers.renderHiddenInput(true, el, name, format.formatValue(value), disabled);
-        return (index.h(index.Host, { key: '81d6d431595fc287861af22aff9cad3b94f4ce97', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '04fb1740b1d722d20cdbb32b19d9a3b7d3334db0', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, theme.createColorClasses(color, {
                 [theme$1]: true,
                 ['datetime-readonly']: readonly,
                 ['datetime-disabled']: disabled,
@@ -2522,7 +2554,7 @@ const Datetime = class {
                 [`datetime-size-${size}`]: true,
                 [`datetime-prefer-wheel`]: hasWheelVariant,
                 [`datetime-grid`]: isGridStyle,
-            })) }, index.h("div", { key: 'a5043ea9c7cabb5333edf82c8563fac2f6488086', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(theme$1)));
+            })) }, index.h("div", { key: '0cbb85b4c71e521c81b37a98da0123a1c3a15fac', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(theme$1)));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -2823,11 +2855,11 @@ const Picker = class {
     render() {
         const { htmlAttributes } = this;
         const theme$1 = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, Object.assign({ key: '2933574a887dec034d63c9fb7e72c6f89ba41eee', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: '681ad6d20efa16f1d6c6f9a7d03caec2b17ff36e', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
             }, class: Object.assign({ [theme$1]: true,
                 // Used internally for styling
-                [`picker-${theme$1}`]: true, 'overlay-hidden': true }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), index.h("ion-backdrop", { key: 'da408d6f273dbdee101ee0fecd534122f3adae4b', visible: this.showBackdrop, tappable: this.backdropDismiss }), index.h("div", { key: 'b2c0b56573828c54e6915c7134f8efdf6d3dd447', tabindex: "0", "aria-hidden": "true" }), index.h("div", { key: '471ececc34bad0850caaaa7bc0617342e631c813', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, index.h("div", { key: '5a22a05ee03d39b89a0a40b4d8b1babc72fd0ec3', class: "picker-toolbar" }, this.buttons.map((b) => (index.h("div", { class: buttonWrapperClass(b) }, index.h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), index.h("div", { key: '779ff00e285f24b7b3a22a3a1f2bc73f81852301', class: "picker-columns" }, index.h("div", { key: '317a4efb359487d4f4815696551c98c2ad2c9f6d', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => index.h("ion-picker-legacy-column", { col: c })), index.h("div", { key: 'b38fcc0d168d8f41eac7b90aef48d2c7354e442a', class: "picker-below-highlight" }))), index.h("div", { key: '05dbb5a72979c720eb1c2810e5023d402a2a16d0', tabindex: "0", "aria-hidden": "true" })));
+                [`picker-${theme$1}`]: true, 'overlay-hidden': true }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), index.h("ion-backdrop", { key: '6dc71805810955048479c2a6eddce2303161cb8f', visible: this.showBackdrop, tappable: this.backdropDismiss }), index.h("div", { key: '0e61724c261c9d69ba23d3cb9064018942755033', tabindex: "0", "aria-hidden": "true" }), index.h("div", { key: 'a6ca79c9a5fce42b5aad6808802535c723f27fb9', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, index.h("div", { key: '7651cbe9d723bba032788d85711e0f7c1dc32c21', class: "picker-toolbar" }, this.buttons.map((b) => (index.h("div", { class: buttonWrapperClass(b) }, index.h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), index.h("div", { key: 'd6b83aded670bc74515c337c038503e396ab42cc', class: "picker-columns" }, index.h("div", { key: '1dfef6ed386d7b327dc19397cc9f01c3938fbab9', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => index.h("ion-picker-legacy-column", { col: c })), index.h("div", { key: 'ec8b2f4de073a245f8917a494a681adf5d1f94f6', class: "picker-below-highlight" }))), index.h("div", { key: '8557ce93083feefa5deb6097270d756424f89ab2', tabindex: "0", "aria-hidden": "true" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -3185,9 +3217,9 @@ const PickerColumnCmp = class {
     render() {
         const col = this.col;
         const theme$1 = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '5b6d8dc5f07aab52638415d5645d7f1b757b0143', class: Object.assign({ [theme$1]: true, 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right' }, theme.getClassMap(col.cssClass)), style: {
+        return (index.h(index.Host, { key: 'aed1c1a702e03765d704f6f563fe26df58e68bbf', class: Object.assign({ [theme$1]: true, 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right' }, theme.getClassMap(col.cssClass)), style: {
                 'max-width': this.col.columnWidth,
-            } }, col.prefix && (index.h("div", { key: '38aec7368a95d580870d6b18c5b588e6393e61c4', class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), index.h("div", { key: 'ab861124d971cad93881e04b0240afa0ee5df1ae', class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index$1) => (index.h("button", { "aria-label": o.ariaLabel, class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index$1 }, o.text)))), col.suffix && (index.h("div", { key: '4c3bc8f9d46bf4c1501d0980516f698314e4f8be', class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
+            } }, col.prefix && (index.h("div", { key: 'a6fae778eec5d57dba4b36b3e448c5c12fe0688b', class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), index.h("div", { key: '1b77354fe5eeeeb4db94fab035a9ef5e45d695ac', class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index$1) => (index.h("button", { "aria-label": o.ariaLabel, class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index$1 }, o.text)))), col.suffix && (index.h("div", { key: '105286ef7ba6eac0796f5af7d6f1daef7107444a', class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-divider.cjs.entry.js

@@ -35,11 +35,11 @@ const Divider = class {
     render() {
         const { inset, spacing } = this;
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '90772ad228282d0be4f9f18fcd14bc7af0f52e0e', class: {
+        return (index.h(index.Host, { key: '6cc1572a93abaf49be7e27348bf513cb7ee24bff', class: {
                 [theme]: true,
                 [`divider-spacing-${spacing}`]: spacing !== undefined,
                 [`divider-inset`]: inset,
-            } }, index.h("hr", { key: 'e70ea44fa8e6af6156c19a60302f4e9785b74dae' })));
+            } }, index.h("hr", { key: '19e4cef3f90d92b56ae0bece15dbdcfbf18d72d9' })));
     }
 };
 Divider.style = {

package/dist/cjs/ion-fab_3.cjs.entry.js

@@ -5,6 +5,7 @@
 
 var index = require('./index-C1knGA9x.js');
 var ionicGlobal = require('./ionic-global-DYLhJaw7.js');
+var x = require('./x-BTF99yFH.js');
 var helpers = require('./helpers-Dhimwhpn.js');
 var theme = require('./theme-IlOsGAz7.js');
 var index$1 = require('./index-CxDnX7hd.js');
@@ -65,12 +66,12 @@ const Fab = class {
     render() {
         const { horizontal, vertical, edge } = this;
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: 'fde83d0b3abd9f0315405f1212202fcc2ee939c3', class: {
+        return (index.h(index.Host, { key: '569b07978a63756169d050f3b67368cecf26dd98', class: {
                 [theme]: true,
                 [`fab-horizontal-${horizontal}`]: horizontal !== undefined,
                 [`fab-vertical-${vertical}`]: vertical !== undefined,
                 'fab-edge': edge,
-            } }, index.h("slot", { key: 'aa393e8a368a4c3aef9ac1f8f38bdfca3b0cbc74' })));
+            } }, index.h("slot", { key: 'cd10d4baa1c2e8c2dcfefe66bdb7ffb8262f8e17' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -207,19 +208,22 @@ const FabButton = class {
     componentWillLoad() {
         this.inheritedAttributes = helpers.inheritAriaAttributes(this.el);
     }
-    /**
-     * Get the icon to use for the close icon.
-     * If an icon is set on the component, use that.
-     * Otherwise, use the icon set in the config.
-     * If no icon is set in the config, use the default icon.
-     */
     get fabButtonCloseIcon() {
         // Return the icon if it is explicitly set
         if (this.closeIcon != null) {
             return this.closeIcon;
         }
+        // Determine the theme and map to default icons
+        const theme = ionicGlobal.getIonTheme(this);
+        const defaultIcons = {
+            ios: index$1.close,
+            ionic: x.xSvg,
+            md: index$1.close,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured fab button close icon or the default icon
-        return index.config.get('fabButtonCloseIcon', index$1.close);
+        return index.config.get('fabButtonCloseIcon', defaultIcon);
     }
     render() {
         const { el, disabled, fabButtonCloseIcon, color, href, activated, show, translucent, size, inheritedAttributes, type, } = this;
@@ -241,7 +245,7 @@ const FabButton = class {
         if (type !== 'button') {
             this.renderHiddenButton();
         }
-        return (index.h(index.Host, { key: '6cbdca34ede5d2ab6d9453f8453e608e596122f6', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: 'af84019ef7cee19ca5578a9a274d3890da83bf83', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, class: theme.createColorClasses(color, {
                 [theme$1]: true,
                 'fab-button-in-list': inList,
                 'fab-button-translucent-in-list': inList && translucent,
@@ -252,7 +256,7 @@ const FabButton = class {
                 'ion-activatable': true,
                 'ion-focusable': true,
                 [`fab-button-${size}`]: size !== undefined,
-            }) }, index.h(TagType, Object.assign({ key: '7e660c3401d3e42ba9b11784cf8c30a6ef3e79ed' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => type === 'button' && theme.openURL(href, ev, this.routerDirection, this.routerAnimation) }, inheritedAttributes), index.h("ion-icon", { key: 'eb8fedfd907fe3f2fb94382891ac399a34e19510', "aria-hidden": "true", icon: fabButtonCloseIcon, part: "close-icon", class: "close-icon", lazy: false }), index.h("span", { key: '3ed25f178824632c99714c2c406b64ffa4358367', class: "button-inner" }, index.h("slot", { key: '27084c351359bb5151059091615c559f1d01df93' })), theme$1 === 'md' && index.h("ion-ripple-effect", { key: '44c780a6554411d89cc213699b14aec8173ec76f' }))));
+            }) }, index.h(TagType, Object.assign({ key: '90b4b17993b3feab7194790c4497d0fd9860e01a' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => type === 'button' && theme.openURL(href, ev, this.routerDirection, this.routerAnimation) }, inheritedAttributes), index.h("ion-icon", { key: 'a6d2cf73b627ead797c8efa82e0b7cd6aa845603', "aria-hidden": "true", icon: fabButtonCloseIcon, part: "close-icon", class: "close-icon", lazy: false }), index.h("span", { key: '3f08bc8aa15bcb72ecf11a81b50e2c79ab4d841a', class: "button-inner" }, index.h("slot", { key: 'c5c5921194b2c6b81dab2f9338298ab1c31367c5' })), theme$1 === 'md' && index.h("ion-ripple-effect", { key: '78952651d0662304bd74ab8dc4cd09eb2d5ed455' }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -298,11 +302,11 @@ const FabList = class {
     }
     render() {
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '764dbc440379e7333215c2b69e177d4a7254a899', class: {
+        return (index.h(index.Host, { key: 'a9b498b07b2082107cbeef3259bdd3cff429c1ac', class: {
                 [theme]: true,
                 'fab-list-active': this.activated,
                 [`fab-list-side-${this.side}`]: true,
-            } }, index.h("slot", { key: '9ea03acea78febe1b379904cef8978bbebcb57cd' })));
+            } }, index.h("slot", { key: '6e993eab68de44c0bc3396fd4871c3005274a9f5' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-gallery-item.cjs.entry.js

@@ -47,10 +47,10 @@ const GalleryItem = class {
     render() {
         const { galleryLayout } = this;
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: 'eccce38103a1fca6cd50f7ad1111d0718699a834', class: {
+        return (index.h(index.Host, { key: '989b13983917f237604ab2d18456ceef140a7f8c', class: {
                 [theme]: true,
                 [`in-gallery-layout-${galleryLayout}`]: galleryLayout != undefined,
-            } }, index.h("slot", { key: '4dcc6d4ac94c47b1e5c510e4e365fb1e17e7087f', onSlotchange: this.onSlotChange })));
+            } }, index.h("slot", { key: 'e4cc9398e55cc1bb19654c8f954eed1edab2e38a', onSlotchange: this.onSlotChange })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ion-gallery.cjs.entry.js

@@ -581,11 +581,11 @@ const Gallery = class {
         const { layout } = this;
         const order = this.getOrder();
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '17e0acf09db810e8635b4965faab99da4e675f31', class: {
+        return (index.h(index.Host, { key: '4a0a9cdd0da106ac0bd2c188a4c6612edab43b33', class: {
                 [theme]: true,
                 [`gallery-layout-${layout}`]: true,
                 [`gallery-order-${order}`]: layout === 'masonry' && order !== undefined,
-            } }, index.h("slot", { key: 'e31f2a92f22e8319011c1d2ceed4a47f733dc96b', onSlotchange: this.onSlotChange })));
+            } }, index.h("slot", { key: 'dc6414ce9762ad7daaedc1583db35e0613a76e11', onSlotchange: this.onSlotChange })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-img.cjs.entry.js

@@ -85,9 +85,9 @@ const Img = class {
         const { loadSrc, alt, onLoad, loadError, inheritedAttributes } = this;
         const { draggable } = inheritedAttributes;
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: 'f6f8d76f7019338f9b07ce9738fdf9b15b0f3e9f', class: {
+        return (index.h(index.Host, { key: 'ba84621055567b2a35387709d9d89b97ad853274', class: {
                 [theme]: true,
-            } }, index.h("img", { key: '0e571771fdf3008bd83588e1924d4f6a91e0ede8', decoding: "async", src: loadSrc, alt: alt, onLoad: onLoad, onError: loadError, part: "image", draggable: isDraggable(draggable) })));
+            } }, index.h("img", { key: '9d6118bbf69e2cccbb0603802c03b9a0d101e2c3', decoding: "async", src: loadSrc, alt: alt, onLoad: onLoad, onError: loadError, part: "image", draggable: isDraggable(draggable) })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-infinite-scroll_2.cjs.entry.js

@@ -272,7 +272,7 @@ const InfiniteScroll = class {
     render() {
         const theme = ionicGlobal.getIonTheme(this);
         const disabled = this.disabled;
-        return (index.h(index.Host, { key: '042d76f3640398a71ff23c84f8df3e25d30536a6', class: {
+        return (index.h(index.Host, { key: 'e3a3cde079dfd6f07e565eb462765df757cbb128', class: {
                 [theme]: true,
                 'infinite-scroll-loading': this.isLoading,
                 'infinite-scroll-enabled': !disabled,
@@ -316,11 +316,11 @@ const InfiniteScrollContent = class {
     }
     render() {
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: '16d080c074d3b61ef884e4f7f5bd5f70aec1aeac', class: {
+        return (index.h(index.Host, { key: '263a27297159ced042f7552a1e14b8c6aba62fa8', class: {
                 [theme]: true,
                 // Used internally for styling
                 [`infinite-scroll-content-${theme}`]: true,
-            } }, index.h("div", { key: 'dc5fa503c8b90255e4c898ceb4d0ec59467ec5a5', class: "infinite-loading" }, this.loadingSpinner && (index.h("div", { key: '091cbc7bfefca20130090a0269a8241a4e0f60a9', class: "infinite-loading-spinner" }, index.h("ion-spinner", { key: '89e7fa70d0846207a8289a0ada9ea38c6fd6bfbc', name: this.loadingSpinner }))), this.loadingText !== undefined && this.renderLoadingText())));
+            } }, index.h("div", { key: 'ee38d3c52df9dc5de186406b3087f20917a17252', class: "infinite-loading" }, this.loadingSpinner && (index.h("div", { key: 'e2348727f79a26f52f42641d4334a0ba9d4aa03e', class: "infinite-loading-spinner" }, index.h("ion-spinner", { key: '41be6f2747f3af5f46c8738e2ef56083ecd95e99', name: this.loadingSpinner }))), this.loadingText !== undefined && this.renderLoadingText())));
     }
 };
 InfiniteScrollContent.style = {

package/dist/cjs/ion-input-otp.cjs.entry.js

@@ -692,7 +692,7 @@ const InputOTP = class {
         const tabbableIndex = this.getTabbableIndex();
         const pattern = this.getPattern();
         const hasDescription = ((_b = (_a = el.querySelector('.input-otp-description')) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim()) !== '';
-        return (index.h(index.Host, { key: '67df3d392e0336b65363fff7cb0d093b7c535b3f', class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '2bdd205b13281373a43d1a86a25df950a6f36ae1', class: theme.createColorClasses(color, {
                 [mode]: true,
                 'has-focus': hasFocus,
                 [`input-otp-size-${size}`]: true,
@@ -700,10 +700,10 @@ const InputOTP = class {
                 [`input-otp-fill-${fill}`]: true,
                 'input-otp-disabled': disabled,
                 'input-otp-readonly': readonly,
-            }) }, index.h("div", Object.assign({ key: 'b68d6bfae96d7f381ce66819d9cff0aa2b1d8a44', role: "group", "aria-label": "One-time password input", class: "input-otp-group", part: "group" }, inheritedAttributes), Array.from({ length }).map((_, index$1) => (index.h(index.Fragment, null, index.h("div", { class: "native-wrapper", part: "container" }, index.h("input", { class: "native-input", part: "native", id: `${inputId}-${index$1}`, "aria-label": `Input ${index$1 + 1} of ${length}`, type: "text", autoCapitalize: autocapitalize, inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index$1 === tabbableIndex ? 0 : -1, value: inputValues[index$1] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index$1] = el), onInput: this.onInput(index$1), onBlur: this.onBlur, onFocus: this.onFocus(index$1), onKeyDown: this.onKeyDown(index$1), onPaste: this.onPaste })), this.showSeparator(index$1) && index.h("div", { class: "input-otp-separator", part: "separator" }))))), index.h("div", { key: '346450b2da262c6543e5dc2c0bbac27c541f4e18', class: {
+            }) }, index.h("div", Object.assign({ key: 'b82d198138929327cd5429bbeb482248935ae88d', role: "group", "aria-label": "One-time password input", class: "input-otp-group", part: "group" }, inheritedAttributes), Array.from({ length }).map((_, index$1) => (index.h(index.Fragment, null, index.h("div", { class: "native-wrapper", part: "container" }, index.h("input", { class: "native-input", part: "native", id: `${inputId}-${index$1}`, "aria-label": `Input ${index$1 + 1} of ${length}`, type: "text", autoCapitalize: autocapitalize, inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index$1 === tabbableIndex ? 0 : -1, value: inputValues[index$1] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index$1] = el), onInput: this.onInput(index$1), onBlur: this.onBlur, onFocus: this.onFocus(index$1), onKeyDown: this.onKeyDown(index$1), onPaste: this.onPaste })), this.showSeparator(index$1) && index.h("div", { class: "input-otp-separator", part: "separator" }))))), index.h("div", { key: '0bb5444d4e653bb7310abec502f5b1d76e681c37', class: {
                 'input-otp-description': true,
                 'input-otp-description-hidden': !hasDescription,
-            }, part: "description" }, index.h("slot", { key: '31ad8b75d9b2808b49f488e7ff2f235099e31b30' }))));
+            }, part: "description" }, index.h("slot", { key: 'f717bda988a6e9b97d67025c1d3163d838f27bb5' }))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/ion-input-password-toggle.cjs.entry.js

@@ -8,6 +8,10 @@ var theme = require('./theme-IlOsGAz7.js');
 var index$1 = require('./index-CxDnX7hd.js');
 var ionicGlobal = require('./ionic-global-DYLhJaw7.js');
 
+const eyeSlashSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgMjU2IiBmaWxsPSJjdXJyZW50Q29sb3IiPjxwYXRoIGQ9Ik01My45MiwzNC42MkE4LDgsMCwxLDAsNDIuMDgsNDUuMzhMNjEuMzIsNjYuNTVDMjUsODguODQsOS4zOCwxMjMuMiw4LjY5LDEyNC43NmE4LDgsMCwwLDAsMCw2LjVjLjM1Ljc5LDguODIsMTkuNTcsMjcuNjUsMzguNEM2MS40MywxOTQuNzQsOTMuMTIsMjA4LDEyOCwyMDhhMTI3LjExLDEyNy4xMSwwLDAsMCw1Mi4wNy0xMC44M2wyMiwyNC4yMWE4LDgsMCwxLDAsMTEuODQtMTAuNzZabTQ3LjMzLDc1Ljg0LDQxLjY3LDQ1Ljg1YTMyLDMyLDAsMCwxLTQxLjY3LTQ1Ljg1Wk0xMjgsMTkyYy0zMC43OCwwLTU3LjY3LTExLjE5LTc5LjkzLTMzLjI1QTEzMy4xNiwxMzMuMTYsMCwwLDEsMjUsMTI4YzQuNjktOC43OSwxOS42Ni0zMy4zOSw0Ny4zNS00OS4zOGwxOCwxOS43NWE0OCw0OCwwLDAsMCw2My42Niw3MGwxNC43MywxNi4yQTExMiwxMTIsMCwwLDEsMTI4LDE5MlptNi05NS40M2E4LDgsMCwwLDEsMy0xNS43Miw0OC4xNiw0OC4xNiwwLDAsMSwzOC43Nyw0Mi42NCw4LDgsMCwwLDEtNy4yMiw4LjcxLDYuMzksNi4zOSwwLDAsMS0uNzUsMCw4LDgsMCwwLDEtOC03LjI2QTMyLjA5LDMyLjA5LDAsMCwwLDEzNCw5Ni41N1ptMTEzLjI4LDM0LjY5Yy0uNDIuOTQtMTAuNTUsMjMuMzctMzMuMzYsNDMuOGE4LDgsMCwxLDEtMTAuNjctMTEuOTJBMTMyLjc3LDEzMi43NywwLDAsMCwyMzEuMDUsMTI4YTEzMy4xNSwxMzMuMTUsMCwwLDAtMjMuMTItMzAuNzdDMTg1LjY3LDc1LjE5LDE1OC43OCw2NCwxMjgsNjRhMTE4LjM3LDExOC4zNywwLDAsMC0xOS4zNiwxLjU3QTgsOCwwLDEsMSwxMDYsNDkuNzksMTM0LDEzNCwwLDAsMSwxMjgsNDhjMzQuODgsMCw2Ni41NywxMy4yNiw5MS42NiwzOC4zNSwxOC44MywxOC44MywyNy4zLDM3LjYyLDI3LjY1LDM4LjQxQTgsOCwwLDAsMSwyNDcuMzEsMTMxLjI2WiIvPjwvc3ZnPg==';
+
+const eyeSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgMjU2IiBmaWxsPSJjdXJyZW50Q29sb3IiPjxwYXRoIGQ9Ik0yNDcuMzEsMTI0Ljc2Yy0uMzUtLjc5LTguODItMTkuNTgtMjcuNjUtMzguNDFDMTk0LjU3LDYxLjI2LDE2Mi44OCw0OCwxMjgsNDhTNjEuNDMsNjEuMjYsMzYuMzQsODYuMzVDMTcuNTEsMTA1LjE4LDksMTI0LDguNjksMTI0Ljc2YTgsOCwwLDAsMCwwLDYuNWMuMzUuNzksOC44MiwxOS41NywyNy42NSwzOC40QzYxLjQzLDE5NC43NCw5My4xMiwyMDgsMTI4LDIwOHM2Ni41Ny0xMy4yNiw5MS42Ni0zOC4zNGMxOC44My0xOC44MywyNy4zLTM3LjYxLDI3LjY1LTM4LjRBOCw4LDAsMCwwLDI0Ny4zMSwxMjQuNzZaTTEyOCwxOTJjLTMwLjc4LDAtNTcuNjctMTEuMTktNzkuOTMtMzMuMjVBMTMzLjQ3LDEzMy40NywwLDAsMSwyNSwxMjgsMTMzLjMzLDEzMy4zMywwLDAsMSw0OC4wNyw5Ny4yNUM3MC4zMyw3NS4xOSw5Ny4yMiw2NCwxMjgsNjRzNTcuNjcsMTEuMTksNzkuOTMsMzMuMjVBMTMzLjQ2LDEzMy40NiwwLDAsMSwyMzEuMDUsMTI4QzIyMy44NCwxNDEuNDYsMTkyLjQzLDE5MiwxMjgsMTkyWm0wLTExMmE0OCw0OCwwLDEsMCw0OCw0OEE0OC4wNSw0OC4wNSwwLDAsMCwxMjgsODBabTAsODBhMzIsMzIsMCwxLDEsMzItMzJBMzIsMzIsMCwwLDEsMTI4LDE2MFoiLz48L3N2Zz4=';
+
 const inputPasswordToggleIonicCss = () => `:host ion-button{--color:var(--token-primitives-neutral-800, #626262);--margin-end:calc(-1 * var(--padding-end));--padding-end:inherit;--icon-size:var(--token-font-size-400, 1rem);-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end);margin-top:0;margin-bottom:0;width:var(--size);height:var(--size)}:host ion-button ion-icon{font-size:var(--icon-size)}`;
 
 const iosInputPasswordToggleNativeCss = () => ``;
@@ -59,48 +63,54 @@ const InputPasswordToggle = class {
     disconnectedCallback() {
         this.inputElRef = null;
     }
-    /**
-     * Get the icon to use for the hide icon.
-     * If an icon is set on the component, use that.
-     * Otherwise, use the icon set in the config.
-     * If no icon is set in the config, use the default icon.
-     */
     get inputPasswordHideIcon() {
         // Return the icon if it is explicitly set
         if (this.hideIcon != null) {
             return this.hideIcon;
         }
+        // Determine the theme and map to default icons
+        const theme = ionicGlobal.getIonTheme(this);
+        const defaultIcons = {
+            ios: index$1.eyeOff,
+            ionic: eyeSlashSvg,
+            md: index$1.eyeOff,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured input password hide icon or the default icon
-        return index.config.get('inputPasswordHideIcon', index$1.eyeOff);
+        return index.config.get('inputPasswordHideIcon', defaultIcon);
     }
-    /**
-     * Get the icon to use for the show icon.
-     * If an icon is set on the component, use that.
-     * Otherwise, use the icon set in the config.
-     * If no icon is set in the config, use the default icon.
-     */
     get inputPasswordShowIcon() {
         // Return the icon if it is explicitly set
         if (this.showIcon != null) {
             return this.showIcon;
         }
+        // Determine the theme and map to default icons
+        const theme = ionicGlobal.getIonTheme(this);
+        const defaultIcons = {
+            ios: index$1.eye,
+            ionic: eyeSvg,
+            md: index$1.eye,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured input password show icon or the default icon
-        return index.config.get('inputPasswordShowIcon', index$1.eye);
+        return index.config.get('inputPasswordShowIcon', defaultIcon);
     }
     render() {
         const { color, inputPasswordHideIcon, inputPasswordShowIcon, type } = this;
         const mode = ionicGlobal.getIonMode(this);
         const isPasswordVisible = type === 'text';
-        return (index.h(index.Host, { key: '67dff695db35fe17927c62f88eb4d1b8a83cf9c1', class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: 'f11e3bf4d3255e003aec504e6dd3ee1e0caaf767', class: theme.createColorClasses(color, {
                 [mode]: true,
-            }) }, index.h("ion-button", { key: '75edb85478a55b76fc1b4b3ecb65d593dee0b3ee', mode: mode, color: color, fill: "clear", shape: "round", "aria-label": isPasswordVisible ? 'Hide password' : 'Show password', "aria-pressed": isPasswordVisible ? 'true' : 'false', type: "button", onPointerDown: (ev) => {
+            }) }, index.h("ion-button", { key: '5bba43f7755857fd9347612bb906c389b60386b4', mode: mode, color: color, fill: "clear", shape: "round", "aria-label": isPasswordVisible ? 'Hide password' : 'Show password', "aria-pressed": isPasswordVisible ? 'true' : 'false', type: "button", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the password toggle
                  * button is activated.
                  */
                 ev.preventDefault();
-            }, onClick: this.togglePasswordVisibility }, index.h("ion-icon", { key: '811e6f30fdc0e78fb23318823fc2bb2135647ca1', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? inputPasswordHideIcon : inputPasswordShowIcon }))));
+            }, onClick: this.togglePasswordVisibility }, index.h("ion-icon", { key: 'c0eb0e4e2f3e9553bfd519ff655064c9f62af406', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? inputPasswordHideIcon : inputPasswordShowIcon }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-input.cjs.entry.js

@@ -4,6 +4,7 @@
 'use strict';
 
 var index = require('./index-C1knGA9x.js');
+var x = require('./x-BTF99yFH.js');
 var notchController = require('./notch-controller-0hkmmSGo.js');
 var validity = require('./validity-QmuwEptc.js');
 var clearButtonPressController = require('./clear-button-press-controller-C7B9kyMa.js');
@@ -586,9 +587,15 @@ const Input = class {
         if (this.clearInputIcon != null) {
             return this.clearInputIcon;
         }
-        // Determine the theme and map to the default icon
+        // Determine the theme and map to default icons
         const theme = ionicGlobal.getIonTheme(this);
-        const defaultIcon = theme === 'ios' ? index$1.closeCircle : index$1.closeSharp;
+        const defaultIcons = {
+            ios: index$1.closeCircle,
+            ionic: x.xSvg,
+            md: index$1.closeSharp,
+        };
+        // Get the default icon based on the theme, falling back to 'md' icon if necessary
+        const defaultIcon = defaultIcons[theme] || defaultIcons.md;
         // Return the configured input clear icon or the default icon
         return index.config.get('inputClearIcon', defaultIcon);
     }
@@ -622,7 +629,7 @@ const Input = class {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (index.h(index.Host, { key: 'ae0920d7c93498741a5a066a5518f89f0c5b43c2', class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: 'f4009568b582fa080103dfb3f490595d5d7e9706', class: theme.createColorClasses(this.color, {
                 [theme$1]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -635,7 +642,7 @@ const Input = class {
                 'in-item-color': theme.hostContext('ion-item.ion-color', this.el),
                 'input-disabled': disabled,
                 'input-readonly': readonly,
-            }) }, index.h("label", { key: 'b9fd3366b0fb429ebacc02a16ae27e29b1b485aa', class: "input-wrapper", htmlFor: inputId, onClick: this.onLabelClick }, this.renderLabelContainer(), index.h("div", { key: 'eb02cef1a79a43f9fc8eb55bd7f3dcd4ca2e81d3', class: "native-wrapper", onClick: this.onLabelClick }, 
+            }) }, index.h("label", { key: 'a05502716afcf5d286f197131619b2bc57ba61e0', class: "input-wrapper", htmlFor: inputId, onClick: this.onLabelClick }, this.renderLabelContainer(), index.h("div", { key: 'de4621c5eff21e26197f28a3e66217fcae449c75', class: "native-wrapper", onClick: this.onLabelClick }, 
         /**
          * For the ionic theme, we render the outline container here
          * instead of higher up, so it can be positioned relative to
@@ -645,10 +652,10 @@ const Input = class {
          * <label> element, ensuring that clicking the label text
          * focuses the input.
          */
-        theme$1 === 'ionic' && index.h("div", { key: '1d35432c405e9d6fec8c4d411bf33e2950a02fb5', class: "input-outline" }), index.h("slot", { key: '627e09591ad9915b8b62b6ad8b8f359f1b010f01', name: "start" }), index.h("input", Object.assign({ key: '3bd035e03868067ea6dbba5c7a28383474f67ba3', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd, "aria-describedby": this.getHintTextID(), "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": this.getLabelledById() }, this.inheritedAttributes)), clearInput && !readonly && !disabled && (index.h("button", { key: 'dfec9566c3dd743dae34afe0de03aabb180a371e', "aria-label": "reset", type: "button", class: {
+        theme$1 === 'ionic' && index.h("div", { key: '79e084dd8d7b0f530ea6518ee6f2ceb2ac099a8e', class: "input-outline" }), index.h("slot", { key: 'a4d0f148035c0f8afca5171139a05665d778bd07', name: "start" }), index.h("input", Object.assign({ key: 'f399d498b4c289571a114347c08c2ae16266ba6f', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd, "aria-describedby": this.getHintTextID(), "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": this.getLabelledById() }, this.inheritedAttributes)), clearInput && !readonly && !disabled && (index.h("button", { key: 'f6672256dfebae3bae35afd61d26bb705e8f268c', "aria-label": "reset", type: "button", class: {
                 'input-clear-icon': true,
                 'input-clear-button-pressed': this.isClearButtonPressed,
-            }, onPointerDown: this.clearButtonPressController.onPointerDown, onPointerCancel: this.clearButtonPressController.release, onClick: this.clearTextInput }, index.h("ion-icon", { key: 'c736514c2df8f78196bd6426fd8d80d282c7aeb7', "aria-hidden": "true", icon: inputClearIcon }))), index.h("slot", { key: 'b6a250b6aaacb7a7ec0e09cc93a8b8dce973bb5b', name: "end" })), shouldRenderHighlight && index.h("div", { key: '989a73bb9210f3ef8084a265533063cdb4b8142c', class: "input-highlight" })), this.renderBottomContent()));
+            }, onPointerDown: this.clearButtonPressController.onPointerDown, onPointerCancel: this.clearButtonPressController.release, onClick: this.clearTextInput }, index.h("ion-icon", { key: '999e8ec2b4c1614ce8f396b6a3e2ff26cb41dfbd', "aria-hidden": "true", icon: inputClearIcon }))), index.h("slot", { key: '2d0df6c7dd9dc17d8bd5e33b9eac1e11a25dd874', name: "end" })), shouldRenderHighlight && index.h("div", { key: 'f80b2c9fe4dfbb038e6c7b5a98e775cdd5ef6a21', class: "input-highlight" })), this.renderBottomContent()));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-item-option_3.cjs.entry.js

@@ -71,14 +71,14 @@ const ItemOption = class {
                 href: this.href,
                 target: this.target,
             };
-        return (index.h(index.Host, { key: '4c40464f3ade0f4afaf4a7682177bf54fd411b2f', onClick: this.onClick, class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: '8f1bad23fd3ccbb9d54d57765e6731cd2ee07306', onClick: this.onClick, class: theme.createColorClasses(this.color, {
                 [theme$1]: true,
                 [`item-option-${shape}`]: shape !== undefined,
                 [`item-option-${hue}`]: hue !== undefined,
                 'item-option-disabled': disabled,
                 'item-option-expandable': expandable,
                 'ion-activatable': true,
-            }) }, index.h(TagType, Object.assign({ key: '857af74eab39e9dbe9e72da7b6727c1fb72ba463' }, attrs, { class: "button-native", part: "native", disabled: disabled }), index.h("span", { key: '7838898caaa93215083f3aa378e8d12c7c0da73f', class: "button-inner", part: "inner" }, index.h("slot", { key: '0cfa9e6c6e55cae4d099eb3c339ae91d69a0899d', name: "top" }), index.h("div", { key: '5ed0d1b3f462e7a03da1c29f5a76efc186b3881c', class: "horizontal-wrapper", part: "container" }, index.h("slot", { key: '264076e1e5818e7666d6958c861d43831b4b9227', name: "start" }), index.h("slot", { key: 'ff6cd961b5d980ce073840f023f2c8ff3d46b4a4', name: "icon-only" }), index.h("slot", { key: '75f3fd3813e497ab1fc1bef2248a8764c0b5a36f' }), index.h("slot", { key: '9df80f908c1facc282b5910d1f3199b72dd33b36', name: "end" })), index.h("slot", { key: 'e82f4c0ea7dd31393dd42496801d8807e57aba2d', name: "bottom" })), theme$1 === 'md' && index.h("ion-ripple-effect", { key: '7730ed91538245a5834989213673dea45b70798d' }))));
+            }) }, index.h(TagType, Object.assign({ key: '2baf904e356a87ed463ee5f517e0e95f90b2ef30' }, attrs, { class: "button-native", part: "native", disabled: disabled }), index.h("span", { key: '49b627f72dffd1b150ccd808b1b1f63bbe78e2de', class: "button-inner", part: "inner" }, index.h("slot", { key: 'cdb52f76f1d7e5df411215f17eb76ad25e36241a', name: "top" }), index.h("div", { key: '864204667c6e3ba6f989b24e96c131b67e55d408', class: "horizontal-wrapper", part: "container" }, index.h("slot", { key: '474f4aab708842bb7ef74cb6f1fbe601ceff82cf', name: "start" }), index.h("slot", { key: '2bd726c5ba3ee079a623f1f6229d1ac2afd3e291', name: "icon-only" }), index.h("slot", { key: '2d1a673c447ebf82c92f944ec9e83a5b38698307' }), index.h("slot", { key: '8d0f9337cd84c725190cffd25d74044075e85ab0', name: "end" })), index.h("slot", { key: 'a674039b26d9cbb886e88ea721bbc210484aba9f', name: "bottom" })), theme$1 === 'md' && index.h("ion-ripple-effect", { key: '3e45bf18b7992943c47ece47e9358f4da0b8e865' }))));
     }
     get el() { return index.getElement(this); }
 };
@@ -113,7 +113,7 @@ const ItemOptions = class {
     render() {
         const theme = ionicGlobal.getIonTheme(this);
         const isEnd = helpers.isEndSide(this.side);
-        return (index.h(index.Host, { key: '3505a534ecca3fe1615b1e686d9ab15bc8967049', class: {
+        return (index.h(index.Host, { key: 'ed05ceebf2cda943ac9efea2f91b71f7e8fc55e8', class: {
                 [theme]: true,
                 // Used internally for styling
                 [`item-options-${theme}`]: true,
@@ -907,7 +907,7 @@ const ItemSliding = class {
     }
     render() {
         const theme = ionicGlobal.getIonTheme(this);
-        return (index.h(index.Host, { key: 'd718bf10e1dfbecc2c1e1b84eee8e79a62751115', class: {
+        return (index.h(index.Host, { key: '47de8c8a9721f9223b42d6722a9ad32f378818aa', class: {
                 [theme]: true,
                 'item-sliding-active-slide': this.state !== 2 /* SlidingState.Disabled */,
                 'item-sliding-active-options-end': (this.state & 8 /* SlidingState.End */) !== 0,