chore: publish

- @react-navigation/bottom-tabs@5.5.0
 - @react-navigation/compat@5.1.24
 - @react-navigation/core@5.8.2
 - @react-navigation/drawer@5.8.0
 - @react-navigation/material-bottom-tabs@5.2.8
 - @react-navigation/material-top-tabs@5.2.8
 - @react-navigation/native@5.4.3
 - @react-navigation/routers@5.4.7
 - @react-navigation/stack@5.4.0

example/CHANGELOG.md

@@ -0,0 +1,41 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+# [5.1.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/example@5.0.0-alpha.23...@react-navigation/example@5.1.0) (2020-05-20)
+
+
+### Bug Fixes
+
+* add config to enable redux devtools integration ([c9c825b](https://github.com/react-navigation/react-navigation/commit/c9c825bee61426635a28ee149eeeff3d628171cd))
+* clamp interpolated styles ([67798af](https://github.com/react-navigation/react-navigation/commit/67798af869dcbbf323629fc7e7cc9062d1e12c29))
+* disable screens when mode is modal on older expo versions ([94d7b28](https://github.com/react-navigation/react-navigation/commit/94d7b28c0b2ce0d56c99b224610f305be6451626))
+* dispatch pop early when screen is closed with gesture ([#336](https://github.com/react-navigation/react-navigation/issues/336)) ([3d937d1](https://github.com/react-navigation/react-navigation/commit/3d937d1e6571cd613e830d64f7b2e7426076d371)), closes [#267](https://github.com/react-navigation/react-navigation/issues/267)
+* provide initial values for safe area to prevent blank screen ([#238](https://github.com/react-navigation/react-navigation/issues/238)) ([77b7570](https://github.com/react-navigation/react-navigation/commit/77b757091c0451e20bca01138629669c7da544a8))
+* render fallback only if linking is enabled. closes [#8161](https://github.com/react-navigation/react-navigation/issues/8161) ([1c075ff](https://github.com/react-navigation/react-navigation/commit/1c075ffb169d233ed0515efea264a5a69b4de52e))
+* return onPress instead of onClick for useLinkProps ([ae5442e](https://github.com/react-navigation/react-navigation/commit/ae5442ebe812b91fa1f12164f27d1aeed918ab0e))
+* rtl in native app example ([50b366e](https://github.com/react-navigation/react-navigation/commit/50b366e7341f201d29a44f20b7771b3a832b0045))
+* screens integration on Android ([#294](https://github.com/react-navigation/react-navigation/issues/294)) ([9bfb295](https://github.com/react-navigation/react-navigation/commit/9bfb29562020c61b4d5c9bee278bcb1c7bdb8b67))
+* spread parent params to children in compat navigator ([24febf6](https://github.com/react-navigation/react-navigation/commit/24febf6ea99be2e5f22005fdd2a82136d647255c)), closes [#6785](https://github.com/react-navigation/react-navigation/issues/6785)
+* update screens for native stack ([5411816](https://github.com/react-navigation/react-navigation/commit/54118161885738a6d20b062c7e6679f3bace8424))
+* wrap navigators in gesture handler root ([41a5e1a](https://github.com/react-navigation/react-navigation/commit/41a5e1a385aa5180abc3992a4c67077c37b998b9))
+
+
+### Features
+
+* add `animationTypeForReplace` option ([#297](https://github.com/react-navigation/react-navigation/issues/297)) ([6262f72](https://github.com/react-navigation/react-navigation/commit/6262f7298bff843571fb4b1a677d3beabe29833e))
+* add `screens` prop for nested configs ([#308](https://github.com/react-navigation/react-navigation/issues/308)) ([b931ae6](https://github.com/react-navigation/react-navigation/commit/b931ae62dfb2c5253c94ea5ace73e9070ec17c4a))
+* add `useLinkBuilder` hook to build links ([2792f43](https://github.com/react-navigation/react-navigation/commit/2792f438fe45428fe193e3708fee7ad61966cbf4))
+* add a useLinkProps hook ([f2291d1](https://github.com/react-navigation/react-navigation/commit/f2291d110faa2aa8e10c9133c1c0c28d54af7917))
+* add action prop to Link ([942d2be](https://github.com/react-navigation/react-navigation/commit/942d2be2c72720469475ce12ec8df23825994dbf))
+* add custom theme support ([#211](https://github.com/react-navigation/react-navigation/issues/211)) ([00fc616](https://github.com/react-navigation/react-navigation/commit/00fc616de0572bade8aa85052cdc8290360b1d7f))
+* add deeplinking to native example ([#309](https://github.com/react-navigation/react-navigation/issues/309)) ([e55e866](https://github.com/react-navigation/react-navigation/commit/e55e866af2f2163ee89bc527997cda13ffeb2abe))
+* add headerStatusBarHeight option to stack ([b201fd2](https://github.com/react-navigation/react-navigation/commit/b201fd20716a2f03cb9373c72281f5d396a9356d))
+* add Link component as useLinkTo hook for navigating to links ([2573b5b](https://github.com/react-navigation/react-navigation/commit/2573b5beaac1240434e52f3f57bb29da2f541c88))
+* add openByDefault option to drawer ([36689e2](https://github.com/react-navigation/react-navigation/commit/36689e24c21b474692bb7ecd0b901c8afbbe9a20))
+* add permanent drawer type ([#7818](https://github.com/react-navigation/react-navigation/issues/7818)) ([6a5d0a0](https://github.com/react-navigation/react-navigation/commit/6a5d0a035afae60d91aef78401ec8826295746fe))
+* add preventDefault functionality in material bottom tabs ([3dede31](https://github.com/react-navigation/react-navigation/commit/3dede316ccab3b2403a475f60ce20b5c4e4cc068))
+* emit appear and dismiss events for native stack ([f1df4a0](https://github.com/react-navigation/react-navigation/commit/f1df4a080877b3642e748a41a5ffc2da8c449a8c))
+* initialState should take priority over deep link ([039017b](https://github.com/react-navigation/react-navigation/commit/039017bc2af69120d2d10e8f2c8a62919c37eb65))
+* integrate with history API on web ([5a3f835](https://github.com/react-navigation/react-navigation/commit/5a3f8356b05bff7ed20893a5db6804612da3e568))

example/app.json

@@ -7,12 +7,6 @@
     "slug": "react-navigation-example",
     "description": "Demo app to showcase various functionality of React Navigation",
     "privacy": "public",
-    "sdkVersion": "37.0.0",
-    "platforms": [
-      "ios",
-      "android",
-      "web"
-    ],
     "version": "1.0.0",
     "icon": "./assets/icon.png",
     "splash": {
@@ -20,15 +14,16 @@
       "resizeMode": "contain",
       "backgroundColor": "#ffffff"
     },
-    "updates": {
+    "sdkVersion": "37.0.0",
-      "fallbackToCacheTimeout": 0
+    "platforms": ["ios", "android", "web"],
-    },
-    "assetBundlePatterns": [
-      "**/*"
-    ],
     "ios": {
       "supportsTablet": true
     },
+    "updates": {
+      "fallbackToCacheTimeout": 0
+    },
+    "assetBundlePatterns": ["**/*"],
+    "scheme": "rne",
     "entryPoint": "App.tsx"
   }
 }

example/e2e/__integration_tests__/Link.test.tsx

@@ -6,7 +6,7 @@ beforeEach(async () => {
 
 it('loads the article page', async () => {
   expect(await page.evaluate(() => location.pathname + location.search)).toBe(
-    '/link-component/Article?author=Gandalf'
+    '/link-component/article/gandalf'
   );
   expect(
     ((await page.accessibility.snapshot()) as any)?.children?.find(
@@ -16,24 +16,24 @@ it('loads the article page', async () => {
 });
 
 it('goes to the album page and goes back', async () => {
-  await page.click('[href="/link-component/Album"]');
+  await page.click('[href="/link-component/music"]');
 
   expect(await page.evaluate(() => location.pathname + location.search)).toBe(
-    '/link-component/Album'
+    '/link-component/music'
   );
 
   expect(
     ((await page.accessibility.snapshot()) as any)?.children?.find(
       (it: any) => it.role === 'heading'
     )?.name
-  ).toBe('Album');
+  ).toBe('Albums');
 
   await page.click('[aria-label="Article by Gandalf, back"]');
 
   await page.waitForNavigation();
 
   expect(await page.evaluate(() => location.pathname + location.search)).toBe(
-    '/link-component/Article?author=Gandalf'
+    '/link-component/article/gandalf'
   );
 
   expect(

example/ios/Podfile.lock

@@ -1,35 +1,38 @@
 PODS:
   - boost-for-react-native (1.63.0)
   - DoubleConversion (1.1.6)
-  - EXAppLoaderProvider (8.0.0)
+  - EXBlur (8.1.0):
-  - EXBlur (8.0.0):
     - UMCore
-  - EXConstants (8.0.0):
+  - EXConstants (9.0.0):
     - UMConstantsInterface
     - UMCore
-  - EXErrorRecovery (1.0.0):
+  - EXErrorRecovery (1.1.0):
     - UMCore
-  - EXFileSystem (8.0.0):
+  - EXFileSystem (8.1.0):
     - UMCore
     - UMFileSystemInterface
-  - EXFont (8.0.0):
+  - EXFont (8.1.0):
     - UMCore
     - UMFontInterface
-  - EXKeepAwake (8.0.0):
+  - EXImageLoader (1.0.1):
+    - React-Core
     - UMCore
-  - EXLinearGradient (8.0.0):
+    - UMImageLoaderInterface
+  - EXKeepAwake (8.1.0):
     - UMCore
-  - EXLocation (8.0.0):
+  - EXLinearGradient (8.1.0):
+    - UMCore
+  - EXLocation (8.1.0):
     - UMCore
     - UMPermissionsInterface
     - UMTaskManagerInterface
-  - EXPermissions (8.0.0):
+  - EXPermissions (8.1.0):
     - UMCore
     - UMPermissionsInterface
-  - EXSQLite (8.0.0):
+  - EXSQLite (8.1.0):
     - UMCore
     - UMFileSystemInterface
-  - EXWebBrowser (8.0.0):
+  - EXWebBrowser (8.2.1):
     - UMCore
   - FBLazyVector (0.61.5)
   - FBReactNativeSpec (0.61.5):
@@ -50,8 +53,6 @@ PODS:
     - glog
   - glog (0.3.5)
   - RCTRequired (0.61.5)
-  - RCTRestart (0.0.13):
-    - React
   - RCTTypeSafety (0.61.5):
     - FBLazyVector (= 0.61.5)
     - Folly (= 2018.10.22.00)
@@ -214,7 +215,9 @@ PODS:
     - React-cxxreact (= 0.61.5)
     - React-jsi (= 0.61.5)
   - React-jsinspector (0.61.5)
-  - react-native-safe-area-context (0.6.2):
+  - react-native-restart (0.0.15):
+    - React
+  - react-native-safe-area-context (1.0.0):
     - React
   - React-RCTActionSheet (0.61.5):
     - React-Core/RCTActionSheetHeaders (= 0.61.5)
@@ -251,39 +254,41 @@ PODS:
     - React-cxxreact (= 0.61.5)
     - React-jsi (= 0.61.5)
     - ReactCommon/jscallinvoker (= 0.61.5)
-  - RNCMaskedView (0.1.5):
+  - RNCMaskedView (0.1.10):
     - React
-  - RNGestureHandler (1.5.5):
+  - RNGestureHandler (1.6.1):
     - React
-  - RNReanimated (1.4.0):
+  - RNReanimated (1.8.0):
     - React
-  - RNScreens (2.0.0-alpha.33):
+  - RNScreens (2.7.0):
     - React
-  - UMBarCodeScannerInterface (5.0.0)
+  - UMAppLoader (1.0.2)
-  - UMCameraInterface (5.0.0)
+  - UMBarCodeScannerInterface (5.1.0)
-  - UMConstantsInterface (5.0.0)
+  - UMCameraInterface (5.1.0)
-  - UMCore (5.0.0)
+  - UMConstantsInterface (5.1.0)
-  - UMFaceDetectorInterface (5.0.0)
+  - UMCore (5.1.2)
-  - UMFileSystemInterface (5.0.0)
+  - UMFaceDetectorInterface (5.1.0)
-  - UMFontInterface (5.0.0)
+  - UMFileSystemInterface (5.1.0)
-  - UMImageLoaderInterface (5.0.0)
+  - UMFontInterface (5.1.0)
-  - UMPermissionsInterface (5.0.0)
+  - UMImageLoaderInterface (5.1.0)
-  - UMReactNativeAdapter (5.0.0):
+  - UMPermissionsInterface (5.1.0):
+    - UMCore
+  - UMReactNativeAdapter (5.2.0):
     - React-Core
     - UMCore
     - UMFontInterface
-  - UMSensorsInterface (5.0.0)
+  - UMSensorsInterface (5.1.0)
-  - UMTaskManagerInterface (5.0.0)
+  - UMTaskManagerInterface (5.1.0)
   - Yoga (1.14.0)
 
 DEPENDENCIES:
   - DoubleConversion (from `../../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec`)
-  - EXAppLoaderProvider (from `../../node_modules/expo-app-loader-provider/ios`)
   - EXBlur (from `../../node_modules/expo-blur/ios`)
   - EXConstants (from `../../node_modules/expo-constants/ios`)
   - EXErrorRecovery (from `../../node_modules/expo-error-recovery/ios`)
   - EXFileSystem (from `../../node_modules/expo-file-system/ios`)
   - EXFont (from `../../node_modules/expo-font/ios`)
+  - EXImageLoader (from `../../node_modules/expo-image-loader/ios`)
   - EXKeepAwake (from `../../node_modules/expo-keep-awake/ios`)
   - EXLinearGradient (from `../../node_modules/expo-linear-gradient/ios`)
   - EXLocation (from `../../node_modules/expo-location/ios`)
@@ -295,7 +300,6 @@ DEPENDENCIES:
   - Folly (from `../../node_modules/react-native/third-party-podspecs/Folly.podspec`)
   - glog (from `../../node_modules/react-native/third-party-podspecs/glog.podspec`)
   - RCTRequired (from `../../node_modules/react-native/Libraries/RCTRequired`)
-  - RCTRestart (from `../../node_modules/react-native-restart/ios`)
   - RCTTypeSafety (from `../../node_modules/react-native/Libraries/TypeSafety`)
   - React (from `../../node_modules/react-native/`)
   - React-Core (from `../../node_modules/react-native/`)
@@ -306,6 +310,7 @@ DEPENDENCIES:
   - React-jsi (from `../../node_modules/react-native/ReactCommon/jsi`)
   - React-jsiexecutor (from `../../node_modules/react-native/ReactCommon/jsiexecutor`)
   - React-jsinspector (from `../../node_modules/react-native/ReactCommon/jsinspector`)
+  - react-native-restart (from `../../node_modules/react-native-restart`)
   - react-native-safe-area-context (from `../../node_modules/react-native-safe-area-context`)
   - React-RCTActionSheet (from `../../node_modules/react-native/Libraries/ActionSheetIOS`)
   - React-RCTAnimation (from `../../node_modules/react-native/Libraries/NativeAnimation`)
@@ -322,10 +327,11 @@ DEPENDENCIES:
   - RNGestureHandler (from `../../node_modules/react-native-gesture-handler`)
   - RNReanimated (from `../../node_modules/react-native-reanimated`)
   - RNScreens (from `../../node_modules/react-native-screens`)
+  - UMAppLoader (from `../../node_modules/unimodules-app-loader/ios`)
   - UMBarCodeScannerInterface (from `../../node_modules/unimodules-barcode-scanner-interface/ios`)
   - UMCameraInterface (from `../../node_modules/unimodules-camera-interface/ios`)
   - UMConstantsInterface (from `../../node_modules/unimodules-constants-interface/ios`)
-  - "UMCore (from `../../node_modules/@unimodules/core/ios`)"
+  - "UMCore (from `../../node_modules/react-native-unimodules/node_modules/@unimodules/core/ios`)"
   - UMFaceDetectorInterface (from `../../node_modules/unimodules-face-detector-interface/ios`)
   - UMFileSystemInterface (from `../../node_modules/unimodules-file-system-interface/ios`)
   - UMFontInterface (from `../../node_modules/unimodules-font-interface/ios`)
@@ -343,42 +349,30 @@ SPEC REPOS:
 EXTERNAL SOURCES:
   DoubleConversion:
     :podspec: "../../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec"
-  EXAppLoaderProvider:
-    :path: !ruby/object:Pathname
-    path: "../../node_modules/expo-app-loader-provider/ios"
   EXBlur:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-blur/ios"
-    path: "../../node_modules/expo-blur/ios"
   EXConstants:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-constants/ios"
-    path: "../../node_modules/expo-constants/ios"
   EXErrorRecovery:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-error-recovery/ios"
-    path: "../../node_modules/expo-error-recovery/ios"
   EXFileSystem:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-file-system/ios"
-    path: "../../node_modules/expo-file-system/ios"
   EXFont:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-font/ios"
-    path: "../../node_modules/expo-font/ios"
+  EXImageLoader:
+    :path: "../../node_modules/expo-image-loader/ios"
   EXKeepAwake:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-keep-awake/ios"
-    path: "../../node_modules/expo-keep-awake/ios"
   EXLinearGradient:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-linear-gradient/ios"
-    path: "../../node_modules/expo-linear-gradient/ios"
   EXLocation:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-location/ios"
-    path: "../../node_modules/expo-location/ios"
   EXPermissions:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-permissions/ios"
-    path: "../../node_modules/expo-permissions/ios"
   EXSQLite:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-sqlite/ios"
-    path: "../../node_modules/expo-sqlite/ios"
   EXWebBrowser:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/expo-web-browser/ios"
-    path: "../../node_modules/expo-web-browser/ios"
   FBLazyVector:
     :path: "../../node_modules/react-native/Libraries/FBLazyVector"
   FBReactNativeSpec:
@@ -389,8 +383,6 @@ EXTERNAL SOURCES:
     :podspec: "../../node_modules/react-native/third-party-podspecs/glog.podspec"
   RCTRequired:
     :path: "../../node_modules/react-native/Libraries/RCTRequired"
-  RCTRestart:
-    :path: "../../node_modules/react-native-restart/ios"
   RCTTypeSafety:
     :path: "../../node_modules/react-native/Libraries/TypeSafety"
   React:
@@ -407,6 +399,8 @@ EXTERNAL SOURCES:
     :path: "../../node_modules/react-native/ReactCommon/jsiexecutor"
   React-jsinspector:
     :path: "../../node_modules/react-native/ReactCommon/jsinspector"
+  react-native-restart:
+    :path: "../../node_modules/react-native-restart"
   react-native-safe-area-context:
     :path: "../../node_modules/react-native-safe-area-context"
   React-RCTActionSheet:
@@ -437,66 +431,55 @@ EXTERNAL SOURCES:
     :path: "../../node_modules/react-native-reanimated"
   RNScreens:
     :path: "../../node_modules/react-native-screens"
+  UMAppLoader:
+    :path: "../../node_modules/unimodules-app-loader/ios"
   UMBarCodeScannerInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-barcode-scanner-interface/ios"
-    path: "../../node_modules/unimodules-barcode-scanner-interface/ios"
   UMCameraInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-camera-interface/ios"
-    path: "../../node_modules/unimodules-camera-interface/ios"
   UMConstantsInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-constants-interface/ios"
-    path: "../../node_modules/unimodules-constants-interface/ios"
   UMCore:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/react-native-unimodules/node_modules/@unimodules/core/ios"
-    path: "../../node_modules/@unimodules/core/ios"
   UMFaceDetectorInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-face-detector-interface/ios"
-    path: "../../node_modules/unimodules-face-detector-interface/ios"
   UMFileSystemInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-file-system-interface/ios"
-    path: "../../node_modules/unimodules-file-system-interface/ios"
   UMFontInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-font-interface/ios"
-    path: "../../node_modules/unimodules-font-interface/ios"
   UMImageLoaderInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-image-loader-interface/ios"
-    path: "../../node_modules/unimodules-image-loader-interface/ios"
   UMPermissionsInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-permissions-interface/ios"
-    path: "../../node_modules/unimodules-permissions-interface/ios"
   UMReactNativeAdapter:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/@unimodules/react-native-adapter/ios"
-    path: "../../node_modules/@unimodules/react-native-adapter/ios"
   UMSensorsInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-sensors-interface/ios"
-    path: "../../node_modules/unimodules-sensors-interface/ios"
   UMTaskManagerInterface:
-    :path: !ruby/object:Pathname
+    :path: "../../node_modules/unimodules-task-manager-interface/ios"
-    path: "../../node_modules/unimodules-task-manager-interface/ios"
   Yoga:
     :path: "../../node_modules/react-native/ReactCommon/yoga"
 
 SPEC CHECKSUMS:
   boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c
   DoubleConversion: 5805e889d232975c086db112ece9ed034df7a0b2
-  EXAppLoaderProvider: ebdb6bc2632c1ccadbe49f5e4104d8d690969c49
+  EXBlur: aa14d84bff6e9c2232fbcaf54ad809eee1cc41dc
-  EXBlur: d1604f66f89a9414f5ee65dfb23874437c1bb147
+  EXConstants: 5304709b1bea70a4828f48ba4c7fc3ec3b2d9b17
-  EXConstants: 4051b16c17ef3defa03c541d42811dc92b249146
+  EXErrorRecovery: 8f4c21ab2f51bf75defe4536f841a37de59b0661
-  EXErrorRecovery: d36db99ec6a3808f313f01b0890eb443796dd1c2
+  EXFileSystem: cf4232ba7c62dc49b78c2d36005f97b6fddf0b01
-  EXFileSystem: 6e0d9bb6cc4ea404dbb8f583c1a8a2dcdf4b83b6
+  EXFont: 8326ecf966be559f7ced7c8e221a32fc4d9ed8b0
-  EXFont: 6187b5ab46ee578d5f8e7f2ea092752e78772235
+  EXImageLoader: 5ad6896fa1ef2ee814b551873cbf7a7baccc694a
-  EXKeepAwake: 66e9f80b6d129633725a0e42f8d285c229876811
+  EXKeepAwake: d045bc2cf1ad5a04f0323cc7c894b95b414042e0
-  EXLinearGradient: 75f302f9d6484267a3f6d3252df2e7a5f00e716a
+  EXLinearGradient: 97d8095d1e4ad96f7893e010e564796ed8aeea42
-  EXLocation: 3c75d012ca92eed94d4338778d79c49d1252393a
+  EXLocation: bbd487fd96a18a3ad9725389bbb94c4a5f78edf3
-  EXPermissions: 9bc08859a675d291e89be9a0870155c27c16ac35
+  EXPermissions: 24b97f734ce9172d245a5be38ad9ccfcb6135964
-  EXSQLite: 220226a354912b100dfe913f5fe6f31762c8927e
+  EXSQLite: 877ad6c8eb169353a2f94d5ad26510ffadd46a1f
-  EXWebBrowser: db32607359fb7b55b7b7b91df32dd3d8355bb3b7
+  EXWebBrowser: 5902f99ac5ac551e5c82ff46f13a337b323aa9ea
   FBLazyVector: aaeaf388755e4f29cd74acbc9e3b8da6d807c37f
   FBReactNativeSpec: 118d0d177724c2d67f08a59136eb29ef5943ec75
   Folly: 30e7936e1c45c08d884aa59369ed951a8e68cf51
   glog: 1f3da668190260b06b429bb211bfbee5cd790c28
   RCTRequired: b153add4da6e7dbc44aebf93f3cf4fcae392ddf1
-  RCTRestart: dd19aab87fc1118e05b6b5b91b959105647f56b4
   RCTTypeSafety: 9aa1b91d7f9310fc6eadc3cf95126ffe818af320
   React: b6a59ef847b2b40bb6e0180a97d0ca716969ac78
   React-Core: 688b451f7d616cc1134ac95295b593d1b5158a04
@@ -505,7 +488,8 @@ SPEC CHECKSUMS:
   React-jsi: cb2cd74d7ccf4cffb071a46833613edc79cdf8f7
   React-jsiexecutor: d5525f9ed5f782fdbacb64b9b01a43a9323d2386
   React-jsinspector: fa0ecc501688c3c4c34f28834a76302233e29dc0
-  react-native-safe-area-context: 25260c5d0b9c53fd7aa88e569e2edae72af1f6a3
+  react-native-restart: fff228304625f55de2ebd4de43938110f4c888ed
+  react-native-safe-area-context: a346c75f2288147527365ce27b59ca6d38c27805
   React-RCTActionSheet: 600b4d10e3aea0913b5a92256d2719c0cdd26d76
   React-RCTAnimation: 791a87558389c80908ed06cc5dfc5e7920dfa360
   React-RCTBlob: d89293cc0236d9cb0933d85e430b0bbe81ad1d72
@@ -516,24 +500,25 @@ SPEC CHECKSUMS:
   React-RCTText: 9ccc88273e9a3aacff5094d2175a605efa854dbe
   React-RCTVibration: a49a1f42bf8f5acf1c3e297097517c6b3af377ad
   ReactCommon: 198c7c8d3591f975e5431bec1b0b3b581aa1c5dd
-  RNCMaskedView: dd13f9f7b146a9ad82f9b7eb6c9b5548fcf6e990
+  RNCMaskedView: 5a8ec07677aa885546a0d98da336457e2bea557f
-  RNGestureHandler: d2270608171c868581b840cfc692f2962c05cd17
+  RNGestureHandler: 8f09cd560f8d533eb36da5a6c5a843af9f056b38
-  RNReanimated: b2ab0b693dddd2339bd2f300e770f6302d2e960c
+  RNReanimated: 955cf4068714003d2f1a6e2bae3fb1118f359aff
-  RNScreens: 1c7fd499b915c77c21e8e6c327890c5af9b4cf7e
+  RNScreens: cf198f915f8a2bf163de94ca9f5bfc8d326c3706
-  UMBarCodeScannerInterface: 3802c8574ef119c150701d679ab386e2266d6a54
+  UMAppLoader: ee77a072f9e15128f777ccd6d2d00f52ab4387e6
-  UMCameraInterface: 985d301f688ed392f815728f0dd906ca34b7ccb1
+  UMBarCodeScannerInterface: 9dc692b87e5f20fe277fa57aa47f45d418c3cc6c
-  UMConstantsInterface: bda5f8bd3403ad99e663eb3c4da685d063c5653c
+  UMCameraInterface: 625878bbf2ba188a8548675e1d1d2e438a653e6d
-  UMCore: 7ab08669a8bb2e61f557c1fe9784521cb5aa28e3
+  UMConstantsInterface: 64060cf86587bcd90b1dbd804cceb6d377a308c1
-  UMFaceDetectorInterface: ce14e8e597f6a52aa66e4ab956cb5bff4fa8acf8
+  UMCore: eb200e882eadafcd31ead290770835fd648c0945
-  UMFileSystemInterface: 2ed004c9620f43f0b36b33c42ce668500850d6a4
+  UMFaceDetectorInterface: d6677d6ddc9ab95a0ca857aa7f8ba76656cc770f
-  UMFontInterface: 24fbc0a02ade6c60ad3ee3e2b5d597c8dcfc3208
+  UMFileSystemInterface: c70ea7147198b9807080f3597f26236be49b0165
-  UMImageLoaderInterface: 3976a14c588341228881ff75970fbabf122efca4
+  UMFontInterface: d9d3b27af698c5389ae9e20b99ef56a083f491fb
-  UMPermissionsInterface: 2abf9f7f4aa7110e27beaf634a7deda2d50ff3d7
+  UMImageLoaderInterface: 14dd2c46c67167491effc9e91250e9510f12709e
-  UMReactNativeAdapter: 230406e3335a8dbd4c9c0e654488a1cf3b44552f
+  UMPermissionsInterface: 5e83a9167c177e4a0f0a3539345983cc749efb3e
-  UMSensorsInterface: d708a892ef1500bdd9fc3ff03f7836c66d1634d3
+  UMReactNativeAdapter: 126da3486c1a1f11945b649d557d6c2ebb9407b2
-  UMTaskManagerInterface: a98e37a576a5220bf43b8faf33cfdc129d2f441d
+  UMSensorsInterface: 48941f70175e2975af1a9386c6d6cb16d8126805
+  UMTaskManagerInterface: cb890c79c63885504ddc0efd7a7d01481760aca2
   Yoga: f2a7cd4280bfe2cca5a7aed98ba0eb3d1310f18b
 
 PODFILE CHECKSUM: c48a21ff513d3eadafa50f8797207ef2be75e234
 
-COCOAPODS: 1.8.4
+COCOAPODS: 1.9.1

example/metro.config.js

@@ -8,25 +8,24 @@ const blacklist = require('metro-config/src/defaults/blacklist');
 const root = path.resolve(__dirname, '..');
 const packages = path.resolve(root, 'packages');
 
-// Get the list of dependencies for all packages in the monorepo
+const workspaces = fs
-const modules = ['@expo/vector-icons']
-  .concat(
-    ...fs
   // List all packages under `packages/`
   .readdirSync(packages)
   // Ignore hidden files such as .DS_Store
   .filter((p) => !p.startsWith('.'))
-      .map((p) => {
+  .map((p) => path.join(packages, p));
+
+// Get the list of dependencies for all packages in the monorepo
+const modules = ['@expo/vector-icons']
+  .concat(
+    ...workspaces.map((it) => {
       const pak = JSON.parse(
-          fs.readFileSync(path.join(packages, p, 'package.json'), 'utf8')
+        fs.readFileSync(path.join(it, 'package.json'), 'utf8')
       );
 
-        // We need to collect list of deps that this package imports
+      // We need to make sure that only one version is loaded for peerDependencies
-        // Collecting both dependencies are peerDependencies should do it
+      // So we blacklist them at the root, and alias them to the versions in example's node_modules
-        return Object.keys({
+      return pak.peerDependencies ? Object.keys(pak.peerDependencies) : [];
-          ...pak.dependencies,
-          ...pak.peerDependencies,
-        });
     })
   )
   .sort()
@@ -45,14 +44,15 @@ module.exports = {
   watchFolders: [root],
 
   resolver: {
-    // We need to blacklist `node_modules` of all our packages
+    // We need to blacklist the peerDependencies we've collected in packages' node_modules
-    // This will avoid Metro throwing duplicate module errors
     blacklistRE: blacklist(
-      fs
+      [].concat(
-        .readdirSync(packages)
+        ...workspaces.map((it) =>
-        .map((p) => path.join(packages, p))
+          modules.map(
-        .map(
+            (m) =>
-          (it) => new RegExp(`^${escape(path.join(it, 'node_modules'))}\\/.*$`)
+              new RegExp(`^${escape(path.join(it, 'node_modules', m))}\\/.*$`)
+          )
+        )
       )
     ),
 

example/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/example",
   "description": "Demo app to showcase various functionality of React Navigation",
-  "version": "5.0.0",
+  "version": "5.1.0",
   "private": true,
   "scripts": {
     "start": "expo start",
@@ -25,7 +25,7 @@
     "react-native-paper": "^3.10.1",
     "react-native-reanimated": "^1.8.0",
     "react-native-restart": "^0.0.15",
-    "react-native-safe-area-context": "^0.7.3",
+    "react-native-safe-area-context": "^1.0.0",
     "react-native-screens": "^2.7.0",
     "react-native-tab-view": "2.14.0",
     "react-native-unimodules": "~0.9.1",

example/src/Screens/BottomTabs.tsx

@@ -1,7 +1,11 @@
 import * as React from 'react';
-import { Platform } from 'react-native';
+import { View, ScrollView, StyleSheet, Platform } from 'react-native';
+import { Button } from 'react-native-paper';
 import { MaterialCommunityIcons } from '@expo/vector-icons';
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import {
+  createBottomTabNavigator,
+  BottomTabNavigationProp,
+} from '@react-navigation/bottom-tabs';
 import TouchableBounce from '../Shared/TouchableBounce';
 import Albums from '../Shared/Albums';
 import Contacts from '../Shared/Contacts';
@@ -23,6 +27,36 @@ type BottomTabParams = {
   Chat: undefined;
 };
 
+const scrollEnabled = Platform.select({ web: true, default: false });
+
+const AlbumsScreen = ({
+  navigation,
+}: {
+  navigation: BottomTabNavigationProp<BottomTabParams>;
+}) => {
+  return (
+    <ScrollView>
+      <View style={styles.buttons}>
+        <Button
+          mode="outlined"
+          onPress={() => navigation.setOptions({ tabBarVisible: false })}
+          style={styles.button}
+        >
+          Hide tab bar
+        </Button>
+        <Button
+          mode="outlined"
+          onPress={() => navigation.setOptions({ tabBarVisible: true })}
+          style={styles.button}
+        >
+          Show tab bar
+        </Button>
+      </View>
+      <Albums scrollEnabled={scrollEnabled} />
+    </ScrollView>
+  );
+};
+
 const BottomTabs = createBottomTabNavigator<BottomTabParams>();
 
 export default function BottomTabsScreen() {
@@ -62,7 +96,7 @@ export default function BottomTabsScreen() {
       />
       <BottomTabs.Screen
         name="Albums"
-        component={Albums}
+        component={AlbumsScreen}
         options={{
           title: 'Albums',
           tabBarIcon: getTabBarIcon('image-album'),
@@ -71,3 +105,13 @@ export default function BottomTabsScreen() {
     </BottomTabs.Navigator>
   );
 }
+
+const styles = StyleSheet.create({
+  buttons: {
+    flexDirection: 'row',
+    padding: 8,
+  },
+  button: {
+    margin: 8,
+  },
+});

example/src/Screens/LinkComponent.tsx

@@ -17,7 +17,7 @@ import Albums from '../Shared/Albums';
 
 type SimpleStackParams = {
   Article: { author: string };
-  Album: undefined;
+  Albums: undefined;
 };
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
@@ -53,24 +53,24 @@ const ArticleScreen = ({
     <ScrollView>
       <View style={styles.buttons}>
         <Link
-          to="/link-component/Album"
+          to="/link-component/music"
           style={[styles.button, { padding: 8 }]}
         >
-          Go to /link-component/Album
+          Go to /link-component/music
         </Link>
         <Link
-          to="/link-component/Album"
+          to="/link-component/music"
-          action={StackActions.replace('Album')}
+          action={StackActions.replace('Albums')}
           style={[styles.button, { padding: 8 }]}
         >
-          Replace with /link-component/Album
+          Replace with /link-component/music
         </Link>
         <LinkButton
-          to="/link-component/Album"
+          to="/link-component/music"
           mode="contained"
           style={styles.button}
         >
-          Go to /link-component/Album
+          Go to /link-component/music
         </LinkButton>
         <Button
           mode="outlined"
@@ -97,17 +97,17 @@ const AlbumsScreen = ({
     <ScrollView>
       <View style={styles.buttons}>
         <Link
-          to="/link-component/Article?author=Babel"
+          to="/link-component/article/babel"
           style={[styles.button, { padding: 8 }]}
         >
-          Go to /link-component/Article
+          Go to /link-component/article
         </Link>
         <LinkButton
-          to="/link-component/Article?author=Babel"
+          to="/link-component/article/babel"
           mode="contained"
           style={styles.button}
         >
-          Go to /link-component/Article
+          Go to /link-component/article
         </LinkButton>
         <Button
           mode="outlined"
@@ -144,9 +144,9 @@ export default function SimpleStackScreen({ navigation, ...rest }: Props) {
         initialParams={{ author: 'Gandalf' }}
       />
       <SimpleStack.Screen
-        name="Album"
+        name="Albums"
         component={AlbumsScreen}
-        options={{ title: 'Album' }}
+        options={{ title: 'Albums' }}
       />
     </SimpleStack.Navigator>
   );

example/src/Screens/MasterDetail.tsx

@@ -1,12 +1,18 @@
 import * as React from 'react';
 import { Dimensions, ScaledSize } from 'react-native';
 import { Appbar } from 'react-native-paper';
-import { ParamListBase } from '@react-navigation/native';
+import {
+  useTheme,
+  useNavigation,
+  ParamListBase,
+} from '@react-navigation/native';
 import { StackNavigationProp } from '@react-navigation/stack';
 import {
   createDrawerNavigator,
   DrawerNavigationProp,
   DrawerContent,
+  DrawerContentComponentProps,
+  DrawerContentOptions,
 } from '@react-navigation/drawer';
 import Article from '../Shared/Article';
 import Albums from '../Shared/Albums';
@@ -15,7 +21,7 @@ import NewsFeed from '../Shared/NewsFeed';
 type DrawerParams = {
   Article: undefined;
   NewsFeed: undefined;
-  Album: undefined;
+  Albums: undefined;
 };
 
 type DrawerNavigation = DrawerNavigationProp<DrawerParams>;
@@ -43,10 +49,11 @@ const Header = ({
   onGoBack: () => void;
   title: string;
 }) => {
+  const { colors } = useTheme();
   const isLargeScreen = useIsLargeScreen();
 
   return (
-    <Appbar.Header>
+    <Appbar.Header style={{ backgroundColor: colors.card, elevation: 1 }}>
       {isLargeScreen ? null : <Appbar.BackAction onPress={onGoBack} />}
       <Appbar.Content title={title} />
     </Appbar.Header>
@@ -80,6 +87,23 @@ const AlbumsScreen = ({ navigation }: { navigation: DrawerNavigation }) => {
   );
 };
 
+const CustomDrawerContent = (
+  props: DrawerContentComponentProps<DrawerContentOptions>
+) => {
+  const { colors } = useTheme();
+  const navigation = useNavigation();
+
+  return (
+    <>
+      <Appbar.Header style={{ backgroundColor: colors.card, elevation: 1 }}>
+        <Appbar.Action icon="close" onPress={() => navigation.goBack()} />
+        <Appbar.Content title="Pages" />
+      </Appbar.Header>
+      <DrawerContent {...props} />
+    </>
+  );
+};
+
 const Drawer = createDrawerNavigator<DrawerParams>();
 
 type Props = Partial<React.ComponentProps<typeof Drawer.Navigator>> & {
@@ -100,15 +124,7 @@ export default function DrawerScreen({ navigation, ...rest }: Props) {
       drawerType={isLargeScreen ? 'permanent' : 'back'}
       drawerStyle={isLargeScreen ? null : { width: '100%' }}
       overlayColor="transparent"
-      drawerContent={(props) => (
+      drawerContent={(props) => <CustomDrawerContent {...props} />}
-        <>
-          <Appbar.Header>
-            <Appbar.Action icon="close" onPress={() => navigation.goBack()} />
-            <Appbar.Content title="Pages" />
-          </Appbar.Header>
-          <DrawerContent {...props} />
-        </>
-      )}
       {...rest}
     >
       <Drawer.Screen name="Article" component={ArticleScreen} />
@@ -118,9 +134,9 @@ export default function DrawerScreen({ navigation, ...rest }: Props) {
         options={{ title: 'Feed' }}
       />
       <Drawer.Screen
-        name="Album"
+        name="Albums"
         component={AlbumsScreen}
-        options={{ title: 'Album' }}
+        options={{ title: 'Albums' }}
       />
     </Drawer.Navigator>
   );

example/src/Screens/MaterialTopTabs.tsx

@@ -1,4 +1,6 @@
 import * as React from 'react';
+import { ParamListBase } from '@react-navigation/native';
+import { StackNavigationProp } from '@react-navigation/stack';
 import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';
 import Albums from '../Shared/Albums';
 import Contacts from '../Shared/Contacts';
@@ -12,7 +14,15 @@ type MaterialTopTabParams = {
 
 const MaterialTopTabs = createMaterialTopTabNavigator<MaterialTopTabParams>();
 
-export default function MaterialTopTabsScreen() {
+type Props = {
+  navigation: StackNavigationProp<ParamListBase>;
+};
+
+export default function MaterialTopTabsScreen({ navigation }: Props) {
+  navigation.setOptions({
+    cardStyle: { flex: 1 },
+  });
+
   return (
     <MaterialTopTabs.Navigator>
       <MaterialTopTabs.Screen

example/src/Screens/ModalPresentationStack.tsx

@@ -12,7 +12,7 @@ import Albums from '../Shared/Albums';
 
 type ModalStackParams = {
   Article: { author: string };
-  Album: undefined;
+  Albums: undefined;
 };
 
 type ModalStackNavigation = StackNavigationProp<ModalStackParams>;
@@ -31,7 +31,7 @@ const ArticleScreen = ({
       <View style={styles.buttons}>
         <Button
           mode="contained"
-          onPress={() => navigation.push('Album')}
+          onPress={() => navigation.push('Albums')}
           style={styles.button}
         >
           Push album
@@ -112,9 +112,9 @@ export default function SimpleStackScreen({ navigation, options }: Props) {
         initialParams={{ author: 'Gandalf' }}
       />
       <ModalPresentationStack.Screen
-        name="Album"
+        name="Albums"
         component={AlbumsScreen}
-        options={{ title: 'Album' }}
+        options={{ title: 'Albums' }}
       />
     </ModalPresentationStack.Navigator>
   );

example/src/Screens/SimpleStack.tsx

@@ -13,7 +13,7 @@ import NewsFeed from '../Shared/NewsFeed';
 type SimpleStackParams = {
   Article: { author: string };
   NewsFeed: undefined;
-  Album: undefined;
+  Albums: undefined;
 };
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
@@ -63,7 +63,7 @@ const NewsFeedScreen = ({
       <View style={styles.buttons}>
         <Button
           mode="contained"
-          onPress={() => navigation.navigate('Album')}
+          onPress={() => navigation.navigate('Albums')}
           style={styles.button}
         >
           Navigate to album
@@ -136,9 +136,9 @@ export default function SimpleStackScreen({ navigation, ...rest }: Props) {
         options={{ title: 'Feed' }}
       />
       <SimpleStack.Screen
-        name="Album"
+        name="Albums"
         component={AlbumsScreen}
-        options={{ title: 'Album' }}
+        options={{ title: 'Albums' }}
       />
     </SimpleStack.Navigator>
   );

example/src/Screens/StackHeaderCustomization.tsx

@@ -15,7 +15,7 @@ import Albums from '../Shared/Albums';
 
 type SimpleStackParams = {
   Article: { author: string };
-  Album: undefined;
+  Albums: undefined;
 };
 
 type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
@@ -34,7 +34,7 @@ const ArticleScreen = ({
       <View style={styles.buttons}>
         <Button
           mode="contained"
-          onPress={() => navigation.push('Album')}
+          onPress={() => navigation.push('Albums')}
           style={styles.button}
         >
           Push album
@@ -131,10 +131,10 @@ export default function SimpleStackScreen({ navigation, ...rest }: Props) {
         initialParams={{ author: 'Gandalf' }}
       />
       <SimpleStack.Screen
-        name="Album"
+        name="Albums"
         component={AlbumsScreen}
         options={{
-          title: 'Album',
+          title: 'Albums',
           headerBackTitle: 'Back',
           headerTransparent: true,
           headerBackground: () => (

example/src/index.tsx

@@ -239,6 +239,22 @@ export default function App() {
                 { Home: '' }
               ),
             },
+            Article: {
+              path: 'article/:author?',
+              parse: {
+                author: (author) =>
+                  author.charAt(0).toUpperCase() +
+                  author.slice(1).replace(/-/g, ' '),
+              },
+              stringify: {
+                author: (author: string) =>
+                  author.toLowerCase().replace(/\s/g, '-'),
+              },
+            },
+            Albums: 'music',
+            Chat: 'chat',
+            Contacts: 'people',
+            NewsFeed: 'feed',
           },
         }}
         fallback={<Text>Loading…</Text>}

package.json

@@ -13,7 +13,7 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/satya164/react-navigation.git"
+    "url": "git+https://github.com/react-navigation/react-navigation.git"
   },
   "author": "Satyajit Sahoo <satyajit.happy@gmail.com> (https://github.com/satya164/), Michał Osadnik <micosa97@gmail.com> (https://github.com/osdnk/)",
   "scripts": {

packages/bottom-tabs/CHANGELOG.md

@@ -3,6 +3,58 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [5.5.0](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.7...@react-navigation/bottom-tabs@5.5.0) (2020-05-23)
+
+
+### Features
+
+* animate changes to tabBarVisible in BottomTabBar ([#8286](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/issues/8286)) ([c1e46f8](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/commit/c1e46f8e331e0054995aa476455af204d02d4170))
+* update react-native-safe-area-context to 1.0.0 ([#8182](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/issues/8182)) ([d62fbfe](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/commit/d62fbfe255140f16b182e8b54b276a7c96f2aec6))
+
+
+
+
+
+## [5.4.7](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.6...@react-navigation/bottom-tabs@5.4.7) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
+## [5.4.6](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.5...@react-navigation/bottom-tabs@5.4.6) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
+## [5.4.5](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.4...@react-navigation/bottom-tabs@5.4.5) (2020-05-16)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
+## [5.4.4](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.3...@react-navigation/bottom-tabs@5.4.4) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
+## [5.4.3](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.2...@react-navigation/bottom-tabs@5.4.3) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
 ## [5.4.2](https://github.com/react-navigation/react-navigation/tree/master/packages/bottom-tabs/compare/@react-navigation/bottom-tabs@5.4.1...@react-navigation/bottom-tabs@5.4.2) (2020-05-10)
 
 **Note:** Version bump only for package @react-navigation/bottom-tabs

packages/bottom-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/bottom-tabs",
   "description": "Bottom tab navigator following iOS design guidelines",
-  "version": "5.4.2",
+  "version": "5.5.0",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -20,7 +20,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -35,15 +36,15 @@
     "react-native-iphone-x-helper": "^1.2.1"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
-    "@react-navigation/native": "^5.3.0",
+    "@react-navigation/native": "^5.4.3",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.34",
     "@types/react-native": "^0.62.7",
     "del-cli": "^3.0.0",
     "react": "~16.9.0",
     "react-native": "~0.61.5",
-    "react-native-safe-area-context": "^0.7.3",
+    "react-native-safe-area-context": "^1.0.0",
     "react-native-screens": "^2.7.0",
     "typescript": "^3.8.3"
   },

packages/bottom-tabs/src/views/BottomTabBar.tsx

@@ -53,52 +53,60 @@ export default function BottomTabBar({
   const { colors } = useTheme();
   const buildLink = useLinkBuilder();
 
-  const [dimensions, setDimensions] = React.useState(() => {
+  const focusedRoute = state.routes[state.index];
-    const { height = 0, width = 0 } = Dimensions.get('window');
+  const focusedDescriptor = descriptors[focusedRoute.key];
+  const focusedOptions = focusedDescriptor.options;
 
-    return { height, width };
+  const [isKeyboardShown, setIsKeyboardShown] = React.useState(false);
-  });
 
-  const [layout, setLayout] = React.useState({
+  const shouldShowTabBar =
-    height: 0,
+    focusedOptions.tabBarVisible !== false &&
-    width: dimensions.width,
+    !(keyboardHidesTabBar && isKeyboardShown);
-  });
-  const [keyboardShown, setKeyboardShown] = React.useState(false);
 
-  const [visible] = React.useState(() => new Animated.Value(1));
+  const [isTabBarHidden, setIsTabBarHidden] = React.useState(!shouldShowTabBar);
 
-  const { routes } = state;
+  const [visible] = React.useState(
+    () => new Animated.Value(shouldShowTabBar ? 1 : 0)
+  );
 
   React.useEffect(() => {
-    if (keyboardShown) {
+    if (shouldShowTabBar) {
-      Animated.timing(visible, {
-        toValue: 0,
-        duration: 200,
-        useNativeDriver,
-      }).start();
-    }
-  }, [keyboardShown, visible]);
-
-  React.useEffect(() => {
-    const handleOrientationChange = ({ window }: { window: ScaledSize }) => {
-      setDimensions(window);
-    };
-
-    const handleKeyboardShow = () => setKeyboardShown(true);
-
-    const handleKeyboardHide = () =>
       Animated.timing(visible, {
         toValue: 1,
         duration: 250,
         useNativeDriver,
       }).start(({ finished }) => {
         if (finished) {
-          setKeyboardShown(false);
+          setIsTabBarHidden(false);
         }
       });
+    } else {
+      setIsTabBarHidden(true);
+
+      Animated.timing(visible, {
+        toValue: 0,
+        duration: 200,
+        useNativeDriver,
+      }).start();
+    }
+  }, [shouldShowTabBar, visible]);
+
+  const [dimensions, setDimensions] = React.useState(() => {
+    const { height = 0, width = 0 } = Dimensions.get('window');
+
+    return { height, width };
+  });
+
+  React.useEffect(() => {
+    const handleOrientationChange = ({ window }: { window: ScaledSize }) => {
+      setDimensions(window);
+    };
 
     Dimensions.addEventListener('change', handleOrientationChange);
 
+    const handleKeyboardShow = () => setIsKeyboardShown(true);
+    const handleKeyboardHide = () => setIsKeyboardShown(false);
+
     if (Platform.OS === 'ios') {
       Keyboard.addListener('keyboardWillShow', handleKeyboardShow);
       Keyboard.addListener('keyboardWillHide', handleKeyboardHide);
@@ -118,7 +126,12 @@ export default function BottomTabBar({
         Keyboard.removeListener('keyboardDidHide', handleKeyboardHide);
       }
     };
-  }, [visible]);
+  }, []);
+
+  const [layout, setLayout] = React.useState({
+    height: 0,
+    width: dimensions.width,
+  });
 
   const handleLayout = (e: LayoutChangeEvent) => {
     const { height, width } = e.nativeEvent.layout;
@@ -135,6 +148,7 @@ export default function BottomTabBar({
     });
   };
 
+  const { routes } = state;
   const shouldUseHorizontalLabels = () => {
     if (labelPosition) {
       return labelPosition === 'beside-icon';
@@ -183,22 +197,19 @@ export default function BottomTabBar({
           backgroundColor: colors.card,
           borderTopColor: colors.border,
         },
-        keyboardHidesTabBar
+        {
-          ? {
-              // When the keyboard is shown, slide down the tab bar
           transform: [
             {
               translateY: visible.interpolate({
                 inputRange: [0, 1],
-                    outputRange: [layout.height, 0],
+                outputRange: [layout.height + insets.bottom, 0],
               }),
             },
           ],
           // Absolutely position the tab bar so that the content is below it
           // This is needed to avoid gap at bottom when the tab bar is hidden
-              position: keyboardShown ? 'absolute' : null,
+          position: isTabBarHidden ? 'absolute' : null,
-            }
+        },
-          : null,
         {
           height: DEFAULT_TABBAR_HEIGHT + insets.bottom,
           paddingBottom: insets.bottom,
@@ -206,7 +217,7 @@ export default function BottomTabBar({
         },
         style,
       ]}
-      pointerEvents={keyboardHidesTabBar && keyboardShown ? 'none' : 'auto'}
+      pointerEvents={isTabBarHidden ? 'none' : 'auto'}
     >
       <View style={styles.content} onLayout={handleLayout}>
         {routes.map((route, index) => {

packages/bottom-tabs/src/views/BottomTabView.tsx

@@ -75,17 +75,8 @@ export default class BottomTabView extends React.Component<Props, State> {
       tabBarOptions,
       state,
       navigation,
+      descriptors,
     } = this.props;
-
-    const { descriptors } = this.props;
-    const route = state.routes[state.index];
-    const descriptor = descriptors[route.key];
-    const options = descriptor.options;
-
-    if (options.tabBarVisible === false) {
-      return null;
-    }
-
     return tabBar({
       ...tabBarOptions,
       state: state,

packages/compat/CHANGELOG.md

@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.24](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.23...@react-navigation/compat@5.1.24) (2020-05-23)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
+## [5.1.23](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.22...@react-navigation/compat@5.1.23) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
+## [5.1.22](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.21...@react-navigation/compat@5.1.22) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
+## [5.1.21](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.20...@react-navigation/compat@5.1.21) (2020-05-16)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
+## [5.1.20](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.19...@react-navigation/compat@5.1.20) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
+## [5.1.19](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.18...@react-navigation/compat@5.1.19) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
 ## [5.1.18](https://github.com/react-navigation/react-navigation/tree/master/packages/compat/compare/@react-navigation/compat@5.1.17...@react-navigation/compat@5.1.18) (2020-05-10)
 
 **Note:** Version bump only for package @react-navigation/compat

packages/compat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/compat",
   "description": "Compatibility layer to write navigator definitions in static configuration format",
-  "version": "5.1.18",
+  "version": "5.1.24",
   "license": "MIT",
   "repository": "https://github.com/react-navigation/react-navigation/tree/master/packages/compat",
   "bugs": {
@@ -15,7 +15,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -26,8 +27,8 @@
     "clean": "del lib"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
-    "@react-navigation/native": "^5.3.0",
+    "@react-navigation/native": "^5.4.3",
     "@types/react": "^16.9.34",
     "react": "~16.9.0",
     "typescript": "^3.8.3"

packages/core/CHANGELOG.md

@@ -3,6 +3,78 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.8.2](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.8.1...@react-navigation/core@5.8.2) (2020-05-23)
+
+**Note:** Version bump only for package @react-navigation/core
+
+
+
+
+
+## [5.8.1](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.8.0...@react-navigation/core@5.8.1) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/core
+
+
+
+
+
+# [5.8.0](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.7.0...@react-navigation/core@5.8.0) (2020-05-20)
+
+
+### Features
+
+* add getCurrentOptions ([#8277](https://github.com/react-navigation/react-navigation/tree/master/packages/core/issues/8277)) ([d024ec6](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/d024ec6d74dffe481ce6fde732c729e20c1668f4))
+* add getCurrentRoute ([#8254](https://github.com/react-navigation/react-navigation/tree/master/packages/core/issues/8254)) ([7b25c8e](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/7b25c8eb2e6f96128fd86b92615346ce55bedeca))
+
+
+
+
+
+# [5.7.0](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.6.1...@react-navigation/core@5.7.0) (2020-05-16)
+
+
+### Bug Fixes
+
+* don't use Object.fromEntries ([51f4d11](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/51f4d11fdf4bd2bb06f8cd4094f051816590e62c))
+
+
+### Features
+
+* add a PathConfig type ([60cb3c9](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/60cb3c9ba76d7ef166c9fe8b55f23728975b5b6e))
+
+
+
+
+
+## [5.6.1](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.6.0...@react-navigation/core@5.6.1) (2020-05-14)
+
+
+### Bug Fixes
+
+* don't use flat since it's not supported in node ([21b397f](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/21b397f0d6b96ec4875d3172f47533130bb08009))
+
+
+
+
+
+# [5.6.0](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.5.2...@react-navigation/core@5.6.0) (2020-05-14)
+
+
+### Bug Fixes
+
+* ignore extra slashes in the pattern ([3c47716](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/3c47716826d0dfa69dfa6112141c116723372ea1))
+* ignore state updates when we're not mounted ([0149e85](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/0149e85a95b90c6a9d487fa753ddbf5d01c03e3d)), closes [#8226](https://github.com/react-navigation/react-navigation/tree/master/packages/core/issues/8226)
+
+
+### Features
+
+* merge path patterns for nested screens ([#8253](https://github.com/react-navigation/react-navigation/tree/master/packages/core/issues/8253)) ([acc9646](https://github.com/react-navigation/react-navigation/tree/master/packages/core/commit/acc9646426fee53558d686dfbe5fd0e35361d8c0))
+
+
+
+
+
 ## [5.5.2](https://github.com/react-navigation/react-navigation/tree/master/packages/core/compare/@react-navigation/core@5.5.1...@react-navigation/core@5.5.2) (2020-05-08)
 
 

packages/core/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/core",
   "description": "Core utilities for building navigators",
-  "version": "5.5.2",
+  "version": "5.8.2",
   "keywords": [
     "react",
     "react-native",
@@ -20,7 +20,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "publishConfig": {
     "access": "public"
@@ -30,7 +31,7 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/routers": "^5.4.4",
+    "@react-navigation/routers": "^5.4.7",
     "escape-string-regexp": "^4.0.0",
     "nanoid": "^3.1.5",
     "query-string": "^6.12.1",
@@ -38,7 +39,7 @@
     "use-subscription": "^1.4.0"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
     "@types/react": "^16.9.34",
     "@types/react-is": "^16.7.1",
     "@types/use-subscription": "^1.0.0",

packages/core/src/BaseNavigationContainer.tsx

@@ -13,49 +13,22 @@ import { ScheduleUpdateContext } from './useScheduleUpdate';
 import useFocusedListeners from './useFocusedListeners';
 import useDevTools from './useDevTools';
 import useStateGetters from './useStateGetters';
+import useOptionsGetters from './useOptionsGetters';
 import useEventEmitter from './useEventEmitter';
 import useSyncState from './useSyncState';
 import isSerializable from './isSerializable';
 
 import { NavigationContainerRef, NavigationContainerProps } from './types';
+import NavigationStateContext from './NavigationStateContext';
 
 type State = NavigationState | PartialState<NavigationState> | undefined;
 
 const DEVTOOLS_CONFIG_KEY =
   'REACT_NAVIGATION_REDUX_DEVTOOLS_EXTENSION_INTEGRATION_ENABLED';
 
-const MISSING_CONTEXT_ERROR =
-  "Couldn't find a navigation context. Have you wrapped your app with 'NavigationContainer'? See https://reactnavigation.org/docs/getting-started for setup instructions.";
-
 const NOT_INITIALIZED_ERROR =
   "The 'navigation' object hasn't been initialized yet. This might happen if you don't have a navigator mounted, or if the navigator hasn't finished mounting. See https://reactnavigation.org/docs/navigating-without-navigation-prop#handling-initialization for more details.";
 
-export const NavigationStateContext = React.createContext<{
-  isDefault?: true;
-  state?: NavigationState | PartialState<NavigationState>;
-  getKey: () => string | undefined;
-  setKey: (key: string) => void;
-  getState: () => NavigationState | PartialState<NavigationState> | undefined;
-  setState: (
-    state: NavigationState | PartialState<NavigationState> | undefined
-  ) => void;
-}>({
-  isDefault: true,
-
-  get getKey(): any {
-    throw new Error(MISSING_CONTEXT_ERROR);
-  },
-  get setKey(): any {
-    throw new Error(MISSING_CONTEXT_ERROR);
-  },
-  get getState(): any {
-    throw new Error(MISSING_CONTEXT_ERROR);
-  },
-  get setState(): any {
-    throw new Error(MISSING_CONTEXT_ERROR);
-  },
-});
-
 let hasWarnedForSerialization = false;
 
 /**
@@ -199,8 +172,21 @@ const BaseNavigationContainer = React.forwardRef(
       return getStateForRoute('root');
     }, [getStateForRoute]);
 
+    const getCurrentRoute = React.useCallback(() => {
+      let state = getRootState();
+      if (state === undefined) {
+        return undefined;
+      }
+      while (state.routes[state.index].state !== undefined) {
+        state = state.routes[state.index].state as NavigationState;
+      }
+      return state.routes[state.index];
+    }, [getRootState]);
+
     const emitter = useEventEmitter();
 
+    const { addOptionsGetter, getCurrentOptions } = useOptionsGetters({});
+
     React.useImperativeHandle(ref, () => ({
       ...(Object.keys(CommonActions) as (keyof typeof CommonActions)[]).reduce<
         any
@@ -221,6 +207,8 @@ const BaseNavigationContainer = React.forwardRef(
       getRootState,
       dangerouslyGetState: () => state,
       dangerouslyGetParent: () => undefined,
+      getCurrentRoute,
+      getCurrentOptions,
     }));
 
     const builderContext = React.useMemo(
@@ -244,8 +232,9 @@ const BaseNavigationContainer = React.forwardRef(
         setState,
         getKey,
         setKey,
+        addOptionsGetter,
       }),
-      [getKey, getState, setKey, setState, state]
+      [getKey, getState, setKey, setState, state, addOptionsGetter]
     );
 
     React.useEffect(() => {

packages/core/src/NavigationStateContext.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { NavigationState, PartialState } from '@react-navigation/routers';
+
+const MISSING_CONTEXT_ERROR =
+  "Couldn't find a navigation context. Have you wrapped your app with 'NavigationContainer'? See https://reactnavigation.org/docs/getting-started for setup instructions.";
+
+export default React.createContext<{
+  isDefault?: true;
+  state?: NavigationState | PartialState<NavigationState>;
+  getKey: () => string | undefined;
+  setKey: (key: string) => void;
+  getState: () => NavigationState | PartialState<NavigationState> | undefined;
+  setState: (
+    state: NavigationState | PartialState<NavigationState> | undefined
+  ) => void;
+  addOptionsGetter?: (
+    key: string,
+    getter: () => object | undefined | null
+  ) => void;
+}>({
+  isDefault: true,
+
+  get getKey(): any {
+    throw new Error(MISSING_CONTEXT_ERROR);
+  },
+  get setKey(): any {
+    throw new Error(MISSING_CONTEXT_ERROR);
+  },
+  get getState(): any {
+    throw new Error(MISSING_CONTEXT_ERROR);
+  },
+  get setState(): any {
+    throw new Error(MISSING_CONTEXT_ERROR);
+  },
+});

packages/core/src/SceneView.tsx

@@ -5,12 +5,13 @@ import {
   NavigationState,
   PartialState,
 } from '@react-navigation/routers';
-import { NavigationStateContext } from './BaseNavigationContainer';
+import NavigationStateContext from './NavigationStateContext';
 import NavigationContext from './NavigationContext';
 import NavigationRouteContext from './NavigationRouteContext';
 import StaticContainer from './StaticContainer';
 import EnsureSingleNavigator from './EnsureSingleNavigator';
 import { NavigationProp, RouteConfig, EventMapBase } from './types';
+import useOptionsGetters from './useOptionsGetters';
 
 type Props<
   State extends NavigationState,
@@ -24,6 +25,7 @@ type Props<
   };
   getState: () => State;
   setState: (state: State) => void;
+  options: object;
 };
 
 /**
@@ -40,11 +42,24 @@ export default function SceneView<
   navigation,
   getState,
   setState,
+  options,
 }: Props<State, ScreenOptions, EventMap>) {
   const navigatorKeyRef = React.useRef<string | undefined>();
-
   const getKey = React.useCallback(() => navigatorKeyRef.current, []);
 
+  const optionsRef = React.useRef<object | undefined>(options);
+
+  React.useEffect(() => {
+    optionsRef.current = options;
+  }, [options]);
+
+  const getOptions = React.useCallback(() => optionsRef.current, []);
+
+  const { addOptionsGetter } = useOptionsGetters({
+    key: route.key,
+    getOptions,
+  });
+
   const setKey = React.useCallback((key: string) => {
     navigatorKeyRef.current = key;
   }, []);
@@ -77,8 +92,16 @@ export default function SceneView<
       setState: setCurrentState,
       getKey,
       setKey,
+      addOptionsGetter,
     }),
-    [getCurrentState, getKey, route.state, setCurrentState, setKey]
+    [
+      getCurrentState,
+      getKey,
+      route.state,
+      setCurrentState,
+      setKey,
+      addOptionsGetter,
+    ]
   );
 
   return (

packages/core/src/__tests__/BaseNavigationContainer.test.tsx

@@ -5,9 +5,8 @@ import {
   NavigationState,
   Router,
 } from '@react-navigation/routers';
-import BaseNavigationContainer, {
+import BaseNavigationContainer from '../BaseNavigationContainer';
-  NavigationStateContext,
+import NavigationStateContext from '../NavigationStateContext';
-} from '../BaseNavigationContainer';
 import MockRouter, { MockActions } from './__fixtures__/MockRouter';
 import useNavigationBuilder from '../useNavigationBuilder';
 import Screen from '../Screen';

packages/core/src/__tests__/getPathFromState.test.tsx

@@ -117,7 +117,8 @@ it("doesn't add query param for empty params", () => {
 });
 
 it('handles state with config with nested screens', () => {
-  const path = '/foe/bar/sweet/apple/baz/jane?answer=42&count=10&valid=true';
+  const path =
+    '/foo/foe/bar/sweet/apple/baz/jane?answer=42&count=10&valid=true';
   const config = {
     Foo: {
       path: 'foo',
@@ -182,8 +183,77 @@ it('handles state with config with nested screens', () => {
   expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
 });
 
+it('handles state with config with nested screens and exact', () => {
+  const path = '/foe/bar/sweet/apple/baz/jane?answer=42&count=10&valid=true';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
+      },
+    },
+    Bar: 'bar/:type/:fruit',
+    Baz: {
+      path: 'baz/:author',
+      parse: {
+        author: (author: string) =>
+          author.replace(/^\w/, (c) => c.toUpperCase()),
+        count: Number,
+        valid: Boolean,
+      },
+      stringify: {
+        author: (author: string) => author.toLowerCase(),
+        id: (id: number) => `x${id}`,
+        unknown: (_: unknown) => 'x',
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        state: {
+          routes: [
+            {
+              name: 'Foe',
+              state: {
+                routes: [
+                  {
+                    name: 'Bar',
+                    params: { fruit: 'apple', type: 'sweet' },
+                    state: {
+                      routes: [
+                        {
+                          name: 'Baz',
+                          params: {
+                            author: 'Jane',
+                            count: '10',
+                            answer: '42',
+                            valid: true,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
 it('handles state with config with nested screens and unused configs', () => {
-  const path = '/foe/baz/jane?answer=42&count=10&valid=true';
+  const path = '/foo/foe/baz/jane?answer=42&count=10&valid=true';
   const config = {
     Foo: {
       path: 'foo',
@@ -239,6 +309,66 @@ it('handles state with config with nested screens and unused configs', () => {
   expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
 });
 
+it('handles state with config with nested screens and unused configs with exact', () => {
+  const path = '/foe/baz/jane?answer=42&count=10&valid=true';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
+      },
+    },
+    Baz: {
+      path: 'baz/:author',
+      parse: {
+        author: (author: string) =>
+          author.replace(/^\w/, (c) => c.toUpperCase()),
+        count: Number,
+        valid: Boolean,
+      },
+      stringify: {
+        author: (author: string) =>
+          author.replace(/^\w/, (c) => c.toLowerCase()),
+        unknown: (_: unknown) => 'x',
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        state: {
+          routes: [
+            {
+              name: 'Foe',
+              state: {
+                routes: [
+                  {
+                    name: 'Baz',
+                    params: {
+                      author: 'Jane',
+                      count: 10,
+                      answer: '42',
+                      valid: true,
+                    },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
 it('handles nested object with stringify in it', () => {
   const path = '/bar/sweet/apple/foo/bis/jane?answer=42&count=10&valid=true';
   const config = {
@@ -252,7 +382,6 @@ it('handles nested object with stringify in it', () => {
     },
     Bar: 'bar/:type/:fruit',
     Baz: {
-      path: 'baz',
       screens: {
         Bos: 'bos',
         Bis: {
@@ -312,8 +441,82 @@ it('handles nested object with stringify in it', () => {
   expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
 });
 
+it('handles nested object with stringify in it with exact', () => {
+  const path = '/bar/sweet/apple/foo/bis/jane?answer=42&count=10&valid=true';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Foe: {
+          path: 'foe',
+        },
+      },
+    },
+    Bar: 'bar/:type/:fruit',
+    Baz: {
+      path: 'baz',
+      screens: {
+        Bos: 'bos',
+        Bis: {
+          path: 'bis/:author',
+          exact: true,
+          stringify: {
+            author: (author: string) =>
+              author.replace(/^\w/, (c) => c.toLowerCase()),
+          },
+          parse: {
+            author: (author: string) =>
+              author.replace(/^\w/, (c) => c.toUpperCase()),
+            count: Number,
+            valid: Boolean,
+          },
+        },
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Bar',
+        params: { fruit: 'apple', type: 'sweet' },
+        state: {
+          routes: [
+            {
+              name: 'Foo',
+              state: {
+                routes: [
+                  {
+                    name: 'Baz',
+                    state: {
+                      routes: [
+                        {
+                          name: 'Bis',
+                          params: {
+                            author: 'Jane',
+                            count: 10,
+                            answer: '42',
+                            valid: true,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
 it('handles nested object for second route depth', () => {
-  const path = '/baz';
+  const path = '/foo/bar/baz';
   const config = {
     Foo: {
       path: 'foo',
@@ -351,7 +554,95 @@ it('handles nested object for second route depth', () => {
   expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
 });
 
-it('handles nested object for second route depth and and path and stringify in roots', () => {
+it('handles nested object for second route depth with exact', () => {
+  const path = '/baz';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Foe: 'foe',
+        Bar: {
+          path: 'bar',
+          screens: {
+            Baz: {
+              path: 'baz',
+              exact: true,
+            },
+          },
+        },
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        state: {
+          routes: [
+            {
+              name: 'Bar',
+              state: {
+                routes: [{ name: 'Baz' }],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
+it('handles nested object for second route depth and path and stringify in roots', () => {
+  const path = '/foo/dathomir/bar/42/baz';
+  const config = {
+    Foo: {
+      path: 'foo/:planet',
+      stringify: {
+        id: (id: number) => `planet=${id}`,
+      },
+      screens: {
+        Foe: 'foe',
+        Bar: {
+          path: 'bar/:id',
+          parse: {
+            id: Number,
+          },
+          screens: {
+            Baz: 'baz',
+          },
+        },
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        params: { planet: 'dathomir' },
+        state: {
+          routes: [
+            {
+              name: 'Bar',
+              state: {
+                routes: [{ name: 'Baz', params: { id: 42 } }],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
+it('handles nested object for second route depth and path and stringify in roots with exact', () => {
   const path = '/baz';
   const config = {
     Foo: {
@@ -370,7 +661,10 @@ it('handles nested object for second route depth and and path and stringify in r
             id: Number,
           },
           screens: {
-            Baz: 'baz',
+            Baz: {
+              path: 'baz',
+              exact: true,
+            },
           },
         },
       },
@@ -470,7 +764,7 @@ it('keeps query params if path is empty', () => {
 });
 
 it('cuts nested configs too', () => {
-  const path = '/baz';
+  const path = '/foo/baz';
   const config = {
     Foo: {
       path: 'foo',
@@ -478,7 +772,48 @@ it('cuts nested configs too', () => {
         Bar: '',
       },
     },
-    Baz: { path: 'baz' },
+    Baz: {
+      path: 'baz',
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        state: {
+          routes: [
+            {
+              name: 'Bar',
+              state: {
+                routes: [{ name: 'Baz' }],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
+it('cuts nested configs too with exact', () => {
+  const path = '/baz';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Bar: {
+          path: '',
+          exact: true,
+        },
+      },
+    },
+    Baz: {
+      path: 'baz',
+    },
   };
 
   const state = {
@@ -504,7 +839,7 @@ it('cuts nested configs too', () => {
 });
 
 it('handles empty path at the end', () => {
-  const path = '/bar';
+  const path = '/foo/bar';
   const config = {
     Foo: {
       path: 'foo',
@@ -641,7 +976,6 @@ it('strips undefined query params', () => {
     },
     Bar: 'bar/:type/:fruit',
     Baz: {
-      path: 'baz',
       screens: {
         Bos: 'bos',
         Bis: {
@@ -681,7 +1015,79 @@ it('strips undefined query params', () => {
                           params: {
                             author: 'Jane',
                             count: 10,
-                            answer: undefined,
+                            valid: true,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
+it('strips undefined query params with exact', () => {
+  const path = '/bar/sweet/apple/foo/bis/jane?count=10&valid=true';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Foe: {
+          path: 'foe',
+        },
+      },
+    },
+    Bar: 'bar/:type/:fruit',
+    Baz: {
+      path: 'baz',
+      screens: {
+        Bos: 'bos',
+        Bis: {
+          path: 'bis/:author',
+          exact: true,
+          stringify: {
+            author: (author: string) =>
+              author.replace(/^\w/, (c) => c.toLowerCase()),
+          },
+          parse: {
+            author: (author: string) =>
+              author.replace(/^\w/, (c) => c.toUpperCase()),
+            count: Number,
+            valid: Boolean,
+          },
+        },
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Bar',
+        params: { fruit: 'apple', type: 'sweet' },
+        state: {
+          routes: [
+            {
+              name: 'Foo',
+              state: {
+                routes: [
+                  {
+                    name: 'Baz',
+                    state: {
+                      routes: [
+                        {
+                          name: 'Bis',
+                          params: {
+                            author: 'Jane',
+                            count: 10,
                             valid: true,
                           },
                         },
@@ -714,7 +1120,6 @@ it('handles stripping all query params', () => {
     },
     Bar: 'bar/:type/:fruit',
     Baz: {
-      path: 'baz',
       screens: {
         Bos: 'bos',
         Bis: {
@@ -753,9 +1158,6 @@ it('handles stripping all query params', () => {
                           name: 'Bis',
                           params: {
                             author: 'Jane',
-                            count: undefined,
-                            answer: undefined,
-                            valid: undefined,
                           },
                         },
                       ],
@@ -773,3 +1175,93 @@ it('handles stripping all query params', () => {
   expect(getPathFromState(state, config)).toBe(path);
   expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
 });
+
+it('handles stripping all query params with exact', () => {
+  const path = '/bar/sweet/apple/foo/bis/jane';
+  const config = {
+    Foo: {
+      path: 'foo',
+      screens: {
+        Foe: {
+          path: 'foe',
+        },
+      },
+    },
+    Bar: 'bar/:type/:fruit',
+    Baz: {
+      path: 'baz',
+      screens: {
+        Bos: 'bos',
+        Bis: {
+          path: 'bis/:author',
+          exact: true,
+          stringify: {
+            author: (author: string) =>
+              author.replace(/^\w/, (c) => c.toLowerCase()),
+          },
+          parse: {
+            author: (author: string) =>
+              author.replace(/^\w/, (c) => c.toUpperCase()),
+            count: Number,
+            valid: Boolean,
+          },
+        },
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Bar',
+        params: { fruit: 'apple', type: 'sweet' },
+        state: {
+          routes: [
+            {
+              name: 'Foo',
+              state: {
+                routes: [
+                  {
+                    name: 'Baz',
+                    state: {
+                      routes: [
+                        {
+                          name: 'Bis',
+                          params: {
+                            author: 'Jane',
+                          },
+                        },
+                      ],
+                    },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});
+
+it('replaces undefined query params', () => {
+  const path = '/bar/undefined/apple';
+  const config = {
+    Bar: 'bar/:type/:fruit',
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Bar',
+        params: { fruit: 'apple' },
+      },
+    ],
+  };
+
+  expect(getPathFromState(state, config)).toBe(path);
+  expect(getPathFromState(getStateFromPath(path, config), config)).toBe(path);
+});

packages/core/src/__tests__/getStateFromPath.test.tsx

@@ -147,7 +147,10 @@ it('converts path string to initial state with config with nested screens', () =
     Foo: {
       path: 'foo',
       screens: {
-        Foe: 'foe',
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
       },
     },
     Bar: 'bar/:type/:fruit',
@@ -213,7 +216,10 @@ it('converts path string to initial state with config with nested screens and un
     Foo: {
       path: 'foo',
       screens: {
-        Foe: 'foe',
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
       },
     },
     Baz: {
@@ -268,16 +274,23 @@ it('handles nested object with unused configs and with parse in it', () => {
     Foo: {
       path: 'foo',
       screens: {
-        Foe: 'foe',
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
       },
     },
     Bar: 'bar/:type/:fruit',
     Baz: {
       path: 'baz',
       screens: {
-        Bos: 'bos',
+        Bos: {
+          path: 'bos',
+          exact: true,
+        },
         Bis: {
           path: 'bis/:author',
+          exact: true,
           stringify: {
             author: (author: string) =>
               author.replace(/^\w/, (c) => c.toLowerCase()),
@@ -348,11 +361,18 @@ it('handles parse in nested object for second route depth', () => {
     Foo: {
       path: 'foo',
       screens: {
-        Foe: 'foe',
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
         Bar: {
           path: 'bar',
+          exact: true,
           screens: {
-            Baz: 'baz',
+            Baz: {
+              path: 'baz',
+              exact: true,
+            },
           },
         },
       },
@@ -519,16 +539,23 @@ it('handles two initialRouteNames', () => {
     Foo: {
       path: 'foo',
       screens: {
-        Foe: 'foe',
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
       },
     },
     Bar: 'bar/:type/:fruit',
     Baz: {
       initialRouteName: 'Bos',
       screens: {
-        Bos: 'bos',
+        Bos: {
+          path: 'bos',
+          exact: true,
+        },
         Bis: {
           path: 'bis/:author',
+          exact: true,
           stringify: {
             author: (author: string) =>
               author.replace(/^\w/, (c) => c.toLowerCase()),
@@ -601,16 +628,23 @@ it('accepts initialRouteName without config for it', () => {
     Foo: {
       path: 'foo',
       screens: {
-        Foe: 'foe',
+        Foe: {
+          path: 'foe',
+          exact: true,
+        },
       },
     },
     Bar: 'bar/:type/:fruit',
     Baz: {
       initialRouteName: 'Bas',
       screens: {
-        Bos: 'bos',
+        Bos: {
+          path: 'bos',
+          exact: true,
+        },
         Bis: {
           path: 'bis/:author',
+          exact: true,
           stringify: {
             author: (author: string) =>
               author.replace(/^\w/, (c) => c.toLowerCase()),
@@ -1777,3 +1811,75 @@ it('handle optional params in the beginning v2', () => {
     state
   );
 });
+
+it('merges parent patterns if needed', () => {
+  const path = 'foo/42/baz/babel';
+
+  const config = {
+    Foo: {
+      path: 'foo/:bar',
+      parse: {
+        bar: Number,
+      },
+      screens: {
+        Baz: 'baz/:qux',
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        params: { bar: 42 },
+        state: {
+          routes: [
+            {
+              name: 'Baz',
+              params: { qux: 'babel' },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getStateFromPath(path, config)).toEqual(state);
+  expect(getStateFromPath(getPathFromState(state, config), config)).toEqual(
+    state
+  );
+});
+
+it('ignores extra slashes in the pattern', () => {
+  const path = '/bar/42';
+  const config = {
+    Foo: {
+      screens: {
+        Bar: {
+          path: '/bar//:id/',
+        },
+      },
+    },
+  };
+
+  const state = {
+    routes: [
+      {
+        name: 'Foo',
+        state: {
+          routes: [
+            {
+              name: 'Bar',
+              params: { id: '42' },
+            },
+          ],
+        },
+      },
+    ],
+  };
+
+  expect(getStateFromPath(path, config)).toEqual(state);
+  expect(getStateFromPath(getPathFromState(state, config), config)).toEqual(
+    state
+  );
+});

packages/core/src/__tests__/index.test.tsx

@@ -1490,3 +1490,128 @@ it("doesn't throw if children is null", () => {
 
   expect(() => render(element).update(element)).not.toThrowError();
 });
+
+it('returns currently focused route with getCurrentRoute', () => {
+  const TestNavigator = (props: any): any => {
+    const { state, descriptors } = useNavigationBuilder(MockRouter, props);
+
+    return descriptors[state.routes[state.index].key].render();
+  };
+
+  const TestScreen = () => null;
+
+  const navigation = React.createRef<NavigationContainerRef>();
+
+  const container = (
+    <BaseNavigationContainer ref={navigation}>
+      <TestNavigator>
+        <Screen name="bar" options={{ a: 'b' }}>
+          {() => (
+            <TestNavigator initialRouteName="bar-a">
+              <Screen
+                name="bar-a"
+                component={TestScreen}
+                options={{ sample: 'data' }}
+              />
+            </TestNavigator>
+          )}
+        </Screen>
+        <Screen name="xux" component={TestScreen} />
+      </TestNavigator>
+    </BaseNavigationContainer>
+  );
+
+  render(container).update(container);
+
+  expect(navigation.current?.getCurrentRoute()).toEqual({
+    key: 'bar-a',
+    name: 'bar-a',
+  });
+});
+
+it("returns currently focused route's options with getCurrentOptions", () => {
+  const TestNavigator = (props: any): any => {
+    const { state, descriptors } = useNavigationBuilder(MockRouter, props);
+
+    return descriptors[state.routes[state.index].key].render();
+  };
+
+  const TestScreen = () => null;
+
+  const navigation = React.createRef<NavigationContainerRef>();
+
+  const container = (
+    <BaseNavigationContainer ref={navigation}>
+      <TestNavigator>
+        <Screen name="bar" options={{ a: 'b' }}>
+          {() => (
+            <TestNavigator
+              initialRouteName="bar-a"
+              screenOptions={() => ({ sample2: 'data' })}
+            >
+              <Screen
+                name="bar-a"
+                component={TestScreen}
+                options={{ sample: 'data' }}
+              />
+            </TestNavigator>
+          )}
+        </Screen>
+        <Screen name="xux" component={TestScreen} />
+      </TestNavigator>
+    </BaseNavigationContainer>
+  );
+
+  render(container).update(container);
+
+  expect(navigation.current?.getCurrentOptions()).toEqual({
+    sample: 'data',
+    sample2: 'data',
+  });
+});
+
+it('does not throw if while getting current options with no options defined', () => {
+  const TestNavigator = (props: any): any => {
+    const { state, descriptors } = useNavigationBuilder(MockRouter, props);
+
+    return descriptors[state.routes[state.index].key].render();
+  };
+
+  const TestScreen = () => null;
+
+  const navigation = React.createRef<NavigationContainerRef>();
+
+  const container = (
+    <BaseNavigationContainer ref={navigation}>
+      <TestNavigator>
+        <Screen name="bar" options={{ a: 'b' }}>
+          {() => (
+            <TestNavigator initialRouteName="bar-a">
+              <Screen
+                name="bar-b"
+                component={TestScreen}
+                options={{ wrongKey: true }}
+              />
+              <Screen name="bar-a" component={TestScreen} />
+            </TestNavigator>
+          )}
+        </Screen>
+      </TestNavigator>
+    </BaseNavigationContainer>
+  );
+
+  render(container).update(container);
+
+  expect(navigation.current?.getCurrentOptions()).toEqual({});
+});
+
+it('does not throw if while getting current options with empty container', () => {
+  const navigation = React.createRef<NavigationContainerRef>();
+
+  // @ts-ignore
+  const container = <BaseNavigationContainer ref={navigation} />;
+
+  render(container).update(container);
+
+  expect(navigation.current?.getCurrentOptions()).toEqual(undefined);
+});

packages/core/src/getPathFromState.tsx

@@ -4,19 +4,18 @@ import {
   PartialState,
   Route,
 } from '@react-navigation/routers';
+import { PathConfig } from './types';
 
 type State = NavigationState | Omit<PartialState<NavigationState>, 'stale'>;
 
 type StringifyConfig = Record<string, (value: any) => string>;
 
-type Options = {
+type OptionsItem = PathConfig[string];
-  [routeName: string]:
+
-    | string
+type ConfigItem = {
-    | {
+  pattern?: string;
-        path?: string;
   stringify?: StringifyConfig;
-        screens?: Options;
+  screens?: Record<string, ConfigItem>;
-      };
 };
 
 /**
@@ -48,89 +47,83 @@ type Options = {
  */
 export default function getPathFromState(
   state?: State,
-  options: Options = {}
+  options: PathConfig = {}
 ): string {
   if (state === undefined) {
     throw Error('NavigationState not passed');
   }
-  let path = '/';
 
+  // Create a normalized configs array which will be easier to use
+  const configs = createNormalizedConfigs(options);
+
+  let path = '/';
   let current: State | undefined = state;
 
+  const allParams: Record<string, any> = {};
+
   while (current) {
     let index = typeof current.index === 'number' ? current.index : 0;
     let route = current.routes[index] as Route<string> & {
       state?: State;
     };
-    let currentOptions = options;
-    let pattern = route.name;
-    // we keep all the route names that appeared during going deeper in config in case the pattern is resolved to undefined
-    let nestedRouteNames = '';
 
-    while (route.name in currentOptions) {
+    let pattern: string | undefined;
-      if (typeof currentOptions[route.name] === 'string') {
+
-        pattern = currentOptions[route.name] as string;
+    let currentParams: Record<string, any> = { ...route.params };
-        break;
+    let currentOptions = configs;
-      } else if (typeof currentOptions[route.name] === 'object') {
+
-        // if there is no `screens` property, we return pattern
+    // Keep all the route names that appeared during going deeper in config in case the pattern is resolved to undefined
-        if (
+    let nestedRouteNames = [];
-          !(currentOptions[route.name] as {
+
-            screens: Options;
+    let hasNext = true;
-          }).screens
+
-        ) {
+    while (route.name in currentOptions && hasNext) {
-          pattern = (currentOptions[route.name] as { path: string }).path;
+      pattern = currentOptions[route.name].pattern;
-          nestedRouteNames = `${nestedRouteNames}/${route.name}`;
+
-          break;
+      nestedRouteNames.push(route.name);
-        } else {
+
-          // if it is the end of state, we return pattern
+      if (route.params) {
-          if (route.state === undefined) {
+        const stringify = currentOptions[route.name]?.stringify;
-            pattern = (currentOptions[route.name] as { path: string }).path;
+
-            nestedRouteNames = `${nestedRouteNames}/${route.name}`;
+        currentParams = fromEntries(
-            break;
+          Object.entries(route.params).map(([key, value]) => [
+            key,
+            stringify?.[key] ? stringify[key](value) : String(value),
+          ])
+        );
+
+        if (pattern) {
+          Object.assign(allParams, currentParams);
+        }
+      }
+
+      // If there is no `screens` property or no nested state, we return pattern
+      if (!currentOptions[route.name].screens || route.state === undefined) {
+        hasNext = false;
       } else {
         index =
-              typeof route.state.index === 'number' ? route.state.index : 0;
+          typeof route.state.index === 'number'
+            ? route.state.index
+            : route.state.routes.length - 1;
+
         const nextRoute = route.state.routes[index];
-            const deeperConfig = (currentOptions[route.name] as {
+        const nestedConfig = currentOptions[route.name].screens;
-              screens: Options;
+
-            }).screens;
         // if there is config for next route name, we go deeper
-            if (nextRoute.name in deeperConfig) {
+        if (nestedConfig && nextRoute.name in nestedConfig) {
-              nestedRouteNames = `${nestedRouteNames}/${route.name}`;
           route = nextRoute as Route<string> & { state?: State };
-              currentOptions = deeperConfig;
+          currentOptions = nestedConfig;
         } else {
-              // if not, there is no sense in going deeper in config
+          // If not, there is no sense in going deeper in config
-              pattern = (currentOptions[route.name] as { path: string }).path;
+          hasNext = false;
-              nestedRouteNames = `${nestedRouteNames}/${route.name}`;
-              break;
-            }
-          }
         }
       }
     }
 
     if (pattern === undefined) {
-      // cut the first `/`
+      pattern = nestedRouteNames.join('/');
-      pattern = nestedRouteNames.substring(1);
     }
 
-    const config =
-      currentOptions[route.name] !== undefined
-        ? (currentOptions[route.name] as { stringify?: StringifyConfig })
-            .stringify
-        : undefined;
-
-    const params = route.params
-      ? // Stringify all of the param values before we use them
-        Object.entries(route.params).reduce<{
-          [key: string]: string;
-        }>((acc, [key, value]) => {
-          acc[key] = config?.[key] ? config[key](value) : String(value);
-          return acc;
-        }, {})
-      : undefined;
-
     if (currentOptions[route.name] !== undefined) {
       path += pattern
         .split('/')
@@ -138,16 +131,23 @@ export default function getPathFromState(
           const name = p.replace(/^:/, '').replace(/\?$/, '');
 
           // If the path has a pattern for a param, put the param in the path
-          if (params && name in params && p.startsWith(':')) {
+          if (p.startsWith(':')) {
-            const value = params[name];
+            const value = allParams[name];
+
             // Remove the used value from the params object since we'll use the rest for query string
+            if (currentParams) {
               // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
-            delete params[name];
+              delete currentParams[name];
-            return encodeURIComponent(value);
+            }
-          } else if (p.endsWith('?')) {
+
-            // optional params without value assigned in route.params should be ignored
+            if (value === undefined && p.endsWith('?')) {
+              // Optional params without value assigned in route.params should be ignored
               return '';
             }
+
+            return encodeURIComponent(value);
+          }
+
           return encodeURIComponent(p);
         })
         .join('/');
@@ -157,14 +157,15 @@ export default function getPathFromState(
 
     if (route.state) {
       path += '/';
-    } else if (params) {
+    } else if (currentParams) {
-      for (let param in params) {
+      for (let param in currentParams) {
-        if (params[param] === 'undefined') {
+        if (currentParams[param] === 'undefined') {
           // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
-          delete params[param];
+          delete currentParams[param];
         }
       }
-      const query = queryString.stringify(params);
+
+      const query = queryString.stringify(currentParams);
 
       if (query) {
         path += `?${query}`;
@@ -180,3 +181,58 @@ export default function getPathFromState(
 
   return path;
 }
+
+// Object.fromEntries is not available in older iOS versions
+const fromEntries = <K extends string, V>(entries: (readonly [K, V])[]) =>
+  entries.reduce((acc, [k, v]) => {
+    acc[k] = v;
+    return acc;
+  }, {} as Record<K, V>);
+
+const joinPaths = (...paths: string[]): string =>
+  ([] as string[])
+    .concat(...paths.map((p) => p.split('/')))
+    .filter(Boolean)
+    .join('/');
+
+const createConfigItem = (
+  config: OptionsItem | string,
+  parentPattern?: string
+): ConfigItem => {
+  if (typeof config === 'string') {
+    // If a string is specified as the value of the key(e.g. Foo: '/path'), use it as the pattern
+    const pattern = parentPattern ? joinPaths(parentPattern, config) : config;
+
+    return { pattern };
+  }
+
+  // If an object is specified as the value (e.g. Foo: { ... }),
+  // It can have `path` property and `screens` prop which has nested configs
+  const pattern =
+    config.exact !== true && parentPattern && config.path
+      ? joinPaths(parentPattern, config.path)
+      : config.path;
+
+  const screens = config.screens
+    ? createNormalizedConfigs(config.screens, pattern)
+    : undefined;
+
+  return {
+    // Normalize pattern to remove any leading, trailing slashes, duplicate slashes etc.
+    pattern: pattern?.split('/').filter(Boolean).join('/'),
+    stringify: config.stringify,
+    screens,
+  };
+};
+
+const createNormalizedConfigs = (
+  options: PathConfig,
+  pattern?: string
+): Record<string, ConfigItem> =>
+  fromEntries(
+    Object.entries(options).map(([name, c]) => {
+      const result = createConfigItem(c, pattern);
+
+      return [name, result];
+    })
+  );

packages/core/src/getStateFromPath.tsx

@@ -5,26 +5,17 @@ import {
   PartialState,
   InitialState,
 } from '@react-navigation/routers';
+import { PathConfig } from './types';
 
 type ParseConfig = Record<string, (value: string) => any>;
 
-type Options = {
-  [routeName: string]:
-    | string
-    | {
-        path?: string;
-        parse?: ParseConfig;
-        screens?: Options;
-        initialRouteName?: string;
-      };
-};
-
 type RouteConfig = {
   screen: string;
-  match: RegExp | null;
+  regex?: RegExp;
+  path: string;
   pattern: string;
   routeNames: string[];
-  parse: ParseConfig | undefined;
+  parse?: ParseConfig;
 };
 
 type InitialRouteConfig = {
@@ -57,21 +48,21 @@ type ResultState = PartialState<NavigationState> & {
  */
 export default function getStateFromPath(
   path: string,
-  options: Options = {}
+  options: PathConfig = {}
 ): ResultState | undefined {
   let initialRoutes: InitialRouteConfig[] = [];
 
   // Create a normalized configs array which will be easier to use
-  const configs = ([] as RouteConfig[]).concat(
+  const configs = ([] as RouteConfig[])
+    .concat(
       ...Object.keys(options).map((key) =>
         createNormalizedConfigs(key, options, [], initialRoutes)
       )
-  );
+    )
-
+    .sort(
-  // sort configs so the most exhaustive is always first to be chosen
+      (a, b) =>
-  configs.sort(
+        // Sort configs so the most exhaustive is always first to be chosen
-    (config1, config2) =>
+        b.pattern.split('/').length - a.pattern.split('/').length
-      config2.pattern.split('/').length - config1.pattern.split('/').length
     );
 
   let remaining = path
@@ -87,18 +78,23 @@ export default function getStateFromPath(
     // When handling empty path, we should only look at the root level config
     const match = configs.find(
       (config) =>
-        config.pattern === '' &&
+        config.path === '' &&
         config.routeNames.every(
-          // make sure that none of the parent configs have a non-empty path defined
+          // Make sure that none of the parent configs have a non-empty path defined
-          (name) => !configs.find((c) => c.screen === name)?.pattern
+          (name) => !configs.find((c) => c.screen === name)?.path
         )
     );
 
     if (match) {
       return createNestedStateObject(
-        match.routeNames,
+        match.routeNames.map((name, i, self) => {
-        initialRoutes,
+          if (i === self.length - 1) {
-        parseQueryParams(path, match.parse)
+            return { name, params: parseQueryParams(path, match.parse) };
+          }
+
+          return { name };
+        }),
+        initialRoutes
       );
     }
 
@@ -110,15 +106,15 @@ export default function getStateFromPath(
 
   while (remaining) {
     let routeNames: string[] | undefined;
-    let params: Record<string, any> | undefined;
+    let allParams: Record<string, any> | undefined;
 
     // Go through all configs, and see if the next path segment matches our regex
     for (const config of configs) {
-      if (!config.match) {
+      if (!config.regex) {
         continue;
       }
 
-      const match = remaining.match(config.match);
+      const match = remaining.match(config.regex);
 
       // If our regex matches, we need to extract params from the path
       if (match) {
@@ -129,16 +125,10 @@ export default function getStateFromPath(
           .filter((p) => p.startsWith(':'));
 
         if (paramPatterns.length) {
-          params = paramPatterns.reduce<Record<string, any>>((acc, p, i) => {
+          allParams = paramPatterns.reduce<Record<string, any>>((acc, p, i) => {
-            const key = p.replace(/^:/, '').replace(/\?$/, '');
+            const value = match![(i + 1) * 2].replace(/\//, ''); // The param segments appear every second item starting from 2 in the regex match result
-            const value = match[(i + 1) * 2].replace(/\//, ''); // The param segments appear every second item starting from 2 in the regex match result
 
-            if (value) {
+            acc[p] = value;
-              acc[key] =
-                config.parse && config.parse[key]
-                  ? config.parse[key](value)
-                  : value;
-            }
 
             return acc;
           }, {});
@@ -159,7 +149,46 @@ export default function getStateFromPath(
       remaining = segments.join('/');
     }
 
-    const state = createNestedStateObject(routeNames, initialRoutes, params);
+    const state = createNestedStateObject(
+      routeNames.map((name) => {
+        const config = configs.find((c) => c.screen === name);
+
+        let params: object | undefined;
+
+        if (allParams && config?.path) {
+          const pattern = config.path;
+
+          if (pattern) {
+            const paramPatterns = pattern
+              .split('/')
+              .filter((p) => p.startsWith(':'));
+
+            if (paramPatterns.length) {
+              params = paramPatterns.reduce<Record<string, any>>((acc, p) => {
+                const key = p.replace(/^:/, '').replace(/\?$/, '');
+                const value = allParams![p];
+
+                if (value) {
+                  acc[key] =
+                    config.parse && config.parse[key]
+                      ? config.parse[key](value)
+                      : value;
+                }
+
+                return acc;
+              }, {});
+            }
+          }
+        }
+
+        if (params && Object.keys(params).length) {
+          return { name, params };
+        }
+
+        return { name };
+      }),
+      initialRoutes
+    );
 
     if (current) {
       // The state should be nested inside the deepest route we parsed before
@@ -194,44 +223,65 @@ export default function getStateFromPath(
   return result;
 }
 
-function createNormalizedConfigs(
+const joinPaths = (...paths: string[]): string =>
-  key: string,
+  ([] as string[])
-  routeConfig: Options,
+    .concat(...paths.map((p) => p.split('/')))
+    .filter(Boolean)
+    .join('/');
+
+const createNormalizedConfigs = (
+  screen: string,
+  routeConfig: PathConfig,
   routeNames: string[] = [],
-  initials: InitialRouteConfig[]
+  initials: InitialRouteConfig[],
-): RouteConfig[] {
+  parentPattern?: string
+): RouteConfig[] => {
   const configs: RouteConfig[] = [];
 
-  routeNames.push(key);
+  routeNames.push(screen);
 
-  const value = routeConfig[key];
+  const config = routeConfig[screen];
 
-  if (typeof value === 'string') {
+  if (typeof config === 'string') {
     // If a string is specified as the value of the key(e.g. Foo: '/path'), use it as the pattern
-    configs.push(createConfigItem(key, routeNames, value));
+    const pattern = parentPattern ? joinPaths(parentPattern, config) : config;
-  } else if (typeof value === 'object') {
+
+    configs.push(createConfigItem(screen, routeNames, pattern, config));
+  } else if (typeof config === 'object') {
+    let pattern: string | undefined;
+
     // if an object is specified as the value (e.g. Foo: { ... }),
     // it can have `path` property and
     // it could have `screens` prop which has nested configs
-    if (typeof value.path === 'string') {
+    if (typeof config.path === 'string') {
-      configs.push(createConfigItem(key, routeNames, value.path, value.parse));
+      pattern =
+        config.exact !== true && parentPattern
+          ? joinPaths(parentPattern, config.path)
+          : config.path;
+
+      configs.push(
+        createConfigItem(screen, routeNames, pattern, config.path, config.parse)
+      );
     }
 
-    if (value.screens) {
+    if (config.screens) {
       // property `initialRouteName` without `screens` has no purpose
-      if (value.initialRouteName) {
+      if (config.initialRouteName) {
         initials.push({
-          initialRouteName: value.initialRouteName,
+          initialRouteName: config.initialRouteName,
-          connectedRoutes: Object.keys(value.screens),
+          connectedRoutes: Object.keys(config.screens),
         });
       }
-      Object.keys(value.screens).forEach((nestedConfig) => {
+
+      Object.keys(config.screens).forEach((nestedConfig) => {
         const result = createNormalizedConfigs(
           nestedConfig,
-          value.screens as Options,
+          config.screens as PathConfig,
           routeNames,
-          initials
+          initials,
+          pattern
         );
+
         configs.push(...result);
       });
     }
@@ -240,15 +290,19 @@ function createNormalizedConfigs(
   routeNames.pop();
 
   return configs;
-}
+};
 
-function createConfigItem(
+const createConfigItem = (
   screen: string,
   routeNames: string[],
   pattern: string,
+  path: string,
   parse?: ParseConfig
-): RouteConfig {
+): RouteConfig => {
-  const match = pattern
+  // Normalize pattern to remove any leading, trailing slashes, duplicate slashes etc.
+  pattern = pattern.split('/').filter(Boolean).join('/');
+
+  const regex = pattern
     ? new RegExp(
         `^(${pattern
           .split('/')
@@ -261,35 +315,37 @@ function createConfigItem(
           })
           .join('')})`
       )
-    : null;
+    : undefined;
 
   return {
     screen,
-    match,
+    regex,
     pattern,
+    path,
     // The routeNames array is mutated, so copy it to keep the current state
     routeNames: [...routeNames],
     parse,
   };
-}
+};
 
-function findParseConfigForRoute(
+const findParseConfigForRoute = (
   routeName: string,
   flatConfig: RouteConfig[]
-): ParseConfig | undefined {
+): ParseConfig | undefined => {
   for (const config of flatConfig) {
     if (routeName === config.routeNames[config.routeNames.length - 1]) {
       return config.parse;
     }
   }
-  return undefined;
-}
 
-// tries to find an initial route connected with the one passed
+  return undefined;
-function findInitialRoute(
+};
+
+// Try to find an initial route connected with the one passed
+const findInitialRoute = (
   routeName: string,
   initialRoutes: InitialRouteConfig[]
-): string | undefined {
+): string | undefined => {
   for (const config of initialRoutes) {
     if (config.connectedRoutes.includes(routeName)) {
       return config.initialRouteName === routeName
@@ -298,28 +354,25 @@ function findInitialRoute(
     }
   }
   return undefined;
-}
+};
 
 // returns state object with values depending on whether
 // it is the end of state and if there is initialRoute for this level
-function createStateObject(
+const createStateObject = (
   initialRoute: string | undefined,
   routeName: string,
-  isEmpty: boolean,
+  params: Record<string, any> | undefined,
-  params?: Record<string, any> | undefined
+  isEmpty: boolean
-): InitialState {
+): InitialState => {
   if (isEmpty) {
     if (initialRoute) {
       return {
         index: 1,
-        routes: [
+        routes: [{ name: initialRoute }, { name: routeName as string, params }],
-          { name: initialRoute },
-          { name: routeName as string, ...(params && { params }) },
-        ],
       };
     } else {
       return {
-        routes: [{ name: routeName as string, ...(params && { params }) }],
+        routes: [{ name: routeName as string, params }],
       };
     }
   } else {
@@ -328,53 +381,59 @@ function createStateObject(
         index: 1,
         routes: [
           { name: initialRoute },
-          { name: routeName as string, state: { routes: [] } },
+          { name: routeName as string, params, state: { routes: [] } },
         ],
       };
     } else {
-      return { routes: [{ name: routeName as string, state: { routes: [] } }] };
+      return {
+        routes: [{ name: routeName as string, params, state: { routes: [] } }],
+      };
     }
   }
-}
+};
 
-function createNestedStateObject(
+const createNestedStateObject = (
-  routeNames: string[],
+  routes: { name: string; params?: object }[],
-  initialRoutes: InitialRouteConfig[],
+  initialRoutes: InitialRouteConfig[]
-  params: object | undefined
+) => {
-) {
   let state: InitialState;
-  let routeName = routeNames.shift() as string;
+  let route = routes.shift() as { name: string; params?: object };
-  let initialRoute = findInitialRoute(routeName, initialRoutes);
+  let initialRoute = findInitialRoute(route.name, initialRoutes);
 
   state = createStateObject(
     initialRoute,
-    routeName,
+    route.name,
-    routeNames.length === 0,
+    route.params,
-    params
+    routes.length === 0
   );
 
-  if (routeNames.length > 0) {
+  if (routes.length > 0) {
     let nestedState = state;
 
-    while ((routeName = routeNames.shift() as string)) {
+    while ((route = routes.shift() as { name: string; params?: object })) {
-      initialRoute = findInitialRoute(routeName, initialRoutes);
+      initialRoute = findInitialRoute(route.name, initialRoutes);
-      nestedState.routes[nestedState.index || 0].state = createStateObject(
+
+      const nestedStateIndex =
+        nestedState.index || nestedState.routes.length - 1;
+
+      nestedState.routes[nestedStateIndex].state = createStateObject(
         initialRoute,
-        routeName,
+        route.name,
-        routeNames.length === 0,
+        route.params,
-        params
+        routes.length === 0
       );
-      if (routeNames.length > 0) {
+
-        nestedState = nestedState.routes[nestedState.index || 0]
+      if (routes.length > 0) {
+        nestedState = nestedState.routes[nestedStateIndex]
           .state as InitialState;
       }
     }
   }
 
   return state;
-}
+};
 
-function findFocusedRoute(state: InitialState) {
+const findFocusedRoute = (state: InitialState) => {
   let current: InitialState | undefined = state;
 
   while (current?.routes[current.index || 0].state) {
@@ -387,12 +446,12 @@ function findFocusedRoute(state: InitialState) {
   ];
 
   return route;
-}
+};
 
-function parseQueryParams(
+const parseQueryParams = (
   path: string,
   parseConfig?: Record<string, (value: string) => any>
-) {
+) => {
   const query = path.split('?')[1];
   const params = queryString.parse(query);
 
@@ -405,4 +464,4 @@ function parseQueryParams(
   }
 
   return Object.keys(params).length ? params : undefined;
-}
+};

packages/core/src/types.tsx

@@ -422,6 +422,14 @@ export type NavigationContainerRef = NavigationHelpers<ParamListBase> &
      * Get the rehydrated navigation state of the navigation tree.
      */
     getRootState(): NavigationState;
+    /**
+     * Get the currently focused navigation route.
+     */
+    getCurrentRoute(): Route<string> | undefined;
+    /**
+     * Get the currently focused route's options.
+     */
+    getCurrentOptions(): object | undefined;
   };
 
 export type TypedNavigator<
@@ -462,3 +470,16 @@ export type TypedNavigator<
     _: RouteConfig<ParamList, RouteName, State, ScreenOptions, EventMap>
   ) => null;
 };
+
+export type PathConfig = {
+  [routeName: string]:
+    | string
+    | {
+        path?: string;
+        exact?: boolean;
+        parse?: Record<string, (value: string) => any>;
+        stringify?: Record<string, (value: any) => string>;
+        screens?: PathConfig;
+        initialRouteName?: string;
+      };
+};

packages/core/src/useDescriptors.tsx

@@ -117,22 +117,7 @@ export default function useDescriptors<
       const screen = screens[route.name];
       const navigation = navigations[route.key];
 
-      acc[route.key] = {
+      const routeOptions = {
-        navigation,
-        render() {
-          return (
-            <NavigationBuilderContext.Provider key={route.key} value={context}>
-              <SceneView
-                navigation={navigation}
-                route={route}
-                screen={screen}
-                getState={getState}
-                setState={setState}
-              />
-            </NavigationBuilderContext.Provider>
-          );
-        },
-        options: {
         // The default `screenOptions` passed to the navigator
         ...(typeof screenOptions === 'object' || screenOptions == null
           ? screenOptions
@@ -152,7 +137,25 @@ export default function useDescriptors<
             })),
         // The options set via `navigation.setOptions`
         ...options[route.key],
+      };
+
+      acc[route.key] = {
+        navigation,
+        render() {
+          return (
+            <NavigationBuilderContext.Provider key={route.key} value={context}>
+              <SceneView
+                navigation={navigation}
+                route={route}
+                screen={screen}
+                getState={getState}
+                setState={setState}
+                options={routeOptions}
+              />
+            </NavigationBuilderContext.Provider>
+          );
         },
+        options: routeOptions,
       };
 
       return acc;

packages/core/src/useNavigationBuilder.tsx

@@ -11,7 +11,7 @@ import {
   NavigationAction,
   Route,
 } from '@react-navigation/routers';
-import { NavigationStateContext } from './BaseNavigationContainer';
+import NavigationStateContext from './NavigationStateContext';
 import NavigationRouteContext from './NavigationRouteContext';
 import Screen from './Screen';
 import useEventEmitter from './useEventEmitter';
@@ -264,41 +264,36 @@ export default function useNavigationBuilder<
     getKey,
   } = React.useContext(NavigationStateContext);
 
-  const previousStateRef = React.useRef<
+  const [initializedState, isFirstStateInitialization] = React.useMemo(() => {
-    NavigationState | PartialState<NavigationState> | undefined
-  >();
-  const initializedStateRef = React.useRef<State>();
-
-  let isFirstStateInitialization = false;
-
-  if (
-    initializedStateRef.current === undefined ||
-    currentState !== previousStateRef.current
-  ) {
     // If the current state isn't initialized on first render, we initialize it
     // We also need to re-initialize it if the state passed from parent was changed (maybe due to reset)
     // Otherwise assume that the state was provided as initial state
     // So we need to rehydrate it to make it usable
     if (currentState === undefined || !isStateValid(currentState)) {
-      isFirstStateInitialization = true;
+      return [
-      initializedStateRef.current = router.getInitialState({
+        router.getInitialState({
           routeNames,
           routeParamList,
-      });
+        }),
+        true,
+      ];
     } else {
-      initializedStateRef.current = router.getRehydratedState(
+      return [
-        currentState as PartialState<State>,
+        router.getRehydratedState(currentState as PartialState<State>, {
-        {
           routeNames,
           routeParamList,
+        }),
+        false,
+      ];
     }
-      );
+    // We explicitly don't include routeNames/routeParamList in the dep list
-    }
+    // below. We want to avoid forcing a new state to be calculated in cases
-  }
+    // where routeConfigs change without affecting routeNames/routeParamList.
-
+    // Instead, we handle changes to these in the nextState code below. Note
-  React.useEffect(() => {
+    // that some changes to routeConfigs are explicitly ignored, such as changes
-    previousStateRef.current = currentState;
+    // to initialParams
-  }, [currentState]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [currentState, router, isStateValid]);
 
   let state =
     // If the state isn't initialized, or stale, use the state we initialized instead
@@ -306,7 +301,7 @@ export default function useNavigationBuilder<
     // So it'll be `undefined` or stale untill the first navigation event happens
     isStateInitialized(currentState)
       ? (currentState as State)
-      : (initializedStateRef.current as State);
+      : (initializedState as State);
 
   let nextState: State = state;
 
@@ -374,6 +369,12 @@ export default function useNavigationBuilder<
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  // We initialize this ref here to avoid a new getState getting initialized
+  // whenever initializedState changes. We want getState to have access to the
+  // latest initializedState, but don't need it to change when that happens
+  const initializedStateRef = React.useRef<State>();
+  initializedStateRef.current = initializedState;
+
   const getState = React.useCallback((): State => {
     const currentState = getCurrentState();
 

packages/core/src/useOptionsGetters.tsx

@@ -0,0 +1,70 @@
+import * as React from 'react';
+import NavigationStateContext from './NavigationStateContext';
+import { NavigationState } from '@react-navigation/routers';
+
+export default function useOptionsGetters({
+  key,
+  getOptions,
+  getState,
+}: {
+  key?: string;
+  getOptions?: () => object | undefined;
+  getState?: () => NavigationState;
+}) {
+  const optionsGettersFromChild = React.useRef<
+    Record<string, (() => object | undefined | null) | undefined>
+  >({});
+
+  const { addOptionsGetter: parentAddOptionsGetter } = React.useContext(
+    NavigationStateContext
+  );
+
+  const getOptionsFromListener = React.useCallback(() => {
+    for (let key in optionsGettersFromChild.current) {
+      if (optionsGettersFromChild.current.hasOwnProperty(key)) {
+        const result = optionsGettersFromChild.current[key]?.();
+        // null means unfocused route
+        if (result !== null) {
+          return result;
+        }
+      }
+    }
+    return null;
+  }, []);
+
+  const getCurrentOptions = React.useCallback(() => {
+    if (getState) {
+      const state = getState();
+      if (state.routes[state.index].key !== key) {
+        // null means unfocused route
+        return null;
+      }
+    }
+
+    const optionsFromListener = getOptionsFromListener();
+    if (optionsFromListener !== null) {
+      return optionsFromListener;
+    }
+    return getOptions?.() ?? undefined;
+  }, [getState, getOptionsFromListener, getOptions, key]);
+
+  React.useEffect(() => {
+    return parentAddOptionsGetter?.(key!, getCurrentOptions);
+  }, [getCurrentOptions, parentAddOptionsGetter, key]);
+
+  const addOptionsGetter = React.useCallback(
+    (key: string, getter: () => object | undefined | null) => {
+      optionsGettersFromChild.current[key] = getter;
+
+      return () => {
+        optionsGettersFromChild.current[key] = undefined;
+      };
+    },
+    []
+  );
+
+  return {
+    addOptionsGetter,
+    getCurrentOptions,
+  };
+}

packages/core/src/useSyncState.tsx

@@ -8,6 +8,15 @@ const UNINTIALIZED_STATE = {};
 export default function useSyncState<T>(initialState?: (() => T) | T) {
   const stateRef = React.useRef<T>(UNINTIALIZED_STATE as any);
   const isSchedulingRef = React.useRef(false);
+  const isMountedRef = React.useRef(true);
+
+  React.useEffect(() => {
+    isMountedRef.current = true;
+
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
 
   if (stateRef.current === UNINTIALIZED_STATE) {
     stateRef.current =
@@ -20,7 +29,7 @@ export default function useSyncState<T>(initialState?: (() => T) | T) {
   const getState = React.useCallback(() => stateRef.current, []);
 
   const setState = React.useCallback((state: T) => {
-    if (state === stateRef.current) {
+    if (state === stateRef.current || !isMountedRef.current) {
       return;
     }
 
@@ -42,6 +51,10 @@ export default function useSyncState<T>(initialState?: (() => T) | T) {
   }, []);
 
   const flushUpdates = React.useCallback(() => {
+    if (!isMountedRef.current) {
+      return;
+    }
+
     // Make sure that the tracking state is up-to-date.
     // We call it unconditionally, but React should skip the update if state is unchanged.
     setTrackingState(stateRef.current);

packages/drawer/CHANGELOG.md

@@ -3,6 +3,57 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [5.8.0](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.7...@react-navigation/drawer@5.8.0) (2020-05-23)
+
+
+### Features
+
+* update react-native-safe-area-context to 1.0.0 ([#8182](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/issues/8182)) ([d62fbfe](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/commit/d62fbfe255140f16b182e8b54b276a7c96f2aec6))
+
+
+
+
+
+## [5.7.7](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.6...@react-navigation/drawer@5.7.7) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
+## [5.7.6](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.5...@react-navigation/drawer@5.7.6) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
+## [5.7.5](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.4...@react-navigation/drawer@5.7.5) (2020-05-16)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
+## [5.7.4](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.3...@react-navigation/drawer@5.7.4) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
+## [5.7.3](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.2...@react-navigation/drawer@5.7.3) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/drawer
+
+
+
+
+
 ## [5.7.2](https://github.com/react-navigation/react-navigation/tree/master/packages/drawer/compare/@react-navigation/drawer@5.7.1...@react-navigation/drawer@5.7.2) (2020-05-10)
 
 **Note:** Version bump only for package @react-navigation/drawer

packages/drawer/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/drawer",
   "description": "Drawer navigator component with animated transitions and gesturess",
-  "version": "5.7.2",
+  "version": "5.8.0",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -25,7 +25,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -40,8 +41,8 @@
     "react-native-iphone-x-helper": "^1.2.1"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
-    "@react-navigation/native": "^5.3.0",
+    "@react-navigation/native": "^5.4.3",
     "@types/react": "^16.9.34",
     "@types/react-native": "^0.62.7",
     "del-cli": "^3.0.0",
@@ -49,7 +50,7 @@
     "react-native": "~0.61.5",
     "react-native-gesture-handler": "^1.6.0",
     "react-native-reanimated": "^1.8.0",
-    "react-native-safe-area-context": "^0.7.3",
+    "react-native-safe-area-context": "^1.0.0",
     "react-native-screens": "^2.7.0",
     "typescript": "^3.8.3"
   },

packages/material-bottom-tabs/CHANGELOG.md

@@ -3,6 +3,57 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.8](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.7...@react-navigation/material-bottom-tabs@5.2.8) (2020-05-23)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
+## [5.2.7](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.6...@react-navigation/material-bottom-tabs@5.2.7) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
+## [5.2.6](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.5...@react-navigation/material-bottom-tabs@5.2.6) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
+## [5.2.5](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.4...@react-navigation/material-bottom-tabs@5.2.5) (2020-05-16)
+
+
+### Bug Fixes
+
+* center icons in material tab bar. fixes [#8248](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/issues/8248) ([51b4087](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/commit/51b40879bdb9cea5462a2291955513a88eb87340))
+
+
+
+
+
+## [5.2.4](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.3...@react-navigation/material-bottom-tabs@5.2.4) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
+## [5.2.3](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.2...@react-navigation/material-bottom-tabs@5.2.3) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
 ## [5.2.2](https://github.com/react-navigation/react-navigation/tree/master/packages/material-bottom-tabs/compare/@react-navigation/material-bottom-tabs@5.2.1...@react-navigation/material-bottom-tabs@5.2.2) (2020-05-10)
 
 **Note:** Version bump only for package @react-navigation/material-bottom-tabs

packages/material-bottom-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/material-bottom-tabs",
   "description": "Integration for bottom navigation component from react-native-paper",
-  "version": "5.2.2",
+  "version": "5.2.8",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -25,7 +25,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -36,8 +37,8 @@
     "clean": "del lib"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
-    "@react-navigation/native": "^5.3.0",
+    "@react-navigation/native": "^5.4.3",
     "@types/react": "^16.9.34",
     "@types/react-native": "^0.62.7",
     "@types/react-native-vector-icons": "^6.4.5",

packages/material-bottom-tabs/src/views/MaterialBottomTabView.tsx

@@ -69,6 +69,7 @@ function MaterialBottomTabViewInner({
               borderless: _1,
               centered: _2,
               rippleColor: _3,
+              style,
               ...rest
             }) => {
               return (
@@ -86,6 +87,7 @@ function MaterialBottomTabViewInner({
                       onPress?.(e);
                     }
                   }}
+                  style={[styles.touchable, style]}
                 />
               );
             }
@@ -153,4 +155,8 @@ const styles = StyleSheet.create({
   icon: {
     backgroundColor: 'transparent',
   },
+  touchable: {
+    display: 'flex',
+    justifyContent: 'center',
+  },
 });

packages/material-top-tabs/CHANGELOG.md

@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.8](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.7...@react-navigation/material-top-tabs@5.2.8) (2020-05-23)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
+## [5.2.7](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.6...@react-navigation/material-top-tabs@5.2.7) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
+## [5.2.6](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.5...@react-navigation/material-top-tabs@5.2.6) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
+## [5.2.5](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.4...@react-navigation/material-top-tabs@5.2.5) (2020-05-16)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
+## [5.2.4](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.3...@react-navigation/material-top-tabs@5.2.4) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
+## [5.2.3](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.2...@react-navigation/material-top-tabs@5.2.3) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
 ## [5.2.2](https://github.com/react-navigation/react-navigation/tree/master/packages/material-top-tabs/compare/@react-navigation/material-top-tabs@5.2.1...@react-navigation/material-top-tabs@5.2.2) (2020-05-10)
 
 **Note:** Version bump only for package @react-navigation/material-top-tabs

packages/material-top-tabs/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/material-top-tabs",
   "description": "Integration for the animated tab view component from react-native-tab-view",
-  "version": "5.2.2",
+  "version": "5.2.8",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -25,7 +25,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -39,8 +40,8 @@
     "color": "^3.1.2"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
-    "@react-navigation/native": "^5.3.0",
+    "@react-navigation/native": "^5.4.3",
     "@types/react": "^16.9.34",
     "@types/react-native": "^0.62.7",
     "del-cli": "^3.0.0",

packages/native/CHANGELOG.md

@@ -3,6 +3,62 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.4.3](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.4.2...@react-navigation/native@5.4.3) (2020-05-23)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
+## [5.4.2](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.4.1...@react-navigation/native@5.4.2) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
+## [5.4.1](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.4.0...@react-navigation/native@5.4.1) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
+# [5.4.0](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.3.2...@react-navigation/native@5.4.0) (2020-05-16)
+
+
+### Bug Fixes
+
+* fix types for linking options ([d14f38b](https://github.com/react-navigation/react-navigation/tree/master/packages/native/commit/d14f38b80ad569d5828c1919cea426c659173924))
+
+
+### Features
+
+* add a PathConfig type ([60cb3c9](https://github.com/react-navigation/react-navigation/tree/master/packages/native/commit/60cb3c9ba76d7ef166c9fe8b55f23728975b5b6e))
+
+
+
+
+
+## [5.3.2](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.3.1...@react-navigation/native@5.3.2) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
+## [5.3.1](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.3.0...@react-navigation/native@5.3.1) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
 # [5.3.0](https://github.com/react-navigation/react-navigation/tree/master/packages/native/compare/@react-navigation/native@5.2.6...@react-navigation/native@5.3.0) (2020-05-10)
 
 

packages/native/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/native",
   "description": "React Native integration for React Navigation",
-  "version": "5.3.0",
+  "version": "5.4.3",
   "keywords": [
     "react-native",
     "react-navigation",
@@ -21,7 +21,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -32,10 +33,10 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/core": "^5.5.2"
+    "@react-navigation/core": "^5.8.2"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
     "@types/react": "^16.9.34",
     "@types/react-native": "^0.62.7",
     "del-cli": "^3.0.0",

packages/native/src/types.tsx

@@ -1,6 +1,7 @@
 import {
   getStateFromPath as getStateFromPathDefault,
   getPathFromState as getPathFromStateDefault,
+  PathConfig,
 } from '@react-navigation/core';
 
 export type Theme = {
@@ -39,7 +40,7 @@ export type LinkingOptions = {
    * }
    * ```
    */
-  config?: Parameters<typeof getStateFromPathDefault>[1];
+  config?: PathConfig;
   /**
    * Custom function to parse the URL to a valid navigation state (advanced).
    * Only applicable on Web.

packages/routers/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.4.7](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/compare/@react-navigation/routers@5.4.6...@react-navigation/routers@5.4.7) (2020-05-23)
+
+**Note:** Version bump only for package @react-navigation/routers
+
+
+
+
+
+## [5.4.6](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/compare/@react-navigation/routers@5.4.5...@react-navigation/routers@5.4.6) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/routers
+
+
+
+
+
+## [5.4.5](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/compare/@react-navigation/routers@5.4.4...@react-navigation/routers@5.4.5) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/routers
+
+
+
+
+
 ## [5.4.4](https://github.com/react-navigation/react-navigation/tree/master/packages/routers/compare/@react-navigation/routers@5.4.3...@react-navigation/routers@5.4.4) (2020-05-08)
 
 

packages/routers/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/routers",
   "description": "Routers to help build custom navigators",
-  "version": "5.4.4",
+  "version": "5.4.7",
   "keywords": [
     "react",
     "react-native",
@@ -20,7 +20,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -34,7 +35,7 @@
     "nanoid": "^3.1.5"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
     "del-cli": "^3.0.0",
     "typescript": "^3.8.3"
   },

packages/stack/CHANGELOG.md

@@ -3,6 +3,74 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [5.4.0](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.9...@react-navigation/stack@5.4.0) (2020-05-23)
+
+
+### Bug Fixes
+
+* allow HeaderBackground's subViews to be touchable ([#8314](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/issues/8314)) ([021a911](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/commit/021a9111d76b9b0d940c8829f7caebeb292fec2a))
+* don't ignore previous header heights on layout update ([6dd45fc](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/commit/6dd45fcff98a0c222d120d6f76a37130de45b92f))
+
+
+### Features
+
+* update react-native-safe-area-context to 1.0.0 ([#8182](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/issues/8182)) ([d62fbfe](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/commit/d62fbfe255140f16b182e8b54b276a7c96f2aec6))
+
+
+
+
+
+## [5.3.9](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.8...@react-navigation/stack@5.3.9) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/stack
+
+
+
+
+
+## [5.3.8](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.7...@react-navigation/stack@5.3.8) (2020-05-20)
+
+**Note:** Version bump only for package @react-navigation/stack
+
+
+
+
+
+## [5.3.7](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.6...@react-navigation/stack@5.3.7) (2020-05-16)
+
+**Note:** Version bump only for package @react-navigation/stack
+
+
+
+
+
+## [5.3.6](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.5...@react-navigation/stack@5.3.6) (2020-05-15)
+
+
+### Bug Fixes
+
+* reduce header title margin. fixes [#8267](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/issues/8267) ([d45dbe9](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/commit/d45dbe97dc6625c6a8e80b5e658ab5a95045e5e8))
+
+
+
+
+
+## [5.3.5](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.4...@react-navigation/stack@5.3.5) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/stack
+
+
+
+
+
+## [5.3.4](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.3...@react-navigation/stack@5.3.4) (2020-05-14)
+
+**Note:** Version bump only for package @react-navigation/stack
+
+
+
+
+
 ## [5.3.3](https://github.com/react-navigation/react-navigation/tree/master/packages/stack/compare/@react-navigation/stack@5.3.2...@react-navigation/stack@5.3.3) (2020-05-11)
 
 

packages/stack/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/stack",
   "description": "Stack navigator component for iOS and Android with animated transitions and gestures",
-  "version": "5.3.3",
+  "version": "5.4.0",
   "keywords": [
     "react-native-component",
     "react-component",
@@ -24,7 +24,8 @@
   "types": "lib/typescript/src/index.d.ts",
   "files": [
     "src",
-    "lib"
+    "lib",
+    "!**/__tests__"
   ],
   "sideEffects": false,
   "publishConfig": {
@@ -39,9 +40,9 @@
     "react-native-iphone-x-helper": "^1.2.1"
   },
   "devDependencies": {
-    "@react-native-community/bob": "^0.13.1",
+    "@react-native-community/bob": "^0.14.3",
     "@react-native-community/masked-view": "^0.1.10",
-    "@react-navigation/native": "^5.3.0",
+    "@react-navigation/native": "^5.4.3",
     "@types/color": "^3.0.1",
     "@types/react": "^16.9.34",
     "@types/react-native": "^0.62.7",
@@ -49,7 +50,7 @@
     "react": "~16.9.0",
     "react-native": "~0.61.5",
     "react-native-gesture-handler": "^1.6.0",
-    "react-native-safe-area-context": "^0.7.3",
+    "react-native-safe-area-context": "^1.0.0",
     "react-native-screens": "^2.7.0",
     "typescript": "^3.8.3"
   },

packages/stack/src/views/Header/HeaderSegment.tsx

@@ -355,7 +355,9 @@ export default class HeaderSegment extends React.Component<Props, State> {
                   : {
                       marginHorizontal:
                         (leftButton ? 32 : 16) +
-                        (leftLabelLayout?.width || 0) +
+                        (leftButton && headerBackTitleVisible !== false
+                          ? 40
+                          : 0) +
                         Math.max(insets.left, insets.right),
                     },
                 titleStyle,

packages/stack/src/views/Stack/CardStack.tsx

@@ -299,7 +299,7 @@ export default class CardStack extends React.Component<Props, State> {
           props.insets,
           state.descriptors,
           layout,
-          {}
+          state.headerHeights
         ),
       };
     });

yarn.lock

@@ -3516,10 +3516,10 @@
   dependencies:
     "@types/node" ">= 8"
 
-"@react-native-community/bob@^0.13.1":
+"@react-native-community/bob@^0.14.3":
-  version "0.13.1"
+  version "0.14.3"
-  resolved "https://registry.yarnpkg.com/@react-native-community/bob/-/bob-0.13.1.tgz#188fb72a925751fa92bc5ed543c33ca8ceea9375"
+  resolved "https://registry.yarnpkg.com/@react-native-community/bob/-/bob-0.14.3.tgz#0a8d615f936844d67543d0305e5a2f332fdee630"
-  integrity sha512-MTngPqrasri2B4y9cVvBCrBrwcwt36izS17n4q4Os+eSK10LXT1Rd7imd9r3lRfdVxF90Dgar91W+hbvJRAWLg==
+  integrity sha512-OfE+cpUj558x4NPLCSzfzdwgl+MbG+Tzuc/RXVnPAsO5aYkYQ0slThGPDK1qAIy7LnuSagcOYOQTU640B8WQqA==
   dependencies:
     "@babel/core" "^7.9.6"
     "@babel/plugin-proposal-class-properties" "^7.8.3"
@@ -3527,6 +3527,7 @@
     "@babel/preset-flow" "^7.9.0"
     "@babel/preset-react" "^7.9.4"
     "@babel/preset-typescript" "^7.9.0"
+    browserslist "^4.12.0"
     chalk "^4.0.0"
     cosmiconfig "^6.0.0"
     cross-spawn "^7.0.2"
@@ -5568,7 +5569,7 @@ browserslist@^4.0.0, browserslist@^4.8.3, browserslist@^4.9.1:
     node-releases "^1.1.53"
     pkg-up "^2.0.0"
 
-browserslist@^4.11.1:
+browserslist@^4.11.1, browserslist@^4.12.0:
   version "4.12.0"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.12.0.tgz#06c6d5715a1ede6c51fc39ff67fd647f740b656d"
   integrity sha512-UH2GkcEDSI0k/lRkuDSzFl9ZZ87skSy9w2XAn1MsZnL+4c4rqbBd3e82UWHbYDpztABrPBhZsTEeuxVfHppqDg==
@@ -15265,10 +15266,10 @@ react-native-restart@^0.0.15:
   resolved "https://registry.yarnpkg.com/react-native-restart/-/react-native-restart-0.0.15.tgz#a2dcb26d0a8b14d1ed796b49e27da6d75bba3bba"
   integrity sha512-HkypkbHhcO5rylmMEil7eMwJubaZ4UDE4o3+IWAls9oASnGmal/0s2WATRIHDKtGcMoeJUUfbbbqAzlpOfqiAw==
 
-react-native-safe-area-context@^0.7.3:
+react-native-safe-area-context@^1.0.0:
-  version "0.7.3"
+  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-0.7.3.tgz#ad6bd4abbabe195332c53810e4ce5851eb21aa2a"
+  resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-1.0.0.tgz#8b4d79b06d6a9ed5ff3b2c3f0ba25d85538a3149"
-  integrity sha512-9Uqu1vlXPi+2cKW/CW6OnHxA76mWC4kF3wvlqzq4DY8hn37AeiXtLFs2WkxH4yXQRrnJdP6ivc65Lz+MqwRZAA==
+  integrity sha512-8Poo0FHSS/KE0fP6JUH9Mnjg2KQ5MfZAJN3G8/gW2HoFSypWSfFmDp5msETU0Ix3OnRsmBZTJpmgHFEl9OfNAg==
 
 react-native-safe-area-view@^0.14.9:
   version "0.14.9"