Skip to content

Commit 44d9a5d

Browse files
committed
Tweak custom navigator docs
1 parent 3c79864 commit 44d9a5d

File tree

2 files changed

+9
-46
lines changed

2 files changed

+9
-46
lines changed

versioned_docs/version-7.x/custom-navigators.md

+6-44
Original file line numberDiff line numberDiff line change
@@ -56,27 +56,9 @@ import {
5656
TabActions,
5757
} from '@react-navigation/native';
5858

59-
function TabNavigator({
60-
id,
61-
initialRouteName,
62-
children,
63-
layout,
64-
screenListeners,
65-
screenOptions,
66-
screenLayout,
67-
tabBarStyle,
68-
contentStyle,
69-
}) {
59+
function TabNavigator({ tabBarStyle, contentStyle, ...rest }) {
7060
const { state, navigation, descriptors, NavigationContent } =
71-
useNavigationBuilder(TabRouter, {
72-
id,
73-
initialRouteName,
74-
children,
75-
layout,
76-
screenListeners,
77-
screenOptions,
78-
screenLayout,
79-
});
61+
useNavigationBuilder(TabRouter, rest);
8062

8163
return (
8264
<NavigationContent>
@@ -210,7 +192,7 @@ import {
210192
useNavigationBuilder,
211193
} from '@react-navigation/native';
212194

213-
// Props accepted by the view
195+
// Additional props accepted by the view
214196
type TabNavigationConfig = {
215197
tabBarStyle: StyleProp<ViewStyle>;
216198
contentStyle: StyleProp<ViewStyle>;
@@ -222,7 +204,6 @@ type TabNavigationOptions = {
222204
};
223205

224206
// Map of event name and the type of data (in event.data)
225-
//
226207
// canPreventDefault: true adds the defaultPrevented property to the
227208
// emitted events.
228209
type TabNavigationEventMap = {
@@ -242,35 +223,15 @@ type Props = DefaultNavigatorOptions<
242223
TabRouterOptions &
243224
TabNavigationConfig;
244225

245-
function TabNavigator({
246-
id,
247-
initialRouteName,
248-
children,
249-
layout,
250-
screenListeners,
251-
screenOptions,
252-
screenLayout,
253-
backBehavior,
254-
tabBarStyle,
255-
contentStyle,
256-
}: Props) {
226+
function TabNavigator({ tabBarStyle, contentStyle, ...rest }: Props) {
257227
const { state, navigation, descriptors, NavigationContent } =
258228
useNavigationBuilder<
259229
TabNavigationState<ParamListBase>,
260230
TabRouterOptions,
261231
TabActionHelpers<ParamListBase>,
262232
TabNavigationOptions,
263233
TabNavigationEventMap
264-
>(TabRouter, {
265-
id,
266-
initialRouteName,
267-
children,
268-
layout,
269-
screenListeners,
270-
screenOptions,
271-
screenLayout,
272-
backBehavior,
273-
});
234+
>(TabRouter, rest);
274235

275236
return (
276237
<NavigationContent>
@@ -321,6 +282,7 @@ function TabNavigator({
321282
);
322283
}
323284

285+
// The factory function with generic types for type-inference
324286
export function createMyNavigator<
325287
const ParamList extends ParamListBase,
326288
const NavigatorID extends string | undefined = undefined,

versioned_docs/version-7.x/testing.md

+3-2
Original file line numberDiff line numberDiff line change
@@ -810,8 +810,9 @@ function TestStackNavigator(props) {
810810
);
811811
}
812812

813-
export const createTestStackNavigator =
814-
createNavigatorFactory(TestStackNavigator);
813+
export function createTestStackNavigator(config) {
814+
return createNavigatorFactory(TestStackNavigator)(config);
815+
}
815816
```
816817

817818
This lets us test React Navigation specific logic such as `useFocusEffect` without needing to set up a full navigator.

0 commit comments

Comments
 (0)