revert adding NavigationNativeContainer (react-navigation#603)

Author: WoLewicki

docs/native-stack-navigator.md

@@ -31,21 +31,18 @@ To use this navigator, import it from `@react-navigation/native-stack`:
 <samp id="simple-native-stack">
 
 ```js
-import { NavigationNativeContainer } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
 const Stack = createNativeStackNavigator();
 
-export default function App() {
+function MyStack() {
   return (
-    <NavigationNativeContainer>
-      <Stack.Navigator>
-        <Stack.Screen name="Home" component={Home} />
-        <Stack.Screen name="Notifications" component={Notifications} />
-        <Stack.Screen name="Profile" component={Profile} />
-        <Stack.Screen name="Settings" component={Settings} />
-      </Stack.Navigator>
-    </NavigationNativeContainer>
+    <Stack.Navigator>
+      <Stack.Screen name="Home" component={Home} />
+      <Stack.Screen name="Notifications" component={Notifications} />
+      <Stack.Screen name="Profile" component={Profile} />
+      <Stack.Screen name="Settings" component={Settings} />
+    </Stack.Navigator>
   );
 }
 ```
@@ -203,45 +200,42 @@ navigation.popToTop();
 <samp id="native-stack-with-options">
 
 ```js
-import { NavigationNativeContainer } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
 const Stack = createNativeStackNavigator();
 
-export default function App() {
+function MyStack() {
   return (
-    <NavigationNativeContainer>
-      <Stack.Navigator
-        initialRouteName="Home"
-        screenOptions={{
-          headerShown: false,
-          headerTintColor: 'white',
-          headerStyle: { backgroundColor: 'tomato' },
+    <Stack.Navigator
+      initialRouteName="Home"
+      screenOptions={{
+        headerShown: false,
+        headerTintColor: 'white',
+        headerStyle: { backgroundColor: 'tomato' },
+      }}
+    >
+      <Stack.Screen
+        name="Home"
+        component={Home}
+        options={{
+          title: 'Awesome app',
         }}
-      >
-        <Stack.Screen
-          name="Home"
-          component={Home}
-          options={{
-            title: 'Awesome app',
-          }}
-        />
-        <Stack.Screen
-          name="Profile"
-          component={Profile}
-          options={{
-            title: 'My profile',
-          }}
-        />
-        <Stack.Screen
-          name="Settings"
-          component={Settings}
-          options={{
-            gestureEnabled: false,
-          }}
-        />
-      </Stack.Navigator>
-    </NavigationNativeContainer>
+      />
+      <Stack.Screen
+        name="Profile"
+        component={Profile}
+        options={{
+          title: 'My profile',
+        }}
+      />
+      <Stack.Screen
+        name="Settings"
+        component={Settings}
+        options={{
+          gestureEnabled: false,
+        }}
+      />
+    </Stack.Navigator>
   );
 }
 ```

website/static/examples/next/native-stack-with-options.js

@@ -37,40 +37,46 @@ function Settings({ navigation }) {
 
 const Stack = createNativeStackNavigator();
 
+function MyStack() {
+  return (
+    <Stack.Navigator
+      initialRouteName="Home"
+      screenOptions={{
+        headerShown: false,
+        headerTintColor: 'white',
+        headerStyle: { backgroundColor: 'tomato' },
+      }}
+    >
+      <Stack.Screen
+        name="Home"
+        component={Home}
+        options={{
+          title: 'Awesome app',
+        }}
+      />
+      <Stack.Screen
+        name="Profile"
+        component={Profile}
+        options={{
+          title: 'My profile',
+        }}
+      />
+      <Stack.Screen
+        name="Settings"
+        component={Settings}
+        options={{
+          gestureEnabled: false,
+        }}
+      />
+    </Stack.Navigator>
+  );
+}
+
 export default function App() {
   enableScreens();
   return (
     <NavigationNativeContainer>
-      <Stack.Navigator
-        initialRouteName="Home"
-        screenOptions={{
-          headerShown: false,
-          headerTintColor: 'white',
-          headerStyle: { backgroundColor: 'tomato' },
-        }}
-      >
-        <Stack.Screen
-          name="Home"
-          component={Home}
-          options={{
-            title: 'Awesome app',
-          }}
-        />
-        <Stack.Screen
-          name="Profile"
-          component={Profile}
-          options={{
-            title: 'My profile',
-          }}
-        />
-        <Stack.Screen
-          name="Settings"
-          component={Settings}
-          options={{
-            gestureEnabled: false,
-          }}
-        />
-      </Stack.Navigator>
+      <MyStack />
     </NavigationNativeContainer>
   );
 }

website/static/examples/next/simple-native-stack.js

@@ -43,16 +43,22 @@ function Settings() {
 
 const Stack = createNativeStackNavigator();
 
+function MyStack() {
+  return (
+    <Stack.Navigator>
+      <Stack.Screen name="Home" component={Home} />
+      <Stack.Screen name="Notifications" component={Notifications} />
+      <Stack.Screen name="Profile" component={Profile} />
+      <Stack.Screen name="Settings" component={Settings} />
+    </Stack.Navigator>
+  );
+}
+
 export default function App() {
   enableScreens();
   return (
     <NavigationNativeContainer>
-      <Stack.Navigator>
-        <Stack.Screen name="Home" component={Home} />
-        <Stack.Screen name="Notifications" component={Notifications} />
-        <Stack.Screen name="Profile" component={Profile} />
-        <Stack.Screen name="Settings" component={Settings} />
-      </Stack.Navigator>
+      <MyStack />
     </NavigationNativeContainer>
   );
 }