fix: fix typescript definitions (#214)

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

@@ -7,6 +7,7 @@ import {
   Platform,
   ViewProps,
 } from 'react-native';
+import { NavigationRoute } from 'react-navigation';
 import Animated from 'react-native-reanimated';
 import * as Screens from 'react-native-screens'; // Import with * as to prevent getters being called
 import { getDefaultHeaderHeight } from '../Header/HeaderSegment';
@@ -18,10 +19,9 @@ import {
 } from '../../TransitionConfigs/TransitionPresets';
 import { forNoAnimation } from '../../TransitionConfigs/HeaderStyleInterpolators';
 import {
-  Route,
   Layout,
   HeaderMode,
-  NavigationProp,
+  NavigationStackProp,
   HeaderScene,
   SceneDescriptorMap,
   NavigationStackOptions,
@@ -33,18 +33,20 @@ type ProgressValues = {
 
 type Props = {
   mode: 'card' | 'modal';
-  navigation: NavigationProp;
+  navigation: NavigationStackProp;
   descriptors: SceneDescriptorMap;
-  routes: Route[];
+  routes: NavigationRoute[];
   openingRoutes: string[];
   closingRoutes: string[];
-  onGoBack: (props: { route: Route }) => void;
-  onOpenRoute: (props: { route: Route }) => void;
-  onCloseRoute: (props: { route: Route }) => void;
-  getPreviousRoute: (props: { route: Route }) => Route | undefined;
-  getGesturesEnabled: (props: { route: Route }) => boolean;
+  onGoBack: (props: { route: NavigationRoute }) => void;
+  onOpenRoute: (props: { route: NavigationRoute }) => void;
+  onCloseRoute: (props: { route: NavigationRoute }) => void;
+  getPreviousRoute: (props: {
+    route: NavigationRoute;
+  }) => NavigationRoute | undefined;
+  getGesturesEnabled: (props: { route: NavigationRoute }) => boolean;
   renderHeader: (props: HeaderContainerProps) => React.ReactNode;
-  renderScene: (props: { route: Route }) => React.ReactNode;
+  renderScene: (props: { route: NavigationRoute }) => React.ReactNode;
   headerMode: HeaderMode;
   onPageChangeStart?: () => void;
   onPageChangeConfirm?: () => void;
@@ -52,9 +54,9 @@ type Props = {
 };
 
 type State = {
-  routes: Route[];
+  routes: NavigationRoute[];
   descriptors: SceneDescriptorMap;
-  scenes: HeaderScene<Route>[];
+  scenes: HeaderScene<NavigationRoute>[];
   progress: ProgressValues;
   layout: Layout;
   floatingHeaderHeights: { [key: string]: number };
@@ -105,7 +107,7 @@ const { cond, eq } = Animated;
 const ANIMATED_ONE = new Animated.Value(1);
 
 const getFloatingHeaderHeights = (
-  routes: Route[],
+  routes: NavigationRoute[],
   layout: Layout,
   previous: { [key: string]: number }
 ) => {
@@ -237,7 +239,7 @@ export default class Stack extends React.Component<Props, State> {
     route,
     height,
   }: {
-    route: Route;
+    route: NavigationRoute;
     height: number;
   }) => {
     const previousHeight = this.state.floatingHeaderHeights[route.key];
@@ -255,7 +257,7 @@ export default class Stack extends React.Component<Props, State> {
   };
 
   private handleTransitionStart = (
-    { route }: { route: Route },
+    { route }: { route: NavigationRoute },
     closing: boolean
   ) => {
     const { descriptors } = this.props;
@@ -267,7 +269,7 @@ export default class Stack extends React.Component<Props, State> {
   };
 
   private handleTransitionEnd = (
-    { route }: { route: Route },
+    { route }: { route: NavigationRoute },
     closing: boolean
   ) => {
     const descriptor = this.props.descriptors[route.key];

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

@@ -1,14 +1,14 @@
 import * as React from 'react';
 import { StyleSheet, Platform, StyleProp, ViewStyle } from 'react-native';
 import Animated from 'react-native-reanimated';
+import { NavigationRoute } from 'react-navigation';
 import { Props as HeaderContainerProps } from '../Header/HeaderContainer';
 import Card from './Card';
 import {
-  Route,
   HeaderScene,
   Layout,
   HeaderMode,
-  NavigationProp,
+  NavigationStackProp,
   TransitionPreset,
 } from '../../types';
 
@@ -19,22 +19,30 @@ type Props = TransitionPreset & {
   closing: boolean;
   layout: Layout;
   current: Animated.Value<number>;
-  previousScene?: HeaderScene<Route>;
-  scene: HeaderScene<Route>;
-  navigation: NavigationProp;
+  previousScene?: HeaderScene;
+  scene: HeaderScene;
+  navigation: NavigationStackProp;
   cardTransparent?: boolean;
   cardOverlayEnabled?: boolean;
   cardShadowEnabled?: boolean;
   cardStyle?: StyleProp<ViewStyle>;
   gestureEnabled?: boolean;
-  getPreviousRoute: (props: { route: Route }) => Route | undefined;
+  getPreviousRoute: (props: {
+    route: NavigationRoute;
+  }) => NavigationRoute | undefined;
   renderHeader: (props: HeaderContainerProps) => React.ReactNode;
-  renderScene: (props: { route: Route }) => React.ReactNode;
-  onOpenRoute: (props: { route: Route }) => void;
-  onCloseRoute: (props: { route: Route }) => void;
-  onGoBack: (props: { route: Route }) => void;
-  onTransitionStart?: (props: { route: Route }, closing: boolean) => void;
-  onTransitionEnd?: (props: { route: Route }, closing: boolean) => void;
+  renderScene: (props: { route: NavigationRoute }) => React.ReactNode;
+  onOpenRoute: (props: { route: NavigationRoute }) => void;
+  onCloseRoute: (props: { route: NavigationRoute }) => void;
+  onGoBack: (props: { route: NavigationRoute }) => void;
+  onTransitionStart?: (
+    props: { route: NavigationRoute },
+    closing: boolean
+  ) => void;
+  onTransitionEnd?: (
+    props: { route: NavigationRoute },
+    closing: boolean
+  ) => void;
   onPageChangeStart?: () => void;
   onPageChangeConfirm?: () => void;
   onPageChangeCancel?: () => void;

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

@@ -1,19 +1,18 @@
 import * as React from 'react';
 import { Platform } from 'react-native';
-import { SceneView, StackActions } from 'react-navigation';
+import { SceneView, StackActions, NavigationRoute } from 'react-navigation';
 import Stack from './Stack';
 import HeaderContainer, {
   Props as HeaderContainerProps,
 } from '../Header/HeaderContainer';
 import {
-  NavigationProp,
+  NavigationStackProp,
   NavigationStackConfig,
-  Route,
   SceneDescriptorMap,
 } from '../../types';
 
 type Props = {
-  navigation: NavigationProp;
+  navigation: NavigationStackProp;
   descriptors: SceneDescriptorMap;
   navigationConfig: NavigationStackConfig;
   onPageChangeStart?: () => void;
@@ -24,7 +23,7 @@ type Props = {
 
 type State = {
   // Local copy of the routes which are actually rendered
-  routes: Route[];
+  routes: NavigationRoute[];
   // List of routes being opened, we need to animate pushing of these new routes
   opening: string[];
   // List of routes being closed, we need to animate popping of these routes
@@ -85,7 +84,7 @@ class StackView extends React.Component<Props, State> {
       // We only need to animate routes if the focused route changed
       // Animating previous routes won't be visible coz the focused route is on top of everything
 
-      const isAnimationEnabled = (route: Route) => {
+      const isAnimationEnabled = (route: NavigationRoute) => {
         const descriptor =
           props.descriptors[route.key] || state.descriptors[route.key];
 
@@ -175,7 +174,7 @@ class StackView extends React.Component<Props, State> {
     descriptors: {},
   };
 
-  private getGesturesEnabled = ({ route }: { route: Route }) => {
+  private getGesturesEnabled = ({ route }: { route: NavigationRoute }) => {
     const descriptor = this.state.descriptors[route.key];
 
     if (descriptor) {
@@ -195,7 +194,7 @@ class StackView extends React.Component<Props, State> {
     return false;
   };
 
-  private getPreviousRoute = ({ route }: { route: Route }) => {
+  private getPreviousRoute = ({ route }: { route: NavigationRoute }) => {
     const { closing, replacing } = this.state;
     const routes = this.state.routes.filter(
       r =>
@@ -207,7 +206,7 @@ class StackView extends React.Component<Props, State> {
     return routes[index - 1];
   };
 
-  private renderScene = ({ route }: { route: Route }) => {
+  private renderScene = ({ route }: { route: NavigationRoute }) => {
     const descriptor =
       this.state.descriptors[route.key] || this.props.descriptors[route.key];
 
@@ -236,14 +235,14 @@ class StackView extends React.Component<Props, State> {
     this.props.navigation.dispatch(StackActions.completeTransition());
   };
 
-  private handleGoBack = ({ route }: { route: Route }) => {
+  private handleGoBack = ({ route }: { route: NavigationRoute }) => {
     // This event will trigger when a gesture ends
     // We need to perform the transition before removing the route completely
     // @ts-ignore
     this.props.navigation.dispatch(StackActions.pop({ key: route.key }));
   };
 
-  private handleOpenRoute = ({ route }: { route: Route }) => {
+  private handleOpenRoute = ({ route }: { route: NavigationRoute }) => {
     this.handleTransitionComplete();
     this.setState(state => ({
       routes: state.replacing.length
@@ -255,7 +254,7 @@ class StackView extends React.Component<Props, State> {
     }));
   };
 
-  private handleCloseRoute = ({ route }: { route: Route }) => {
+  private handleCloseRoute = ({ route }: { route: NavigationRoute }) => {
     this.handleTransitionComplete();
 
     // This event will trigger when the animation for closing the route ends