From dcfce302cefadb01c755932389b9da1c440751f1 Mon Sep 17 00:00:00 2001
From: bySabi Files <bysabi.files@gmail.com>
Date: Tue, 29 Jan 2019 09:32:17 +0100
Subject: [PATCH 1/3] update withNavigation doc

---
 docs/with-navigation.md | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/docs/with-navigation.md b/docs/with-navigation.md
index 93c931e668b..843f253a102 100644
--- a/docs/with-navigation.md
+++ b/docs/with-navigation.md
@@ -6,7 +6,7 @@ sidebar_label: withNavigation
 
 `withNavigation` is a higher order component which passes the `navigation` prop into a wrapped component. It's useful when you cannot pass the `navigation` prop into the component directly, or don't want to pass it in case of a deeply nested child.
 
-- `withNavigation(Component)` returns a Component.
+- `withNavigation(Component, config)` returns a Component.
 
 ## Example
 
@@ -31,9 +31,19 @@ export default withNavigation(MyBackButton);
 - If you wish to use the `ref` prop on the wrapped component, you must pass the `onRef` prop instead. For example,
 
 ```
-// MyBackButton.ts
+// MyBackButton.js
 export default withNavigation(MyBackButton);
 
-// MyNavBar.ts
+// MyNavBar.jsx
+<MyBackButton onRef={(elem) => this.backButton = elem} />
+```
+
+- If you need to use `withNavigation` HOC as the wrapped component of a custom HOC that use `onRef` prop API too, in order to prevent `onRef` callback fuction be called twice, `onRef` injectiong must be disabled using second param `config` object.
+
+```
+// MyBackButton.js
+export myCustomHOC(withNavigation(MyBackButton, { forwardRef: false }));
+
+// MyNavBar.jsx
 <MyBackButton onRef={(elem) => this.backButton = elem} />
 ```

From 35f021e1bf47a6e26e7a67b88217d1c20d26a824 Mon Sep 17 00:00:00 2001
From: bySabi Files <bysabi.files@gmail.com>
Date: Mon, 4 Feb 2019 10:11:58 +0100
Subject: [PATCH 2/3] create with-navigation 3.x doc file

---
 docs/with-navigation.md                       | 16 ++----
 .../version-3.x/with-navigation.md            | 50 +++++++++++++++++++
 yarn.lock                                     |  4 ++
 3 files changed, 57 insertions(+), 13 deletions(-)
 create mode 100644 website/versioned_docs/version-3.x/with-navigation.md
 create mode 100644 yarn.lock

diff --git a/docs/with-navigation.md b/docs/with-navigation.md
index 843f253a102..0a6f4176678 100644
--- a/docs/with-navigation.md
+++ b/docs/with-navigation.md
@@ -6,7 +6,7 @@ sidebar_label: withNavigation
 
 `withNavigation` is a higher order component which passes the `navigation` prop into a wrapped component. It's useful when you cannot pass the `navigation` prop into the component directly, or don't want to pass it in case of a deeply nested child.
 
-- `withNavigation(Component, config)` returns a Component.
+- `withNavigation(Component)` returns a Component.
 
 ## Example
 
@@ -30,20 +30,10 @@ export default withNavigation(MyBackButton);
 
 - If you wish to use the `ref` prop on the wrapped component, you must pass the `onRef` prop instead. For example,
 
-```
+```js
 // MyBackButton.js
 export default withNavigation(MyBackButton);
 
-// MyNavBar.jsx
-<MyBackButton onRef={(elem) => this.backButton = elem} />
-```
-
-- If you need to use `withNavigation` HOC as the wrapped component of a custom HOC that use `onRef` prop API too, in order to prevent `onRef` callback fuction be called twice, `onRef` injectiong must be disabled using second param `config` object.
-
-```
-// MyBackButton.js
-export myCustomHOC(withNavigation(MyBackButton, { forwardRef: false }));
-
-// MyNavBar.jsx
+// MyNavBar.js
 <MyBackButton onRef={(elem) => this.backButton = elem} />
 ```
diff --git a/website/versioned_docs/version-3.x/with-navigation.md b/website/versioned_docs/version-3.x/with-navigation.md
new file mode 100644
index 00000000000..5ed087c8b4e
--- /dev/null
+++ b/website/versioned_docs/version-3.x/with-navigation.md
@@ -0,0 +1,50 @@
+---
+id: version-3.x-with-navigation
+title: withNavigation
+sidebar_label: withNavigation
+original_id: with-navigation
+---
+
+`withNavigation` is a higher order component which passes the `navigation` prop into a wrapped component. It's useful when you cannot pass the `navigation` prop into the component directly, or don't want to pass it in case of a deeply nested child.
+
+- `withNavigation(Component, config)` returns a Component.
+
+## Example
+
+```js
+import React from 'react';
+import { Button } from 'react-native';
+import { withNavigation } from 'react-navigation';
+
+class MyBackButton extends React.Component {
+  render() {
+    return <Button title="Back" onPress={() => { this.props.navigation.goBack() }} />;
+  }
+}
+
+// withNavigation returns a component that wraps MyBackButton and passes in the
+// navigation prop
+export default withNavigation(MyBackButton);
+```
+
+## Notes
+
+- If you wish to use the `ref` prop on the wrapped component, you must pass the `onRef` prop instead. For example,
+
+```js
+// MyBackButton.js
+export default withNavigation(MyBackButton);
+
+// MyNavBar.js
+<MyBackButton onRef={(elem) => this.backButton = elem} />
+```
+
+- If you need to use `withNavigation` HOC as the wrapped component of a custom HOC that use `onRef` prop API too, in order to prevent `onRef` callback fuction be called twice, `onRef` injectiong must be disabled using second param `config` object.
+
+```js
+// MyBackButton.js
+export myCustomHOC(withNavigation(MyBackButton, { forwardRef: false }));
+
+// MyNavBar.js
+<MyBackButton onRef={(elem) => this.backButton = elem} />
+```
diff --git a/yarn.lock b/yarn.lock
new file mode 100644
index 00000000000..fb57ccd13af
--- /dev/null
+++ b/yarn.lock
@@ -0,0 +1,4 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+

From a76ecea21d7e0cfdf4c4d5980caf35a3dec3369e Mon Sep 17 00:00:00 2001
From: bySabi Files <bysabi.files@gmail.com>
Date: Mon, 4 Feb 2019 10:28:30 +0100
Subject: [PATCH 3/3] update docs//with-navigation.md/

---
 docs/with-navigation.md | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/docs/with-navigation.md b/docs/with-navigation.md
index 0a6f4176678..801c15323ec 100644
--- a/docs/with-navigation.md
+++ b/docs/with-navigation.md
@@ -6,7 +6,7 @@ sidebar_label: withNavigation
 
 `withNavigation` is a higher order component which passes the `navigation` prop into a wrapped component. It's useful when you cannot pass the `navigation` prop into the component directly, or don't want to pass it in case of a deeply nested child.
 
-- `withNavigation(Component)` returns a Component.
+- `withNavigation(Component, config)` returns a Component.
 
 ## Example
 
@@ -37,3 +37,13 @@ export default withNavigation(MyBackButton);
 // MyNavBar.js
 <MyBackButton onRef={(elem) => this.backButton = elem} />
 ```
+
+- If you need to use `withNavigation` HOC as the wrapped component of a custom HOC that use `onRef` prop API too, in order to prevent `onRef` callback fuction be called twice, `onRef` injectiong must be disabled using second param `config` object.
+
+```js
+// MyBackButton.js
+export myCustomHOC(withNavigation(MyBackButton, { forwardRef: false }));
+
+// MyNavBar.js
+<MyBackButton onRef={(elem) => this.backButton = elem} />
+```