@ionic/core 7.7.1 → 7.7.2-dev.11707840956.16e27b4c

package/dist/collection/utils/overlays.js

@@ -409,6 +409,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 +440,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
      * from returning focus as a result.
      */
     if (overlay.el.tagName !== 'ION-TOAST') {
-        focusPreviousElementOnDismiss(overlay.el);
+        restoreElementFocus(overlay.el);
     }
     /**
      * If the focused element is already
@@ -442,6 +451,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 +470,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
  * to where they were before they
  * opened the overlay.
  */
-const focusPreviousElementOnDismiss = async (overlayEl) => {
+const restoreElementFocus = async (overlayEl) => {
     let previousElement = document.activeElement;
     if (!previousElement) {
         return;
@@ -464,10 +481,36 @@ const focusPreviousElementOnDismiss = async (overlayEl) => {
         previousElement = shadowRoot.querySelector(focusableQueryString) || previousElement;
     }
     await overlayEl.onDidDismiss();
-    previousElement.focus();
+    /**
+     * 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;
     }
@@ -518,6 +561,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,38 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
             await modalInputOne.click();
             await expect(modalInputOne).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-07T14:16:22",
+  "timestamp": "2024-02-13T16:17:46",
   "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/{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';
 

package/dist/esm/{hardware-back-button-f42b9c80.js → hardware-back-button-b410a047.js}

@@ -2,8 +2,8 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { w as win } from './index-a5d50daf.js';
-import { c as config } from './ionic-global-778b7863.js';
-import './index-73881b51.js';
+import { c as config } from './ionic-global-ad9a1810.js';
+import './index-4c30cddd.js';
 
 /**
  * CloseWatcher is a newer API that lets

package/dist/esm/{index-4b98143d.js → index-0b4beb69.js}

@@ -1,7 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { w as writeTask, B as Build } from './index-73881b51.js';
+import { w as writeTask, B as Build } from './index-4c30cddd.js';
 import { r as raf } from './helpers-c0b9ca37.js';
 
 const LIFECYCLE_WILL_ENTER = 'ionViewWillEnter';
@@ -10,8 +10,8 @@ const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
 const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
 const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
 
-const iosTransitionAnimation = () => import('./ios.transition-7ff7381d.js');
-const mdTransitionAnimation = () => import('./md.transition-28a9a26b.js');
+const iosTransitionAnimation = () => import('./ios.transition-b76c7020.js');
+const mdTransitionAnimation = () => import('./md.transition-564937a7.js');
 // TODO(FW-2832): types
 const transition = (opts) => {
     return new Promise((resolve, reject) => {

package/dist/esm/{index-48209844.js → index-47b2066d.js}

@@ -2,10 +2,10 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { d as doc } from './index-a5d50daf.js';
-import { MENU_BACK_BUTTON_PRIORITY } from './hardware-back-button-f42b9c80.js';
+import { MENU_BACK_BUTTON_PRIORITY } from './hardware-back-button-b410a047.js';
 import { p as printIonWarning } from './index-9b0d46f4.js';
 import { c as componentOnReady } from './helpers-c0b9ca37.js';
-import { b as getIonMode } from './ionic-global-778b7863.js';
+import { b as getIonMode } from './ionic-global-ad9a1810.js';
 import { c as createAnimation } from './animation-60dbdd13.js';
 
 /**

package/dist/esm/{index-73881b51.js → index-4c30cddd.js}

@@ -1388,8 +1388,7 @@ const patch = (oldVNode, newVNode, isInitialRender = false) => {
             isSvgMode = tag === 'svg' ? true : tag === 'foreignObject' ? false : isSvgMode;
         }
         {
-            if (tag === 'slot')
-                ;
+            if (tag === 'slot' && !useNativeShadowDom) ;
             else {
                 // either this is the first render of an element OR it's an update
                 // AND we already know it's possible it could have changed
@@ -1676,9 +1675,9 @@ const renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
     {
         scopeId = hostElm['s-sc'];
     }
+    useNativeShadowDom = (cmpMeta.$flags$ & 1 /* CMP_FLAGS.shadowDomEncapsulation */) !== 0;
     {
         contentRef = hostElm['s-cr'];
-        useNativeShadowDom = (cmpMeta.$flags$ & 1 /* CMP_FLAGS.shadowDomEncapsulation */) !== 0;
         // always reset
         checkSlotFallbackVisibility = false;
     }
@@ -2565,25 +2564,29 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
             }
         });
     });
-    // Add styles for `slot-fb` elements if any of our components are using slots outside the Shadow DOM
-    if (hasSlotRelocation) {
-        dataStyles.innerHTML += SLOT_FB_CSS;
-    }
-    // Add hydration styles
-    {
-        dataStyles.innerHTML += cmpTags + HYDRATED_CSS;
-    }
-    // If we have styles, add them to the DOM
-    if (dataStyles.innerHTML.length) {
-        dataStyles.setAttribute('data-styles', '');
-        // Apply CSP nonce to the style tag if it exists
-        const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
-        if (nonce != null) {
-            dataStyles.setAttribute('nonce', nonce);
-        }
-        // Insert the styles into the document head
-        // NOTE: this _needs_ to happen last so we can ensure the nonce (and other attributes) are applied
-        head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
+    // Only bother generating CSS if we have components
+    // TODO(STENCIL-1118): Add test cases for CSS content based on conditionals
+    if (cmpTags.length > 0) {
+        // Add styles for `slot-fb` elements if any of our components are using slots outside the Shadow DOM
+        if (hasSlotRelocation) {
+            dataStyles.innerHTML += SLOT_FB_CSS;
+        }
+        // Add hydration styles
+        {
+            dataStyles.innerHTML += cmpTags + HYDRATED_CSS;
+        }
+        // If we have styles, add them to the DOM
+        if (dataStyles.innerHTML.length) {
+            dataStyles.setAttribute('data-styles', '');
+            // Apply CSP nonce to the style tag if it exists
+            const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
+            if (nonce != null) {
+                dataStyles.setAttribute('nonce', nonce);
+            }
+            // Insert the styles into the document head
+            // NOTE: this _needs_ to happen last so we can ensure the nonce (and other attributes) are applied
+            head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
+        }
     }
     // Process deferred connectedCallbacks now all components have been registered
     isBootstrapping = false;

package/dist/esm/index.js

@@ -2,21 +2,21 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 export { c as createAnimation } from './animation-60dbdd13.js';
-export { a as LIFECYCLE_DID_ENTER, c as LIFECYCLE_DID_LEAVE, L as LIFECYCLE_WILL_ENTER, b as LIFECYCLE_WILL_LEAVE, d as LIFECYCLE_WILL_UNLOAD, g as getIonPageElement } from './index-4b98143d.js';
-export { iosTransitionAnimation } from './ios.transition-7ff7381d.js';
-export { mdTransitionAnimation } from './md.transition-28a9a26b.js';
+export { a as LIFECYCLE_DID_ENTER, c as LIFECYCLE_DID_LEAVE, L as LIFECYCLE_WILL_ENTER, b as LIFECYCLE_WILL_LEAVE, d as LIFECYCLE_WILL_UNLOAD, g as getIonPageElement } from './index-0b4beb69.js';
+export { iosTransitionAnimation } from './ios.transition-b76c7020.js';
+export { mdTransitionAnimation } from './md.transition-564937a7.js';
 export { g as getTimeGivenProgression } from './cubic-bezier-fe2083dc.js';
 export { createGesture } from './index-2cf77112.js';
-export { g as getPlatforms, i as initialize, a as isPlatform } from './ionic-global-778b7863.js';
+export { g as getPlatforms, i as initialize, a as isPlatform } from './ionic-global-ad9a1810.js';
 export { c as componentOnReady } from './helpers-c0b9ca37.js';
 export { I as IonicSafeString, g as getMode, s as setupConfig } from './config-49c88215.js';
 export { o as openURL } from './theme-01f3f29c.js';
-export { m as menuController } from './index-48209844.js';
-export { b as actionSheetController, a as alertController, l as loadingController, m as modalController, p as pickerController, c as popoverController, t as toastController } from './overlays-33ae3ea0.js';
+export { m as menuController } from './index-47b2066d.js';
+export { b as actionSheetController, a as alertController, l as loadingController, m as modalController, p as pickerController, c as popoverController, t as toastController } from './overlays-04a9a43f.js';
 import './index-a5d50daf.js';
-import './index-73881b51.js';
+import './index-4c30cddd.js';
 import './gesture-controller-1bf57181.js';
-import './hardware-back-button-f42b9c80.js';
+import './hardware-back-button-b410a047.js';
 import './index-9b0d46f4.js';
 import './framework-delegate-fed7fe7c.js';
 

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

@@ -1,10 +1,10 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { r as registerInstance, h, H as Host, f as getElement, d as createEvent } from './index-73881b51.js';
+import { r as registerInstance, h, H as Host, f as getElement, d as createEvent } from './index-4c30cddd.js';
 import { r as raf, t as transitionEndAsync, a as addEventListener, b as removeEventListener, g as getElementRoot } from './helpers-c0b9ca37.js';
 import { l as chevronDown } from './index-f7dc70ba.js';
-import { c as config, b as getIonMode } from './ionic-global-778b7863.js';
+import { c as config, b as getIonMode } from './ionic-global-ad9a1810.js';
 import { p as printIonWarning } from './index-9b0d46f4.js';
 
 const accordionIosCss = ":host{display:block;position:relative;width:100%;background-color:var(--ion-background-color, #ffffff);overflow:hidden;z-index:0}:host(.accordion-expanding) ::slotted(ion-item[slot=header]),:host(.accordion-expanded) ::slotted(ion-item[slot=header]){--border-width:0px}:host(.accordion-animated){-webkit-transition:all 300ms cubic-bezier(0.25, 0.8, 0.5, 1);transition:all 300ms cubic-bezier(0.25, 0.8, 0.5, 1)}:host(.accordion-animated) #content{-webkit-transition:max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1);transition:max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1)}#content{overflow:hidden;will-change:max-height}:host(.accordion-collapsing) #content{max-height:0 !important}:host(.accordion-collapsed) #content{display:none}:host(.accordion-expanding) #content{max-height:0}:host(.accordion-expanding) #content-wrapper{overflow:auto}:host(.accordion-disabled) #header,:host(.accordion-readonly) #header,:host(.accordion-disabled) #content,:host(.accordion-readonly) #content{pointer-events:none}:host(.accordion-disabled) #header,:host(.accordion-disabled) #content{opacity:0.4}@media (prefers-reduced-motion: reduce){:host,#content{-webkit-transition:none !important;transition:none !important}}:host(.accordion-next) ::slotted(ion-item[slot=header]){--border-width:0.55px 0px 0.55px 0px}";