docs: use native-stack in navigation-lifecycle

Author: kacperkapusciak

static/examples/6.x/focus-and-blur.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button, View, Text } from 'react-native';
 import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 
 function SettingsScreen({ navigation }) {
@@ -62,8 +62,8 @@ function DetailsScreen({ navigation }) {
   );
 }
 const Tab = createBottomTabNavigator();
-const SettingsStack = createStackNavigator();
-const HomeStack = createStackNavigator();
+const SettingsStack = createNativeStackNavigator();
+const HomeStack = createNativeStackNavigator();
 
 export default function App() {
   return (

static/examples/6.x/navigation-lifecycle.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button, View, Text } from 'react-native';
 import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 
 function SettingsScreen({ navigation }) {
@@ -52,8 +52,8 @@ function DetailsScreen({ navigation }) {
   );
 }
 const Tab = createBottomTabNavigator();
-const SettingsStack = createStackNavigator();
-const HomeStack = createStackNavigator();
+const SettingsStack = createNativeStackNavigator();
+const HomeStack = createNativeStackNavigator();
 
 export default function App() {
   return (

static/examples/6.x/use-focus-effect.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button, View, Text } from 'react-native';
 import { NavigationContainer, useFocusEffect } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 
 function SettingsScreen({ navigation }) {
@@ -64,8 +64,8 @@ function DetailsScreen({ navigation }) {
   );
 }
 const Tab = createBottomTabNavigator();
-const SettingsStack = createStackNavigator();
-const HomeStack = createStackNavigator();
+const SettingsStack = createNativeStackNavigator();
+const HomeStack = createNativeStackNavigator();
 
 export default function App() {
   return (

versioned_docs/version-6.x/navigation-lifecycle.md

@@ -4,19 +4,19 @@ title: Navigation lifecycle
 sidebar_label: Navigation lifecycle
 ---
 
-In a previous section, we worked with a stack navigator that has two screens (`Home` and `Details`) and learned how to use `navigation.navigate('RouteName')` to navigate between the routes.
+In a previous section, we worked with a native stack navigator that has two screens (`Home` and `Details`) and learned how to use `navigation.navigate('RouteName')` to navigate between the routes.
 
 An important question in this context is: what happens with `Home` when we navigate away from it, or when we come back to it? How does a route find out that a user is leaving it or coming back to it?
 
 If you are coming to react-navigation from a web background, you may assume that when user navigates from route `A` to route `B`, `A` will unmount (its `componentWillUnmount` is called) and `A` will mount again when user comes back to it. While these React lifecycle methods are still valid and are used in react-navigation, their usage differs from the web. This is driven by more complex needs of mobile navigation.
 
 ## Example scenario
 
-Consider a stack navigator with screens A and B. After navigating to A, its `componentDidMount` is called. When pushing B, its `componentDidMount` is also called, but A remains mounted on the stack and its `componentWillUnmount` is therefore not called.
+Consider a native stack navigator with screens A and B. After navigating to A, its `componentDidMount` is called. When pushing B, its `componentDidMount` is also called, but A remains mounted on the stack and its `componentWillUnmount` is therefore not called.
 
 When going back from B to A, `componentWillUnmount` of B is called, but `componentDidMount` of A is not because A remained mounted the whole time.
 
-Similar results can be observed (in combination) with other navigators as well. Consider a tab navigator with two tabs, where each tab is a stack navigator:
+Similar results can be observed (in combination) with other navigators as well. Consider a tab navigator with two tabs, where each tab is a native stack navigator:
 
 <samp id="navigation-lifecycle" />