Skip to content

Commit 6f2206e

Browse files
committed
Add tab view and drawer to the docs
1 parent 91f0824 commit 6f2206e

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

46 files changed

+2032
-234
lines changed

blog/2018-04-06-react-navigation-2.0-rc.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ Exactly two months after the release of React Navigation 1.0, we are close to an
1111

1212
<!--truncate-->
1313

14-
```sh
14+
```bash
1515
yarn add react-navigation@^2.0.0-rc.1
1616
```
1717

blog/2021-03-12-react-navigation-6.0-next.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ We'll share few highlights of the release in this blog post. If you're looking f
2929

3030
If you'd like to try it out, add `@^6.x` to the package, you're installing. For example:
3131

32-
```sh npm2yarn
32+
```bash npm2yarn
3333
npm install @react-navigation/native@^6.x @react-navigation/stack@^6.x
3434
```
3535

static/assets/libraries/tab-view.gif

1.24 MB
Loading

versioned_docs/version-1.x/deep-linking.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
120120

121121
Now you can press play in Xcode, or re-build on the command line:
122122

123-
```sh
123+
```bash
124124
react-native run-ios
125125
```
126126

@@ -160,7 +160,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
160160

161161
Now, re-install the app:
162162

163-
```sh
163+
```bash
164164
react-native run-android
165165
```
166166

versioned_docs/version-2.x/deep-linking.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
120120

121121
Now you can press play in Xcode, or re-build on the command line:
122122

123-
```sh
123+
```bash
124124
react-native run-ios
125125
```
126126

@@ -160,7 +160,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
160160

161161
Now, re-install the app:
162162

163-
```sh
163+
```bash
164164
react-native run-android
165165
```
166166

versioned_docs/version-3.x/deep-linking.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,7 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
155155

156156
Now you can press play in Xcode, or re-build on the command line:
157157

158-
```sh
158+
```bash
159159
react-native run-ios
160160
```
161161

@@ -195,7 +195,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
195195

196196
Now, re-install the app:
197197

198-
```sh
198+
```bash
199199
react-native run-android
200200
```
201201

versioned_docs/version-3.x/getting-started.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ Next, if you are not using the Expo managed workflow then you need to link these
4444

4545
On iOS, to complete the linking, make sure you have [Cocoapods](https://cocoapods.org/) installed. Then run:
4646

47-
```sh
47+
```bash
4848
cd ios
4949
pod install
5050
cd ..
@@ -56,7 +56,7 @@ Next, if you are not using the Expo managed workflow then you need to link these
5656

5757
If you're on an older React Native version, you need to manually link the dependencies. To do that, run:
5858

59-
```sh
59+
```bash
6060
react-native link react-native-reanimated
6161
react-native link react-native-gesture-handler
6262
```

versioned_docs/version-4.x/deep-linking.md

+8-8
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ The reason that is necessary to use `Linking.createURL` is that the scheme will
101101

102102
To test the URI on the simulator in the Expo client app, run the following:
103103

104-
```sh
104+
```bash
105105
xcrun simctl openurl booted [ put your URI prefix in here ]
106106

107107
// for example
@@ -113,7 +113,7 @@ xcrun simctl openurl booted exp://127.0.0.1:19000/--/chat/Eric
113113

114114
To test the intent handling in the Expo client app on Android, run the following:
115115

116-
```sh
116+
```bash
117117
adb shell am start -W -a android.intent.action.VIEW -d "[ put your URI prefix in here ]" host.exp.exponent
118118

119119
# for example
@@ -145,7 +145,7 @@ Let's configure the native iOS app to open based on the `mychat://` URI scheme.
145145

146146
In `SimpleApp/ios/SimpleApp/AppDelegate.m`:
147147

148-
```sh
148+
```bash
149149
// Add the header at the top of the file:
150150
#import <React/RCTLinkingManager.h>
151151

@@ -163,13 +163,13 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
163163

164164
Now you can press play in Xcode, or re-build on the command line:
165165

166-
```sh
166+
```bash
167167
react-native run-ios
168168
```
169169

170170
To test the URI on the simulator, run the following:
171171

172-
```sh
172+
```bash
173173
xcrun simctl openurl booted mychat://chat/Eric
174174
```
175175

@@ -184,7 +184,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
184184
1. Set `launchMode` of `MainActivity` to `singleTask` in order to receive intent on existing `MainActivity`. It is useful if you want to perform navigation using deep link you have been registered - [details](http://developer.android.com/training/app-indexing/deep-linking.html#adding-filters)
185185
2. Add the new `intent-filter` inside the `MainActivity` entry with a `VIEW` type action:
186186

187-
```sh
187+
```bash
188188
<activity
189189
android:name=".MainActivity"
190190
android:launchMode="singleTask">
@@ -203,13 +203,13 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
203203

204204
Now, re-install the app:
205205

206-
```sh
206+
```bash
207207
react-native run-android
208208
```
209209

210210
To test the intent handling in Android, run the following:
211211

212-
```sh
212+
```bash
213213
adb shell am start -W -a android.intent.action.VIEW -d "mychat://chat/Eric" com.simpleapp
214214
```
215215

versioned_docs/version-4.x/getting-started.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ The libraries we will install now are [`react-native-gesture-handler`](https://g
4040

4141
In your project directory, run:
4242

43-
```sh
43+
```bash
4444
npx expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view
4545
```
4646

@@ -66,15 +66,15 @@ Next, we need to link these libraries. The steps depends on your React Native ve
6666

6767
If you're on a Mac and developing for iOS, you need to install pods to complete the linking. Make sure you have [Cocoapods](https://cocoapods.org/) installed. Then run:
6868

69-
```sh
69+
```bash
7070
cd ios; pod install; cd ..
7171
```
7272

7373
- **React Native 0.59 and lower**
7474

7575
If you're on an older React Native version, you need to manually link the dependencies. To do that, run:
7676

77-
```sh
77+
```bash
7878
react-native link react-native-reanimated
7979
react-native link react-native-gesture-handler
8080
react-native link react-native-screens
@@ -99,7 +99,7 @@ Next, we need to link these libraries. The steps depends on your React Native ve
9999
100100
Now, run the `postinstall` script manually:
101101

102-
```sh
102+
```bash
103103
npm run postinstall
104104
```
105105

versioned_docs/version-4.x/troubleshooting.md

+8-8
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,13 @@ If the module points to a local file (i.e. the name of the module starts with `.
1919

2020
If you're using Expo, run:
2121

22-
```sh
22+
```bash
2323
expo start -c
2424
```
2525

2626
If you're not using Expo, run:
2727

28-
```sh
28+
```bash
2929
npx react-native start --reset-cache
3030
```
3131

@@ -43,21 +43,21 @@ This and some similar errors might occur if you didn't link the [`react-native-g
4343

4444
On newer versions of React Native, [linking is automatic](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md), so if you have linked the library manually, first unlink it:
4545

46-
```sh
46+
```bash
4747
react-native unlink react-native-gesture-handler
4848
```
4949

5050
If you're testing on iOS and use Mac, make sure you have run `pod install` in the `ios/` folder:
5151

52-
```sh
52+
```bash
5353
cd ios; pod install; cd ..
5454
```
5555

5656
- **React Native 0.59 and lower**
5757

5858
If you're on an older React Native version, you need to manually link the library. To do that, run:
5959

60-
```sh
60+
```bash
6161
react-native link react-native-gesture-handler
6262
```
6363

@@ -67,7 +67,7 @@ Now rebuild the app and test on your device or simulator.
6767

6868
This error can often happen if you have a Babel plugin that compiles the code in a non-spec compliant way. For example:
6969

70-
```sh
70+
```bash
7171
["@babel/plugin-proposal-class-properties", { "loose": true}]
7272
```
7373
@@ -91,13 +91,13 @@ If you have additional options configured here, try removing them to see if it f
9191
9292
If you're using Expo, run:
9393
94-
```sh
94+
```bash
9595
expo start -c
9696
```
9797
9898
If you're not using Expo, run:
9999
100-
```sh
100+
```bash
101101
npx react-native start --reset-cache
102102
```
103103

versioned_docs/version-4.x/upgrading-from-3.x.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ The latest drawer and tabs depend on [`react-native-gesture-handler`](https://gi
7676

7777
In your project directory, run the following:
7878

79-
```sh
79+
```bash
8080
npx expo install react-native-gesture-handler react-native-reanimated
8181
```
8282

@@ -94,7 +94,7 @@ Next, we need to link these libraries. The steps depends on your React Native ve
9494

9595
To complete the linking on iOS, make sure you have [Cocoapods](https://cocoapods.org/) installed. Then run:
9696

97-
```sh
97+
```bash
9898
cd ios
9999
pod install
100100
cd ..
@@ -104,7 +104,7 @@ Next, we need to link these libraries. The steps depends on your React Native ve
104104

105105
If you're on an older React Native version, you need to manually link the dependencies. To do that, run:
106106

107-
```sh
107+
```bash
108108
react-native link react-native-reanimated
109109
react-native link react-native-gesture-handler
110110
```

versioned_docs/version-5.x/configuring-links.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -688,7 +688,7 @@ In the example app, you will use the Expo managed workflow. The guide will focus
688688

689689
First, you need to decide the navigation structure of your app. To keep it simple, the main navigator will be bottom-tabs navigator with two screens. Its first screen will be a simple stack navigator, called `HomeStack`, with two screens: `Home` and `Profile`, and the second tabs screen will be just a simple one without any nested navigators, called `Settings`:
690690

691-
```sh
691+
```bash
692692
BottomTabs
693693
├── Stack (HomeStack)
694694
│   ├── Home

versioned_docs/version-5.x/contributing.md

+8-8
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@ Much like the issue template, the [pull request template](https://github.com/rea
111111
- Fork the [`repo`](https://github.com/react-navigation/react-navigation) on GitHub
112112
- Run these commands in the terminal to download locally and install it:
113113

114-
```sh
114+
```bash
115115
git clone https://github.com/<USERNAME>/navigation-ex.git
116116
cd navigation-ex
117117
git remote add upstream https://github.com/react-navigation/react-navigation.git
@@ -124,25 +124,25 @@ The project uses a monorepo structure for the packages managed by [yarn workspac
124124

125125
Look around. Match the style of the rest of the codebase. This project uses ESLint to ensure consistency throughout the project. You can check your project by running:
126126

127-
```sh
127+
```bash
128128
yarn lint
129129
```
130130

131131
If any errors occur you'll either have to manually fix them or you can attempt to automatically fix them by running:
132132

133-
```sh
133+
```bash
134134
yarn lint --fix
135135
```
136136

137137
The codebase is written in TypeScript, and must pass typecheck. To typecheck files, run:
138138

139-
```sh
139+
```bash
140140
yarn typescript
141141
```
142142

143143
It's useful to run typechecking in watch mode when working on the project. To do it, run:
144144

145-
```sh
145+
```bash
146146
yarn typescript --watch
147147
```
148148

@@ -152,21 +152,21 @@ The [example app](https://github.com/react-navigation/react-navigation/tree/main
152152

153153
While developing, you can run the [example app](https://github.com/react-navigation/react-navigation/tree/main/example) with [Expo](https://expo.io/) to test your changes:
154154

155-
```sh
155+
```bash
156156
yarn example start
157157
```
158158

159159
### Run Tests
160160

161161
React Navigation has tests implemented in [Jest](https://facebook.github.io/jest/). To run either of these, from the React Navigation directory, run either of the following commands (after installing the `node_modules`) to run tests or type-checking.
162162

163-
```sh
163+
```bash
164164
yarn test
165165
```
166166

167167
It's useful to run tests in watch mode when working on the project. To do it, run:
168168

169-
```sh
169+
```bash
170170
yarn test --watch
171171
```
172172

0 commit comments

Comments
 (0)