@ionic/core 7.7.2-nightly.20240208 → 7.7.2-nightly.20240209

package/components/action-sheet.js

@@ -177,6 +177,10 @@ const ActionSheet = /*@__PURE__*/ proxyCustomElement(class ActionSheet extends H
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the action sheet.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -285,12 +289,12 @@ const ActionSheet = /*@__PURE__*/ proxyCustomElement(class ActionSheet extends H
         const cancelButton = allButtons.find((b) => b.role === 'cancel');
         const buttons = allButtons.filter((b) => b.role !== 'cancel');
         const headerID = `action-sheet-${overlayIndex}-header`;
-        return (h(Host, Object.assign({ key: '98851ef73ef85bb1e364111f090480102929a197', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'cd141d12d7d86d3402fd220c4afb61cdbf064c04', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: 'e2520342ca16aae4dac0bd7bff59b2150aeb2171', tappable: this.backdropDismiss }), h("div", { key: 'c95f2ec4edde1dc3a8860e68b4a86b82f6797aee', tabindex: "0" }), h("div", { key: '7af9edad368e308508801c8ef2225928ced63159', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: 'd1d92b4d1814d34eb7d8134ff77ee260ca521a6d', class: "action-sheet-container" }, h("div", { key: 'cc774b45a9992e95bfee788cb484d99364b76d22', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (h("div", { id: headerID, class: {
+            }, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: 'b6a051e2cf5e101edbf59c8a40a04d8f7107fb3c', tappable: this.backdropDismiss }), h("div", { key: '5bfa2b37a417aaff3776f06d92a8544dfcbf714f', tabindex: "0" }), h("div", { key: '77d5a217803fd7be8f8dbedcd0ef5e59f0fd9800', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '3901d56215f05cdab074e2ec321391281a165097', class: "action-sheet-container" }, h("div", { key: '275f5c7981b2ee44fb632b3d137c7209cbfcf45c', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (h("div", { id: headerID, class: {
                 'action-sheet-title': true,
                 'action-sheet-has-sub-title': this.subHeader !== undefined,
-            } }, header, this.subHeader && h("div", { class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b) }), h("span", { class: "action-sheet-button-inner" }, b.icon && h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && h("ion-ripple-effect", null))))), cancelButton && (h("div", { class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({}, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", null)))))), h("div", { key: '9a013adda7dec101cf0c90feb02f5b7f5582a0b3', tabindex: "0" })));
+            } }, header, this.subHeader && h("div", { class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b) }), h("span", { class: "action-sheet-button-inner" }, b.icon && h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && h("ion-ripple-effect", null))))), cancelButton && (h("div", { class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({}, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", null)))))), h("div", { key: '4285893438675be9b40838a93c2ff382a1074cd3', tabindex: "0" })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/alert.js

@@ -315,6 +315,10 @@ const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends HTMLElement {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the alert.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -482,9 +486,9 @@ const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends HTMLElement {
          * If neither is defined, don't set aria-labelledby.
          */
         const ariaLabelledBy = header ? hdrId : subHeader ? subHdrId : null;
-        return (h(Host, Object.assign({ key: '8327e1aef6c404c2021d43aaa542d86e839817f5', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '4b7f7880dc5f39aa9b61981af0a821ac0350af7f', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '814a4e1b4f7560026b089b762c68401b6277355e', tappable: this.backdropDismiss }), h("div", { key: 'b31ce08019e7223a098d18cb857f72eddc245e98', tabindex: "0" }), h("div", { key: '77efa4b9f7062f55ba0998a09a24550ec0b9b4f5', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '648e0768610ee57f9e5c84b8955da497ec9b0b82', class: "alert-head" }, header && (h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: 'f3d752cce77ca021dc959611ad5078b94b7f3cec', tabindex: "0" })));
+            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '961a2684013ac61d59882914fd8d759ddb542fe7', tappable: this.backdropDismiss }), h("div", { key: '2ec08c3719b3cd8a4cae09d2c6ac778ffad5f940', tabindex: "0" }), h("div", { key: 'ee543683d20693c9a9497aca4d41f032aa580c9c', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '55015102b67d080249a8859fc8788f3a82d5ead9', class: "alert-head" }, header && (h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: 'df7bcfb0cb41965f169de05edd631a050d5ce648', tabindex: "0" })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-loading.js

@@ -211,6 +211,10 @@ const Loading = /*@__PURE__*/ proxyCustomElement(class Loading extends HTMLEleme
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the loading.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -252,9 +256,9 @@ const Loading = /*@__PURE__*/ proxyCustomElement(class Loading extends HTMLEleme
          * Otherwise, don't set aria-labelledby.
          */
         const ariaLabelledBy = message !== undefined ? msgId : null;
-        return (h(Host, Object.assign({ key: '81295894ca6e047124918420f2483c092ebf91b9', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '95123f54ba1db5e59563d79db075315b43ed20f7', 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: 'db9fbd946cf3eb03c3a70f2e71c49ab233df1879', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: 'd27b03de0b450c0668d4b4077d76bc5b283f03cf', tabindex: "0" }), h("div", { key: '7112719ddd487365c1e36fc4dec32aac888dbb52', 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: '5715dd7dae209ae58e5557cb60f3ae514752b822', 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: 'e113bf123eaad38f2dafce8ea5d2ebef409d0c0f', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '1268c9480854383c7883a79d597350540ade93c2', tabindex: "0" }), h("div", { key: 'e86fc71504ebd578117dea2232d9740a087d1249', 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: '3b91e2492e06aa65ebe77ed2b6ffb9d2f84bdd9c', tabindex: "0" })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-modal.js

@@ -1479,6 +1479,10 @@ const Modal = /*@__PURE__*/ proxyCustomElement(class Modal extends HTMLElement {
      *
      * @param data Any data to emit in the dismiss events.
      * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         var _a;
@@ -1609,9 +1613,9 @@ const Modal = /*@__PURE__*/ proxyCustomElement(class Modal extends HTMLElement {
         const mode = getIonMode(this);
         const isCardModal = presentingElement !== undefined && mode === 'ios';
         const isHandleCycle = handleBehavior === 'cycle';
-        return (h(Host, Object.assign({ key: '9a305d82f123283b6200c42d67393b378bb309a8', "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '0c2c4369ab2df4ef4660addea5e927c6a0232864', "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: '85e8dc6f19b30fd95db518445929fb0c1d5cdef0', 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: '893a0202d91828e60099311442c2677bee5464e2',
+            }, 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: 'd044383a776c2ee1703f996caedaedca47f2948f', 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: '8d23b6a3cc9069e4d46fa0645cde9db3e6f89507',
             /*
               role and aria-modal must be used on the
               same element. They must also be set inside the
@@ -1620,7 +1624,7 @@ const Modal = /*@__PURE__*/ proxyCustomElement(class Modal extends HTMLElement {
             */
             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: '25187bf4c69d9022930227b8b8748a294176be5f' }))));
+            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: '3fbb689e4bf5575fbb26ad1000f6ac5993f3bf8f' }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-picker.js

@@ -167,6 +167,10 @@ const Picker = /*@__PURE__*/ proxyCustomElement(class Picker extends HTMLElement
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the picker.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -238,11 +242,11 @@ const Picker = /*@__PURE__*/ proxyCustomElement(class Picker extends HTMLElement
     render() {
         const { htmlAttributes } = this;
         const mode = getIonMode(this);
-        return (h(Host, Object.assign({ key: '8b9049c5315e701dff3f7457be646941bb3cc0df', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'c266cc072afaba2da22f70d8b62dc4bc6756d188', "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: '4f62ae6c088108189bfab18b680f0ae50b4cc395', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: 'c5fd2584ca4470c69bf61582cef2ac72289addba', tabindex: "0" }), h("div", { key: '2e68572dd5ddc4911c1e6bca57a2157b47477348', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, h("div", { key: '218526e531998a4d5a6377499acb42f99b347729', 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: '4dd711f1fa1f2a4bd24696ae1633da16bbf55879', class: "picker-columns" }, h("div", { key: '440ebd807ca3675b0055e67e0354ac4625ae375d', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => h("ion-picker-column", { col: c })), h("div", { key: '5cdceda410904470e3742ab416ed3d3a661b6859', class: "picker-below-highlight" }))), h("div", { key: '0c96e8a43a6d4cd4b8b7c9e81c54414eb1d989bf', tabindex: "0" })));
+                [`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '35ee3e5028028835580e28ac2c8db65a924d5d6a', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '8b454e6edbcfc45c57d3d8baf7c14b7905921a6e', tabindex: "0" }), h("div", { key: 'e0fee78ec6d097bf0963190f748e5daad602e0f7', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, h("div", { key: 'ce66bca18fc3e982ad7d6660f27cb1a03fb8247b', 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: 'a58b9523fe16f109dd6de0610717c5077fed964b', class: "picker-columns" }, h("div", { key: 'acd54c0314cff51e8513a08dd9755c4b847c0617', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => h("ion-picker-column", { col: c })), h("div", { key: '604730bd87582d048d850c6e0a0f29ba33258918', class: "picker-below-highlight" }))), h("div", { key: '93baf5e6e57aec5f084d7d5b24af14e7d8126b5a', tabindex: "0" })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-toast.js

@@ -657,6 +657,10 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends HTMLElement {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the toast.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         var _a, _b;
@@ -824,9 +828,9 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends HTMLElement {
         if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
             printIonWarning('This toast is using start and end buttons with the stacked toast layout. We recommend following the best practice of using either start or end buttons with the stacked toast layout.', el);
         }
-        return (h(Host, Object.assign({ key: '15a5c3e8d475435c838b70c55ef2e7cc12d6abfb', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'c8d7e7d2baa01d3ed5d65a845bc61acf087c0b18', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: 'a6ed7fb75ab098dc632d1a546b4d5298675c14c1', class: wrapperClass }, h("div", { key: '68ff7219e9abae0b7c2030369ebffd2fe0edf7de', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '6b45ca5e283d3507c682cbe733e27a94460a7f69', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
+            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '27c0feeb89c4efb47c42623a4b036ed84338ed10', class: wrapperClass }, h("div", { key: '41d5a3069f92e4a6acef2793fa4e236cdbdaae88', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '176f497bc990ef2ecc14c7fa90dd3a54a912030a', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/popover.js

@@ -1237,6 +1237,10 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class Popover extends HTMLEleme
      * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
      * @param dismissParentPopover If `true`, dismissing this popover will also dismiss
      * a parent popover if this popover is nested. Defaults to `true`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role, dismissParentPopover = true) {
         const unlock = await this.lockController.lock();
@@ -1288,9 +1292,9 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class Popover extends HTMLEleme
         const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes } = this;
         const desktop = isPlatform('desktop');
         const enableArrow = arrow && !parentPopover;
-        return (h(Host, Object.assign({ key: 'f335ae001173483e6a973b2084f8a7b6b895ae5d', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '104a5bf92a9bbd2efc71d499a8500e5d55f81711', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && h("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), h("div", { key: '8468f39b0a0f30b42ae9cac51950e5f0b9be1069', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && h("div", { class: "popover-arrow", part: "arrow" }), h("div", { key: 'cb4eeaef385187f3c8e566931844e30edd5451c4', class: "popover-content", part: "content" }, h("slot", { key: '80a5739a4beb6eba150503e426104701954c90b9' })))));
+            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && h("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), h("div", { key: 'ef0baa04c22444d4bc705220235a892308d67586', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && h("div", { class: "popover-arrow", part: "arrow" }), h("div", { key: '5cc5f5c353de614e484e9cfeacecfca9fbfde0e0', class: "popover-content", part: "content" }, h("slot", { key: '2d85c591cdc85efa98afbf40f676525f1402efcf' })))));
     }
     get el() { return this; }
     static get watchers() { return {

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

@@ -185,6 +185,10 @@ const ActionSheet = class {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the action sheet.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -293,12 +297,12 @@ const ActionSheet = class {
         const cancelButton = allButtons.find((b) => b.role === 'cancel');
         const buttons = allButtons.filter((b) => b.role !== 'cancel');
         const headerID = `action-sheet-${overlayIndex}-header`;
-        return (index.h(index.Host, Object.assign({ key: '98851ef73ef85bb1e364111f090480102929a197', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: 'cd141d12d7d86d3402fd220c4afb61cdbf064c04', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({ [mode]: true }, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), index.h("ion-backdrop", { key: 'e2520342ca16aae4dac0bd7bff59b2150aeb2171', tappable: this.backdropDismiss }), index.h("div", { key: 'c95f2ec4edde1dc3a8860e68b4a86b82f6797aee', tabindex: "0" }), index.h("div", { key: '7af9edad368e308508801c8ef2225928ced63159', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, index.h("div", { key: 'd1d92b4d1814d34eb7d8134ff77ee260ca521a6d', class: "action-sheet-container" }, index.h("div", { key: 'cc774b45a9992e95bfee788cb484d99364b76d22', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (index.h("div", { id: headerID, class: {
+            }, class: Object.assign(Object.assign({ [mode]: true }, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), index.h("ion-backdrop", { key: 'b6a051e2cf5e101edbf59c8a40a04d8f7107fb3c', tappable: this.backdropDismiss }), index.h("div", { key: '5bfa2b37a417aaff3776f06d92a8544dfcbf714f', tabindex: "0" }), index.h("div", { key: '77d5a217803fd7be8f8dbedcd0ef5e59f0fd9800', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, index.h("div", { key: '3901d56215f05cdab074e2ec321391281a165097', class: "action-sheet-container" }, index.h("div", { key: '275f5c7981b2ee44fb632b3d137c7209cbfcf45c', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (index.h("div", { id: headerID, class: {
                 'action-sheet-title': true,
                 'action-sheet-has-sub-title': this.subHeader !== undefined,
-            } }, header, this.subHeader && index.h("div", { class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (index.h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b) }), index.h("span", { class: "action-sheet-button-inner" }, b.icon && index.h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && index.h("ion-ripple-effect", null))))), cancelButton && (index.h("div", { class: "action-sheet-group action-sheet-group-cancel" }, index.h("button", Object.assign({}, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), index.h("span", { class: "action-sheet-button-inner" }, cancelButton.icon && (index.h("ion-icon", { icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && index.h("ion-ripple-effect", null)))))), index.h("div", { key: '9a013adda7dec101cf0c90feb02f5b7f5582a0b3', tabindex: "0" })));
+            } }, header, this.subHeader && index.h("div", { class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (index.h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b) }), index.h("span", { class: "action-sheet-button-inner" }, b.icon && index.h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && index.h("ion-ripple-effect", null))))), cancelButton && (index.h("div", { class: "action-sheet-group action-sheet-group-cancel" }, index.h("button", Object.assign({}, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), index.h("span", { class: "action-sheet-button-inner" }, cancelButton.icon && (index.h("ion-icon", { icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && index.h("ion-ripple-effect", null)))))), index.h("div", { key: '4285893438675be9b40838a93c2ff382a1074cd3', tabindex: "0" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -324,6 +324,10 @@ const Alert = class {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the alert.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -491,9 +495,9 @@ const Alert = class {
          * If neither is defined, don't set aria-labelledby.
          */
         const ariaLabelledBy = header ? hdrId : subHeader ? subHdrId : null;
-        return (index.h(index.Host, Object.assign({ key: '8327e1aef6c404c2021d43aaa542d86e839817f5', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: '4b7f7880dc5f39aa9b61981af0a821ac0350af7f', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), index.h("ion-backdrop", { key: '814a4e1b4f7560026b089b762c68401b6277355e', tappable: this.backdropDismiss }), index.h("div", { key: 'b31ce08019e7223a098d18cb857f72eddc245e98', tabindex: "0" }), index.h("div", { key: '77efa4b9f7062f55ba0998a09a24550ec0b9b4f5', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, index.h("div", { key: '648e0768610ee57f9e5c84b8955da497ec9b0b82', class: "alert-head" }, header && (index.h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (index.h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), index.h("div", { key: 'f3d752cce77ca021dc959611ad5078b94b7f3cec', tabindex: "0" })));
+            }, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), index.h("ion-backdrop", { key: '961a2684013ac61d59882914fd8d759ddb542fe7', tappable: this.backdropDismiss }), index.h("div", { key: '2ec08c3719b3cd8a4cae09d2c6ac778ffad5f940', tabindex: "0" }), index.h("div", { key: 'ee543683d20693c9a9497aca4d41f032aa580c9c', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, index.h("div", { key: '55015102b67d080249a8859fc8788f3a82d5ead9', class: "alert-head" }, header && (index.h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (index.h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), index.h("div", { key: 'df7bcfb0cb41965f169de05edd631a050d5ce648', tabindex: "0" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -1943,6 +1943,10 @@ const Picker = class {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the picker.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -2014,11 +2018,11 @@ const Picker = class {
     render() {
         const { htmlAttributes } = this;
         const mode = ionicGlobal.getIonMode(this);
-        return (index$1.h(index$1.Host, Object.assign({ key: '8b9049c5315e701dff3f7457be646941bb3cc0df', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
+        return (index$1.h(index$1.Host, Object.assign({ key: 'c266cc072afaba2da22f70d8b62dc4bc6756d188', "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 }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), index$1.h("ion-backdrop", { key: '4f62ae6c088108189bfab18b680f0ae50b4cc395', visible: this.showBackdrop, tappable: this.backdropDismiss }), index$1.h("div", { key: 'c5fd2584ca4470c69bf61582cef2ac72289addba', tabindex: "0" }), index$1.h("div", { key: '2e68572dd5ddc4911c1e6bca57a2157b47477348', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, index$1.h("div", { key: '218526e531998a4d5a6377499acb42f99b347729', class: "picker-toolbar" }, this.buttons.map((b) => (index$1.h("div", { class: buttonWrapperClass(b) }, index$1.h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), index$1.h("div", { key: '4dd711f1fa1f2a4bd24696ae1633da16bbf55879', class: "picker-columns" }, index$1.h("div", { key: '440ebd807ca3675b0055e67e0354ac4625ae375d', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => index$1.h("ion-picker-column", { col: c })), index$1.h("div", { key: '5cdceda410904470e3742ab416ed3d3a661b6859', class: "picker-below-highlight" }))), index$1.h("div", { key: '0c96e8a43a6d4cd4b8b7c9e81c54414eb1d989bf', tabindex: "0" })));
+                [`picker-${mode}`]: true, 'overlay-hidden': true }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), index$1.h("ion-backdrop", { key: '35ee3e5028028835580e28ac2c8db65a924d5d6a', visible: this.showBackdrop, tappable: this.backdropDismiss }), index$1.h("div", { key: '8b454e6edbcfc45c57d3d8baf7c14b7905921a6e', tabindex: "0" }), index$1.h("div", { key: 'e0fee78ec6d097bf0963190f748e5daad602e0f7', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, index$1.h("div", { key: 'ce66bca18fc3e982ad7d6660f27cb1a03fb8247b', class: "picker-toolbar" }, this.buttons.map((b) => (index$1.h("div", { class: buttonWrapperClass(b) }, index$1.h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), index$1.h("div", { key: 'a58b9523fe16f109dd6de0610717c5077fed964b', class: "picker-columns" }, index$1.h("div", { key: 'acd54c0314cff51e8513a08dd9755c4b847c0617', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => index$1.h("ion-picker-column", { col: c })), index$1.h("div", { key: '604730bd87582d048d850c6e0a0f29ba33258918', class: "picker-below-highlight" }))), index$1.h("div", { key: '93baf5e6e57aec5f084d7d5b24af14e7d8126b5a', tabindex: "0" })));
     }
     get el() { return index$1.getElement(this); }
     static get watchers() { return {

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

@@ -216,6 +216,10 @@ const Loading = class {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the loading.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -257,9 +261,9 @@ const Loading = class {
          * Otherwise, don't set aria-labelledby.
          */
         const ariaLabelledBy = message !== undefined ? msgId : null;
-        return (index.h(index.Host, Object.assign({ key: '81295894ca6e047124918420f2483c092ebf91b9', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: '95123f54ba1db5e59563d79db075315b43ed20f7', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${40000 + this.overlayIndex}`,
-            }, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), index.h("ion-backdrop", { key: 'db9fbd946cf3eb03c3a70f2e71c49ab233df1879', visible: this.showBackdrop, tappable: this.backdropDismiss }), index.h("div", { key: 'd27b03de0b450c0668d4b4077d76bc5b283f03cf', tabindex: "0" }), index.h("div", { key: '7112719ddd487365c1e36fc4dec32aac888dbb52', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (index.h("div", { class: "loading-spinner" }, index.h("ion-spinner", { name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), index.h("div", { key: '5715dd7dae209ae58e5557cb60f3ae514752b822', tabindex: "0" })));
+            }, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), index.h("ion-backdrop", { key: 'e113bf123eaad38f2dafce8ea5d2ebef409d0c0f', visible: this.showBackdrop, tappable: this.backdropDismiss }), index.h("div", { key: '1268c9480854383c7883a79d597350540ade93c2', tabindex: "0" }), index.h("div", { key: 'e86fc71504ebd578117dea2232d9740a087d1249', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (index.h("div", { class: "loading-spinner" }, index.h("ion-spinner", { name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), index.h("div", { key: '3b91e2492e06aa65ebe77ed2b6ffb9d2f84bdd9c', tabindex: "0" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -1483,6 +1483,10 @@ const Modal = class {
      *
      * @param data Any data to emit in the dismiss events.
      * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         var _a;
@@ -1613,9 +1617,9 @@ const Modal = class {
         const mode = ionicGlobal.getIonMode(this);
         const isCardModal = presentingElement !== undefined && mode === 'ios';
         const isHandleCycle = handleBehavior === 'cycle';
-        return (index$3.h(index$3.Host, Object.assign({ key: '9a305d82f123283b6200c42d67393b378bb309a8', "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index$3.h(index$3.Host, Object.assign({ key: '0c2c4369ab2df4ef4660addea5e927c6a0232864', "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 }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }), index$3.h("ion-backdrop", { key: '85e8dc6f19b30fd95db518445929fb0c1d5cdef0', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && index$3.h("div", { class: "modal-shadow" }), index$3.h("div", Object.assign({ key: '893a0202d91828e60099311442c2677bee5464e2',
+            }, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, 'overlay-hidden': true }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle }), index$3.h("ion-backdrop", { key: 'd044383a776c2ee1703f996caedaedca47f2948f', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && index$3.h("div", { class: "modal-shadow" }), index$3.h("div", Object.assign({ key: '8d23b6a3cc9069e4d46fa0645cde9db3e6f89507',
             /*
               role and aria-modal must be used on the
               same element. They must also be set inside the
@@ -1624,7 +1628,7 @@ const Modal = class {
             */
             role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (index$3.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" })), index$3.h("slot", { key: '25187bf4c69d9022930227b8b8748a294176be5f' }))));
+            tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle" })), index$3.h("slot", { key: '3fbb689e4bf5575fbb26ad1000f6ac5993f3bf8f' }))));
     }
     get el() { return index$3.getElement(this); }
     static get watchers() { return {

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

@@ -1240,6 +1240,10 @@ const Popover = class {
      * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
      * @param dismissParentPopover If `true`, dismissing this popover will also dismiss
      * a parent popover if this popover is nested. Defaults to `true`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role, dismissParentPopover = true) {
         const unlock = await this.lockController.lock();
@@ -1291,9 +1295,9 @@ const Popover = class {
         const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes } = this;
         const desktop = ionicGlobal.isPlatform('desktop');
         const enableArrow = arrow && !parentPopover;
-        return (index.h(index.Host, Object.assign({ key: 'f335ae001173483e6a973b2084f8a7b6b895ae5d', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: '104a5bf92a9bbd2efc71d499a8500e5d55f81711', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && index.h("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), index.h("div", { key: '8468f39b0a0f30b42ae9cac51950e5f0b9be1069', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && index.h("div", { class: "popover-arrow", part: "arrow" }), index.h("div", { key: 'cb4eeaef385187f3c8e566931844e30edd5451c4', class: "popover-content", part: "content" }, index.h("slot", { key: '80a5739a4beb6eba150503e426104701954c90b9' })))));
+            }, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && index.h("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), index.h("div", { key: 'ef0baa04c22444d4bc705220235a892308d67586', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && index.h("div", { class: "popover-arrow", part: "arrow" }), index.h("div", { key: '5cc5f5c353de614e484e9cfeacecfca9fbfde0e0', class: "popover-content", part: "content" }, index.h("slot", { key: '2d85c591cdc85efa98afbf40f676525f1402efcf' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -658,6 +658,10 @@ const Toast = class {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the toast.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         var _a, _b;
@@ -825,9 +829,9 @@ const Toast = class {
         if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
             index$1.printIonWarning('This toast is using start and end buttons with the stacked toast layout. We recommend following the best practice of using either start or end buttons with the stacked toast layout.', el);
         }
-        return (index$3.h(index$3.Host, Object.assign({ key: '15a5c3e8d475435c838b70c55ef2e7cc12d6abfb', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (index$3.h(index$3.Host, Object.assign({ key: 'c8d7e7d2baa01d3ed5d65a845bc61acf087c0b18', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: theme.createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), index$3.h("div", { key: 'a6ed7fb75ab098dc632d1a546b4d5298675c14c1', class: wrapperClass }, index$3.h("div", { key: '68ff7219e9abae0b7c2030369ebffd2fe0edf7de', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (index$3.h("ion-icon", { class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), index$3.h("div", { key: '6b45ca5e283d3507c682cbe733e27a94460a7f69', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
+            }, class: theme.createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), index$3.h("div", { key: '27c0feeb89c4efb47c42623a4b036ed84338ed10', class: wrapperClass }, index$3.h("div", { key: '41d5a3069f92e4a6acef2793fa4e236cdbdaae88', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (index$3.h("ion-icon", { class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), index$3.h("div", { key: '176f497bc990ef2ecc14c7fa90dd3a54a912030a', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
     }
     get el() { return index$3.getElement(this); }
     static get watchers() { return {

package/dist/collection/components/action-sheet/action-sheet.js

@@ -79,6 +79,10 @@ export class ActionSheet {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the action sheet.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -187,12 +191,12 @@ export class ActionSheet {
         const cancelButton = allButtons.find((b) => b.role === 'cancel');
         const buttons = allButtons.filter((b) => b.role !== 'cancel');
         const headerID = `action-sheet-${overlayIndex}-header`;
-        return (h(Host, Object.assign({ key: '98851ef73ef85bb1e364111f090480102929a197', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'cd141d12d7d86d3402fd220c4afb61cdbf064c04', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: 'e2520342ca16aae4dac0bd7bff59b2150aeb2171', tappable: this.backdropDismiss }), h("div", { key: 'c95f2ec4edde1dc3a8860e68b4a86b82f6797aee', tabindex: "0" }), h("div", { key: '7af9edad368e308508801c8ef2225928ced63159', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: 'd1d92b4d1814d34eb7d8134ff77ee260ca521a6d', class: "action-sheet-container" }, h("div", { key: 'cc774b45a9992e95bfee788cb484d99364b76d22', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (h("div", { id: headerID, class: {
+            }, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: 'b6a051e2cf5e101edbf59c8a40a04d8f7107fb3c', tappable: this.backdropDismiss }), h("div", { key: '5bfa2b37a417aaff3776f06d92a8544dfcbf714f', tabindex: "0" }), h("div", { key: '77d5a217803fd7be8f8dbedcd0ef5e59f0fd9800', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '3901d56215f05cdab074e2ec321391281a165097', class: "action-sheet-container" }, h("div", { key: '275f5c7981b2ee44fb632b3d137c7209cbfcf45c', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (h("div", { id: headerID, class: {
                 'action-sheet-title': true,
                 'action-sheet-has-sub-title': this.subHeader !== undefined,
-            } }, header, this.subHeader && h("div", { class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b) }), h("span", { class: "action-sheet-button-inner" }, b.icon && h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && h("ion-ripple-effect", null))))), cancelButton && (h("div", { class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({}, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", null)))))), h("div", { key: '9a013adda7dec101cf0c90feb02f5b7f5582a0b3', tabindex: "0" })));
+            } }, header, this.subHeader && h("div", { class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (h("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass(b), onClick: () => this.buttonClick(b) }), h("span", { class: "action-sheet-button-inner" }, b.icon && h("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && h("ion-ripple-effect", null))))), cancelButton && (h("div", { class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({}, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", null)))))), h("div", { key: '4285893438675be9b40838a93c2ff382a1074cd3', tabindex: "0" })));
     }
     static get is() { return "ion-action-sheet"; }
     static get encapsulation() { return "scoped"; }
@@ -690,7 +694,7 @@ export class ActionSheet {
                         }, {
                             "name": "role",
                             "type": "string | undefined",
-                            "docs": "The role of the element that is dismissing the action sheet.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the action sheet.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "docs": "The role of the element that is dismissing the action sheet.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the action sheet.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`.\n\nThis is a no-op if the overlay has not been presented yet. If you want\nto remove an overlay from the DOM that was never presented, use the\n[remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method."
                         }],
                     "references": {
                         "Promise": {
@@ -707,7 +711,7 @@ export class ActionSheet {
                             "text": "data Any data to emit in the dismiss events."
                         }, {
                             "name": "param",
-                            "text": "role The role of the element that is dismissing the action sheet.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the action sheet.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "text": "role The role of the element that is dismissing the action sheet.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the action sheet.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`.\n\nThis is a no-op if the overlay has not been presented yet. If you want\nto remove an overlay from the DOM that was never presented, use the\n[remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method."
                         }]
                 }
             },

package/dist/collection/components/alert/alert.js

@@ -220,6 +220,10 @@ export class Alert {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the alert.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -387,9 +391,9 @@ export class Alert {
          * If neither is defined, don't set aria-labelledby.
          */
         const ariaLabelledBy = header ? hdrId : subHeader ? subHdrId : null;
-        return (h(Host, Object.assign({ key: '8327e1aef6c404c2021d43aaa542d86e839817f5', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '4b7f7880dc5f39aa9b61981af0a821ac0350af7f', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '814a4e1b4f7560026b089b762c68401b6277355e', tappable: this.backdropDismiss }), h("div", { key: 'b31ce08019e7223a098d18cb857f72eddc245e98', tabindex: "0" }), h("div", { key: '77efa4b9f7062f55ba0998a09a24550ec0b9b4f5', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '648e0768610ee57f9e5c84b8955da497ec9b0b82', class: "alert-head" }, header && (h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: 'f3d752cce77ca021dc959611ad5078b94b7f3cec', tabindex: "0" })));
+            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '961a2684013ac61d59882914fd8d759ddb542fe7', tappable: this.backdropDismiss }), h("div", { key: '2ec08c3719b3cd8a4cae09d2c6ac778ffad5f940', tabindex: "0" }), h("div", { key: 'ee543683d20693c9a9497aca4d41f032aa580c9c', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '55015102b67d080249a8859fc8788f3a82d5ead9', class: "alert-head" }, header && (h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: 'df7bcfb0cb41965f169de05edd631a050d5ce648', tabindex: "0" })));
     }
     static get is() { return "ion-alert"; }
     static get encapsulation() { return "scoped"; }
@@ -932,7 +936,7 @@ export class Alert {
                         }, {
                             "name": "role",
                             "type": "string | undefined",
-                            "docs": "The role of the element that is dismissing the alert.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the alert.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "docs": "The role of the element that is dismissing the alert.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the alert.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`.\n\nThis is a no-op if the overlay has not been presented yet. If you want\nto remove an overlay from the DOM that was never presented, use the\n[remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method."
                         }],
                     "references": {
                         "Promise": {
@@ -949,7 +953,7 @@ export class Alert {
                             "text": "data Any data to emit in the dismiss events."
                         }, {
                             "name": "param",
-                            "text": "role The role of the element that is dismissing the alert.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the alert.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "text": "role The role of the element that is dismissing the alert.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the alert.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`.\n\nThis is a no-op if the overlay has not been presented yet. If you want\nto remove an overlay from the DOM that was never presented, use the\n[remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method."
                         }]
                 }
             },

package/dist/collection/components/loading/loading.js

@@ -113,6 +113,10 @@ export class Loading {
      * This can be useful in a button handler for determining which button was
      * clicked to dismiss the loading.
      * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+     *
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role) {
         const unlock = await this.lockController.lock();
@@ -154,9 +158,9 @@ export class Loading {
          * Otherwise, don't set aria-labelledby.
          */
         const ariaLabelledBy = message !== undefined ? msgId : null;
-        return (h(Host, Object.assign({ key: '81295894ca6e047124918420f2483c092ebf91b9', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: '95123f54ba1db5e59563d79db075315b43ed20f7', 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: 'db9fbd946cf3eb03c3a70f2e71c49ab233df1879', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: 'd27b03de0b450c0668d4b4077d76bc5b283f03cf', tabindex: "0" }), h("div", { key: '7112719ddd487365c1e36fc4dec32aac888dbb52', 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: '5715dd7dae209ae58e5557cb60f3ae514752b822', 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: 'e113bf123eaad38f2dafce8ea5d2ebef409d0c0f', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '1268c9480854383c7883a79d597350540ade93c2', tabindex: "0" }), h("div", { key: 'e86fc71504ebd578117dea2232d9740a087d1249', 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: '3b91e2492e06aa65ebe77ed2b6ffb9d2f84bdd9c', tabindex: "0" })));
     }
     static get is() { return "ion-loading"; }
     static get encapsulation() { return "scoped"; }
@@ -680,7 +684,7 @@ export class Loading {
                         }, {
                             "name": "role",
                             "type": "string | undefined",
-                            "docs": "The role of the element that is dismissing the loading.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the loading.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "docs": "The role of the element that is dismissing the loading.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the loading.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`.\n\nThis is a no-op if the overlay has not been presented yet. If you want\nto remove an overlay from the DOM that was never presented, use the\n[remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method."
                         }],
                     "references": {
                         "Promise": {
@@ -697,7 +701,7 @@ export class Loading {
                             "text": "data Any data to emit in the dismiss events."
                         }, {
                             "name": "param",
-                            "text": "role The role of the element that is dismissing the loading.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the loading.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "text": "role The role of the element that is dismissing the loading.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the loading.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`.\n\nThis is a no-op if the overlay has not been presented yet. If you want\nto remove an overlay from the DOM that was never presented, use the\n[remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method."
                         }]
                 }
             },