voyager-ionic-core 7.7.0 → 7.7.3

package/dist/collection/utils/overlays.js

@@ -7,7 +7,7 @@ import { config } from "../global/config";
 import { getIonMode } from "../global/ionic-global";
 import { CoreDelegate } from "./framework-delegate";
 import { OVERLAY_BACK_BUTTON_PRIORITY } from "./hardware-back-button";
-import { addEventListener, componentOnReady, focusElement, getElementRoot, removeEventListener } from "./helpers";
+import { addEventListener, componentOnReady, focusVisibleElement, getElementRoot, removeEventListener, } from "./helpers";
 import { printIonWarning } from "./logging";
 let lastOverlayIndex = 0;
 let lastId = 0;
@@ -99,32 +99,48 @@ export const createOverlay = (tagName, opts) => {
  * valid usage for the disabled property on ion-button.
  */
 const focusableQueryString = '[tabindex]:not([tabindex^="-"]):not([hidden]):not([disabled]), input:not([type=hidden]):not([tabindex^="-"]):not([hidden]):not([disabled]), textarea:not([tabindex^="-"]):not([hidden]):not([disabled]), button:not([tabindex^="-"]):not([hidden]):not([disabled]), select:not([tabindex^="-"]):not([hidden]):not([disabled]), .ion-focusable:not([tabindex^="-"]):not([hidden]):not([disabled]), .ion-focusable[disabled="false"]:not([tabindex^="-"]):not([hidden])';
+const isOverlayHidden = (overlay) => overlay.classList.contains('overlay-hidden');
+/**
+ * Focuses the first descendant in an overlay
+ * that can receive focus. If none exists,
+ * the entire overlay will be focused.
+ */
 export const focusFirstDescendant = (ref, overlay) => {
-    let firstInput = ref.querySelector(focusableQueryString);
-    const shadowRoot = firstInput === null || firstInput === void 0 ? void 0 : firstInput.shadowRoot;
-    if (shadowRoot) {
-        // If there are no inner focusable elements, just focus the host element.
-        firstInput = shadowRoot.querySelector(focusableQueryString) || firstInput;
-    }
-    if (firstInput) {
-        focusElement(firstInput);
-    }
-    else {
-        // Focus overlay instead of letting focus escape
-        overlay.focus();
-    }
+    const firstInput = ref.querySelector(focusableQueryString);
+    focusElementInOverlay(firstInput, overlay);
 };
-const isOverlayHidden = (overlay) => overlay.classList.contains('overlay-hidden');
+/**
+ * Focuses the last descendant in an overlay
+ * that can receive focus. If none exists,
+ * the entire overlay will be focused.
+ */
 const focusLastDescendant = (ref, overlay) => {
     const inputs = Array.from(ref.querySelectorAll(focusableQueryString));
-    let lastInput = inputs.length > 0 ? inputs[inputs.length - 1] : null;
-    const shadowRoot = lastInput === null || lastInput === void 0 ? void 0 : lastInput.shadowRoot;
+    const lastInput = inputs.length > 0 ? inputs[inputs.length - 1] : null;
+    focusElementInOverlay(lastInput, overlay);
+};
+/**
+ * Focuses a particular element in an overlay. If the element
+ * doesn't have anything focusable associated with it then
+ * the overlay itself will be focused.
+ * This should be used instead of the focus() method
+ * on most elements because the focusable element
+ * may not be the host element.
+ *
+ * For example, if an ion-button should be focused
+ * then we should actually focus the native <button>
+ * element inside of ion-button's shadow root, not
+ * the host element itself.
+ */
+const focusElementInOverlay = (hostToFocus, overlay) => {
+    let elementToFocus = hostToFocus;
+    const shadowRoot = hostToFocus === null || hostToFocus === void 0 ? void 0 : hostToFocus.shadowRoot;
     if (shadowRoot) {
         // If there are no inner focusable elements, just focus the host element.
-        lastInput = shadowRoot.querySelector(focusableQueryString) || lastInput;
+        elementToFocus = shadowRoot.querySelector(focusableQueryString) || hostToFocus;
     }
-    if (lastInput) {
-        lastInput.focus();
+    if (elementToFocus) {
+        focusVisibleElement(elementToFocus);
     }
     else {
         // Focus overlay instead of letting focus escape
@@ -175,6 +191,21 @@ const trapKeyboardFocus = (ev, doc) => {
          */
         if (lastOverlay === target) {
             lastOverlay.lastFocus = undefined;
+            /**
+             * Toasts can be presented from an overlay.
+             * However, focus should still be returned to
+             * the overlay when clicking a toast. Normally,
+             * focus would be returned to the last focusable
+             * descendant in the overlay which may not always be
+             * the button that the toast was presented from. In this case,
+             * the focus may be returned to an unexpected element.
+             * To account for this, we make sure to return focus to the
+             * last focused element in the overlay if focus is
+             * moved to the toast.
+             */
+        }
+        else if (target.tagName === 'ION-TOAST') {
+            focusElementInOverlay(lastOverlay.lastFocus, lastOverlay);
             /**
              * Otherwise, we must be focusing an element
              * inside of the overlay. The two possible options
@@ -246,6 +277,21 @@ const trapKeyboardFocus = (ev, doc) => {
          */
         if (lastOverlay.contains(target)) {
             lastOverlay.lastFocus = target;
+            /**
+             * Toasts can be presented from an overlay.
+             * However, focus should still be returned to
+             * the overlay when clicking a toast. Normally,
+             * focus would be returned to the last focusable
+             * descendant in the overlay which may not always be
+             * the button that the toast was presented from. In this case,
+             * the focus may be returned to an unexpected element.
+             * To account for this, we make sure to return focus to the
+             * last focused element in the overlay if focus is
+             * moved to the toast.
+             */
+        }
+        else if (target.tagName === 'ION-TOAST') {
+            focusElementInOverlay(lastOverlay.lastFocus, lastOverlay);
         }
         else {
             /**
@@ -409,6 +455,15 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
         return;
     }
     setRootAriaHidden(true);
+    /**
+     * Hide all other overlays from screen readers so only this one
+     * can be read. Note that presenting an overlay always makes
+     * it the topmost one.
+     */
+    if (doc !== undefined) {
+        const presentedOverlays = getPresentedOverlays(doc);
+        presentedOverlays.forEach((o) => o.setAttribute('aria-hidden', 'true'));
+    }
     overlay.presented = true;
     overlay.willPresent.emit();
     (_a = overlay.willPresentShorthand) === null || _a === void 0 ? void 0 : _a.emit();
@@ -431,7 +486,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
      * from returning focus as a result.
      */
     if (overlay.el.tagName !== 'ION-TOAST') {
-        focusPreviousElementOnDismissIfNeeded(overlay.el);
+        restoreElementFocus(overlay.el);
     }
     /**
      * If the focused element is already
@@ -442,6 +497,14 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
     if (overlay.keyboardClose && (document.activeElement === null || !overlay.el.contains(document.activeElement))) {
         overlay.el.focus();
     }
+    /**
+     * If this overlay was previously dismissed without being
+     * the topmost one (such as by manually calling dismiss()),
+     * it would still have aria-hidden on being presented again.
+     * Removing it here ensures the overlay is visible to screen
+     * readers.
+     */
+    overlay.el.removeAttribute('aria-hidden');
 };
 /**
  * When an overlay component is dismissed,
@@ -453,7 +516,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
  * to where they were before they
  * opened the overlay.
  */
-const focusPreviousElementOnDismissIfNeeded = async (overlayEl) => {
+const restoreElementFocus = async (overlayEl) => {
     let previousElement = document.activeElement;
     if (!previousElement) {
         return;
@@ -465,18 +528,35 @@ const focusPreviousElementOnDismissIfNeeded = async (overlayEl) => {
     }
     await overlayEl.onDidDismiss();
     /**
-     * If the user has already removed focus
-     * from the overlay (For example, focusing
-     * a text box after tapping a button in an
-     * action sheet) then don't restore focus
-     * to previous element
+     * After onDidDismiss, the overlay loses focus
+     * because it is removed from the document
+     *
+     * > An element will also lose focus [...]
+     * > if the element is removed from the document)
+     *
+     * https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event
+     *
+     * Additionally, `document.activeElement` returns:
+     *
+     * > The Element which currently has focus,
+     * > `<body>` or null if there is
+     * > no focused element.
+     *
+     * https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement#value
+     *
+     * However, if the user has already focused
+     * an element sometime between onWillDismiss
+     * and onDidDismiss (for example, focusing a
+     * text box after tapping a button in an
+     * action sheet) then don't restore focus to
+     * previous element
      */
     if (document.activeElement === null || document.activeElement === document.body) {
         previousElement.focus();
     }
 };
 export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnimation, opts) => {
-    var _a, _b;
+    var _a, _b, _c;
     if (!overlay.presented) {
         return false;
     }
@@ -503,6 +583,10 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
         }
         overlay.didDismiss.emit({ data, role });
         (_b = overlay.didDismissShorthand) === null || _b === void 0 ? void 0 : _b.emit({ data, role });
+        // Get a reference to all animations currently assigned to this overlay
+        // Then tear them down to return the overlay to its initial visual state
+        const animations = activeAnimations.get(overlay) || [];
+        animations.forEach((ani) => ani.destroy());
         activeAnimations.delete(overlay);
         /**
          * Make overlay hidden again in case it is being reused.
@@ -523,6 +607,13 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
         console.error(err);
     }
     overlay.el.remove();
+    /**
+     * If there are other overlays presented, unhide the new
+     * topmost one from screen readers.
+     */
+    if (doc !== undefined) {
+        (_c = getPresentedOverlay(doc)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-hidden');
+    }
     return true;
 };
 const getAppRoot = (doc) => {

package/dist/collection/utils/test/overlays/overlays.e2e.js

@@ -175,5 +175,127 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
             await modalInputOne.click();
             await expect(modalInputOne).toBeFocused();
         });
+        test('focusing toast from a shadow overlay should return focus to the last focused element', async ({ page }) => {
+            test.info().annotations.push({
+                type: 'issue',
+                description: 'https://github.com/ionic-team/ionic-framework/issues/28261',
+            });
+            /**
+             * Triggers for an overlay are typically buttons. However in this case,
+             * buttons are not considered keyboard focusable by WebKit. Inputs are,
+             * so we use an input here so we can still test on WebKit.
+             */
+            await page.setContent(`
+        <ion-modal>
+          <ion-content>
+            <input id="show-toast">Button A</input>
+            <button>Button B</button>
+            <ion-toast trigger="show-toast"></ion-toast>
+          </ion-content>
+        </ion-modal>
+
+        <script>
+          const toast = document.querySelector('ion-toast');
+          toast.buttons = ['Ok'];
+        </script>
+      `, config);
+            const modal = page.locator('ion-modal');
+            const showToastTrigger = page.locator('#show-toast');
+            const toast = page.locator('ion-toast');
+            const toastButton = toast.locator('button');
+            const ionToastDidPresent = await page.spyOnEvent('ionToastDidPresent');
+            // Show overlay
+            await modal.evaluate((el) => el.present());
+            // Click trigger to open toast
+            await showToastTrigger.click();
+            // Wait for toast to be presented
+            await ionToastDidPresent.next();
+            // Verify trigger in overlay is focused
+            await expect(showToastTrigger).toBeFocused();
+            // Click a button in the toast and therefore attempt to move focus
+            await toastButton.click();
+            // Verify trigger in overlay is still focused
+            await expect(showToastTrigger).toBeFocused();
+        });
+        test('focusing toast from a scoped overlay should return focus to the last focused element', async ({ page, skip, }) => {
+            test.info().annotations.push({
+                type: 'issue',
+                description: 'https://github.com/ionic-team/ionic-framework/issues/28261',
+            });
+            skip.browser('webkit', 'WebKit does not consider buttons to be focusable');
+            await page.setContent(`
+        <ion-action-sheet></ion-action-sheet>
+        <ion-toast></ion-toast>
+
+        <script>
+          const actionSheet = document.querySelector('ion-action-sheet');
+          actionSheet.buttons = [
+            'Other Button',
+            {
+              text: 'Button',
+              id: 'show-toast',
+              handler: () => {
+                document.querySelector('ion-toast').present();
+                return false;
+              }
+            }
+          ];
+
+          const toast = document.querySelector('ion-toast');
+          toast.buttons = ['Ok'];
+       </script>
+       `, config);
+            const actionSheet = page.locator('ion-action-sheet');
+            const showToastButton = page.locator('#show-toast');
+            const toast = page.locator('ion-toast');
+            const toastButton = toast.locator('button');
+            const ionToastDidPresent = await page.spyOnEvent('ionToastDidPresent');
+            // Show overlay
+            await actionSheet.evaluate((el) => el.present());
+            // Click button to open toast
+            await showToastButton.click();
+            // Wait for toast to be presented
+            await ionToastDidPresent.next();
+            // Verify button in overlay is focused
+            await expect(showToastButton).toBeFocused();
+            // Click a button in the toast and therefore attempt to move focus
+            await toastButton.click();
+            await page.pause();
+            // Verify button in overlay is still focused
+            await expect(showToastButton).toBeFocused();
+        });
+        test('should not return focus to another element if focus already manually returned', async ({ page, skip, }, testInfo) => {
+            skip.browser('webkit', 'WebKit does not consider buttons to be focusable, so this test always passes since the input is the only focusable element.');
+            testInfo.annotations.push({
+                type: 'issue',
+                description: 'https://github.com/ionic-team/ionic-framework/issues/28849',
+            });
+            await page.setContent(`
+        <button id="open-action-sheet">open</button>
+        <ion-action-sheet trigger="open-action-sheet"></ion-action-sheet>
+        <input id="test-input" />
+
+        <script>
+          const actionSheet = document.querySelector('ion-action-sheet');
+
+          actionSheet.addEventListener('ionActionSheetWillDismiss', () => {
+            requestAnimationFrame(() => {
+              document.querySelector('#test-input').focus();
+            });
+          });
+        </script>
+      `, config);
+            const ionActionSheetDidPresent = await page.spyOnEvent('ionActionSheetDidPresent');
+            const actionSheet = page.locator('ion-action-sheet');
+            const input = page.locator('#test-input');
+            const trigger = page.locator('#open-action-sheet');
+            // present action sheet
+            await trigger.click();
+            await ionActionSheetDidPresent.next();
+            // dismiss action sheet
+            await actionSheet.evaluate((el) => el.dismiss());
+            // verify focus is in correct location
+            await expect(input).toBeFocused();
+        });
     });
 });

package/dist/collection/utils/test/overlays/overlays.spec.js

@@ -100,3 +100,54 @@ describe('setRootAriaHidden()', () => {
         expect(routerOutlet.hasAttribute('aria-hidden')).toEqual(false);
     });
 });
+describe('aria-hidden on individual overlays', () => {
+    it('should hide non-topmost overlays from screen readers', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+        });
+        const modalOne = page.body.querySelector('ion-modal#one');
+        const modalTwo = page.body.querySelector('ion-modal#two');
+        await modalOne.present();
+        await modalTwo.present();
+        expect(modalOne.hasAttribute('aria-hidden')).toEqual(true);
+        expect(modalTwo.hasAttribute('aria-hidden')).toEqual(false);
+    });
+    it('should unhide new topmost overlay from screen readers when topmost is dismissed', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+        });
+        const modalOne = page.body.querySelector('ion-modal#one');
+        const modalTwo = page.body.querySelector('ion-modal#two');
+        await modalOne.present();
+        await modalTwo.present();
+        // dismiss modalTwo so that modalOne becomes the new topmost overlay
+        await modalTwo.dismiss();
+        expect(modalOne.hasAttribute('aria-hidden')).toEqual(false);
+    });
+    it('should not keep overlays hidden from screen readers if presented after being dismissed while non-topmost', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+        });
+        const modalOne = page.body.querySelector('ion-modal#one');
+        const modalTwo = page.body.querySelector('ion-modal#two');
+        await modalOne.present();
+        await modalTwo.present();
+        // modalOne is not the topmost overlay at this point and is hidden from screen readers
+        await modalOne.dismiss();
+        // modalOne will become the topmost overlay; ensure it isn't still hidden from screen readers
+        await modalOne.present();
+        expect(modalOne.hasAttribute('aria-hidden')).toEqual(false);
+    });
+});

package/dist/docs.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2024-02-02T00:56:23",
+  "timestamp": "2024-02-24T20:38:59",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.12.0",
+    "version": "4.12.2",
     "typescriptVersion": "5.3.3"
   },
   "components": [
@@ -806,7 +806,7 @@
               {
                 "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": {
@@ -827,7 +827,7 @@
             {
               "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."
             }
           ],
           "docs": "Dismiss the action sheet overlay after it has been presented.",
@@ -838,7 +838,7 @@
             },
             {
               "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."
             }
           ]
         },
@@ -1637,7 +1637,7 @@
               {
                 "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": {
@@ -1658,7 +1658,7 @@
             {
               "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."
             }
           ],
           "docs": "Dismiss the alert overlay after it has been presented.",
@@ -1669,7 +1669,7 @@
             },
             {
               "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."
             }
           ]
         },
@@ -13797,7 +13797,7 @@
               {
                 "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": {
@@ -13818,7 +13818,7 @@
             {
               "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."
             }
           ],
           "docs": "Dismiss the loading overlay after it has been presented.",
@@ -13829,7 +13829,7 @@
             },
             {
               "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."
             }
           ]
         },
@@ -15526,7 +15526,7 @@
               {
                 "name": "role",
                 "type": "string | undefined",
-                "docs": "The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'."
+                "docs": "The role of the element that is dismissing the modal. For example, 'cancel' or '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": {
@@ -15551,7 +15551,7 @@
             {
               "name": "role",
               "type": "string | undefined",
-              "docs": "The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'."
+              "docs": "The role of the element that is dismissing the modal. For example, 'cancel' or '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."
             }
           ],
           "docs": "Dismiss the modal overlay after it has been presented.",
@@ -15562,7 +15562,7 @@
             },
             {
               "name": "param",
-              "text": "role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'."
+              "text": "role The role of the element that is dismissing the modal. For example, 'cancel' or '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."
             }
           ]
         },
@@ -17787,7 +17787,7 @@
               {
                 "name": "role",
                 "type": "string | undefined",
-                "docs": "The role of the element that is dismissing the picker.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the picker.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                "docs": "The role of the element that is dismissing the picker.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the picker.\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": {
@@ -17808,7 +17808,7 @@
             {
               "name": "role",
               "type": "string | undefined",
-              "docs": "The role of the element that is dismissing the picker.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the picker.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+              "docs": "The role of the element that is dismissing the picker.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the picker.\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."
             }
           ],
           "docs": "Dismiss the picker overlay after it has been presented.",
@@ -17819,7 +17819,7 @@
             },
             {
               "name": "param",
-              "text": "role The role of the element that is dismissing the picker.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the picker.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+              "text": "role The role of the element that is dismissing the picker.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the picker.\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."
             }
           ]
         },
@@ -18829,7 +18829,7 @@
               {
                 "name": "dismissParentPopover",
                 "type": "boolean",
-                "docs": "If `true`, dismissing this popover will also dismiss\na parent popover if this popover is nested. Defaults to `true`."
+                "docs": "If `true`, dismissing this popover will also dismiss\na parent popover if this popover is nested. Defaults to `true`.\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": {
@@ -18859,7 +18859,7 @@
             {
               "name": "dismissParentPopover",
               "type": "boolean",
-              "docs": "If `true`, dismissing this popover will also dismiss\na parent popover if this popover is nested. Defaults to `true`."
+              "docs": "If `true`, dismissing this popover will also dismiss\na parent popover if this popover is nested. Defaults to `true`.\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."
             }
           ],
           "docs": "Dismiss the popover overlay after it has been presented.",
@@ -18874,7 +18874,7 @@
             },
             {
               "name": "param",
-              "text": "dismissParentPopover If `true`, dismissing this popover will also dismiss\na parent popover if this popover is nested. Defaults to `true`."
+              "text": "dismissParentPopover If `true`, dismissing this popover will also dismiss\na parent popover if this popover is nested. Defaults to `true`.\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."
             }
           ]
         },
@@ -28180,7 +28180,7 @@
               {
                 "name": "role",
                 "type": "string | undefined",
-                "docs": "The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                "docs": "The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\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": {
@@ -28206,7 +28206,7 @@
             {
               "name": "role",
               "type": "string | undefined",
-              "docs": "The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+              "docs": "The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\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."
             }
           ],
           "docs": "Dismiss the toast overlay after it has been presented.",
@@ -28217,7 +28217,7 @@
             },
             {
               "name": "param",
-              "text": "role The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+              "text": "role The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\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/esm/{animation-60dbdd13.js → animation-6a0c5338.js}

@@ -2,7 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { w as win } from './index-a5d50daf.js';
-import { r as raf } from './helpers-c0b9ca37.js';
+import { r as raf } from './helpers-be245865.js';
 
 let animationPrefix;
 /**

package/dist/esm/{app-globals-47226a12.js → app-globals-5cf6195b.js}

@@ -1,7 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { i as initialize } from './ionic-global-778b7863.js';
+import { i as initialize } from './ionic-global-ad9a1810.js';
 
 const globalScripts = initialize;
 

package/dist/esm/{button-active-4bee452c.js → button-active-47ac8092.js}

@@ -1,7 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { w as writeTask } from './index-73881b51.js';
+import { w as writeTask } from './index-4c30cddd.js';
 import { h as hapticSelectionEnd, a as hapticSelectionStart, b as hapticSelectionChanged } from './haptic-554688a5.js';
 import { createGesture } from './index-2cf77112.js';