@react-navigation/core 8.0.0-alpha.22 → 8.0.0-alpha.24

package/src/types.tsx

@@ -287,6 +287,45 @@ export class PrivateValueStore<T extends [any, any, any, any]> {
   protected ''?: T;
 }
 
+type NavigatorLike =
+  | {
+      Navigator: React.ComponentType<any>;
+      Screen: unknown;
+      Group: unknown;
+    }
+  | {
+      config: unknown;
+      getComponent: () => React.ComponentType<any>;
+    };
+
+type ParamListForNavigator<T extends {}> = T extends NavigatorLike
+  ? T extends PrivateValueStore<[infer ParamList extends {}, any, any, any]>
+    ? ParamList
+    : T
+  : T;
+
+// Remove `undefined` before checking for nested navigator params.
+// If nothing remains, avoid matching `never` against `NavigatorScreenParams`
+type NestedNavigatorForScreenParams<T, Params = NotUndefined<T>> = [
+  Params,
+] extends [never]
+  ? never
+  : Params extends NavigatorScreenParams<infer Navigator>
+    ? Navigator extends PrivateValueStore<[any, any, any, any]>
+      ? Navigator extends NavigatorLike
+        ? Navigator
+        : never
+      : never
+    : never;
+
+export type NestedNavigatorsForParamList<ParamList extends {}> = {
+  [RouteName in keyof ParamList as NestedNavigatorForScreenParams<
+    ParamList[RouteName]
+  > extends never
+    ? never
+    : RouteName]: NestedNavigatorForScreenParams<ParamList[RouteName]>;
+};
+
 type NavigateOptions = {
   merge?: boolean | undefined;
   pop?: boolean | undefined;
@@ -336,27 +375,6 @@ type NavigationHelpersCommon<
       : never
   ): void;
 
-  /**
-   * Navigate to a route in current navigation tree.
-   *
-   * @param options.name Name of the route to navigate to.
-   * @param [options.params] Params object for the route.
-   * @param [options.path] Path to associate the route with (e.g. for deep links).
-   * @param [options.merge] Whether to merge the params onto the route. Defaults to `false`.
-   * @param [options.pop] Whether to pop routes in a stack to go back to the matching route. Defaults to `false`.
-   */
-  navigate<RouteName extends keyof ParamList>(
-    options: RouteName extends unknown
-      ? {
-          name: RouteName;
-          params: ParamList[RouteName];
-          path?: string | undefined;
-          merge?: boolean | undefined;
-          pop?: boolean | undefined;
-        }
-      : never
-  ): void;
-
   /**
    * Preloads the route in current navigation tree.
    *
@@ -933,15 +951,19 @@ export type NavigationContainerEventMap = {
       /**
        * The data object passed when emitting the event.
        */
-      data: unknown;
+      data?: unknown;
       /**
        * The key of the target route which received the event.
        */
-      target: string | undefined;
+      target?: string | undefined;
       /**
        * Whether `event.preventDefault()` was called on this event.
        */
-      defaultPrevented: boolean | undefined;
+      defaultPrevented?: boolean | undefined;
+      /**
+       * Prevent the default action which happens on this event.
+       */
+      preventDefault?: (() => void) | undefined;
     };
   };
 };
@@ -1021,8 +1043,8 @@ export type RouteForName<
 // Look up route object by checking each level and recursing into the nested param lists
 // This avoids building a union of all routes, which doesn't scale on large trees
 type RouteForNameInternal<ParamList extends {}, RouteName extends string> =
-  | (RouteName extends infer Name extends KeyOf<ParamList>
-      ? RouteProp<ParamList, Name>
+  | (RouteName extends KeyOf<ParamList>
+      ? RouteProp<ParamList, RouteName>
       : never)
   | RouteForNameNested<NestedParamLists<ParamList>, RouteName>;
 
@@ -1031,11 +1053,7 @@ type RouteForNameNested<ParamLists, RouteName extends string> =
   // e.g. if ParamLists is A | B
   // TypeScript evaluates the branch once per member (A, then B)
   // and unions the outcomes
-  // The infer ParamList extends {} just captures the current member
-  // and re-asserts the {} constraint that RouteForNameInternal requires
-  ParamLists extends infer ParamList extends {}
-    ? RouteForNameInternal<ParamList, RouteName>
-    : never;
+  ParamLists extends {} ? RouteForNameInternal<ParamLists, RouteName> : never;
 
 /**
  * Union of param lists of the nested navigators in a param list.
@@ -1043,7 +1061,7 @@ type RouteForNameNested<ParamLists, RouteName extends string> =
 export type NestedParamLists<ParamList extends {}> = {
   [RouteName in keyof ParamList]: NavigatorScreenParams<{}> extends ParamList[RouteName]
     ? NotUndefined<ParamList[RouteName]> extends NavigatorScreenParams<infer T>
-      ? T
+      ? ParamListForNavigator<T>
       : never
     : never;
 }[keyof ParamList];
@@ -1051,7 +1069,9 @@ export type NestedParamLists<ParamList extends {}> = {
 type ParamListRoute<ParamList extends {}> = {
   [RouteName in keyof ParamList]: NavigatorScreenParams<{}> extends ParamList[RouteName]
     ? NotUndefined<ParamList[RouteName]> extends NavigatorScreenParams<infer T>
-      ? ParamListRoute<T> | RouteProp<ParamList, RouteName>
+      ?
+          | ParamListRoute<ParamListForNavigator<T>>
+          | RouteProp<ParamList, RouteName>
       : RouteProp<ParamList, RouteName>
     : RouteProp<ParamList, RouteName>;
 }[keyof ParamList];
@@ -1077,13 +1097,15 @@ type BasicNavigationList<
       ? NotUndefined<ParamList[RouteName]> extends NavigatorScreenParams<
           infer T
         >
-        ? keyof T extends ExcludedRouteNames
-          ? {}
-          : BasicNavigationList<
-              T,
-              ExcludedRouteNames,
-              NavigationProp<ParamList, RouteName>
-            >
+        ? ParamListForNavigator<T> extends infer NestedParamList extends {}
+          ? keyof NestedParamList extends ExcludedRouteNames
+            ? {}
+            : BasicNavigationList<
+                NestedParamList,
+                ExcludedRouteNames,
+                NavigationProp<ParamList, RouteName>
+              >
+          : {}
         : {}
       : {}) &
       (RouteName extends ExcludedRouteNames
@@ -1097,6 +1119,105 @@ type BasicNavigationList<
   }[keyof ParamList]
 >;
 
+type InheritedParentParams<ParentParamList, ParamList> = {
+  [K in keyof ParentParamList as K extends keyof ParamList
+    ? never
+    : string extends K
+      ? never
+      : K]: ParentParamList[K];
+};
+
+type GenericNavigationComposite<
+  ParamList extends ParamListBase,
+  RouteName extends keyof ParamList,
+  Parent,
+> =
+  Parent extends NavigationProp<any, any, any, any, any>
+    ? ParamListOfNavigationProp<Parent> extends infer ParentParamList
+      ? NavigationProp<
+          ParamList & InheritedParentParams<ParentParamList, ParamList>,
+          RouteName
+        > & { getParent: Parent['getParent'] }
+      : never
+    : NavigationProp<ParamList, RouteName>;
+
+type NavigationListForScreenParams<
+  T extends {},
+  ParamList extends ParamListBase,
+  RouteName extends keyof ParamList,
+  ExcludedRouteNames,
+  Parent extends NavigationProp<any, any, any, any, any> | undefined,
+> =
+  T extends PrivateValueStore<[any, any, any, any]>
+    ? T extends NavigatorLike
+      ? NavigationListForNestedInternal<
+          T,
+          GenericNavigationComposite<ParamList, RouteName, Parent>
+        >
+      : NavigationListForParamListScreenParams<
+          T,
+          ParamList,
+          RouteName,
+          ExcludedRouteNames,
+          Parent
+        >
+    : NavigationListForParamListScreenParams<
+        T,
+        ParamList,
+        RouteName,
+        ExcludedRouteNames,
+        Parent
+      >;
+
+type NavigationListForParamListScreenParams<
+  T extends {},
+  ParamList extends ParamListBase,
+  RouteName extends keyof ParamList,
+  ExcludedRouteNames,
+  Parent extends NavigationProp<any, any, any, any, any> | undefined,
+> =
+  // `T` is only ever a plain param list here, since navigators are routed to
+  // `NavigationListForNestedInternal` by `NavigationListForScreenParams`.
+  // So there's no navigator to unwrap with `ParamListForNavigator`.
+  T extends ParamListBase
+    ? BasicNavigationListForParamList<
+        T,
+        ExcludedRouteNames,
+        GenericNavigationComposite<ParamList, RouteName, Parent>
+      >
+    : {};
+
+type BasicNavigationListForParamList<
+  ParamList extends ParamListBase,
+  ExcludedRouteNames,
+  Parent extends NavigationProp<any, any, any, any, any> | undefined,
+> = UnionToIntersection<
+  {
+    [RouteName in keyof ParamList]: (NavigatorScreenParams<{}> extends ParamList[RouteName]
+      ? NotUndefined<ParamList[RouteName]> extends NavigatorScreenParams<
+          infer T
+        >
+        ? NavigationListForScreenParams<
+            T,
+            ParamList,
+            RouteName,
+            ExcludedRouteNames,
+            Parent
+          >
+        : {}
+      : {}) &
+      (RouteName extends ExcludedRouteNames
+        ? {}
+        : {
+            [Key in RouteName]: GenericNavigationComposite<
+              ParamList,
+              RouteName,
+              Parent
+            >;
+          });
+  }[keyof ParamList]
+>;
+
 export type NavigationListForNavigator<Navigator> =
   Navigator extends PrivateValueStore<infer Value> ? Value[1] : {};
 
@@ -1115,13 +1236,14 @@ type NavigationListForNestedInternal<
   Parent = undefined,
   NavigatorList extends Record<string, any> =
     NavigationListForNavigator<Navigator>,
+  Navigators = NestedNavigatorsOf<Navigator>,
   // This navigator's own routes, each composed with the accumulated parent.
   // It's threaded into the recursion as the parent for nested navigators so
   // each route is composed with its ancestors exactly once, instead of
   // re-wrapping the whole descendant list at every level (which is quadratic
   // in the nesting depth).
   ComposedList = ComposeNavigationList<NavigatorList, Parent>,
-> = Navigator extends {
+> = (Navigator extends {
   readonly config: {
     readonly screens?: infer Screens;
     readonly groups?: infer Groups;
@@ -1130,7 +1252,69 @@ type NavigationListForNestedInternal<
   ? ComposedList &
       NavigationListForScreens<ComposedList, Screens> &
       NavigationListForGroups<ComposedList, Groups>
-  : ComposedList;
+  : ComposedList) &
+  NavigationListForNestedNavigators<ComposedList, Navigators> &
+  NavigationListForDynamicNestedParamLists<Navigator, ComposedList, Navigators>;
+
+type NavigationListForDynamicNestedParamLists<
+  Navigator,
+  ParentList,
+  Navigators,
+> = Navigator extends { readonly config: unknown }
+  ? {}
+  : Navigator extends PrivateValueStore<[infer ParamList, any, any, any]>
+    ? NavigationListForNestedParamLists<ParentList, ParamList, Navigators>
+    : {};
+
+// Map of route name to nested navigator type
+// inferred from `NavigatorScreenParams<typeof Navigator>`
+type NestedNavigatorsOf<Navigator> =
+  Navigator extends PrivateValueStore<[any, any, any, infer Nesting]>
+    ? Nesting extends Record<string, any>
+      ? Nesting
+      : {}
+    : {};
+
+// Like `NavigationListForScreens`, but reads nested navigators from the brand
+// map instead of a static config.
+type NavigationListForNestedNavigators<ParentList, Navigators> =
+  UnionToIntersection<
+    {
+      [K in keyof Navigators]: K extends keyof ParentList
+        ? NavigationListForNestedInternal<Navigators[K], ParentList[K]>
+        : {};
+    }[keyof Navigators]
+  >;
+
+// Fallback for dynamic nested routes declared through NavigatorScreenParams<ParamList>.
+// Param-list branches expose generic navigation props, while nested navigator
+// entries still recover their concrete navigator props.
+type NavigationListForNestedParamLists<ParentList, ParamList, Navigators> =
+  ParentList extends Record<string, any>
+    ? ParamList extends ParamListBase
+      ? UnionToIntersection<
+          {
+            [K in keyof ParamList]: K extends keyof Navigators
+              ? {}
+              : K extends keyof ParentList
+                ? NavigatorScreenParams<{}> extends ParamList[K]
+                  ? NotUndefined<ParamList[K]> extends NavigatorScreenParams<
+                      infer T
+                    >
+                    ? NavigationListForScreenParams<
+                        T,
+                        ParamList,
+                        K,
+                        keyof ParentList,
+                        ParentList[K]
+                      >
+                    : {}
+                  : {}
+                : {};
+          }[keyof ParamList]
+        >
+      : {}
+    : {};
 
 // Compose every entry in a navigator's list with the accumulated parent.
 // When there's no parent (root navigator), the list is returned as-is so the
@@ -1291,6 +1475,7 @@ type TypedNavigatorStatic<
 export type TypedNavigator<
   Bag extends NavigatorTypeBagBase,
   Config = unknown,
+  Nesting = unknown,
 > = (undefined extends Config
   ? TypedNavigatorInternal<
       Bag['ParamList'],
@@ -1302,7 +1487,7 @@ export type TypedNavigator<
     >
   : TypedNavigatorStatic<Bag, Config>) &
   PrivateValueStore<
-    [Bag['ParamList'], Bag['NavigationList'], unknown, unknown]
+    [Bag['ParamList'], Bag['NavigationList'], unknown, Nesting]
   >;
 
 type TypedNavigatorInternal<
@@ -1350,7 +1535,17 @@ type TypedNavigatorInternal<
   ) => null;
 };
 
-export type NavigatorScreenParams<ParamList extends {}> =
+declare const NavigatorScreenParamsSymbol: unique symbol;
+
+type NavigatorScreenParamsBrand<T extends {}> = {
+  // Preserve the original generic for inference without affecting assignability.
+  // - The symbol key hides the property from normal object usage
+  // - The actual type is intersected for inference
+  // - The `any` makes the property effectively `any` for assignability
+  readonly [NavigatorScreenParamsSymbol]?: any & { readonly type: T };
+};
+
+type NavigatorScreenParamsForParamList<ParamList extends {}> =
   | {
       screen?: never;
       params?: never;
@@ -1385,6 +1580,10 @@ export type NavigatorScreenParams<ParamList extends {}> =
           };
     }[keyof ParamList];
 
+export type NavigatorScreenParams<ParamList extends {}> =
+  NavigatorScreenParamsForParamList<ParamListForNavigator<ParamList>> &
+    NavigatorScreenParamsBrand<ParamList>;
+
 type ParseConfig<Params> = {
   [K in keyof Params]?:
     | ((value: string) => Params[K])
@@ -1452,16 +1651,20 @@ export type PathConfig<Params> = FlatType<
      */
     alias?: (string | PathConfigAlias<Params>)[] | undefined;
   } & (NonNullable<Params> extends NavigatorScreenParams<infer ParamList>
-      ? {
-          /**
-           * Path configuration for child screens.
-           */
-          screens?: PathConfigMap<ParamList> | undefined;
-          /**
-           * Name of the initial route to use for the navigator when the path matches.
-           */
-          initialRouteName?: Extract<keyof ParamList, string> | undefined;
-        }
+      ? ParamListForNavigator<ParamList> extends infer ChildParamList extends {}
+        ? {
+            /**
+             * Path configuration for child screens.
+             */
+            screens?: PathConfigMap<ChildParamList> | undefined;
+            /**
+             * Name of the initial route to use for the navigator when the path matches.
+             */
+            initialRouteName?:
+              | Extract<keyof ChildParamList, string>
+              | undefined;
+          }
+        : {}
       : {})
 >;
 

package/src/useEventEmitter.tsx

@@ -13,12 +13,15 @@ type Listeners = Set<(e: any) => void>;
  * Hook to manage the event system used by the navigator to notify screens of various events.
  */
 export function useEventEmitter<T extends Record<string, any>>(
-  listen?: (e: any) => void
+  listen?: (e: any) => void,
+  onPostEmit?: (e: any) => void
 ): NavigationEventEmitter<T> {
   const listenRef = React.useRef(listen);
+  const onPostEmitRef = React.useRef(onPostEmit);
 
   React.useEffect(() => {
     listenRef.current = listen;
+    onPostEmitRef.current = onPostEmit;
   });
 
   const listeners = React.useRef<Record<string, Record<string, Listeners>>>(
@@ -124,6 +127,8 @@ export function useEventEmitter<T extends Record<string, any>>(
 
       callbacks?.forEach((cb) => cb(event));
 
+      onPostEmitRef.current?.(event);
+
       return event as any;
     },
     []

package/src/useNavigationBuilder.tsx

@@ -687,13 +687,16 @@ export function useNavigationBuilder<
         }
       } else {
         // If the route was updated with new screen name and/or params, we should navigate there
-        action = CommonActions.navigate({
-          name: route.params.screen,
-          params: route.params.params,
-          path: route.params.path,
-          merge: route.params.merge,
-          pop: route.params.pop,
-        });
+        action = {
+          type: 'NAVIGATE',
+          payload: {
+            name: route.params.screen,
+            params: route.params.params,
+            path: route.params.path,
+            merge: route.params.merge,
+            pop: route.params.pop,
+          },
+        } as const;
       }
     }
 
@@ -874,14 +877,7 @@ export function useNavigationBuilder<
 
       listeners.forEach((listener) => listener?.(e));
     }
-
-    onEmitEvent({
-      type: e.type,
-      data: e.data,
-      target: e.target,
-      defaultPrevented: e.defaultPrevented,
-    });
-  });
+  }, onEmitEvent);
 
   useFocusEvents({ state, emitter });
 

package/src/useOnAction.tsx

@@ -88,8 +88,6 @@ export function useOnAction<State extends NavigationState>({
           result === null && action.target === state.key ? state : result;
 
         if (result !== null) {
-          onDispatchAction(action, state === result);
-
           if (state !== result) {
             const isPrevented = shouldPreventRemove(
               emitter,
@@ -100,10 +98,16 @@ export function useOnAction<State extends NavigationState>({
             );
 
             if (isPrevented) {
+              onDispatchAction(action, true);
+
               return true;
             }
 
+            onDispatchAction(action, false);
+
             setState(result);
+          } else {
+            onDispatchAction(action, true);
           }
 
           if (onRouteFocusParent !== undefined) {

package/src/useOnPreventRemove.tsx

@@ -1,6 +1,9 @@
 import type {
   NavigationAction,
+  NavigationRoute,
   NavigationState,
+  ParamListBase,
+  PartialRoute,
 } from '@react-navigation/routers';
 import * as React from 'react';
 
@@ -23,16 +26,18 @@ const VISITED_ROUTE_KEYS = Symbol('VISITED_ROUTE_KEYS');
 export const shouldPreventRemove = (
   emitter: NavigationEventEmitter<EventMapCore<any>>,
   beforeRemoveListeners: Record<string, ChildBeforeRemoveListener | undefined>,
-  currentRoutes: { key: string }[],
-  nextRoutes: { key?: string | undefined }[],
+  currentRoutes: NavigationRoute<ParamListBase, string>[],
+  nextRoutes: (
+    | NavigationRoute<ParamListBase, string>
+    | PartialRoute<NavigationRoute<ParamListBase, string>>
+  )[],
   action: NavigationAction
 ) => {
-  const nextRouteKeys = nextRoutes.map((route) => route.key);
-
-  // Call these in reverse order so last screens handle the event first
-  const removedRoutes = currentRoutes
-    .filter((route) => !nextRouteKeys.includes(route.key))
-    .reverse();
+  const nextRoutesByKey = new Map(
+    nextRoutes
+      .map((route) => [route.key, route] as const)
+      .filter(([, route]) => route.key != null)
+  );
 
   const visitedRouteKeys: Set<string> =
     // @ts-expect-error: add this property to mark that we've already emitted this action
@@ -43,30 +48,53 @@ export const shouldPreventRemove = (
     [VISITED_ROUTE_KEYS]: visitedRouteKeys,
   };
 
-  for (const route of removedRoutes) {
+  // Call these in reverse order so last screens handle the event first
+  const reversedCurrentRoutes = [...currentRoutes].reverse();
+
+  for (const route of reversedCurrentRoutes) {
     if (visitedRouteKeys.has(route.key)) {
       // Skip if we've already emitted this action for this screen
       continue;
     }
 
-    // First, we need to check if any child screens want to prevent it
-    const isPrevented = beforeRemoveListeners[route.key]?.(beforeRemoveAction);
-
-    if (isPrevented) {
-      return true;
-    }
-
-    visitedRouteKeys.add(route.key);
+    if (!nextRoutesByKey.has(route.key)) {
+      // The route is not in next state, so it's being removed
+      // First, we need to check if any child screens want to prevent it
+      const isPrevented = beforeRemoveListeners[route.key]?.(
+        beforeRemoveAction,
+        undefined
+      );
+
+      if (isPrevented) {
+        return true;
+      }
+
+      visitedRouteKeys.add(route.key);
+
+      const event = emitter.emit({
+        type: 'beforeRemove',
+        target: route.key,
+        data: { action: beforeRemoveAction },
+        canPreventDefault: true,
+      });
 
-    const event = emitter.emit({
-      type: 'beforeRemove',
-      target: route.key,
-      data: { action: beforeRemoveAction },
-      canPreventDefault: true,
-    });
+      if (event.defaultPrevented) {
+        return true;
+      }
+    } else {
+      // The route is kept but its nested state changed, so propagate the check into the nested navigator
+      const nextRoute = nextRoutesByKey.get(route.key);
+
+      if (route.state != null && route.state !== nextRoute?.state) {
+        const isPrevented = beforeRemoveListeners[route.key]?.(
+          beforeRemoveAction,
+          nextRoute?.state
+        );
 
-    if (event.defaultPrevented) {
-      return true;
+        if (isPrevented) {
+          return true;
+        }
+      }
     }
   }
 
@@ -84,17 +112,21 @@ export function useOnPreventRemove({
 
   React.useInsertionEffect(() => {
     if (routeKey) {
-      return addKeyedListener?.('beforeRemove', routeKey, (action) => {
-        const state = getState();
-
-        return shouldPreventRemove(
-          emitter,
-          beforeRemoveListeners,
-          state.routes,
-          [],
-          action
-        );
-      });
+      return addKeyedListener?.(
+        'beforeRemove',
+        routeKey,
+        (action, nextState) => {
+          const state = getState();
+
+          return shouldPreventRemove(
+            emitter,
+            beforeRemoveListeners,
+            state.routes,
+            nextState?.routes ?? [],
+            action
+          );
+        }
+      );
     }
   }, [addKeyedListener, beforeRemoveListeners, emitter, getState, routeKey]);
 }

package/src/useRoute.tsx

@@ -22,11 +22,9 @@ type AllRouteNames<ParamList extends {}> =
   | KeyOf<ParamList>
   | AllNestedRouteNames<NestedParamLists<ParamList>>;
 
-type AllNestedRouteNames<ParamLists> =
-  // Distributes over the union of nested param lists
-  ParamLists extends infer ParamList extends {}
-    ? AllRouteNames<ParamList>
-    : never;
+type AllNestedRouteNames<ParamLists> = ParamLists extends {}
+  ? AllRouteNames<ParamLists>
+  : never;
 
 /**
  * Hook to access the route prop of the parent screen anywhere.