@ionic/core 8.0.0-dev.11711734184.18e3ccbf → 8.0.0-dev.11712850753.10c4a960

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

@@ -11,7 +11,7 @@ import { c as chevronBack, o as chevronForward, l as chevronDown, p as caretUpSh
 import { b as getIonMode } from './ionic-global-c4e0c089.js';
 import { g as generateDayAriaLabel, a as getDay, i as isBefore, b as isAfter, c as isSameDay, d as getPreviousMonth, e as getNextMonth, v as validateParts, f as getPartsFromCalendarDay, h as getNextYear, j as getPreviousYear, k as getEndOfWeek, l as getStartOfWeek, m as getPreviousDay, n as getNextDay, o as getPreviousWeek, p as getNextWeek, q as parseMinParts, r as parseMaxParts, s as parseDate, w as warnIfValueOutOfBounds, t as convertToArrayOfNumbers, u as convertDataToISO, x as getToday, y as getClosestValidDate, z as generateMonths, A as getNumDaysInMonth, B as getCombinedDateColumnData, C as getMonthColumnData, D as getDayColumnData, E as getYearColumnData, F as isMonthFirstLocale, G as getTimeColumnsData, H as isLocaleDayPeriodRTL, I as getDaysOfWeek, J as getMonthAndYear, K as getDaysOfMonth, L as getHourCycle, M as getLocalizedTime, N as getLocalizedDateTime, O as formatValue, P as clampDate, Q as parseAmPm, R as calculateHourFromAMPM } from './data-ae11fd43.js';
 import { c as createLockController } from './lock-controller-316928be.js';
-import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod, s as safeCall } from './overlays-9472c98b.js';
+import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod, s as safeCall } from './overlays-634df4be.js';
 import { c as createAnimation } from './animation-eab5a4ca.js';
 import { b as hapticSelectionChanged, h as hapticSelectionEnd, a as hapticSelectionStart } from './haptic-ac164e4c.js';
 import './index-a5d50daf.js';
@@ -287,10 +287,10 @@ const Datetime = class {
             const { activeParts } = this;
             return Array.isArray(activeParts) ? activeParts[0] : activeParts;
         };
-        this.closeParentOverlay = () => {
+        this.closeParentOverlay = (role) => {
             const popoverOrModal = this.el.closest('ion-modal, ion-popover');
             if (popoverOrModal) {
-                popoverOrModal.dismiss();
+                popoverOrModal.dismiss(undefined, role);
             }
         };
         this.setWorkingParts = (parts) => {
@@ -960,7 +960,7 @@ const Datetime = class {
             }
         }
         if (closeOverlay) {
-            this.closeParentOverlay();
+            this.closeParentOverlay(CONFIRM_ROLE);
         }
     }
     /**
@@ -980,7 +980,7 @@ const Datetime = class {
     async cancel(closeOverlay = false) {
         this.ionCancel.emit();
         if (closeOverlay) {
-            this.closeParentOverlay();
+            this.closeParentOverlay(CANCEL_ROLE);
         }
     }
     get isCalendarPicker() {
@@ -1758,7 +1758,7 @@ const Datetime = class {
         const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
         const hasWheelVariant = hasDatePresentation && preferWheel;
         renderHiddenInput(true, el, name, formatValue(value), disabled);
-        return (h(Host, { key: '79357d753d003539aaadbc30aa0ca7e2ab97415d', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses(color, {
+        return (h(Host, { key: '952afba4aff8f172dcdc7986afb56271f0e239aa', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses(color, {
                 [mode]: true,
                 ['datetime-readonly']: readonly,
                 ['datetime-disabled']: disabled,
@@ -1768,7 +1768,7 @@ const Datetime = class {
                 [`datetime-size-${size}`]: true,
                 [`datetime-prefer-wheel`]: hasWheelVariant,
                 [`datetime-grid`]: isGridStyle,
-            })) }, h("div", { key: '18b6631ffcf028c5062659e75be5d6712ac30402', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
+            })) }, h("div", { key: '2de62751e7498f09cef364a401e65a098be4705a', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -1786,6 +1786,8 @@ const Datetime = class {
     }; }
 };
 let datetimeIds = 0;
+const CANCEL_ROLE = 'datetime-cancel';
+const CONFIRM_ROLE = 'datetime-confirm';
 const WHEEL_ITEM_PART = 'wheel-item';
 const WHEEL_ITEM_ACTIVE_PART = `active`;
 Datetime.style = {
@@ -2020,11 +2022,11 @@ const Picker = class {
     render() {
         const { htmlAttributes } = this;
         const mode = getIonMode(this);
-        return (h(Host, Object.assign({ key: '91d3d127c46d125a2a86222e3002d804ebd8bc84', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '1cf2f8a25a3eca7ac59eff969803c85540f102fc', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
             }, class: Object.assign({ [mode]: true,
                 // Used internally for styling
-                [`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '63140c43f7a2e3000076adec0406197cb569f985', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '3e86ec5e61adf40983a1d33ef24f66f4f75307e8', tabindex: "0" }), h("div", { key: '3c3844f369da33e35c9a498d88d1b7e4d686b8ce', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, h("div", { key: 'e03200231976723409505b0c4070e7f596815e50', class: "picker-toolbar" }, this.buttons.map((b) => (h("div", { class: buttonWrapperClass(b) }, h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), h("div", { key: 'd59de79e8c364376bc16d2edae3672b21443f3fe', class: "picker-columns" }, h("div", { key: 'e79cb88c5397047bc8c7e71efb4f1a338773e744', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => h("ion-picker-legacy-column", { col: c })), h("div", { key: '776de64da09485ad1dbf78d4d402e297b94348a6', class: "picker-below-highlight" }))), h("div", { key: 'f0aa77e3b467c3fb4950389d27c13769dc913b14', tabindex: "0" })));
+                [`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '3a70c7c6e0457afda2e9ef4619cb253b583b7805', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '4c90cf7dfeb9d2bdb5e947739864dbc2d1e327e0', tabindex: "0" }), h("div", { key: '050098ced341fd86bfcd72595b1f7a52c3b01b46', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, h("div", { key: 'b0d9420fb053d0c71af04c88224a38f804fd99ba', class: "picker-toolbar" }, this.buttons.map((b) => (h("div", { class: buttonWrapperClass(b) }, h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), h("div", { key: '82cd2788c394079cb8843c240c17e3629eef0953', class: "picker-columns" }, h("div", { key: '34d2ce59e88b5967e52fe8077ef3a151c6ce38e5', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => h("ion-picker-legacy-column", { col: c })), h("div", { key: 'b604b101bc0006efc246aea9320d9f44419c531f', class: "picker-below-highlight" }))), h("div", { key: '70437d735b009386b4f5ae250b555c039c366183', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -2381,9 +2383,9 @@ const PickerColumnCmp = class {
     render() {
         const col = this.col;
         const mode = getIonMode(this);
-        return (h(Host, { key: '90b9d07917c0643cf8a622f090abefcd2846ac96', class: Object.assign({ [mode]: true, 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right' }, getClassMap(col.cssClass)), style: {
+        return (h(Host, { key: '0337ac8379be177501b8d61f0ac0f68ecbb8344d', class: Object.assign({ [mode]: true, 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right' }, getClassMap(col.cssClass)), style: {
                 'max-width': this.col.columnWidth,
-            } }, col.prefix && (h("div", { class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), h("div", { key: '4adca834de9295a18bdb355ebbfa49813f0f93f8', class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index) => (h("button", { "aria-label": o.ariaLabel, class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index }, o.text)))), col.suffix && (h("div", { class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
+            } }, col.prefix && (h("div", { class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), h("div", { key: '013ba8ea1c2fe4fe717386b9cc87484913c234f7', class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index) => (h("button", { "aria-label": o.ariaLabel, class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index }, o.text)))), col.suffix && (h("div", { class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -55,12 +55,12 @@ const Fab = class {
     render() {
         const { horizontal, vertical, edge } = this;
         const mode = getIonMode(this);
-        return (h(Host, { key: 'a25aae31396546595b21a760ced22ee92d2379d6', class: {
+        return (h(Host, { key: '8d10537e35f518b03a840de9a0fbe7973abc4290', class: {
                 [mode]: true,
                 [`fab-horizontal-${horizontal}`]: horizontal !== undefined,
                 [`fab-vertical-${vertical}`]: vertical !== undefined,
                 'fab-edge': edge,
-            } }, h("slot", { key: 'b01cc2572213bfa6c12111e32e2f7702e6d93621' })));
+            } }, h("slot", { key: '77331bf85f939b20ff14886f0a8b0f13c5ca392a' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -129,7 +129,7 @@ const FabButton = class {
                 rel: this.rel,
                 target: this.target,
             };
-        return (h(Host, { key: 'f342fbd54263de388bc49e54af61ce4aaaef1f2e', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses(color, {
+        return (h(Host, { key: 'bc00fdb39e41787a3b4c53aededfc32485ee9211', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses(color, {
                 [mode]: true,
                 'fab-button-in-list': inList,
                 'fab-button-translucent-in-list': inList && translucent,
@@ -140,7 +140,7 @@ const FabButton = class {
                 'ion-activatable': true,
                 'ion-focusable': true,
                 [`fab-button-${size}`]: size !== undefined,
-            }) }, h(TagType, Object.assign({ key: 'cd29a22c7d8ea02ab3469ba8a5878fd1cb28286a' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => openURL(href, ev, this.routerDirection, this.routerAnimation) }, inheritedAttributes), h("ion-icon", { key: '046a1254b728b43e2f4496ad96fff7bb8827df19', "aria-hidden": "true", icon: this.closeIcon, part: "close-icon", class: "close-icon", lazy: false }), h("span", { key: '9b5c11105d2b7c37c82f7eea2264e29c5f939262', class: "button-inner" }, h("slot", { key: '283fe50749e5537bc7d21159c36c9eb3fbe45415' })), mode === 'md' && h("ion-ripple-effect", null))));
+            }) }, h(TagType, Object.assign({ key: 'fe13b3e19638177b516e6e530e6ff0b745856481' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: (ev) => openURL(href, ev, this.routerDirection, this.routerAnimation) }, inheritedAttributes), h("ion-icon", { key: '210e4a3cd39e0ff6fc300eeaafa3a9330a9dc73f', "aria-hidden": "true", icon: this.closeIcon, part: "close-icon", class: "close-icon", lazy: false }), h("span", { key: 'c6547612ff58a1e46bae2e91302b6b86a49d6429', class: "button-inner" }, h("slot", { key: '48abc7e6a27391f2595eeddf9abd8d16c0a86630' })), mode === 'md' && h("ion-ripple-effect", null))));
     }
     get el() { return getElement(this); }
 };
@@ -168,11 +168,11 @@ const FabList = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '62d22c1907677360d91fc0386ab05379bcc9de8a', class: {
+        return (h(Host, { key: 'ccce297302fa14d6ce0646d4bb14a74e71d68cb9', class: {
                 [mode]: true,
                 'fab-list-active': this.activated,
                 [`fab-list-side-${this.side}`]: true,
-            } }, h("slot", { key: '4f9b6b9620c0ec79006663c5981140184129b7ce' })));
+            } }, h("slot", { key: '9007d178411ea80db29d2034473e3f9d61157fa1' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -76,7 +76,7 @@ const Img = class {
     render() {
         const { loadSrc, alt, onLoad, loadError, inheritedAttributes } = this;
         const { draggable } = inheritedAttributes;
-        return (h(Host, { key: 'fa0d0e73693f4d5454dde2397a333143ab00a145', class: getIonMode(this) }, h("img", { key: '70198693643ab6a33816c6e1b0ed23b368208fbb', decoding: "async", src: loadSrc, alt: alt, onLoad: onLoad, onError: loadError, part: "image", draggable: isDraggable(draggable) })));
+        return (h(Host, { key: '167143c9e996a0b2f78841e6c427c57a322189d7', class: getIonMode(this) }, h("img", { key: 'e840d04e5d0a939cd4c2d19f915a3fee394419b5', decoding: "async", src: loadSrc, alt: alt, onLoad: onLoad, onError: loadError, part: "image", draggable: isDraggable(draggable) })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -176,7 +176,7 @@ const InfiniteScroll = class {
     render() {
         const mode = getIonMode(this);
         const disabled = this.disabled;
-        return (h(Host, { key: 'be1a720fcf686dc48468de968d84ea58bfe0a06d', class: {
+        return (h(Host, { key: '69e7741fd2eb2053ba1d59d00d307d2f662fcf13', class: {
                 [mode]: true,
                 'infinite-scroll-loading': this.isLoading,
                 'infinite-scroll-enabled': !disabled,
@@ -218,11 +218,11 @@ const InfiniteScrollContent = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '44b11681f802fb0d1c565810f71f7672453e16ca', class: {
+        return (h(Host, { key: '7c32cbd526ef8a151df1c870bd3a4f0c9d764154', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`infinite-scroll-content-${mode}`]: true,
-            } }, h("div", { key: 'd7e7d5beedf1e22a009e87790ca024b8f15c462b', class: "infinite-loading" }, this.loadingSpinner && (h("div", { class: "infinite-loading-spinner" }, h("ion-spinner", { name: this.loadingSpinner }))), this.loadingText !== undefined && this.renderLoadingText())));
+            } }, h("div", { key: '6bd67f2c9f3f23edc2f81b6de16134b853bea716', class: "infinite-loading" }, this.loadingSpinner && (h("div", { class: "infinite-loading-spinner" }, h("ion-spinner", { name: this.loadingSpinner }))), this.loadingText !== undefined && this.renderLoadingText())));
     }
 };
 InfiniteScrollContent.style = {

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

@@ -65,16 +65,16 @@ const InputPasswordToggle = class {
         const showPasswordIcon = (_a = this.showIcon) !== null && _a !== void 0 ? _a : eye;
         const hidePasswordIcon = (_b = this.hideIcon) !== null && _b !== void 0 ? _b : eyeOff;
         const isPasswordVisible = type === 'text';
-        return (h(Host, { key: '1cb075999e41c2fde3a3d6cafe6f37c9b5429299', class: createColorClasses(color, {
+        return (h(Host, { key: '9dd0f6e44824961eb19de2af03ed0237551bc623', class: createColorClasses(color, {
                 [mode]: true,
-            }) }, h("ion-button", { key: 'cfaaec221f530ecc475690b6508c2333e32ff609', mode: mode, color: color, fill: "clear", shape: "round", "aria-checked": isPasswordVisible ? 'true' : 'false', "aria-label": "show password", role: "switch", type: "button", onPointerDown: (ev) => {
+            }) }, h("ion-button", { key: '72737f52a8a9767f14bde3851a28368c3420a408', mode: mode, color: color, fill: "clear", shape: "round", "aria-checked": isPasswordVisible ? 'true' : 'false', "aria-label": "show password", role: "switch", type: "button", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the password toggle
                  * button is activated.
                  */
                 ev.preventDefault();
-            }, onClick: this.togglePasswordVisibility }, h("ion-icon", { key: 'dc0fc5fe8df4df4c145e29b30e589f159aab9cd9', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? hidePasswordIcon : showPasswordIcon }))));
+            }, onClick: this.togglePasswordVisibility }, h("ion-icon", { key: '17a7d7681e8509aa6feab3d54ce6ca1c87b631b0', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? hidePasswordIcon : showPasswordIcon }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -87,6 +87,7 @@ const Input = class {
         this.autocorrect = 'off';
         this.autofocus = false;
         this.clearInput = false;
+        this.clearInputIcon = undefined;
         this.clearOnEdit = undefined;
         this.counter = false;
         this.counterFormatter = undefined;
@@ -376,11 +377,13 @@ const Input = class {
         return this.renderLabel();
     }
     render() {
-        const { disabled, fill, readonly, shape, inputId, labelPlacement, el, hasFocus } = this;
+        const { disabled, fill, readonly, shape, inputId, labelPlacement, el, hasFocus, clearInputIcon } = this;
         const mode = getIonMode(this);
         const value = this.getValue();
         const inItem = hostContext('ion-item', this.el);
         const shouldRenderHighlight = mode === 'md' && fill !== 'outline' && !inItem;
+        const defaultClearIcon = mode === 'ios' ? closeCircle : closeSharp;
+        const clearIconData = clearInputIcon !== null && clearInputIcon !== void 0 ? clearInputIcon : defaultClearIcon;
         const hasValue = this.hasValue();
         const hasStartEndSlots = el.querySelector('[slot="start"], [slot="end"]') !== null;
         /**
@@ -401,7 +404,7 @@ const Input = class {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (h(Host, { key: 'f1007469471c9610950749d87f1aa8165cea4dbb', class: createColorClasses(this.color, {
+        return (h(Host, { key: '12e9da8ff2d6ecce8e3ce1880ea46e71260c81fc', class: createColorClasses(this.color, {
                 [mode]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -412,14 +415,14 @@ const Input = class {
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', this.el),
                 'input-disabled': disabled,
-            }) }, h("label", { key: '12a5a2a2b942e4d7420b7e10b98dc3f5b15c6e28', class: "input-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: '938381505753fbc842583215e32d74dd3a383742', class: "native-wrapper" }, h("slot", { key: '0e835fd6b94f7407696d4ab097a02c6e4b742fc9', name: "start" }), h("input", Object.assign({ key: '1835e2bbbdcaf8a80e3a7665536afb02d571bcb9', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.clearInput && !readonly && !disabled && (h("button", { "aria-label": "reset", type: "button", class: "input-clear-icon", onPointerDown: (ev) => {
+            }) }, h("label", { key: 'c241838173e639eebad7d8067063999fc609320b', class: "input-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: 'c392fcd8367aa3a05fac3a5774dad0525670d4d0', class: "native-wrapper" }, h("slot", { key: '3f6bb21aab004dfc7957ca42d18acac73c240a0e', name: "start" }), h("input", Object.assign({ key: '86720e7d2b4e2f5cfe7dfee4c9947f0998279e17', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.clearInput && !readonly && !disabled && (h("button", { "aria-label": "reset", type: "button", class: "input-clear-icon", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the clear
                  * button is activated.
                  */
                 ev.preventDefault();
-            }, onClick: this.clearTextInput }, h("ion-icon", { "aria-hidden": "true", icon: mode === 'ios' ? closeCircle : closeSharp }))), h("slot", { key: 'bdcffc81c8d07c793a06d9880a02d7b94ddfff2e', name: "end" })), shouldRenderHighlight && h("div", { class: "input-highlight" })), this.renderBottomContent()));
+            }, onClick: this.clearTextInput }, h("ion-icon", { "aria-hidden": "true", icon: clearIconData }))), h("slot", { key: '55cf54320c1555fd3501374d2c2b4e9c1dce046f', name: "end" })), shouldRenderHighlight && h("div", { class: "input-highlight" })), this.renderBottomContent()));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -44,12 +44,12 @@ const ItemOption = class {
                 href: this.href,
                 target: this.target,
             };
-        return (h(Host, { key: '85fe8f529ab0673f1ddba299473690590a1bca88', onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: '8cae654786fadc2cfe864e495645715cb53a3e68', onClick: this.onClick, class: createColorClasses(this.color, {
                 [mode]: true,
                 'item-option-disabled': disabled,
                 'item-option-expandable': expandable,
                 'ion-activatable': true,
-            }) }, h(TagType, Object.assign({ key: 'cde9bca980cb5589204017d80483baab0996586e' }, attrs, { class: "button-native", part: "native", disabled: disabled }), h("span", { key: 'e2b7886b53b0b85d81fbfd9209c2989673cdb863', class: "button-inner" }, h("slot", { key: 'eaf089857ff0a22d3a9c12574596002e32a28c75', name: "top" }), h("div", { key: '12f5d46fe5b8b5d2a5d2bd9e4782376c5af86f1c', class: "horizontal-wrapper" }, h("slot", { key: 'ba6d89b7c7f9470f73e17808f90d578fbcceba48', name: "start" }), h("slot", { key: '22ad963dd37ae40c03a5723c3e3b05970f40d871', name: "icon-only" }), h("slot", { key: 'a1596a1961b5757828fafaa9edf9da3381482ff3' }), h("slot", { key: 'ad0d2b50de279a712e18985ce9aceda7b5d45712', name: "end" })), h("slot", { key: '2940933c947f7e2d9875f0fb980aff392d5ea7fa', name: "bottom" })), mode === 'md' && h("ion-ripple-effect", null))));
+            }) }, h(TagType, Object.assign({ key: '296e26957428fc701d52695cfbad83d507e02060' }, attrs, { class: "button-native", part: "native", disabled: disabled }), h("span", { key: '51b3d2e3ce737c8034678dec4fcda4dfbc1438e6', class: "button-inner" }, h("slot", { key: 'be0fbb128ef61a6deaa52eb1197c0f3481cc4ae3', name: "top" }), h("div", { key: '7ba732ae5b8c94c0448df3c3500d9f6eac71d61c', class: "horizontal-wrapper" }, h("slot", { key: '90bf045e30ae006aa7418fd25c1090de27164980', name: "start" }), h("slot", { key: '6858e4a608a4ac9144de58ada851ae3497ae7f74', name: "icon-only" }), h("slot", { key: 'a35037681327fd5753f6d3d7c9ad37b960885e96' }), h("slot", { key: '834c710c88cead42fe3d9ce7f714b62df8a8a604', name: "end" })), h("slot", { key: 'b574fe0f3655dfd9ef1e668983278b28951269e4', name: "bottom" })), mode === 'md' && h("ion-ripple-effect", null))));
     }
     get el() { return getElement(this); }
 };
@@ -79,7 +79,7 @@ const ItemOptions = class {
     render() {
         const mode = getIonMode(this);
         const isEnd = isEndSide(this.side);
-        return (h(Host, { key: 'ac0cec6a2ea83c9633c10bce379ffdcc99221b52', class: {
+        return (h(Host, { key: '3d1b754bcc184044cd0213eab08fb22224abddfb', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`item-options-${mode}`]: true,
@@ -487,7 +487,7 @@ const ItemSliding = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: 'ae9da267d130e2875b2d854952b70daa739effd8', class: {
+        return (h(Host, { key: '1c2d40968e7a306e4d63443571a7581e0511c9c4', class: {
                 [mode]: true,
                 'item-sliding-active-slide': this.state !== 2 /* SlidingState.Disabled */,
                 'item-sliding-active-options-end': (this.state & 8 /* SlidingState.End */) !== 0,

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

@@ -238,11 +238,11 @@ const ItemDivider = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '18d1b78568247bfbf0b0274971b752ace7531f58', class: createColorClasses(this.color, {
+        return (h(Host, { key: '41b2a690aefd50a634401a985600b6eff9a68d2e', class: createColorClasses(this.color, {
                 [mode]: true,
                 'item-divider-sticky': this.sticky,
                 item: true,
-            }) }, h("slot", { key: 'cbf5fe1a9f4233a303d2366d1fc032d7c445f5c7', name: "start" }), h("div", { key: 'ca2608689325a350b23eb026053dd588ea3004e9', class: "item-divider-inner" }, h("div", { key: '00af1d58d5fc7995754a5266534cdf989a3294eb', class: "item-divider-wrapper" }, h("slot", { key: 'bfa2547fe8de49dcfbfccaeb46736182e514ffbc' })), h("slot", { key: '650dd1153d211eb992e69ff7e98c381cf0555e25', name: "end" }))));
+            }) }, h("slot", { key: 'b112bb29c21cfee950b6e5efb0dbb0abf0960546', name: "start" }), h("div", { key: '4aa596db07830cd597e08d927a02a033b1d3cc63', class: "item-divider-inner" }, h("div", { key: '23f288847d93c1ef4ad2e619f0eb88440240e9ea', class: "item-divider-wrapper" }, h("slot", { key: '9e9b2cc3baa537e64ff45b373322a46fb3658878' })), h("slot", { key: 'c7269f28307f00fccc47e1efb58984430ae13a5d', name: "end" }))));
     }
     get el() { return getElement(this); }
 };
@@ -263,7 +263,7 @@ const ItemGroup = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '2443d9e64c1867a9582a2965ed9ac78263965d70', role: "group", class: {
+        return (h(Host, { key: 'd0ceadd6baf0735aa38607c2207309add77e2162', role: "group", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`item-group-${mode}`]: true,
@@ -333,13 +333,13 @@ const Label = class {
     render() {
         const position = this.position;
         const mode = getIonMode(this);
-        return (h(Host, { key: '6820fe45a0aa73dca665a43f588f952e94c194c7', class: createColorClasses(this.color, {
+        return (h(Host, { key: '567b47008af8b025a043b6e00d4333c3164c5247', class: createColorClasses(this.color, {
                 [mode]: true,
                 'in-item-color': hostContext('ion-item.ion-color', this.el),
                 [`label-${position}`]: position !== undefined,
                 [`label-no-animate`]: this.noAnimate,
                 'label-rtl': document.dir === 'rtl',
-            }) }, h("slot", { key: '79815d03fbfc141573f69eb037592837ca3428ce' })));
+            }) }, h("slot", { key: 'a3a8fa43fb1d74355dae8418f827ea13aa897640' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -380,7 +380,7 @@ const List = class {
     render() {
         const mode = getIonMode(this);
         const { lines, inset } = this;
-        return (h(Host, { key: '9a0eab31e53ae22dbfa7aa58d779d3976797ea08', role: "list", class: {
+        return (h(Host, { key: 'dd30ba8fb55bc55b570f6cd8babd4752d995c79b', role: "list", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`list-${mode}`]: true,
@@ -411,10 +411,10 @@ const ListHeader = class {
     render() {
         const { lines } = this;
         const mode = getIonMode(this);
-        return (h(Host, { key: '8788351ca44861f264661da2412d6ce7906126bd', class: createColorClasses(this.color, {
+        return (h(Host, { key: '7b0de2d26ec09f11740ad55bba5e4d2f52623b58', class: createColorClasses(this.color, {
                 [mode]: true,
                 [`list-header-lines-${lines}`]: lines !== undefined,
-            }) }, h("div", { key: '8801cb2fdddb2dab0c649aef1ffbac8f0ba9fbe0', class: "list-header-inner" }, h("slot", { key: '7fc87318333b7ee0c3eee91abc64a9275ad43a26' }))));
+            }) }, h("div", { key: '86cbae45e24ce7607b011cd3cd1ae82e741a111c', class: "list-header-inner" }, h("slot", { key: 'a276c0540cd1bdd907b01620d5bfb9c996c08b90' }))));
     }
 };
 ListHeader.style = {
@@ -435,9 +435,9 @@ const Note = class {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '4064be8c5aceec02a25b8933338596b1720e19d9', class: createColorClasses(this.color, {
+        return (h(Host, { key: '83fbede35bbb772419d68f6ad398aab0e00b9f61', class: createColorClasses(this.color, {
                 [mode]: true,
-            }) }, h("slot", { key: '9b4265b01387096a8a6aba34a1d8217733bb6f1f' })));
+            }) }, h("slot", { key: 'c4060ce2439e96a5ac8763843579b7956a90032f' })));
     }
 };
 Note.style = {
@@ -470,11 +470,11 @@ const SkeletonText = class {
         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: 'a093b75e3cac98eed870a682f55a6a305d6ba0ba', class: {
+        return (h(Host, { key: 'e0a84e5017cde072087d5580dd370bbd36106f99', class: {
                 [mode]: true,
                 'skeleton-text-animated': animated,
                 'in-media': inMedia,
-            } }, h("span", { key: 'e73bb72ba6e57b4e5ddbe03acdb844b0ba63a0b9' }, "\u00A0")));
+            } }, h("span", { key: '3274a42e3fd4f1b9fb285f4b982416e1f68ac766' }, "\u00A0")));
     }
     get el() { return getElement(this); }
 };

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

@@ -5,7 +5,7 @@ import { r as registerInstance, d as createEvent, h, f as Host, i as getElement
 import { E as ENABLE_HTML_CONTENT_DEFAULT, a as sanitizeDOMString } from './config-49c88215.js';
 import { r as raf } from './helpers-da915de8.js';
 import { c as createLockController } from './lock-controller-316928be.js';
-import { d as createDelegateController, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-9472c98b.js';
+import { d as createDelegateController, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-634df4be.js';
 import { g as getClassMap } from './theme-01f3f29c.js';
 import { c as config, b as getIonMode } from './ionic-global-c4e0c089.js';
 import { c as createAnimation } from './animation-eab5a4ca.js';
@@ -258,9 +258,9 @@ const Loading = class {
          * Otherwise, don't set aria-labelledby.
          */
         const ariaLabelledBy = message !== undefined ? msgId : null;
-        return (h(Host, Object.assign({ key: '255c2d52a0788769ca8ac027eababc903f525d0e', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '0b32f7915df1327934877cc71228aea71205266f', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${40000 + this.overlayIndex}`,
-            }, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), h("ion-backdrop", { key: 'd3a70d4e67a6578b01a82f97cb54f79342e7fd62', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '9641470dc2f759e674cd176662c12161bf22e078', tabindex: "0" }), h("div", { key: 'a1b986633eff28e8da49eec08dfb27acab63a88e', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (h("div", { class: "loading-spinner" }, h("ion-spinner", { name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), h("div", { key: 'ab8a43e8d71756be287f92961ebdc0bbe2d1882b', tabindex: "0" })));
+            }, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), h("ion-backdrop", { key: 'ca6c4c48b83457685a17c7a396e67cd7a6b06ab9', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: 'd76304807d988c02de44fc947124a15179ba2c6c', tabindex: "0" }), h("div", { key: '79ec338787a709a668c8f170d75a271bad3c2488', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (h("div", { class: "loading-spinner" }, h("ion-spinner", { name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), h("div", { key: 'a8e3e70c79e1b359f821c6769b1f4b4bf90da992', tabindex: "0" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -3,7 +3,7 @@
  */
 import { r as registerInstance, d as createEvent, h, f as Host, i as getElement } from './index-6e4709ff.js';
 import { g as getTimeGivenProgression } from './cubic-bezier-fe2083dc.js';
-import { o as getPresentedOverlay, n as focusFirstDescendant, q as focusLastDescendant } from './overlays-9472c98b.js';
+import { o as getPresentedOverlay, n as focusFirstDescendant, q as focusLastDescendant } from './overlays-634df4be.js';
 import { G as GESTURE_CONTROLLER } from './gesture-controller-314a54f6.js';
 import { shouldUseCloseWatcher } from './hardware-back-button-329c81fd.js';
 import { n as isEndSide, i as inheritAriaAttributes, m as assert, j as clamp } from './helpers-da915de8.js';
@@ -595,14 +595,14 @@ const Menu = class {
          * the ionBackButton listener in the menu controller
          * will handle closing the menu when Escape is pressed.
          */
-        return (h(Host, { key: 'f5f151ca5bf4963c0300656327bb9c38bc7869fb', onKeyDown: shouldUseCloseWatcher() ? null : this.onKeydown, role: "navigation", "aria-label": inheritedAttributes['aria-label'] || 'menu', class: {
+        return (h(Host, { key: 'b1ad113462ad4df94e6cd66d2afb5a8464869909', onKeyDown: shouldUseCloseWatcher() ? null : this.onKeydown, role: "navigation", "aria-label": inheritedAttributes['aria-label'] || 'menu', class: {
                 [mode]: true,
                 [`menu-type-${type}`]: true,
                 'menu-enabled': !disabled,
                 [`menu-side-${side}`]: true,
                 'menu-pane-visible': isPaneVisible,
                 'split-pane-side': hostContext('ion-split-pane', el),
-            } }, h("div", { key: '39ddd64f884cc667e45f99a2922077d87f209205', class: "menu-inner", part: "container", ref: (el) => (this.menuInnerEl = el) }, h("slot", { key: '1ccce2c24ec0dfc81a34580c8be60c69c68d2d2d' })), h("ion-backdrop", { key: 'cf2bdf7f4171a4ada3cb55dd15f6b921b626a347', ref: (el) => (this.backdropEl = el), class: "menu-backdrop", tappable: false, stopPropagation: false, part: "backdrop" })));
+            } }, h("div", { key: '2aeb119aaf00a69b1cc0dedcafd8987286e1c2d1', class: "menu-inner", part: "container", ref: (el) => (this.menuInnerEl = el) }, h("slot", { key: '6f732c578b6ffceb06cd08725d056378f4dc5da2' })), h("ion-backdrop", { key: 'f524bd70256beae5c9711eb32762294badb326cc', ref: (el) => (this.backdropEl = el), class: "menu-backdrop", tappable: false, stopPropagation: false, part: "backdrop" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -675,7 +675,7 @@ const MenuButton = class {
             type: this.type,
         };
         const ariaLabel = inheritedAttributes['aria-label'] || 'menu';
-        return (h(Host, { key: '1588897aeaefa91e13ed15927f2eeaebc01e8f18', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-hidden": hidden ? 'true' : null, class: createColorClasses(color, {
+        return (h(Host, { key: '3cdbc04925c8c62ac65763fe83efdfffda0a16fa', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-hidden": hidden ? 'true' : null, class: createColorClasses(color, {
                 [mode]: true,
                 button: true, // ion-buttons target .button
                 'menu-button-hidden': hidden,
@@ -684,7 +684,7 @@ const MenuButton = class {
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'ion-activatable': true,
                 'ion-focusable': true,
-            }) }, h("button", Object.assign({ key: 'cb4e5b3d2095e15a53fa24ac65209162ec635476' }, attrs, { disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }), h("span", { key: '1c2f499b40e8b9b18e3cb0ed28bbcca01e6d777f', class: "button-inner" }, h("slot", { key: 'df2f969098b5779f54c2d51b4816c7b78b45c860' }, h("ion-icon", { key: 'd093d7377c7f1a5a47b3cc319b36e5087421cf4c', part: "icon", icon: menuIcon, mode: mode, lazy: false, "aria-hidden": "true" }))), mode === 'md' && h("ion-ripple-effect", { type: "unbounded" }))));
+            }) }, h("button", Object.assign({ key: '63db22c49359bf77fa344f5a13b733570ff088a4' }, attrs, { disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }), h("span", { key: '011af3fa930dd888f7f4aca24ba294d23b2ceba7', class: "button-inner" }, h("slot", { key: 'dc75fd2f1f3d42eb30aefd9cd3ef137d6c8a515a' }, h("ion-icon", { key: '55cfdc7df1eab0bdc386e2a5c90be87be56a000a', part: "icon", icon: menuIcon, mode: mode, lazy: false, "aria-hidden": "true" }))), mode === 'md' && h("ion-ripple-effect", { type: "unbounded" }))));
     }
     get el() { return getElement(this); }
 };
@@ -715,10 +715,10 @@ const MenuToggle = class {
     render() {
         const mode = getIonMode(this);
         const hidden = this.autoHide && !this.visible;
-        return (h(Host, { key: '63bcdda9e9917133893d92284b9a91dfe38596a9', onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
+        return (h(Host, { key: 'fa7f54b6264dd2110f4cda34aaa6ea7ec4f5040f', onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
                 [mode]: true,
                 'menu-toggle-hidden': hidden,
-            } }, h("slot", { key: 'a3ecc57b11c04b2f9911e5703ea0c6f66515b2f2' })));
+            } }, h("slot", { key: '6e1701d21f439cabd9f83607c500eb6111162447' })));
     }
 };
 MenuToggle.style = IonMenuToggleStyle0;

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

@@ -8,7 +8,7 @@ import { g as getElementRoot, j as clamp, r as raf, h as inheritAttributes, k as
 import { c as createLockController } from './lock-controller-316928be.js';
 import { p as printIonWarning } from './index-9b0d46f4.js';
 import { g as getCapacitor } from './capacitor-59395cbd.js';
-import { G as GESTURE, O as OVERLAY_GESTURE_PRIORITY, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-9472c98b.js';
+import { G as GESTURE, O as OVERLAY_GESTURE_PRIORITY, F as FOCUS_TRAP_DISABLE_CLASS, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-634df4be.js';
 import { g as getClassMap } from './theme-01f3f29c.js';
 import { e as deepReady, w as waitForMount } from './index-f1f5de26.js';
 import { b as getIonMode, c as config } from './ionic-global-c4e0c089.js';
@@ -814,7 +814,7 @@ const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, ba
          * as inputs should not be focusable outside
          * the sheet.
          */
-        baseEl.classList.remove('ion-disable-focus-trap');
+        baseEl.classList.remove(FOCUS_TRAP_DISABLE_CLASS);
     };
     const disableBackdrop = () => {
         baseEl.style.setProperty('pointer-events', 'none');
@@ -826,7 +826,7 @@ const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, ba
          * Adding this class disables focus trapping
          * for the sheet temporarily.
          */
-        baseEl.classList.add('ion-disable-focus-trap');
+        baseEl.classList.add(FOCUS_TRAP_DISABLE_CLASS);
     };
     /**
      * After the entering animation completes,
@@ -1167,6 +1167,7 @@ const Modal = class {
         this.isOpen = false;
         this.trigger = undefined;
         this.keepContentsMounted = false;
+        this.focusTrap = true;
         this.canDismiss = true;
     }
     onIsOpenChange(newValue, oldValue) {
@@ -1623,14 +1624,14 @@ const Modal = class {
         return true;
     }
     render() {
-        const { handle, isSheetModal, presentingElement, htmlAttributes, handleBehavior, inheritedAttributes } = this;
+        const { handle, isSheetModal, presentingElement, htmlAttributes, handleBehavior, inheritedAttributes, focusTrap } = this;
         const showHandle = handle !== false && isSheetModal;
         const mode = getIonMode(this);
         const isCardModal = presentingElement !== undefined && mode === 'ios';
         const isHandleCycle = handleBehavior === 'cycle';
-        return (h(Host, Object.assign({ key: '18053756559601f785776196d9dd269f8250c813', "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '1fbeb502325f00153e335c235a038507e35a210e', "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }), h("ion-backdrop", { key: 'c080204fb09a67046d1986db28ccb7a1c8f0704d', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && h("div", { class: "modal-shadow" }), h("div", Object.assign({ key: '1988ad86ef92108ad4c980ee6d98f280e368dee4',
+            }, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, 'overlay-hidden': true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }), h("ion-backdrop", { key: '388aa2b92fa5795d1ef9021c4df9817ac426bcea', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && h("div", { class: "modal-shadow" }), h("div", Object.assign({ key: '752f4e329a330cc0802476404ef292f73fac257f',
             /*
               role and aria-modal must be used on the
               same element. They must also be set inside the
@@ -1639,7 +1640,7 @@ const Modal = class {
             */
             role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (h("button", { class: "modal-handle",
             // Prevents the handle from receiving keyboard focus when it does not cycle
-            tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle" })), h("slot", { key: '321e79f29eba3faab323d17ae575300e25fc0c51' }))));
+            tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle" })), h("slot", { key: '87d1d4a725c463cefed2e96a6a9fee36ba6e8311' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -898,7 +898,7 @@ const Nav = class {
         }
     }
     render() {
-        return h("slot", { key: '2cb1a430d8d29b0f54b1ec80f98e4b82b6c8cc0a' });
+        return h("slot", { key: 'a86e551f86509bd65200393785e4000dbb37154a' });
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -940,7 +940,7 @@ const NavLink = class {
         this.routerAnimation = undefined;
     }
     render() {
-        return h(Host, { key: 'e4aebea5eb131852acea407afb84597df71be4a4', onClick: this.onClick });
+        return h(Host, { key: '7b6b746a0e945a48b308eec2dcd9893daf00bca1', onClick: this.onClick });
     }
     get el() { return getElement(this); }
 };

package/dist/esm/ion-picker-column-option.entry.js

@@ -84,10 +84,10 @@ const PickerColumnOption = class {
     render() {
         const { color, disabled, ariaLabel } = this;
         const mode = getIonMode(this);
-        return (h(Host, { key: '9333d9ac8e9990fc840f31e00391177d9cd563b3', class: createColorClasses(color, {
+        return (h(Host, { key: '1d5358c019c01ca429ddb514b9f9b67a3c89f652', class: createColorClasses(color, {
                 [mode]: true,
                 ['option-disabled']: disabled,
-            }) }, h("button", { key: '6ca92bc584587230135982106eab542589fc4c9d', tabindex: "-1", "aria-label": ariaLabel, disabled: disabled, onClick: () => this.onClick() }, h("slot", { key: 'd9a68906017f77143a0691b9bbc59ae2142da6aa' }))));
+            }) }, h("button", { key: 'c86794a15b61062a886c6f5113723ccd98238e9f', tabindex: "-1", "aria-label": ariaLabel, disabled: disabled, onClick: () => this.onClick() }, h("slot", { key: 'ab7f80cacdd39b5aedf7d2cc8eddc6288093629a' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ion-picker-column.entry.js

@@ -383,14 +383,14 @@ const PickerColumn = class {
     render() {
         const { color, disabled, isActive, numericInput } = this;
         const mode = getIonMode(this);
-        return (h(Host, { key: '20de89f624d0fdbb4eadf912a6a8a8c1f3c374bc', class: createColorClasses(color, {
+        return (h(Host, { key: '36fba9b5a9938eb80facbd39ebf2227c0b8df96b', class: createColorClasses(color, {
                 [mode]: true,
                 ['picker-column-active']: isActive,
                 ['picker-column-numeric-input']: numericInput,
                 ['picker-column-disabled']: disabled,
-            }) }, h("slot", { key: '39bd2171785e21aef935787d8222949a2d29a771', name: "prefix" }), h("div", { key: '97217b758b65913db869f322b8f127f0da3a1c28', class: "picker-opts", tabindex: disabled ? undefined : 0, ref: (el) => {
+            }) }, h("slot", { key: 'e872bd8ccecb45f2abfae0a17c99bd193c323fb7', name: "prefix" }), h("div", { key: '3b8d9502fb428c99aa18e5396cd4f37a7cac222f', class: "picker-opts", tabindex: disabled ? undefined : 0, ref: (el) => {
                 this.scrollEl = el;
-            } }, h("div", { key: '8cfd8f5de1c274f7b2b5b14c7f6f875d475edc5c', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: 'cfbf7e8abe54c4df98addb9a24e82dd803ba95c0', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: '8049923186d8b5ce28da2ce90ad720c244395f9c', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("slot", { key: '180efa3b7874e2b4269fb150794eaeab9f648f2e' }), h("div", { key: '9161cc3e344b92354276981813e1d55ef9979dea', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: 'ce703fb3ea07d5ea2abf526d64ca85d2beed15f1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: '6ce6cb5de80ac316a664e9cfcecf1897c8f90e58', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), h("slot", { key: 'ecccfa6bd8f6d2d641109e74d0788081e3f29801', name: "suffix" })));
+            } }, h("div", { key: 'b5f1bb3f63cc786fb5363b0c4a8e3c7de5336f5e', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: '9b19a3d7463dc4b0b1f85f29573f5ab09da9cfe4', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: '981c7c7171318c5b5bc31ed2de35ffd1a7229760', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("slot", { key: '387695afab07d859ec22c3d8b096485c694eff1e' }), h("div", { key: 'dca63e9f8945cf0a2010b552e79cc8c821e7d1ff', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: '95e80d163c50f3112fbc36cb66502e07f87b2aa1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), h("div", { key: 'd29c471d7529b7eebb10b1fe1ac7d93be25aedb1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), h("slot", { key: 'bc3527c0dd2ec7775f3ae16feb06736308a996e5', name: "suffix" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {