voyager-ionic-core 8.8.17 → 9.0.3

package/dist/collection/utils/overlays.js

@@ -19,8 +19,16 @@ export const activeAnimations = new WeakMap();
  * Returns false if showBackdrop=false or backdropBreakpoint > 0.
  */
 const isBackdropAlwaysBlocking = (el) => {
-    var _a;
-    return el.showBackdrop !== false && !(((_a = el.backdropBreakpoint) !== null && _a !== void 0 ? _a : 0) > 0);
+    return el.showBackdrop !== false && !((el.backdropBreakpoint ?? 0) > 0);
+};
+/**
+ * Whether the overlay takes the app root out of the accessibility tree and
+ * blocks body scroll while presented. Toasts never do, modal and popover can
+ * opt out with `focusTrap={false}`, and a backdrop that does not block
+ * (`showBackdrop={false}`, or a `backdropBreakpoint` above 0) is excluded.
+ */
+const locksAppRoot = (el) => {
+    return el.tagName !== 'ION-TOAST' && el.focusTrap !== false && isBackdropAlwaysBlocking(el);
 };
 const createController = (tagName) => {
     return {
@@ -39,10 +47,6 @@ export const alertController = /*@__PURE__*/ createController('ion-alert');
 export const actionSheetController = /*@__PURE__*/ createController('ion-action-sheet');
 export const loadingController = /*@__PURE__*/ createController('ion-loading');
 export const modalController = /*@__PURE__*/ createController('ion-modal');
-/**
- * @deprecated Use the inline ion-picker component instead.
- */
-export const pickerController = /*@__PURE__*/ createController('ion-picker-legacy');
 export const popoverController = /*@__PURE__*/ createController('ion-popover');
 export const toastController = /*@__PURE__*/ createController('ion-toast');
 /**
@@ -82,7 +86,6 @@ export const setOverlayId = (el) => {
     return el.id;
 };
 export const createOverlay = (tagName, opts) => {
-    // eslint-disable-next-line @typescript-eslint/prefer-optional-chain
     if (typeof window !== 'undefined' && typeof window.customElements !== 'undefined') {
         return window.customElements.whenDefined(tagName).then(() => {
             const element = document.createElement(tagName);
@@ -91,7 +94,7 @@ export const createOverlay = (tagName, opts) => {
              * Convert the passed in overlay options into props
              * that get passed down into the new overlay.
              */
-            Object.assign(element, Object.assign(Object.assign({}, opts), { hasController: true }));
+            Object.assign(element, { ...opts, hasController: true });
             // append the overlay element to the document body
             getAppRoot(document).appendChild(element);
             return new Promise((resolve) => componentOnReady(element, resolve));
@@ -115,7 +118,7 @@ const isOverlayHidden = (overlay) => overlay.classList.contains('overlay-hidden'
  */
 const focusElementInOverlay = (hostToFocus, overlay) => {
     let elementToFocus = hostToFocus;
-    const shadowRoot = hostToFocus === null || hostToFocus === void 0 ? void 0 : hostToFocus.shadowRoot;
+    const shadowRoot = hostToFocus?.shadowRoot;
     if (shadowRoot) {
         // If there are no inner focusable elements, just focus the host element.
         elementToFocus = shadowRoot.querySelector(focusableQueryString) || hostToFocus;
@@ -136,7 +139,7 @@ const focusElementInOverlay = (hostToFocus, overlay) => {
  * Should NOT include: Toast
  */
 const trapKeyboardFocus = (ev, doc) => {
-    const lastOverlay = getPresentedOverlay(doc, 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker-legacy,ion-popover');
+    const lastOverlay = getPresentedOverlay(doc, 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-popover');
     const target = ev.target;
     /**
      * If no active overlay, ignore this event.
@@ -322,7 +325,7 @@ const connectListeners = (doc) => {
         // handle back-button click
         doc.addEventListener('ionBackButton', (ev) => {
             const lastOverlay = getPresentedOverlay(doc);
-            if (lastOverlay === null || lastOverlay === void 0 ? void 0 : lastOverlay.backdropDismiss) {
+            if (lastOverlay?.backdropDismiss) {
                 ev.detail.register(OVERLAY_BACK_BUTTON_PRIORITY, () => {
                     /**
                      * Do not return this promise otherwise
@@ -350,7 +353,7 @@ const connectListeners = (doc) => {
             doc.addEventListener('keydown', (ev) => {
                 if (ev.key === 'Escape') {
                     const lastOverlay = getPresentedOverlay(doc);
-                    if (lastOverlay === null || lastOverlay === void 0 ? void 0 : lastOverlay.backdropDismiss) {
+                    if (lastOverlay?.backdropDismiss) {
                         lastOverlay.dismiss(undefined, BACKDROP);
                     }
                 }
@@ -370,7 +373,7 @@ export const dismissOverlay = (doc, data, role, overlayTag, id) => {
  */
 export const getOverlays = (doc, selector) => {
     if (selector === undefined) {
-        selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker-legacy,ion-popover,ion-toast';
+        selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-popover,ion-toast';
     }
     return Array.from(doc.querySelectorAll(selector)).filter((c) => c.overlayIndex > 0);
 };
@@ -397,6 +400,13 @@ export const getPresentedOverlay = (doc, overlayTag, id) => {
     // Otherwise, return the last overlay with the given id
     return (id === undefined ? overlays : overlays.filter((o) => o.id === id)).slice(-1)[0];
 };
+/**
+ * The element an app nests its views under. Overlays hide this rather than the
+ * whole root, so the overlay itself (a sibling) stays reachable.
+ */
+const getViewContainer = () => {
+    return getAppRoot(document).querySelector('ion-router-outlet, #ion-view-container-root');
+};
 /**
  * When an overlay is presented, the main
  * focus is the overlay not the page content.
@@ -420,8 +430,7 @@ export const getPresentedOverlay = (doc, overlayTag, id) => {
  * for main content.
  */
 export const setRootAriaHidden = (hidden = false) => {
-    const root = getAppRoot(document);
-    const viewContainer = root.querySelector('ion-router-outlet, #ion-view-container-root');
+    const viewContainer = getViewContainer();
     if (!viewContainer) {
         return;
     }
@@ -432,8 +441,57 @@ export const setRootAriaHidden = (hidden = false) => {
         viewContainer.removeAttribute('aria-hidden');
     }
 };
+/**
+ * Cleans up root `aria-hidden` and `backdrop-no-scroll` when
+ * an overlay is removed from the DOM without going through
+ * the `dismiss()` flow (e.g., when a framework unmounts the
+ * overlay during a route change).
+ *
+ * Should be called from an overlay's `disconnectedCallback`
+ * when the overlay was still presented at the time of removal.
+ */
+export const cleanupRootFocusTrapAccessibility = () => {
+    if (typeof document === 'undefined') {
+        return;
+    }
+    const remainingOverlays = getPresentedOverlays(document);
+    const hasRemainingLocking = remainingOverlays.some((o) => locksAppRoot(o));
+    if (!hasRemainingLocking) {
+        setRootAriaHidden(false);
+        document.body.classList.remove(BACKDROP_NO_SCROLL);
+    }
+};
+/**
+ * Applies the root lock itself: `aria-hidden` on the view container, and
+ * `backdrop-no-scroll` on the body. Shared by `present()` and the restore
+ * below, which have to stay in lockstep.
+ */
+const applyRootLock = (el) => {
+    // Hiding the container the overlay now sits in would hide the overlay too.
+    if (!getViewContainer()?.contains(el)) {
+        setRootAriaHidden(true);
+    }
+    document.body.classList.add(BACKDROP_NO_SCROLL);
+};
+/**
+ * Re-applies the root lock that `cleanupRootFocusTrapAccessibility()` released.
+ * Call from `connectedCallback` when the overlay is still presented.
+ *
+ * A synchronous move keeps the overlay connected, so the lock survives. A
+ * detach with a re-insert in a later task releases it, which is the shape a
+ * framework produces when it takes a subtree out and puts it back.
+ */
+export const restoreRootFocusTrapAccessibility = (overlayEl) => {
+    if (typeof document === 'undefined') {
+        return;
+    }
+    const el = overlayEl;
+    if (!locksAppRoot(el)) {
+        return;
+    }
+    applyRootLock(el);
+};
 export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts) => {
-    var _a, _b;
     if (overlay.presented) {
         return;
     }
@@ -449,15 +507,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
         restoreElementFocus(overlay.el);
     }
     /**
-     * Due to accessibility guidelines, toasts do not have
-     * focus traps.
-     *
-     * All other overlays should have focus traps to prevent
-     * the keyboard focus from leaving the overlay unless
-     * developers explicitly opt out (for example, sheet
-     * modals that should permit background interaction).
-     *
-     * Note: Some apps move inline overlays to a specific container
+     * Some apps move inline overlays to a specific container
      * during the willPresent lifecycle (e.g., React portals via
      * onWillPresent). Defer applying aria-hidden/inert to the app
      * root until after willPresent so we can detect where the
@@ -466,20 +516,13 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
      * to avoid disabling the overlay.
      */
     const overlayEl = overlay.el;
-    const shouldTrapFocus = overlayEl.tagName !== 'ION-TOAST' && overlayEl.focusTrap !== false;
-    const shouldLockRoot = shouldTrapFocus && isBackdropAlwaysBlocking(overlayEl);
+    const shouldLockRoot = locksAppRoot(overlayEl);
     overlay.presented = true;
     overlay.willPresent.emit();
     if (shouldLockRoot) {
-        const root = getAppRoot(document);
-        const viewContainer = root.querySelector('ion-router-outlet, #ion-view-container-root');
-        const overlayInsideViewContainer = viewContainer ? viewContainer.contains(overlayEl) : false;
-        if (!overlayInsideViewContainer) {
-            setRootAriaHidden(true);
-        }
-        document.body.classList.add(BACKDROP_NO_SCROLL);
+        applyRootLock(overlayEl);
     }
-    (_a = overlay.willPresentShorthand) === null || _a === void 0 ? void 0 : _a.emit();
+    overlay.willPresentShorthand?.emit();
     const mode = getIonMode(overlay);
     // get the user's animation fn if one was provided
     const animationBuilder = overlay.enterAnimation
@@ -488,7 +531,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
     const completed = await overlayAnimation(overlay, animationBuilder, overlay.el, opts);
     if (completed) {
         overlay.didPresent.emit();
-        (_b = overlay.didPresentShorthand) === null || _b === void 0 ? void 0 : _b.emit();
+        overlay.didPresentShorthand?.emit();
     }
     /**
      * If the focused element is already
@@ -508,7 +551,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
          * exists (e.g. picker-legacy), we fall back to the host.
          */
         const overlayWrapper = getElementRoot(overlay.el).querySelector('[role="dialog"][tabindex]');
-        const focusTarget = overlayWrapper !== null && overlayWrapper !== void 0 ? overlayWrapper : overlay.el;
+        const focusTarget = overlayWrapper ?? overlay.el;
         /**
          * `preventScroll` keeps this a pure focus move so the viewport does not
          * jump when the wrapper is partially off-screen (e.g. a sheet modal).
@@ -518,7 +561,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
         try {
             focusTarget.focus({ preventScroll: true });
         }
-        catch (_c) {
+        catch {
             focusTarget.focus();
         }
     }
@@ -554,7 +597,7 @@ const restoreElementFocus = async (overlayEl) => {
     }
     // Ensure active element is blurred to prevent a11y warning issues
     previousElement.blur();
-    const shadowRoot = previousElement === null || previousElement === void 0 ? void 0 : previousElement.shadowRoot;
+    const shadowRoot = previousElement?.shadowRoot;
     if (shadowRoot) {
         // If there are no inner focusable elements, just focus the host element.
         previousElement = shadowRoot.querySelector(focusableQueryString) || previousElement;
@@ -589,7 +632,6 @@ const restoreElementFocus = async (overlayEl) => {
     }
 };
 export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnimation, opts) => {
-    var _a, _b;
     if (!overlay.presented) {
         return false;
     }
@@ -604,12 +646,9 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
      * from the root element when the last focus-trapping overlay
      * is dismissed.
      */
-    const overlaysLockingRoot = presentedOverlays.filter((o) => {
-        const el = o;
-        return el.tagName !== 'ION-TOAST' && el.focusTrap !== false && isBackdropAlwaysBlocking(el);
-    });
+    const overlaysLockingRoot = presentedOverlays.filter((o) => locksAppRoot(o));
     const overlayEl = overlay.el;
-    const locksRoot = overlayEl.tagName !== 'ION-TOAST' && overlayEl.focusTrap !== false && isBackdropAlwaysBlocking(overlayEl);
+    const locksRoot = locksAppRoot(overlayEl);
     /**
      * If this is the last visible overlay that is trapping focus
      * then we want to re-add the root to the accessibility tree.
@@ -624,7 +663,7 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
         // Overlay contents should not be clickable during dismiss
         overlay.el.style.setProperty('pointer-events', 'none');
         overlay.willDismiss.emit({ data, role });
-        (_a = overlay.willDismissShorthand) === null || _a === void 0 ? void 0 : _a.emit({ data, role });
+        overlay.willDismissShorthand?.emit({ data, role });
         const mode = getIonMode(overlay);
         const animationBuilder = overlay.leaveAnimation
             ? overlay.leaveAnimation
@@ -634,7 +673,7 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
             await overlayAnimation(overlay, animationBuilder, overlay.el, opts);
         }
         overlay.didDismiss.emit({ data, role });
-        (_b = overlay.didDismissShorthand) === null || _b === void 0 ? void 0 : _b.emit({ data, role });
+        overlay.didDismissShorthand?.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) || [];
@@ -675,7 +714,7 @@ const overlayAnimation = async (overlay, animationBuilder, baseEl, opts) => {
     if (overlay.keyboardClose) {
         animation.beforeAddWrite(() => {
             const activeElement = baseEl.ownerDocument.activeElement;
-            if (activeElement === null || activeElement === void 0 ? void 0 : activeElement.matches('input,ion-input, ion-textarea')) {
+            if (activeElement?.matches('input,ion-input, ion-textarea')) {
                 activeElement.blur();
             }
         });

package/dist/collection/utils/platform.js

@@ -25,7 +25,7 @@ export const setupPlatforms = (win = window) => {
 const detectPlatforms = (win) => {
     const customPlatformMethods = config.get('platform');
     return Object.keys(PLATFORMS_MAP).filter((p) => {
-        const customMethod = customPlatformMethods === null || customPlatformMethods === void 0 ? void 0 : customPlatformMethods[p];
+        const customMethod = customPlatformMethods?.[p];
         return typeof customMethod === 'function' ? customMethod(win) : PLATFORMS_MAP[p](win);
     });
 };
@@ -67,13 +67,12 @@ const isHybrid = (win) => isCordova(win) || isCapacitorNative(win);
 const isCordova = (win) => !!(win['cordova'] || win['phonegap'] || win['PhoneGap']);
 const isCapacitorNative = (win) => {
     const capacitor = win['Capacitor'];
-    // TODO(ROU-11693): Remove when we no longer support Capacitor 2, which does not have isNativePlatform
-    return !!((capacitor === null || capacitor === void 0 ? void 0 : capacitor.isNative) || ((capacitor === null || capacitor === void 0 ? void 0 : capacitor.isNativePlatform) && !!capacitor.isNativePlatform()));
+    return !!capacitor?.isNativePlatform?.();
 };
 const isElectron = (win) => testUserAgent(win, /electron/i);
-const isPWA = (win) => { var _a; return !!(((_a = win.matchMedia) === null || _a === void 0 ? void 0 : _a.call(win, '(display-mode: standalone)').matches) || win.navigator.standalone); };
+const isPWA = (win) => !!(win.matchMedia?.('(display-mode: standalone)').matches || win.navigator.standalone);
 export const testUserAgent = (win, expr) => expr.test(win.navigator.userAgent);
-const matchMedia = (win, query) => { var _a; return (_a = win.matchMedia) === null || _a === void 0 ? void 0 : _a.call(win, query).matches; };
+const matchMedia = (win, query) => win.matchMedia?.(query).matches;
 const PLATFORMS_MAP = {
     ipad: isIpad,
     iphone: isIphone,

package/dist/collection/utils/rtl/dir.js

@@ -2,15 +2,25 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 /**
- * Returns `true` if the document or host element
- * has a `dir` set to `rtl`. The host value will always
- * take priority over the root document value.
+ * Returns `true` if the direction resolves to `rtl` for the given element.
+ *
+ * The direction comes from the nearest ancestor that declares one, starting
+ * with `hostEl` itself, and falls back to the root document value. Setting
+ * `dir="auto"` or setting `dir` to an empty string are skipped rather than
+ * treated as `ltr`. When nothing declares a direction, including the document,
+ * the direction is `ltr`.
+ *
+ * @param hostEl the element to resolve the direction for.
  */
 export const isRTL = (hostEl) => {
-    if (hostEl) {
-        if (hostEl.dir !== '') {
-            return hostEl.dir.toLowerCase() === 'rtl';
+    for (let el = hostEl; el; el = el.parentElement) {
+        const dir = el.getAttribute('dir')?.toLowerCase();
+        if (dir === 'rtl') {
+            return true;
+        }
+        if (dir === 'ltr') {
+            return false;
         }
     }
-    return (document === null || document === void 0 ? void 0 : document.dir.toLowerCase()) === 'rtl';
+    return document?.dir?.toLowerCase() === 'rtl';
 };