chore: publish

- @react-navigation/bottom-tabs@5.7.3 - @react-navigation/compat@5.2.4 - @react-navigation/core@5.12.2 - @react-navigation/devtools@5.1.4 - @react-navigation/drawer@5.8.7 - @react-navigation/material-bottom-tabs@5.2.15 - @react-navigation/material-top-tabs@5.2.15 - @react-navigation/native@5.7.2 - @react-navigation/routers@5.4.10 - @react-navigation/stack@5.8.0
fix: add accessibilityState property (#8548 )
2026-01-13 09:30:30 +08:00 · 2020-07-28 14:08:02 +02:00 · 2020-07-28 11:28:42 +02:00 · 2020-07-28 11:27:30 +02:00 · 2020-07-28 11:26:45 +02:00 · 2020-07-28 11:20:17 +02:00
33 changed files with 289 additions and 68 deletions
--- a/example/src/Screens/CompatAPI.tsx
+++ b/example/src/Screens/CompatAPI.tsx
@@ -82,7 +82,6 @@ const ArticleScreen: CompatScreenType<StackNavigationProp<
  NestedStackParams,
  'Article'
 >> = ({ navigation }) => {
-  navigation.dangerouslyGetParent();
  return (
    <ScrollView>
      <View style={styles.buttons}>
--- a/packages/bottom-tabs/CHANGELOG.md
+++ b/packages/bottom-tabs/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.7.3](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.7.2...@react-navigation/bottom-tabs@5.7.3) (2020-07-28)
+
+
+### Bug Fixes
+
+* add accessibilityState property ([#8548](https://github.com/react-navigation/react-navigation/issues/8548)) ([ce4eb7e](https://github.com/react-navigation/react-navigation/commit/ce4eb7e9273a25e4433eb82e255a58ba3bf4d632))
+* pass label position flag to label rendering in BottomTabBar ([#8557](https://github.com/react-navigation/react-navigation/issues/8557)) ([baea77e](https://github.com/react-navigation/react-navigation/commit/baea77e3325f0d7e5ce331ad61979a9362dd01fa))
+
+
+
+
+
 ## [5.7.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.7.1...@react-navigation/bottom-tabs@5.7.2) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/bottom-tabs
--- a/packages/bottom-tabs/package.json
+++ b/packages/bottom-tabs/package.json
@@ -1,7 +1,7 @@
 {
  "name": "@react-navigation/bottom-tabs",
  "description": "Bottom tab navigator following iOS design guidelines",
-  "version": "5.7.2",
+  "version": "5.7.3",
  "keywords": [
    "react-native-component",
    "react-component",
@@ -41,7 +41,7 @@
  },
  "devDependencies": {
    "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.1",
+    "@react-navigation/native": "^5.7.2",
    "@types/color": "^3.0.1",
    "@types/react": "^16.9.36",
    "@types/react-native": "^0.62.7",
--- a/packages/bottom-tabs/src/types.tsx
+++ b/packages/bottom-tabs/src/types.tsx
@@ -63,12 +63,16 @@ export type BottomTabNavigationOptions = {

  /**
   * Title string of a tab displayed in the tab bar
-   * or a function that given { focused: boolean, color: string } returns a React.Node to display in tab bar.
+   * or a function that given { focused: boolean, color: string, position: 'below-icon' | 'beside-icon' } returns a React.Node to display in tab bar.
   * When undefined, scene title is used. To hide, see tabBarOptions.showLabel in the previous section.
   */
  tabBarLabel?:
    | string
-    | ((props: { focused: boolean; color: string }) => React.ReactNode);
+    | ((props: {
+        focused: boolean;
+        color: string;
+        position: LabelPosition;
+      }) => React.ReactNode);

  /**
   * A function that given { focused: boolean, color: string } returns a React.Node to display in the tab bar.
@@ -183,7 +187,8 @@ export type BottomTabBarOptions = {
  tabStyle?: StyleProp<ViewStyle>;
  /**
   * Whether the label is rendered below the icon or beside the icon.
-   * By default, in `vertical` orientation, label is rendered below and in `horizontal` orientation, it's rendered beside.
+   * By default, the position is chosen automatically based on device width.
+   * In `below-icon` orientation (typical for iPhones), the label is rendered below and in `beside-icon` orientation, it's rendered beside (typical for iPad).
   */
  labelPosition?: LabelPosition;
  /**
--- a/packages/bottom-tabs/src/views/BottomTabItem.tsx
+++ b/packages/bottom-tabs/src/views/BottomTabItem.tsx
@@ -14,7 +14,7 @@ import { Link, Route, useTheme } from '@react-navigation/native';
 import Color from 'color';

 import TabBarIcon from './TabBarIcon';
-import type { BottomTabBarButtonProps } from '../types';
+import type { BottomTabBarButtonProps, LabelPosition } from '../types';

 type Props = {
  /**
@@ -30,7 +30,11 @@ type Props = {
   */
  label:
    | string
-    | ((props: { focused: boolean; color: string }) => React.ReactNode);
+    | ((props: {
+        focused: boolean;
+        color: string;
+        position: LabelPosition;
+      }) => React.ReactNode);
  /**
   * Icon to display for the tab.
   */
@@ -211,7 +215,11 @@ export default function BottomTabBarItem({
      );
    }

-    return label({ focused, color });
+    return label({
+      focused,
+      color,
+      position: horizontal ? 'beside-icon' : 'below-icon',
+    });
  };

  const renderIcon = ({ focused }: { focused: boolean }) => {
@@ -250,6 +258,7 @@ export default function BottomTabBarItem({
    testID,
    accessibilityLabel,
    accessibilityRole: 'button',
+    accessibilityState: { selected: focused },
    accessibilityStates: focused ? ['selected'] : [],
    style: [
      styles.tab,
--- a/packages/compat/CHANGELOG.md
+++ b/packages/compat/CHANGELOG.md
@@ -3,6 +3,36 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.2.4](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.2.3...@react-navigation/compat@5.2.4) (2020-07-28)
+
+**Note:** Version bump only for package @react-navigation/compat
+
+
+
+
+
+## [5.2.3](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.2.1...@react-navigation/compat@5.2.3) (2020-07-22)
+
+
+### Bug Fixes
+
+* fix false warning due to change in Object.assign in metro preset ([5e358b3](https://github.com/react-navigation/react-navigation/commit/5e358b3aadac7bb186521872d515fff2e571a940)), closes [#8584](https://github.com/react-navigation/react-navigation/issues/8584)
+
+
+
+
+
+## [5.2.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.2.1...@react-navigation/compat@5.2.2) (2020-07-22)
+
+
+### Bug Fixes
+
+* fix false warning due to change in Object.assign in metro preset ([240a706](https://github.com/react-navigation/react-navigation/commit/240a706a56220b63d603a52407a738c2872349dd)), closes [#8584](https://github.com/react-navigation/react-navigation/issues/8584)
+
+
+
+
+
 ## [5.2.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.2.0...@react-navigation/compat@5.2.1) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/compat
--- a/packages/compat/package.json
+++ b/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.2.1",
+  "version": "5.2.4",
  "license": "MIT",
  "repository": {
    "type": "git",
@@ -32,7 +32,7 @@
  },
  "devDependencies": {
    "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.1",
+    "@react-navigation/native": "^5.7.2",
    "@types/react": "^16.9.36",
    "react": "~16.9.0",
    "typescript": "^3.9.5"
--- a/packages/compat/src/createCompatNavigationProp.tsx
+++ b/packages/compat/src/createCompatNavigationProp.tsx
@@ -143,9 +143,12 @@ export default function createCompatNavigationProp<
      }
    },
    state: {
-      ...state,
+      // @ts-expect-error: these properties may actually exist
+      key: state.key,
      // @ts-expect-error
      routeName: state.name,
+      // @ts-expect-error
+      params: state.params ?? {},
      get index() {
        // @ts-expect-error
        if (state.index !== undefined) {
@@ -154,11 +157,11 @@ export default function createCompatNavigationProp<
        }

        console.warn(
-          "Accessing child navigation state for a route is not safe and won't work correctly."
+          "Looks like you are using 'navigation.state.index' in your code. Accessing child navigation state for a route is not safe and won't work correctly. You should refactor it not to access the 'index' property in the child navigation state."
        );

        // @ts-expect-error
-        return state.state ? state.state.index : undefined;
+        return state.state?.index;
      },
      get routes() {
        // @ts-expect-error
@@ -168,11 +171,11 @@ export default function createCompatNavigationProp<
        }

        console.warn(
-          "Accessing child navigation state for a route is not safe and won't work correctly."
+          "Looks like you are using 'navigation.state.routes' in your code. Accessing child navigation state for a route is not safe and won't work correctly. You should refactor it not to access the 'routes' property in the child navigation state."
        );

        // @ts-expect-error
-        return state.state ? state.state.routes : undefined;
+        return state.state?.routes;
      },
    },
    getParam<T extends keyof ParamList>(
--- a/packages/core/CHANGELOG.md
+++ b/packages/core/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.12.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/core@5.12.1...@react-navigation/core@5.12.2) (2020-07-28)
+
+**Note:** Version bump only for package @react-navigation/core
+
+
+
+
+
 ## [5.12.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/core@5.12.0...@react-navigation/core@5.12.1) (2020-07-19)


--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,7 +1,7 @@
 {
  "name": "@react-navigation/core",
  "description": "Core utilities for building navigators",
-  "version": "5.12.1",
+  "version": "5.12.2",
  "keywords": [
    "react",
    "react-native",
@@ -35,7 +35,7 @@
    "clean": "del lib"
  },
  "dependencies": {
-    "@react-navigation/routers": "^5.4.9",
+    "@react-navigation/routers": "^5.4.10",
    "escape-string-regexp": "^4.0.0",
    "nanoid": "^3.1.9",
    "query-string": "^6.13.1",
--- a/packages/devtools/CHANGELOG.md
+++ b/packages/devtools/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.1.4](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@5.1.3...@react-navigation/devtools@5.1.4) (2020-07-28)
+
+**Note:** Version bump only for package @react-navigation/devtools
+
+
+
+
+
 ## [5.1.3](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@5.1.2...@react-navigation/devtools@5.1.3) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/devtools
--- a/packages/devtools/package.json
+++ b/packages/devtools/package.json
@@ -1,7 +1,7 @@
 {
  "name": "@react-navigation/devtools",
  "description": "Developer tools for React Navigation",
-  "version": "5.1.3",
+  "version": "5.1.4",
  "keywords": [
    "react",
    "react-native",
@@ -36,7 +36,7 @@
    "clean": "del lib"
  },
  "dependencies": {
-    "@react-navigation/core": "^5.12.1",
+    "@react-navigation/core": "^5.12.2",
    "deep-equal": "^2.0.3"
  },
  "devDependencies": {
--- a/packages/drawer/CHANGELOG.md
+++ b/packages/drawer/CHANGELOG.md
@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.8.7](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@5.8.6...@react-navigation/drawer@5.8.7) (2020-07-28)
+
+
+### Bug Fixes
+
+* add accessibilityState property ([#8548](https://github.com/react-navigation/react-navigation/issues/8548)) ([ce4eb7e](https://github.com/react-navigation/react-navigation/commit/ce4eb7e9273a25e4433eb82e255a58ba3bf4d632))
+
+
+
+
+
 ## [5.8.6](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@5.8.5...@react-navigation/drawer@5.8.6) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/drawer
--- a/packages/drawer/package.json
+++ b/packages/drawer/package.json
@@ -1,7 +1,7 @@
 {
  "name": "@react-navigation/drawer",
  "description": "Drawer navigator component with animated transitions and gesturess",
-  "version": "5.8.6",
+  "version": "5.8.7",
  "keywords": [
    "react-native-component",
    "react-component",
@@ -46,7 +46,7 @@
  },
  "devDependencies": {
    "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.1",
+    "@react-navigation/native": "^5.7.2",
    "@types/react": "^16.9.36",
    "@types/react-native": "^0.62.7",
    "del-cli": "^3.0.1",
--- a/packages/drawer/src/views/DrawerItem.tsx
+++ b/packages/drawer/src/views/DrawerItem.tsx
@@ -156,6 +156,7 @@ export default function DrawerItem(props: Props) {
        accessibilityTraits={focused ? ['button', 'selected'] : 'button'}
        accessibilityComponentType="button"
        accessibilityRole="button"
+        accessibilityState={{ selected: focused }}
        accessibilityStates={focused ? ['selected'] : []}
        to={to}
      >
--- a/packages/material-bottom-tabs/CHANGELOG.md
+++ b/packages/material-bottom-tabs/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.2.15](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-bottom-tabs@5.2.14...@react-navigation/material-bottom-tabs@5.2.15) (2020-07-28)
+
+**Note:** Version bump only for package @react-navigation/material-bottom-tabs
+
+
+
+
+
 ## [5.2.14](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-bottom-tabs@5.2.13...@react-navigation/material-bottom-tabs@5.2.14) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/material-bottom-tabs
--- a/packages/material-bottom-tabs/package.json
+++ b/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.14",
+  "version": "5.2.15",
  "keywords": [
    "react-native-component",
    "react-component",
@@ -42,7 +42,7 @@
  },
  "devDependencies": {
    "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.1",
+    "@react-navigation/native": "^5.7.2",
    "@types/react": "^16.9.36",
    "@types/react-native": "^0.62.7",
    "@types/react-native-vector-icons": "^6.4.5",
--- a/packages/material-top-tabs/CHANGELOG.md
+++ b/packages/material-top-tabs/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.2.15](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-top-tabs@5.2.14...@react-navigation/material-top-tabs@5.2.15) (2020-07-28)
+
+**Note:** Version bump only for package @react-navigation/material-top-tabs
+
+
+
+
+
 ## [5.2.14](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-top-tabs@5.2.13...@react-navigation/material-top-tabs@5.2.14) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/material-top-tabs
--- a/packages/material-top-tabs/package.json
+++ b/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.14",
+  "version": "5.2.15",
  "keywords": [
    "react-native-component",
    "react-component",
@@ -45,7 +45,7 @@
  },
  "devDependencies": {
    "@react-native-community/bob": "^0.15.1",
-    "@react-navigation/native": "^5.7.1",
+    "@react-navigation/native": "^5.7.2",
    "@types/react": "^16.9.36",
    "@types/react-native": "^0.62.7",
    "del-cli": "^3.0.1",
--- a/packages/native/CHANGELOG.md
+++ b/packages/native/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.7.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native@5.7.1...@react-navigation/native@5.7.2) (2020-07-28)
+
+**Note:** Version bump only for package @react-navigation/native
+
+
+
+
+
 ## [5.7.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native@5.7.0...@react-navigation/native@5.7.1) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/native
--- a/packages/native/package.json
+++ b/packages/native/package.json
@@ -1,7 +1,7 @@
 {
  "name": "@react-navigation/native",
  "description": "React Native integration for React Navigation",
-  "version": "5.7.1",
+  "version": "5.7.2",
  "keywords": [
    "react-native",
    "react-navigation",
@@ -37,7 +37,7 @@
    "clean": "del lib"
  },
  "dependencies": {
-    "@react-navigation/core": "^5.12.1",
+    "@react-navigation/core": "^5.12.2",
    "nanoid": "^3.1.9"
  },
  "devDependencies": {
--- a/packages/routers/CHANGELOG.md
+++ b/packages/routers/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [5.4.10](https://github.com/react-navigation/react-navigation/compare/@react-navigation/routers@5.4.9...@react-navigation/routers@5.4.10) (2020-07-28)
+
+
+### Bug Fixes
+
+* make sure history is correct after rehydration ([b70e3fe](https://github.com/react-navigation/react-navigation/commit/b70e3fe61852502322b2cb46c5934800462b0267))
+* make sure index is correct when rehydrating state for tabs ([#8638](https://github.com/react-navigation/react-navigation/issues/8638)) ([1aa8219](https://github.com/react-navigation/react-navigation/commit/1aa8219021f6c231a3e150fc9bea73f12542f85c))
+
+
+
+
+
 ## [5.4.9](https://github.com/react-navigation/react-navigation/compare/@react-navigation/routers@5.4.8...@react-navigation/routers@5.4.9) (2020-07-10)


--- a/packages/routers/package.json
+++ b/packages/routers/package.json
@@ -1,7 +1,7 @@
 {
  "name": "@react-navigation/routers",
  "description": "Routers to help build custom navigators",
-  "version": "5.4.9",
+  "version": "5.4.10",
  "keywords": [
    "react",
    "react-native",
--- a/packages/routers/src/TabRouter.tsx
+++ b/packages/routers/src/TabRouter.tsx
@@ -196,37 +196,28 @@ export default function TabRouter({
      });

      const index = Math.min(
-        Math.max(
-          typeof state.index === 'number'
-            ? state.index
-            : routeNames.indexOf(state.routes[0].name),
-          0
-        ),
+        Math.max(routeNames.indexOf(state.routes[state?.index ?? 0]?.name), 0),
        routes.length - 1
      );

-      let history = state.history?.filter((it) =>
-        routes.find((r) => r.key === it.key)
-      );
+      const history =
+        state.history?.filter((it) => routes.find((r) => r.key === it.key)) ??
+        [];

-      if (!history?.length) {
-        history = getRouteHistory(
-          routes,
+      return changeIndex(
+        {
+          stale: false,
+          type: 'tab',
+          key: `tab-${nanoid()}`,
          index,
-          backBehavior,
-          initialRouteName
-        );
-      }
-
-      return {
-        stale: false,
-        type: 'tab',
-        key: `tab-${nanoid()}`,
+          routeNames,
+          history,
+          routes,
+        },
        index,
-        routeNames,
-        history,
-        routes,
-      };
+        backBehavior,
+        initialRouteName
+      );
    },

    getStateForRouteNamesChange(state, { routeNames, routeParamList }) {
--- a/packages/routers/src/tests/DrawerRouter.test.tsx
+++ b/packages/routers/src/tests/DrawerRouter.test.tsx
@@ -150,7 +150,7 @@ it('gets rehydrated state from partial state', () => {
      options
    )
  ).toEqual({
-    index: 2,
+    index: 0,
    key: 'drawer-test',
    routeNames: ['bar', 'baz', 'qux'],
    routes: [
@@ -158,7 +158,7 @@ it('gets rehydrated state from partial state', () => {
      { key: 'baz-test', name: 'baz', params: { answer: 42 } },
      { key: 'qux-test', name: 'qux', params: { name: 'Jane' } },
    ],
-    history: [{ type: 'route', key: 'qux-test' }],
+    history: [{ type: 'route', key: 'bar-test' }],
    stale: false,
    type: 'drawer',
  });
@@ -178,7 +178,7 @@ it('gets rehydrated state from partial state', () => {
      options
    )
  ).toEqual({
-    index: 1,
+    index: 0,
    key: 'drawer-test',
    routeNames: ['bar', 'baz', 'qux'],
    routes: [
@@ -187,8 +187,8 @@ it('gets rehydrated state from partial state', () => {
      { key: 'qux-test', name: 'qux', params: { name: 'Jane' } },
    ],
    history: [
-      { type: 'route', key: 'bar-test' },
      { type: 'route', key: 'qux-test' },
+      { type: 'route', key: 'bar-test' },
      { type: 'drawer' },
    ],
    stale: false,
--- a/packages/routers/src/tests/TabRouter.test.tsx
+++ b/packages/routers/src/tests/TabRouter.test.tsx
@@ -139,8 +139,11 @@ it('gets rehydrated state from partial state', () => {
  expect(
    router.getRehydratedState(
      {
-        index: 4,
-        routes: [],
+        index: 1,
+        routes: [
+          { key: 'bar-0', name: 'bar' },
+          { key: 'qux-2', name: 'qux' },
+        ],
      },
      options
    )
@@ -148,12 +151,34 @@ it('gets rehydrated state from partial state', () => {
    index: 2,
    key: 'tab-test',
    routeNames: ['bar', 'baz', 'qux'],
+    routes: [
+      { key: 'bar-0', name: 'bar' },
+      { key: 'baz-test', name: 'baz', params: { answer: 42 } },
+      { key: 'qux-2', name: 'qux', params: { name: 'Jane' } },
+    ],
+    history: [{ type: 'route', key: 'qux-2' }],
+    stale: false,
+    type: 'tab',
+  });
+
+  expect(
+    router.getRehydratedState(
+      {
+        index: 4,
+        routes: [],
+      },
+      options
+    )
+  ).toEqual({
+    index: 0,
+    key: 'tab-test',
+    routeNames: ['bar', 'baz', 'qux'],
    routes: [
      { key: 'bar-test', name: 'bar' },
      { key: 'baz-test', name: 'baz', params: { answer: 42 } },
      { key: 'qux-test', name: 'qux', params: { name: 'Jane' } },
    ],
-    history: [{ type: 'route', key: 'qux-test' }],
+    history: [{ type: 'route', key: 'bar-test' }],
    stale: false,
    type: 'tab',
  });
@@ -172,7 +197,7 @@ it('gets rehydrated state from partial state', () => {
      options
    )
  ).toEqual({
-    index: 1,
+    index: 0,
    key: 'tab-test',
    routeNames: ['bar', 'baz', 'qux'],
    routes: [
@@ -181,8 +206,8 @@ it('gets rehydrated state from partial state', () => {
      { key: 'qux-test', name: 'qux', params: { name: 'Jane' } },
    ],
    history: [
-      { type: 'route', key: 'bar-test' },
      { type: 'route', key: 'qux-test' },
+      { type: 'route', key: 'bar-test' },
    ],
    stale: false,
    type: 'tab',
--- a/packages/stack/CHANGELOG.md
+++ b/packages/stack/CHANGELOG.md
@@ -3,6 +3,18 @@
 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/compare/@react-navigation/stack@5.7.1...@react-navigation/stack@5.8.0) (2020-07-28)
+
+
+### Features
+
+* allow style overrides for HeaderBackButton ([#8626](https://github.com/react-navigation/react-navigation/issues/8626)) ([486c3de](https://github.com/react-navigation/react-navigation/commit/486c3defd27592bf4170af4962a1c66f4710b17a))
+* emit gesture navigation events from stack view ([#8524](https://github.com/react-navigation/react-navigation/issues/8524)) ([15f9b95](https://github.com/react-navigation/react-navigation/commit/15f9b9573e52666f88b0f917396496b03218f160))
+
+
+
+
+
 ## [5.7.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@5.7.0...@react-navigation/stack@5.7.1) (2020-07-19)

 **Note:** Version bump only for package @react-navigation/stack
--- a/packages/stack/package.json
+++ b/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.7.1",
+  "version": "5.8.0",
  "keywords": [
    "react-native-component",
    "react-component",
@@ -46,7 +46,7 @@
  "devDependencies": {
    "@react-native-community/bob": "^0.15.1",
    "@react-native-community/masked-view": "^0.1.10",
-    "@react-navigation/native": "^5.7.1",
+    "@react-navigation/native": "^5.7.2",
    "@types/color": "^3.0.1",
    "@types/react": "^16.9.36",
    "@types/react-native": "^0.62.7",
--- a/packages/stack/src/types.tsx
+++ b/packages/stack/src/types.tsx
@@ -27,6 +27,18 @@ export type StackNavigationEventMap = {
   * Event which fires when a transition animation ends.
   */
  transitionEnd: { data: { closing: boolean } };
+  /**
+   * Event which fires when navigation gesture starts.
+   */
+  gestureStart: { data: undefined };
+  /**
+   * Event which fires when navigation gesture is completed.
+   */
+  gestureEnd: { data: undefined };
+  /**
+   * Event which fires when navigation gesture is canceled.
+   */
+  gestureCancel: { data: undefined };
 };

 export type StackNavigationHelpers = NavigationHelpers<
@@ -406,6 +418,10 @@ export type StackHeaderLeftButtonProps = {
   * Accessibility label for the button for screen readers.
   */
  accessibilityLabel?: string;
+  /**
+   * Style object for the button.
+   */
+  style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
 };

 export type StackHeaderTitleProps = {
--- a/packages/stack/src/views/Header/HeaderBackButton.tsx
+++ b/packages/stack/src/views/Header/HeaderBackButton.tsx
@@ -30,6 +30,7 @@ export default function HeaderBackButton({
  titleLayout,
  truncatedLabel = 'Back',
  accessibilityLabel = label && label !== 'Back' ? `${label}, back` : 'Go back',
+  style,
 }: Props) {
  const { dark, colors } = useTheme();

@@ -160,7 +161,7 @@ export default function HeaderBackButton({
      delayPressIn={0}
      onPress={disabled ? undefined : handlePress}
      pressColor={pressColorAndroid}
-      style={[styles.container, disabled && styles.disabled]}
+      style={[styles.container, disabled && styles.disabled, style]}
      hitSlop={Platform.select({
        ios: undefined,
        default: { top: 16, right: 16, bottom: 16, left: 16 },
--- a/packages/stack/src/views/Stack/CardContainer.tsx
+++ b/packages/stack/src/views/Stack/CardContainer.tsx
@@ -46,6 +46,9 @@ type Props = TransitionPreset & {
  onPageChangeStart?: () => void;
  onPageChangeConfirm?: () => void;
  onPageChangeCancel?: () => void;
+  onGestureStart?: (props: { route: Route<string> }) => void;
+  onGestureEnd?: (props: { route: Route<string> }) => void;
+  onGestureCancel?: (props: { route: Route<string> }) => void;
  gestureEnabled?: boolean;
  gestureResponseDistance?: {
    vertical?: number;
@@ -95,6 +98,9 @@ function CardContainer({
  onPageChangeCancel,
  onPageChangeConfirm,
  onPageChangeStart,
+  onGestureCancel,
+  onGestureEnd,
+  onGestureStart,
  onTransitionEnd,
  onTransitionStart,
  renderHeader,
@@ -120,6 +126,20 @@ function CardContainer({
    onCloseRoute({ route: scene.route });
  };

+  const handleGestureBegin = () => {
+    onPageChangeStart?.();
+    onGestureStart?.({ route: scene.route });
+  };
+
+  const handleGestureCanceled = () => {
+    onPageChangeCancel?.();
+    onGestureCancel?.({ route: scene.route });
+  };
+
+  const handleGestureEnd = () => {
+    onGestureEnd?.({ route: scene.route });
+  };
+
  const handleTransitionStart = ({ closing }: { closing: boolean }) => {
    if (active && closing) {
      onPageChangeConfirm?.();
@@ -179,8 +199,9 @@ function CardContainer({
      overlayEnabled={cardOverlayEnabled}
      shadowEnabled={cardShadowEnabled}
      onTransitionStart={handleTransitionStart}
-      onGestureBegin={onPageChangeStart}
-      onGestureCanceled={onPageChangeCancel}
+      onGestureBegin={handleGestureBegin}
+      onGestureCanceled={handleGestureCanceled}
+      onGestureEnd={handleGestureEnd}
      gestureEnabled={gestureEnabled}
      gestureResponseDistance={gestureResponseDistance}
      gestureVelocityImpact={gestureVelocityImpact}
--- a/packages/stack/src/views/Stack/CardStack.tsx
+++ b/packages/stack/src/views/Stack/CardStack.tsx
@@ -60,6 +60,9 @@ type Props = {
  onPageChangeStart?: () => void;
  onPageChangeConfirm?: () => void;
  onPageChangeCancel?: () => void;
+  onGestureStart?: (props: { route: Route<string> }) => void;
+  onGestureEnd?: (props: { route: Route<string> }) => void;
+  onGestureCancel?: (props: { route: Route<string> }) => void;
 };

 type State = {
@@ -372,6 +375,9 @@ export default class CardStack extends React.Component<Props, State> {
      onPageChangeStart,
      onPageChangeConfirm,
      onPageChangeCancel,
+      onGestureStart,
+      onGestureEnd,
+      onGestureCancel,
    } = this.props;

    const { scenes, layout, gestures, headerHeights } = this.state;
@@ -568,6 +574,9 @@ export default class CardStack extends React.Component<Props, State> {
                        onPageChangeStart={onPageChangeStart}
                        onPageChangeConfirm={onPageChangeConfirm}
                        onPageChangeCancel={onPageChangeCancel}
+                        onGestureStart={onGestureStart}
+                        onGestureCancel={onGestureCancel}
+                        onGestureEnd={onGestureEnd}
                        gestureResponseDistance={gestureResponseDistance}
                        headerHeight={headerHeight}
                        onHeaderHeightChange={this.handleHeaderLayout}
--- a/packages/stack/src/views/Stack/StackView.tsx
+++ b/packages/stack/src/views/Stack/StackView.tsx
@@ -405,6 +405,27 @@ export default class StackView extends React.Component<Props, State> {
      target: route.key,
    });

+  private handleGestureStart = ({ route }: { route: Route<string> }) => {
+    this.props.navigation.emit({
+      type: 'gestureStart',
+      target: route.key,
+    });
+  };
+
+  private handleGestureEnd = ({ route }: { route: Route<string> }) => {
+    this.props.navigation.emit({
+      type: 'gestureEnd',
+      target: route.key,
+    });
+  };
+
+  private handleGestureCancel = ({ route }: { route: Route<string> }) => {
+    this.props.navigation.emit({
+      type: 'gestureCancel',
+      target: route.key,
+    });
+  };
+
  render() {
    const {
      state,
@@ -451,6 +472,9 @@ export default class StackView extends React.Component<Props, State> {
                      headerMode={headerMode}
                      state={state}
                      descriptors={descriptors}
+                      onGestureStart={this.handleGestureStart}
+                      onGestureEnd={this.handleGestureEnd}
+                      onGestureCancel={this.handleGestureCancel}
                      {...rest}
                      {...props}
                    />
Author	SHA1	Message	Date
Satyajit Sahoo	1e813dfb5b	chore: publish - @react-navigation/bottom-tabs@5.7.3 - @react-navigation/compat@5.2.4 - @react-navigation/core@5.12.2 - @react-navigation/devtools@5.1.4 - @react-navigation/drawer@5.8.7 - @react-navigation/material-bottom-tabs@5.2.15 - @react-navigation/material-top-tabs@5.2.15 - @react-navigation/native@5.7.2 - @react-navigation/routers@5.4.10 - @react-navigation/stack@5.8.0	2020-07-28 14:08:02 +02:00
Simon Arm-Riding	ce4eb7e927	fix: add accessibilityState property (#8548 ) React Native 0.62 removes the deprecated `accessibilityStates` property and replaces it with an `accessibilityState` object instead. This PR adds the new property where needed, but leaves the old one in place for backwards compatibility. Without the change, the selected tab in BottomTabNavigator isn't announced properly in VoiceOver.	2020-07-28 11:28:42 +02:00
Madd.is	baea77e332	fix: pass label position flag to label rendering in BottomTabBar (#8557 ) In the process of upgrading from v4, I noticed a regression. In the past, the function form of `tabBarLabel` did get an `orientation: 'landscape' \| 'portrait'`, this is no longer the case. However, when using a custom Text rendering, we need to apply a margin to the text in horizontal mode. Since the orientation/horizontal state is decided based on internal heuristics, It is a huge pain with a high bug potential when reimplementing that detection myself.	2020-07-28 11:27:30 +02:00
Martin Treurnicht	15f9b9573e	feat: emit gesture navigation events from stack view (#8524 ) Allows you to subscribe to gesture navigation events, we have a custom keyboard that we want to hide and show when gesture is being used to navigate (same as native keyboard)	2020-07-28 11:26:45 +02:00
Satyajit Sahoo	b70e3fe618	fix: make sure history is correct after rehydration	2020-07-28 11:20:17 +02:00
Tomasz Krzyżowski	1aa8219021	fix: make sure index is correct when rehydrating state for tabs (#8638 ) If the state being rehydrated contained multiple `routes` and had an `index`, we incorrectly kept the same index even if the index of the focused route changed in the state after rehydration. This commit ensures that we also adjust the index appropriately according to the new index of the focused route.	2020-07-28 11:13:01 +02:00
Andrei Barabas	486c3defd2	feat: allow style overrides for HeaderBackButton (#8626 )	2020-07-28 11:09:23 +02:00
Satyajit Sahoo	0d6a43f663	chore: publish - @react-navigation/compat@5.2.3	2020-07-22 03:07:54 +02:00
Satyajit Sahoo	5e358b3aad	fix: fix false warning due to change in Object.assign in metro preset #8584	2020-07-22 03:06:55 +02:00