diff --git a/static/examples/5.x/drawer-actions.js b/static/examples/5.x/drawer-actions.js
index 2576b6812f8..3c97fefcf54 100755
--- a/static/examples/5.x/drawer-actions.js
+++ b/static/examples/5.x/drawer-actions.js
@@ -1,12 +1,11 @@
-import * as React from 'react';
-import { View, Button, Text } from 'react-native';
-import { NavigationContainer, DrawerActions } from '@react-navigation/native';
import {
createDrawerNavigator,
DrawerContentScrollView,
- DrawerItemList,
DrawerItem,
+ DrawerItemList,
} from '@react-navigation/drawer';
+import { DrawerActions, NavigationContainer } from '@react-navigation/native';
+import { Button, Text, View } from 'react-native';
function HomeScreen({ navigation }) {
const jumpToAction = DrawerActions.jumpTo('Profile', { user: 'Satya' });
@@ -34,7 +33,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/static/examples/5.x/hidden-components.js b/static/examples/5.x/hidden-components.js
index 6f6eee0d346..25c9afcd7c5 100755
--- a/static/examples/5.x/hidden-components.js
+++ b/static/examples/5.x/hidden-components.js
@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { Text, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
+import { Text, View } from 'react-native';
function Demo() {
return (
@@ -23,8 +22,8 @@ export default function App() {
{() => (
- null}>
-
+ null}>
+
)}
diff --git a/static/examples/5.x/safe-area-example.js b/static/examples/5.x/safe-area-example.js
index c842ea6a7c9..07c974f6259 100755
--- a/static/examples/5.x/safe-area-example.js
+++ b/static/examples/5.x/safe-area-example.js
@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { Text } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
+import { Text } from 'react-native';
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
function Demo() {
@@ -26,8 +25,8 @@ export default function App() {
{() => (
- null}>
-
+ null}>
+
)}
diff --git a/static/examples/5.x/state-persistance.js b/static/examples/5.x/state-persistence.js
similarity index 100%
rename from static/examples/5.x/state-persistance.js
rename to static/examples/5.x/state-persistence.js
diff --git a/static/examples/5.x/tab-actions.js b/static/examples/5.x/tab-actions.js
index 46ce0e54bc5..9c38e145cd4 100755
--- a/static/examples/5.x/tab-actions.js
+++ b/static/examples/5.x/tab-actions.js
@@ -1,7 +1,6 @@
-import * as React from 'react';
-import { View, Button, Text } from 'react-native';
-import { NavigationContainer, TabActions } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer, TabActions } from '@react-navigation/native';
+import { Button, Text, View } from 'react-native';
function HomeScreen({ navigation }) {
const jumpToAction = TabActions.jumpTo('Profile', { user: 'Satya' });
@@ -21,7 +20,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/static/examples/5.x/use-safe-area.js b/static/examples/5.x/use-safe-area.js
index 09a015b70ac..1e09dd1c41c 100755
--- a/static/examples/5.x/use-safe-area.js
+++ b/static/examples/5.x/use-safe-area.js
@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { Text, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
+import { Text, View } from 'react-native';
import { SafeAreaProvider, useSafeArea } from 'react-native-safe-area-context';
function Demo() {
@@ -34,8 +33,8 @@ export default function App() {
{() => (
- null}>
-
+ null}>
+
)}
diff --git a/static/examples/6.x/drawer-actions.js b/static/examples/6.x/drawer-actions.js
index 2576b6812f8..3c97fefcf54 100755
--- a/static/examples/6.x/drawer-actions.js
+++ b/static/examples/6.x/drawer-actions.js
@@ -1,12 +1,11 @@
-import * as React from 'react';
-import { View, Button, Text } from 'react-native';
-import { NavigationContainer, DrawerActions } from '@react-navigation/native';
import {
createDrawerNavigator,
DrawerContentScrollView,
- DrawerItemList,
DrawerItem,
+ DrawerItemList,
} from '@react-navigation/drawer';
+import { DrawerActions, NavigationContainer } from '@react-navigation/native';
+import { Button, Text, View } from 'react-native';
function HomeScreen({ navigation }) {
const jumpToAction = DrawerActions.jumpTo('Profile', { user: 'Satya' });
@@ -34,7 +33,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/static/examples/6.x/hidden-components.js b/static/examples/6.x/hidden-components.js
index baa2de5e7bf..f6cdc93eacb 100755
--- a/static/examples/6.x/hidden-components.js
+++ b/static/examples/6.x/hidden-components.js
@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { Text, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import { Text, View } from 'react-native';
function Demo() {
return (
@@ -27,11 +26,11 @@ export default function App() {
{() => (
null}
screenOptions={{ headerShown: false }}
>
-
+
)}
diff --git a/static/examples/6.x/safe-area-example.js b/static/examples/6.x/safe-area-example.js
index df9f692f61f..b0dced279e0 100755
--- a/static/examples/6.x/safe-area-example.js
+++ b/static/examples/6.x/safe-area-example.js
@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { View, Text } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import { Text, View } from 'react-native';
import {
SafeAreaProvider,
useSafeAreaInsets,
@@ -43,11 +42,11 @@ export default function App() {
{() => (
null}
screenOptions={{ headerShown: false }}
>
-
+
)}
diff --git a/static/examples/6.x/state-persistance.js b/static/examples/6.x/state-persistence.js
similarity index 100%
rename from static/examples/6.x/state-persistance.js
rename to static/examples/6.x/state-persistence.js
diff --git a/static/examples/6.x/tab-actions.js b/static/examples/6.x/tab-actions.js
index 46ce0e54bc5..9c38e145cd4 100755
--- a/static/examples/6.x/tab-actions.js
+++ b/static/examples/6.x/tab-actions.js
@@ -1,7 +1,6 @@
-import * as React from 'react';
-import { View, Button, Text } from 'react-native';
-import { NavigationContainer, TabActions } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer, TabActions } from '@react-navigation/native';
+import { Button, Text, View } from 'react-native';
function HomeScreen({ navigation }) {
const jumpToAction = TabActions.jumpTo('Profile', { user: 'Satya' });
@@ -21,7 +20,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/static/examples/6.x/use-safe-area.js b/static/examples/6.x/use-safe-area.js
index aeff43cfd29..b91cf128c12 100755
--- a/static/examples/6.x/use-safe-area.js
+++ b/static/examples/6.x/use-safe-area.js
@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { Text, View } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
+import { Text, View } from 'react-native';
import { SafeAreaProvider, useSafeArea } from 'react-native-safe-area-context';
function Demo() {
@@ -38,11 +37,11 @@ export default function App() {
{() => (
null}
screenOptions={{ headerShown: false }}
>
-
+
)}
diff --git a/versioned_docs/version-5.x/state-persistence.md b/versioned_docs/version-5.x/state-persistence.md
index 62dda684cd9..0030e515816 100755
--- a/versioned_docs/version-5.x/state-persistence.md
+++ b/versioned_docs/version-5.x/state-persistence.md
@@ -17,7 +17,7 @@ To be able to persist the [navigation state](navigation-state.md), we can use th
- `onStateChange` - This prop notifies us of any state changes. We can persist the state in this callback.
- `initialState` - This prop allows us to pass an initial state to use for [navigation state](navigation-state.md). We can pass the restored state in this prop.
-
+
```js
import * as React from 'react';
diff --git a/versioned_docs/version-6.x/native-stack-navigator.md b/versioned_docs/version-6.x/native-stack-navigator.md
index c6c30f9e95f..526434ddb06 100755
--- a/versioned_docs/version-6.x/native-stack-navigator.md
+++ b/versioned_docs/version-6.x/native-stack-navigator.md
@@ -441,7 +441,7 @@ Supported values:
- `"none"`
- `"slide"`
-On Android, setting either `fade` or `slide` will set the transition of status bar color. On iOS, this option applies to appereance animation of the status bar.
+On Android, setting either `fade` or `slide` will set the transition of status bar color. On iOS, this option applies to the appereance animation of the status bar.
Requires setting `View controller-based status bar appearance -> YES` (or removing the config) in your `Info.plist` file.
diff --git a/versioned_docs/version-6.x/state-persistence.md b/versioned_docs/version-6.x/state-persistence.md
index 3bde677dc8a..2209c43c96a 100755
--- a/versioned_docs/version-6.x/state-persistence.md
+++ b/versioned_docs/version-6.x/state-persistence.md
@@ -15,7 +15,7 @@ To be able to persist the [navigation state](navigation-state.md), we can use th
- `onStateChange` - This prop notifies us of any state changes. We can persist the state in this callback.
- `initialState` - This prop allows us to pass an initial state to use for [navigation state](navigation-state.md). We can pass the restored state in this prop.
-
+
```js
import * as React from 'react';
diff --git a/versioned_docs/version-7.x/drawer-actions.md b/versioned_docs/version-7.x/drawer-actions.md
index afaee8a26f7..ad254c2036e 100755
--- a/versioned_docs/version-7.x/drawer-actions.md
+++ b/versioned_docs/version-7.x/drawer-actions.md
@@ -230,7 +230,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/versioned_docs/version-7.x/native-stack-navigator.md b/versioned_docs/version-7.x/native-stack-navigator.md
index 9aeb490a2fd..c199d1db913 100755
--- a/versioned_docs/version-7.x/native-stack-navigator.md
+++ b/versioned_docs/version-7.x/native-stack-navigator.md
@@ -109,7 +109,7 @@ Supported values:
- `"none"`
- `"slide"`
-On Android, setting either `fade` or `slide` will set the transition of status bar color. On iOS, this option applies to appereance animation of the status bar.
+On Android, setting either `fade` or `slide` will set the transition of status bar color. On iOS, this option applies to the appereance animation of the status bar.
Requires setting `View controller-based status bar appearance -> YES` (or removing the config) in your `Info.plist` file.
diff --git a/versioned_docs/version-7.x/screen-tracking.md b/versioned_docs/version-7.x/screen-tracking.md
index 6838de14653..a77407c9233 100644
--- a/versioned_docs/version-7.x/screen-tracking.md
+++ b/versioned_docs/version-7.x/screen-tracking.md
@@ -101,7 +101,7 @@ export default function App() {
-```js name="Screen tracking for anylytics" snack
+```js name="Screen tracking for analytics" snack
import * as React from 'react';
import { View } from 'react-native';
// codeblock-focus-start
diff --git a/versioned_docs/version-7.x/tab-actions.md b/versioned_docs/version-7.x/tab-actions.md
index 0944a0ec620..8601bdd475b 100755
--- a/versioned_docs/version-7.x/tab-actions.md
+++ b/versioned_docs/version-7.x/tab-actions.md
@@ -55,7 +55,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/versioned_docs/version-8.x/drawer-actions.md b/versioned_docs/version-8.x/drawer-actions.md
index afaee8a26f7..ad254c2036e 100755
--- a/versioned_docs/version-8.x/drawer-actions.md
+++ b/versioned_docs/version-8.x/drawer-actions.md
@@ -230,7 +230,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}
diff --git a/versioned_docs/version-8.x/native-stack-navigator.md b/versioned_docs/version-8.x/native-stack-navigator.md
index 187849c23fa..190f487782a 100755
--- a/versioned_docs/version-8.x/native-stack-navigator.md
+++ b/versioned_docs/version-8.x/native-stack-navigator.md
@@ -109,7 +109,7 @@ Supported values:
- `"none"`
- `"slide"`
-On Android, setting either `fade` or `slide` will set the transition of status bar color. On iOS, this option applies to appereance animation of the status bar.
+On Android, setting either `fade` or `slide` will set the transition of status bar color. On iOS, this option applies to the appereance animation of the status bar.
Requires setting `View controller-based status bar appearance -> YES` (or removing the config) in your `Info.plist` file.
diff --git a/versioned_docs/version-8.x/screen-tracking.md b/versioned_docs/version-8.x/screen-tracking.md
index 39d2bf9d3ed..d0171fe0b18 100644
--- a/versioned_docs/version-8.x/screen-tracking.md
+++ b/versioned_docs/version-8.x/screen-tracking.md
@@ -76,6 +76,9 @@ export default function App() {
ref={navigationRef}
onReady={() => {
routeNameRef.current = navigationRef.current.getCurrentRoute().name;
+
+ // Replace the line below to add the tracker from a mobile analytics SDK
+ await trackScreenView(currentRouteName);
}}
onStateChange={async () => {
const previousRouteName = routeNameRef.current;
@@ -101,7 +104,7 @@ export default function App() {
-```js name="Screen tracking for anylytics" snack
+```js name="Screen tracking for analytics" snack
import * as React from 'react';
import { View } from 'react-native';
// codeblock-focus-start
diff --git a/versioned_docs/version-8.x/tab-actions.md b/versioned_docs/version-8.x/tab-actions.md
index 0944a0ec620..8601bdd475b 100755
--- a/versioned_docs/version-8.x/tab-actions.md
+++ b/versioned_docs/version-8.x/tab-actions.md
@@ -55,7 +55,9 @@ function ProfileScreen({ route }) {
return (
Profile!
- {route?.params?.user ? route.params.user : 'Noone'}'s profile
+
+ {route?.params?.user ? route.params.user : 'No one'}'s profile
+
);
}