@ionic/react-router 9.0.6-nightly.20260929 → 9.0.6

package/dist/index.js

@@ -1,6 +1,7 @@
 import React, { useRef, useState, useEffect, useCallback } from 'react';
 import { Route, matchPath as matchPath$1, Routes, Navigate, UNSAFE_RouteContext, matchRoutes, useLocation, useNavigate, BrowserRouter, useNavigationType, HashRouter } from 'react-router-dom';
 import { IonRoute, ViewStacks, generateId, ViewLifeCycleManager, createDebugLogger, StackContext, RouteManagerContext, getConfig, LocationHistory, NavManager } from '@ionic/react';
+import { LIFECYCLE_WILL_LEAVE, LIFECYCLE_DID_LEAVE, LIFECYCLE_WILL_ENTER, LIFECYCLE_DID_ENTER } from '@ionic/core/components';
 import { MemoryRouter, useLocation as useLocation$1, useNavigationType as useNavigationType$1 } from 'react-router';
 
 const IonRouteInner = ({ path, index, caseSensitive, element }) => {
@@ -1452,6 +1453,12 @@ const revealIonPageForSwipeBack = (element) => {
         element.removeAttribute('aria-hidden');
     }
 };
+/** Dispatches a view lifecycle event the way core's `lifecycle()` does. */
+const dispatchLifecycleEvent = (element, eventName) => {
+    if (element) {
+        element.dispatchEvent(new CustomEvent(eventName, { bubbles: false, cancelable: false }));
+    }
+};
 /**
  * A leaf view is "preservable" on browser-back (pop) when its React state
  * should survive a forward-pop round-trip. Non-parameterized leaf paths
@@ -1688,8 +1695,8 @@ class StackManager extends React.PureComponent {
         const allViewsInOutlet = this.context.getViewItemsForOutlet(this.id);
         allViewsInOutlet.forEach((viewItem) => {
             if (viewItem.ionPageElement && isViewVisible(viewItem.ionPageElement)) {
-                viewItem.ionPageElement.dispatchEvent(new CustomEvent('ionViewWillLeave', { bubbles: false, cancelable: false }));
-                viewItem.ionPageElement.dispatchEvent(new CustomEvent('ionViewDidLeave', { bubbles: false, cancelable: false }));
+                dispatchLifecycleEvent(viewItem.ionPageElement, LIFECYCLE_WILL_LEAVE);
+                dispatchLifecycleEvent(viewItem.ionPageElement, LIFECYCLE_DID_LEAVE);
             }
         });
         // Defer removal of view items to allow the parent outlet's leaving-page
@@ -1724,8 +1731,8 @@ class StackManager extends React.PureComponent {
                 return;
             }
             if (viewItem.ionPageElement && isViewVisible(viewItem.ionPageElement)) {
-                viewItem.ionPageElement.dispatchEvent(new CustomEvent('ionViewWillLeave', { bubbles: false, cancelable: false }));
-                viewItem.ionPageElement.dispatchEvent(new CustomEvent('ionViewDidLeave', { bubbles: false, cancelable: false }));
+                dispatchLifecycleEvent(viewItem.ionPageElement, LIFECYCLE_WILL_LEAVE);
+                dispatchLifecycleEvent(viewItem.ionPageElement, LIFECYCLE_DID_LEAVE);
             }
             this.context.unMountViewItem(viewItem);
         });
@@ -2856,10 +2863,34 @@ class StackManager extends React.PureComponent {
                     // Bail out if the component unmounted during waitForComponentsReady
                     if (!this._isMounted)
                         return;
+                    const isCurrent = myGeneration === this.transitionGeneration;
+                    // A page the newest transition is entering is not leaving after all.
+                    const isLeaving = isCurrent || leavingEl !== this.transitionEnteringElement;
+                    // Already hidden means the leave events have fired. This checks the class rather
+                    // than `isViewVisible` because a nested outlet marks its leaving page
+                    // `visibility: hidden` before we get here and still needs `ionViewDidLeave`.
+                    const announceLeaving = isLeaving && !leavingEl.classList.contains('ion-page-hidden');
+                    /**
+                     * Dispatch the lifecycle events, since we skipped `commit()`. Only the
+                     * newest transition fires the entering events, and the class swap follows
+                     * all four so the ordering matches core's `transition()`.
+                     *
+                     * These run after `waitForComponentsReady` because on a first mount the
+                     * page has not attached its listeners yet.
+                     */
+                    if (announceLeaving) {
+                        dispatchLifecycleEvent(leavingEl, LIFECYCLE_WILL_LEAVE);
+                    }
+                    if (isCurrent) {
+                        dispatchLifecycleEvent(enteringEl, LIFECYCLE_WILL_ENTER);
+                        dispatchLifecycleEvent(enteringEl, LIFECYCLE_DID_ENTER);
+                    }
+                    if (announceLeaving) {
+                        dispatchLifecycleEvent(leavingEl, LIFECYCLE_DID_LEAVE);
+                    }
                     // Swap visibility synchronously - show entering, hide leaving
-                    // Skip hiding if a newer transition already made leavingEl the entering view
                     enteringEl.classList.remove('ion-page-invisible');
-                    if (myGeneration === this.transitionGeneration || leavingEl !== this.transitionEnteringElement) {
+                    if (isLeaving) {
                         leavingEl.classList.add('ion-page-hidden');
                         leavingEl.setAttribute('aria-hidden', 'true');
                     }