feat: add a NavigatorScreenParams type. closes #6931

example/src/Screens/BottomTabs.tsx

@@ -5,6 +5,7 @@ import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityI
 import {
   getFocusedRouteNameFromRoute,
   ParamListBase,
+  NavigatorScreenParams,
 } from '@react-navigation/native';
 import type { StackScreenProps } from '@react-navigation/stack';
 import {
@@ -15,7 +16,7 @@ import TouchableBounce from '../Shared/TouchableBounce';
 import Albums from '../Shared/Albums';
 import Contacts from '../Shared/Contacts';
 import Chat from '../Shared/Chat';
-import SimpleStackScreen from './SimpleStack';
+import SimpleStackScreen, { SimpleStackParams } from './SimpleStack';
 
 const getTabBarIcon = (name: string) => ({
   color,
@@ -26,7 +27,7 @@ const getTabBarIcon = (name: string) => ({
 }) => <MaterialCommunityIcons name={name} color={color} size={size} />;
 
 type BottomTabParams = {
-  Article: undefined;
+  Article: NavigatorScreenParams<SimpleStackParams>;
   Albums: undefined;
   Contacts: undefined;
   Chat: undefined;

example/src/Screens/MaterialBottomTabs.tsx

@@ -1,13 +1,14 @@
 import * as React from 'react';
 import { StyleSheet } from 'react-native';
+import type { NavigatorScreenParams } from '@react-navigation/native';
 import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs';
 import Albums from '../Shared/Albums';
 import Contacts from '../Shared/Contacts';
 import Chat from '../Shared/Chat';
-import SimpleStackScreen from './SimpleStack';
+import SimpleStackScreen, { SimpleStackParams } from './SimpleStack';
 
 type MaterialBottomTabParams = {
-  Article: undefined;
+  Article: NavigatorScreenParams<SimpleStackParams>;
   Albums: undefined;
   Contacts: undefined;
   Chat: undefined;

example/src/Screens/SimpleStack.tsx

@@ -10,7 +10,7 @@ import Article from '../Shared/Article';
 import Albums from '../Shared/Albums';
 import NewsFeed from '../Shared/NewsFeed';
 
-type SimpleStackParams = {
+export type SimpleStackParams = {
   Article: { author: string } | undefined;
   NewsFeed: { date: number };
   Albums: undefined;

packages/core/src/getActionFromState.tsx

@@ -1,11 +1,12 @@
 import type {
   Route,
   PartialRoute,
+  ParamListBase,
   NavigationState,
   PartialState,
   CommonActions,
 } from '@react-navigation/routers';
-import type { PathConfig, PathConfigMap, NestedNavigateParams } from './types';
+import type { PathConfig, PathConfigMap, NavigatorScreenParams } from './types';
 
 type ConfigItem = {
   initialRouteName?: string;
@@ -18,7 +19,7 @@ type NavigateAction<State extends NavigationState> = {
   type: 'NAVIGATE';
   payload: {
     name: string;
-    params?: NestedNavigateParams<State>;
+    params?: NavigatorScreenParams<State>;
   };
 };
 
@@ -55,7 +56,10 @@ export default function getActionFromState(
 
   let current: PartialState<NavigationState> | undefined = route?.state;
   let config: ConfigItem | undefined = normalizedConfig?.screens?.[route?.name];
-  let params: NestedNavigateParams<NavigationState> = { ...route.params };
+  let params = { ...route.params } as NavigatorScreenParams<
+    ParamListBase,
+    NavigationState
+  >;
 
   let payload = route ? { name: route.name, params } : undefined;
 
@@ -98,7 +102,10 @@ export default function getActionFromState(
 
     if (route.state) {
       params.params = { ...route.params };
-      params = params.params;
+      params = params.params as NavigatorScreenParams<
+        ParamListBase,
+        NavigationState
+      >;
     } else {
       params.params = route.params;
     }

packages/core/src/types.tsx

@@ -504,19 +504,31 @@ export type TypedNavigator<
   ) => null;
 };
 
-export type NestedNavigateParams<State extends NavigationState> =
-  | {
-      screen?: string;
-      params?: object;
-      initial?: boolean;
-      state?: never;
-    }
+export type NavigatorScreenParams<
+  ParamList,
+  State extends NavigationState = NavigationState
+> =
   | {
       screen?: never;
       params?: never;
       initial?: never;
-      state?: PartialState<State> | State;
-    };
+      state: PartialState<State> | State | undefined;
+    }
+  | {
+      [RouteName in keyof ParamList]: undefined extends ParamList[RouteName]
+        ? {
+            screen: RouteName;
+            params?: ParamList[RouteName];
+            initial?: boolean;
+            state?: never;
+          }
+        : {
+            screen: RouteName;
+            params: ParamList[RouteName];
+            initial?: boolean;
+            state?: never;
+          };
+    }[keyof ParamList];
 
 export type PathConfig = {
   path?: string;

packages/core/src/useNavigationBuilder.tsx

@@ -34,7 +34,7 @@ import {
   PrivateValueStore,
   EventMapBase,
   EventMapCore,
-  NestedNavigateParams,
+  NavigatorScreenParams,
 } from './types';
 
 // This is to make TypeScript compiler happy
@@ -43,7 +43,7 @@ PrivateValueStore;
 
 type NavigatorRoute<State extends NavigationState> = {
   key: string;
-  params?: NestedNavigateParams<State>;
+  params?: NavigatorScreenParams<ParamListBase, State>;
 };
 
 /**