chore: publish

- @react-navigation/bottom-tabs@5.0.0-alpha.30
 - @react-navigation/drawer@5.0.0-alpha.32

packages/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.0.0-alpha.30](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/bottom-tabs@5.0.0-alpha.29...@react-navigation/bottom-tabs@5.0.0-alpha.30) (2020-01-03)
+
+**Note:** Version bump only for package @react-navigation/bottom-tabs
+
+
+
+
+
 # [5.0.0-alpha.29](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/bottom-tabs@5.0.0-alpha.28...@react-navigation/bottom-tabs@5.0.0-alpha.29) (2020-01-01)
 
 **Note:** Version bump only for package @react-navigation/bottom-tabs

packages/bottom-tabs/package.json

@@ -10,7 +10,7 @@
     "android",
     "tab"
   ],
-  "version": "5.0.0-alpha.29",
+  "version": "5.0.0-alpha.30",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -51,7 +51,7 @@
     "@react-navigation/native": "^5.0.0-alpha.0",
     "react": "*",
     "react-native": "*",
-    "react-native-safe-area-context": "^0.3.6"
+    "react-native-safe-area-context": "^0.6.0"
   },
   "@react-native-community/bob": {
     "source": "src",

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.0.0-alpha.32](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/drawer@5.0.0-alpha.31...@react-navigation/drawer@5.0.0-alpha.32) (2020-01-03)
+
+
+### Bug Fixes
+
+* pass backBehavior to the router in drawer. fixes [#230](https://github.com/react-navigation/navigation-ex/issues/230) ([3cd1aed](https://github.com/react-navigation/navigation-ex/commit/3cd1aedcf490a4c7962b2d36873d714637f3b9b0))
+
+
+
+
+
 # [5.0.0-alpha.31](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/drawer@5.0.0-alpha.30...@react-navigation/drawer@5.0.0-alpha.31) (2020-01-01)
 
 **Note:** Version bump only for package @react-navigation/drawer

packages/drawer/package.json

@@ -11,7 +11,7 @@
     "material",
     "drawer"
   ],
-  "version": "5.0.0-alpha.31",
+  "version": "5.0.0-alpha.32",
   "license": "MIT",
   "repository": {
     "type": "git",

packages/drawer/src/navigators/createDrawerNavigator.tsx

@@ -23,6 +23,7 @@ type Props = DefaultNavigatorOptions<DrawerNavigationOptions> &
 
 function DrawerNavigator({
   initialRouteName,
+  backBehavior,
   children,
   screenOptions,
   ...rest
@@ -34,6 +35,7 @@ function DrawerNavigator({
     DrawerNavigationEventMap
   >(DrawerRouter, {
     initialRouteName,
+    backBehavior,
     children,
     screenOptions,
   });

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.0.0-alpha.48](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/stack@5.0.0-alpha.47...@react-navigation/stack@5.0.0-alpha.48) (2020-01-01)
+
+
+### Bug Fixes
+
+* improve gesture performance ([59803f5](https://github.com/react-navigation/navigation-ex/commit/59803f54d64f85c8e46c1ebc70613a70a812f53a))
+* use native driver for gestures ([9356598](https://github.com/react-navigation/navigation-ex/commit/935659899f1d4084c601fbefea4a935f9b6ce087))
+
+
+
+
+
 # [5.0.0-alpha.47](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/stack@5.0.0-alpha.46...@react-navigation/stack@5.0.0-alpha.47) (2020-01-01)
 
 **Note:** Version bump only for package @react-navigation/stack

packages/stack/package.json

@@ -10,7 +10,7 @@
     "android",
     "stack"
   ],
-  "version": "5.0.0-alpha.47",
+  "version": "5.0.0-alpha.48",
   "license": "MIT",
   "repository": {
     "type": "git",

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

@@ -105,6 +105,11 @@ export default class Card extends React.Component<Props> {
     if (
       this.getAnimateToValue(this.props) !== this.getAnimateToValue(prevProps)
     ) {
+      // We need to trigger the animation when route was closed
+      // Thr route might have been closed by a `POP` action or by a gesture
+      // When route was closed due to a gesture, the animation would've happened already
+      // It's still important to trigger the animation so that `onClose` is called
+      // If `onClose` is not called, cleanup step won't be performed for gestures
       this.animate({ closing });
     }
   }
@@ -132,7 +137,7 @@ export default class Card extends React.Component<Props> {
     closing,
     velocity,
   }: {
-    closing: boolean | undefined;
+    closing?: boolean;
     velocity?: number;
   }) => {
     const {
@@ -143,6 +148,11 @@ export default class Card extends React.Component<Props> {
       onTransitionStart,
     } = this.props;
 
+    const toValue = this.getAnimateToValue({
+      ...this.props,
+      closing,
+    });
+
     const spec = closing ? transitionSpec.close : transitionSpec.open;
 
     const animation =
@@ -153,7 +163,7 @@ export default class Card extends React.Component<Props> {
       ...spec.config,
       velocity,
       useNativeDriver: true,
-      toValue: this.getAnimateToValue(this.props),
+      toValue,
     }).start(({ finished }) => {
       if (finished) {
         if (closing) {
@@ -169,7 +179,11 @@ export default class Card extends React.Component<Props> {
     closing,
     layout,
     gestureDirection,
-  }: Props) => {
+  }: {
+    closing?: boolean;
+    layout: Layout;
+    gestureDirection: GestureDirection;
+  }) => {
     if (!closing) {
       return 0;
     }
@@ -376,15 +390,18 @@ export default class Card extends React.Component<Props> {
     } = interpolatedStyle;
 
     const handleGestureEvent = gestureEnabled
-      ? Animated.event([
+      ? Animated.event(
-          {
+          [
-            nativeEvent:
+            {
-              gestureDirection === 'vertical' ||
+              nativeEvent:
-              gestureDirection === 'vertical-inverted'
+                gestureDirection === 'vertical' ||
-                ? { translationY: gesture }
+                gestureDirection === 'vertical-inverted'
-                : { translationX: gesture },
+                  ? { translationY: gesture }
-          },
+                  : { translationX: gesture },
-        ])
+            },
+          ],
+          { useNativeDriver: true }
+        )
       : undefined;
 
     const { backgroundColor } = StyleSheet.flatten(contentStyle || {});

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

@@ -30,7 +30,6 @@ type Props = TransitionPreset & {
   renderScene: (props: { route: Route<string> }) => React.ReactNode;
   onOpenRoute: (props: { route: Route<string> }) => void;
   onCloseRoute: (props: { route: Route<string> }) => void;
-  onGoBack: (props: { route: Route<string> }) => void;
   onTransitionStart?: (
     props: { route: Route<string> },
     closing: boolean
@@ -73,7 +72,6 @@ export default function CardContainer({
   index,
   layout,
   onCloseRoute,
-  onGoBack,
   onOpenRoute,
   onPageChangeCancel,
   onPageChangeConfirm,
@@ -109,7 +107,6 @@ export default function CardContainer({
     }
 
     onTransitionStart?.({ route: scene.route }, closing);
-    closing && onGoBack({ route: scene.route });
   };
 
   const insets = {

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

@@ -46,7 +46,6 @@ type Props = {
   routes: Route<string>[];
   openingRouteKeys: string[];
   closingRouteKeys: string[];
-  onGoBack: (props: { route: Route<string> }) => void;
   onOpenRoute: (props: { route: Route<string> }) => void;
   onCloseRoute: (props: { route: Route<string> }) => void;
   getPreviousRoute: (props: {
@@ -360,7 +359,6 @@ export default class CardStack extends React.Component<Props, State> {
       closingRouteKeys,
       onOpenRoute,
       onCloseRoute,
-      onGoBack,
       getPreviousRoute,
       getGesturesEnabled,
       renderHeader,
@@ -527,7 +525,6 @@ export default class CardStack extends React.Component<Props, State> {
                   onCloseRoute={onCloseRoute}
                   onTransitionStart={onTransitionStart}
                   onTransitionEnd={onTransitionEnd}
-                  onGoBack={onGoBack}
                   gestureEnabled={index !== 0 && getGesturesEnabled({ route })}
                   gestureVelocityImpact={gestureVelocityImpact}
                   gestureDirection={gestureDirection}

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

@@ -266,18 +266,6 @@ class StackView extends React.Component<Props, State> {
     return <HeaderContainer {...props} />;
   };
 
-  private handleGoBack = ({ route }: { route: Route<string> }) => {
-    const { state, navigation } = this.props;
-
-    // This event will trigger when a gesture ends
-    // We need to perform the transition before removing the route completely
-    navigation.dispatch({
-      ...StackActions.pop(),
-      source: route.key,
-      target: state.key,
-    });
-  };
-
   private handleOpenRoute = ({ route }: { route: Route<string> }) => {
     this.setState(state => ({
       routes: state.replacingRouteKeys.length
@@ -290,15 +278,33 @@ class StackView extends React.Component<Props, State> {
   };
 
   private handleCloseRoute = ({ route }: { route: Route<string> }) => {
-    // This event will trigger when the animation for closing the route ends
+    const { state, navigation } = this.props;
-    // In this case, we need to clean up any state tracking the route and pop it immediately
 
-    // @ts-ignore
+    if (state.routes.find(r => r.key === route.key)) {
-    this.setState(state => ({
+      // If a route exists in state, trigger a pop
-      routes: state.routes.filter(r => r.key !== route.key),
+      // This will happen in when the route was closed from the card component
-      openingRouteKeys: state.openingRouteKeys.filter(key => key !== route.key),
+      // e.g. When the close animation triggered from a gesture ends
-      closingRouteKeys: state.closingRouteKeys.filter(key => key !== route.key),
+      // For the cleanup, the card needs to call this function again from its componentDidUpdate
-    }));
+      navigation.dispatch({
+        ...StackActions.pop(),
+        source: route.key,
+        target: state.key,
+      });
+    } else {
+      // Otherwise, the animation was triggered due to a route removal
+      // In this case, we need to clean up any state tracking the route and pop it immediately
+
+      // @ts-ignore
+      this.setState(state => ({
+        routes: state.routes.filter(r => r.key !== route.key),
+        openingRouteKeys: state.openingRouteKeys.filter(
+          key => key !== route.key
+        ),
+        closingRouteKeys: state.closingRouteKeys.filter(
+          key => key !== route.key
+        ),
+      }));
+    }
   };
 
   private handleTransitionStart = (
@@ -355,7 +361,6 @@ class StackView extends React.Component<Props, State> {
                   routes={routes}
                   openingRouteKeys={openingRouteKeys}
                   closingRouteKeys={closingRouteKeys}
-                  onGoBack={this.handleGoBack}
                   onOpenRoute={this.handleOpenRoute}
                   onCloseRoute={this.handleCloseRoute}
                   onTransitionStart={this.handleTransitionStart}