Update to RN 0.45, fix/improve flow coverage

2026-01-12 22:51:18 +08:00 · 2017-07-03 15:06:08 -07:00
parent c2c81d95f6
commit 9436d03fe8
24 changed files with 402 additions and 252 deletions
--- a/.flowconfig
+++ b/.flowconfig
@@ -41,7 +41,7 @@ experimental.strict_type_args=true

 munge_underscores=true

-module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
+module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/stubs/RelativeImageStub.js.flow'
 module.file_ext=.js
 module.file_ext=.jsx
 module.file_ext=.json
--- a/flow-typed/react-native.js
+++ b/flow-typed/react-native.js
@@ -5,18 +5,18 @@ declare module 'react-native' {
  declare type Color = string | number;

  declare type Transform =
-    { perspective: number } |
-    { scale: number } |
-    { scaleX: number } |
-    { scaleY: number } |
-    { translateX: number } |
-    { translateY: number } |
-    { rotate: string } |
-    { rotateX: string } |
-    { rotateY: string } |
-    { rotateZ: string } |
-    { skewX: string } |
-    { skewY: string };
+    { perspective: number | AnimatedInterpolation | AnimatedValue } |
+    { scale: number | AnimatedInterpolation | AnimatedValue } |
+    { scaleX: number | AnimatedInterpolation | AnimatedValue } |
+    { scaleY: number | AnimatedInterpolation | AnimatedValue } |
+    { translateX: number | AnimatedInterpolation | AnimatedValue } |
+    { translateY: number | AnimatedInterpolation | AnimatedValue } |
+    { rotate: string | AnimatedInterpolation | AnimatedValue } |
+    { rotateX: string | AnimatedInterpolation | AnimatedValue } |
+    { rotateY: string | AnimatedInterpolation | AnimatedValue } |
+    { rotateZ: string | AnimatedInterpolation | AnimatedValue } |
+    { skewX: string | AnimatedInterpolation | AnimatedValue } |
+    { skewY: string | AnimatedInterpolation | AnimatedValue };

  declare type TransformPropTypes = {|
    transform?: Array<Transform>
@@ -580,7 +580,7 @@ declare module 'react-native' {
  declare type StylePropTypes = {|
    ...LayoutPropTypes,
    ...ShadowPropTypes,
-    ...TransformPropTypes,
+    ...$Exact<TransformPropTypes>,
    ...ExtraImageStylePropTypes,
    ...ExtraTextStylePropTypes,
    ...ExtraViewStylePropTypes,
@@ -588,8 +588,8 @@ declare module 'react-native' {

  declare type StyleId = number;

-  declare type Styles = {[key: string]: StylePropTypes};
-  declare type StyleRuleSet<S: Styles> = {[key: $Keys<S>]: StyleId};
+  declare export type StyleDefinition = {[key: string]: StylePropTypes};
+  declare type StyleRuleSet<S: StyleDefinition> = {[key: $Keys<S>]: StyleId};
  declare type StyleProp<T, V> = false | null | void | T | V | Array<StyleProp<T, V>>;

  declare export var StyleSheet: {|
@@ -597,7 +597,7 @@ declare module 'react-native' {
    absoluteFill: StyleId,
    absoluteFillObject: Object,
    flatten: (style: StyleProp<StylePropTypes, StyleId>) => StylePropTypes,
-    create<S: Styles>(styles: S): StyleRuleSet<S>,
+    create<S: StyleDefinition>(styles: S): StyleRuleSet<S>,
    setStyleAttributePreprocessor(property: string, process: (nextProp: mixed) => mixed): void,
  |};

@@ -671,8 +671,8 @@ declare module 'react-native' {

  declare type ViewDefaultProps = {
  };
-
-  declare type ViewProps = {
+  
+  declare type RCTViewAttributes = {
    accessible?: boolean,
    accessibilityLabel?: React$PropType$Primitive<any>,
    accessibilityComponentType?: AccessibilityComponentType,
@@ -684,6 +684,23 @@ declare module 'react-native' {
    onMagicTap?: Function,
    testID?: string,
    nativeID?: string,
+    pointerEvents?: 'box-none'| 'none'| 'box-only'| 'auto',
+    removeClippedSubviews?: boolean,
+    renderToHardwareTextureAndroid?: boolean,
+    shouldRasterizeIOS?: boolean,
+    collapsable?: boolean,
+    needsOffscreenAlphaCompositing?: boolean,
+    hitSlop?: EdgeInsetsProp,
+    /**
+     * Invoked on mount and layout changes with
+     *
+     *   `{nativeEvent: {layout: {x, y, width, height}}}`
+     */
+    onLayout?: Function,
+  }
+
+  declare export type ViewProps = {
+    ...$Exact<RCTViewAttributes>,
    onResponderGrant?: Function,
    onResponderMove?: Function,
    onResponderReject?: Function,
@@ -694,18 +711,11 @@ declare module 'react-native' {
    onStartShouldSetResponderCapture?: Function,
    onMoveShouldSetResponder?: Function,
    onMoveShouldSetResponderCapture?: Function,
-    hitSlop?: EdgeInsetsProp,
-    pointerEvents?: 'box-none'| 'none'| 'box-only'| 'auto',
-    style?: StyleProp<ViewStylePropTypes, StyleId>,
-    removeClippedSubviews?: boolean,
-    renderToHardwareTextureAndroid?: boolean,
-    shouldRasterizeIOS?: boolean,
-    collapsable?: boolean,
-    needsOffscreenAlphaCompositing?: boolean,
+    style?: StyleProp<ViewStylePropTypes, StyleId>,    
    children?: React$Element<*>,
  };

-  declare export class View extends React$Component<void, ViewProps, void> {
+  declare class BaseView<D, P, S> extends React$Component<D, P, S> {
    blur(): void,
    focus(): void,
    measure(callback: MeasureOnSuccessCallback): void,
@@ -715,8 +725,22 @@ declare module 'react-native' {
      onSuccess: MeasureLayoutOnSuccessCallback,
      onFail: () => void,
    ): void,
-    setNativeProps(nativeProps: ViewProps): void,
+    setNativeProps(nativeProps: P): void,
  }
+  
+  declare export class View extends BaseView<ViewDefaultProps, ViewProps, void> {}
+  
+  declare export type AnimatedViewStylePropTypes = {
+    ...$Exact<ViewStylePropTypes>,
+    ...({ [key: $Keys<ViewStylePropTypes>]: AnimatedValue | AnimatedInterpolation })
+  };
+  
+  declare type AnimatedViewProps = {
+    ...$Exact<ViewProps>,
+    style: StyleProp<AnimatedViewStylePropTypes, StyleId>,
+  }
+  
+  declare class AnimatedView extends BaseView<ViewDefaultProps, AnimatedViewProps, void> {}

  declare type TextDefaultProps = {
    accessible: true,
@@ -725,7 +749,8 @@ declare module 'react-native' {
    disabled: false,
  };

-  declare type TextProps = {
+  declare export type TextProps = {
+    ...$Exact<RCTViewAttributes>,
    /**
     * When `numberOfLines` is set, this prop defines how text will be truncated.
     * `numberOfLines` must be set in conjunction with this prop.
@@ -759,12 +784,6 @@ declare module 'react-native' {
     * @platform android
     */
    textBreakStrategy?: 'simple' | 'highQuality' | 'balanced',
-    /**
-     * Invoked on mount and layout changes with
-     *
-     *   `{nativeEvent: {layout: {x, y, width, height}}}`
-     */
-    onLayout?: Function,
    /**
     * This function is called on press.
     *
@@ -842,7 +861,7 @@ declare module 'react-native' {
    children?: React$Element<*>,
  };

-  declare export class Text extends React$Component<TextDefaultProps, TextProps, void> {
+  declare class BaseText<D, P, S> extends React$Component<D, P, S> {    
    blur(): void,
    focus(): void,
    measure(callback: MeasureOnSuccessCallback): void,
@@ -852,8 +871,22 @@ declare module 'react-native' {
      onSuccess: MeasureLayoutOnSuccessCallback,
      onFail: () => void,
    ): void,
-    setNativeProps(nativeProps: TextProps): void,
+    setNativeProps(nativeProps: P): void,
  }
+  
+  declare export class Text extends BaseText<TextDefaultProps, TextProps, void> {}
+  
+  declare type AnimatedTextStylePropTypes = {
+    ...$Exact<TextStylePropTypes>,
+    ...({ [key: $Keys<TextStylePropTypes>]: AnimatedValue | AnimatedInterpolation })
+  };
+  
+  declare type AnimatedTextProps = {
+    ...$Exact<TextProps>,
+    style: StyleProp<AnimatedTextStylePropTypes, StyleId>,
+  };
+  
+  declare class AnimatedText extends BaseText<TextDefaultProps, AnimatedTextProps, void> {}

  declare type ImageUriSourcePropType = {
    uri: string,
@@ -1056,7 +1089,7 @@ declare module 'react-native' {
    scale: number,
  };

-  declare export class Image extends React$Component<void, ImageProps, void> {
+  declare class BaseImage<D, P, S> extends React$Component<D, P, S> {
    static resizeMode: ImageResizeModeEnum,
    /**
     * Retrieve the width and height (in pixels) of an image prior to displaying it.
@@ -1113,12 +1146,26 @@ declare module 'react-native' {
      onSuccess: MeasureLayoutOnSuccessCallback,
      onFail: () => void,
    ): void,
-    setNativeProps(nativeProps: ImageProps): void,
+    setNativeProps(nativeProps: P): void,
  }
+  
+  declare export class Image extends BaseImage<void, ImageProps, void> {}
+  
+  declare type AnimatedImageStylePropTypes = {
+    ...$Exact<ImageStylePropTypes>,
+    ...({ [key: $Keys<ImageStylePropTypes>]: AnimatedValue | AnimatedInterpolation })
+  };
+  
+  declare type AnimatedImageProps = {
+    ...$Exact<ImageProps>,
+    style: StyleProp<AnimatedImageStylePropTypes, StyleId>,
+  };
+  
+  declare class AnimatedImage extends BaseView<void, AnimatedImageProps, void> {}


  declare type ScrollViewProps = {
-    ...ViewProps,
+    ...$Exact<ViewProps>,
    /**
     * Controls whether iOS should automatically adjust the content inset
     * for scroll views that are placed behind a navigation bar or
@@ -1417,9 +1464,9 @@ declare module 'react-native' {
    overScrollMode?: 'auto' | 'always' | 'never',
  }

-  declare export class ScrollView extends React$Component<void, ScrollViewProps, void> {
+  declare export class BaseScrollView<D, P, S> extends React$Component<D, P, S> {
    // TODO(lmr): ScrollResponder.Mixin?
-    setNativeProps(props: ScrollViewProps): void,
+    setNativeProps(props: P): void,

    /**
     * Returns a reference to the underlying scroll responder, which supports
@@ -1462,7 +1509,21 @@ declare module 'react-native' {
      options?: { animated?: boolean },
    ): void,
  }
-
+  
+  declare export class ScrollView extends BaseScrollView<void, ScrollViewProps, void> {}
+  
+  declare type AnimatedScrollViewStyleProps = {
+    ...$Exact<ViewStylePropTypes>,
+    ...({ [key: $Keys<ViewStylePropTypes>]: AnimatedValue | AnimatedInterpolation })
+  };
+  
+  declare type AnimatedScrollViewProps = {
+    ...$Exact<ScrollViewProps>,
+    style: StyleProp<AnimatedScrollViewStyleProps, StyleId>,
+  };
+  
+  declare class AnimatedScrollView extends BaseView<void, AnimatedScrollViewProps, void> {}
+  
  declare export var Platform: {|
    OS: 'ios' | 'android',
    Version: number,
@@ -2011,7 +2072,7 @@ declare module 'react-native' {
     * see [Issue#7070](https://github.com/facebook/react-native/issues/7070)
     * for more detail.
     *
-     * [Styles](docs/style.html)
+     * [StyleDefinition](docs/style.html)
     */
    style?: StyleProp<TextStylePropTypes, StyleId>,
    /**
@@ -2490,7 +2551,8 @@ declare module 'react-native' {
    setDeadline(deadline: number): void,
  |};

-  declare type EasingFunction = (t: number) => number;
+  declare type EasingFunction = (t?: number) => number;
+  declare type EasingFunctionGenerator = (s: number) => EasingFunction;

  declare export var Easing: {|
    step0: (n: number) => EasingFunction,
@@ -2506,7 +2568,7 @@ declare module 'react-native' {
     * n = 4: http://easings.net/#easeInQuart
     * n = 5: http://easings.net/#easeInQuint
     */
-    poly: EasingFunction,
+    poly: EasingFunctionGenerator,

    /**
     * A sinusoidal function.
@@ -2595,10 +2657,6 @@ declare module 'react-native' {
    inOut(easing: EasingFunction): EasingFunction,
  |};

-
-
-
-
  declare type ExtrapolateType = 'extend' | 'identity' | 'clamp';
  declare type InterpolationConfigType = {
    inputRange: Array<number>,
@@ -2681,6 +2739,12 @@ declare module 'react-native' {
  declare type ValueListenerCallback = (state: {value: number}) => void;

  declare class AnimatedValue extends AnimatedWithChildren {
+    __isNative: boolean,
+    __getValue: () => number,
+    __getAnimatedValue: () => number,
+    
+    _listeners: { [key: string]: mixed },
+    
    constructor(value: number): void,
    /**
     * Directly set the value.  This will stop any animations running on the value
@@ -2883,7 +2947,7 @@ declare module 'react-native' {

  }

-  declare var Animated: {|
+  declare export var Animated: {|
    /**
     * Standard value class for driving animations.  Typically initialized with
     * `new Animated.Value(0);`
@@ -3049,6 +3113,11 @@ declare module 'react-native' {
     */
    forkEvent(event: ?AnimatedEvent | ?Function, listener: Function): AnimatedEvent | Function,
    unforkEvent(event: ?AnimatedEvent | ?Function, listener: Function): void ,
+    
+    Text: Class<AnimatedText>,
+    View: Class<AnimatedView>,
+    Image: Class<AnimatedImage>,
+    ScrollView: Class<AnimatedScrollView>,
  |};

  declare export function findNodeHandle(componentOrHandle: any): ?number;
@@ -3135,7 +3204,12 @@ declare module 'react-native' {
    tvParallaxProperties?: Object,
  };

-  declare export class TouchableOpacity extends React$Component<typeof TouchableOpacity.defaultProps, TouchableOpacityProps, void> {
+  declare type TouchableOpacityDefaultProps = {
+    activeOpacity: number,
+    focusedOpacity: number,
+  };
+
+  declare export class TouchableOpacity extends React$Component<TouchableOpacityDefaultProps, TouchableOpacityProps, void> {
    static defaultProps: {
      activeOpacity: 0.2,
      focusedOpacity: 0.7,
@@ -3220,8 +3294,8 @@ declare module 'react-native' {
     */
    background: {
      type: 'RippleAndroid',
-      color?: number,
-      borderless?: boolean,
+      color: number,
+      borderless: boolean,
    } | {
      type: 'ThemeAttrAndroid',
      attribute: string,
@@ -3238,8 +3312,13 @@ declare module 'react-native' {
     */
    useForeground?: boolean,
  };
+  
+  declare type TouchableNativeFeedbackDefaultProps = {
+    activeOpacity: number,
+    underlayColor: string,
+  };

-  declare export class TouchableNativeFeedback extends React$Component<typeof TouchableNativeFeedback.defaultProps, TouchableNativeFeedbackProps, void> {
+  declare export class TouchableNativeFeedback extends React$Component<TouchableNativeFeedbackDefaultProps, TouchableNativeFeedbackProps, void> {
    static defaultProps: {
      activeOpacity: 0.85,
      underlayColor: 'black',
@@ -4318,7 +4397,7 @@ declare module 'react-native' {
  // declare export var Image: any;
  // declare export var Dimensions: any;
  // declare export var ScrollView: any;
-  // declare export var Animated: any; // yes // TODO(lmr): View/Text/Image/ScrollView
+  // declare export var Animated: any; // yes
  // declare export var Alert: any; // yes
  // declare export var TouchableHighlight: any;
  // declare export var ActivityIndicator: any;
--- a/package.json
+++ b/package.json
@@ -41,6 +41,18 @@
    "lib-rn",
    "src"
  ],
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*"
+  },
+  "dependencies": {
+    "clamp": "^1.0.1",
+    "hoist-non-react-statics": "^1.2.0",
+    "path-to-regexp": "^1.7.0",
+    "prop-types": "^15.5.10",
+    "react-native-drawer-layout-polyfill": "^1.3.1",
+    "react-native-tab-view": "^0.0.66"
+  },
  "devDependencies": {
    "babel-cli": "^6.24.1",
    "babel-core": "^6.24.1",
@@ -61,27 +73,15 @@
    "eslint-plugin-jsx-a11y": "^5.0.1",
    "eslint-plugin-prettier": "^2.0.1",
    "eslint-plugin-react": "^7.0.1",
-    "flow-bin": "0.42.0",
+    "flow-bin": "^0.49.1",
    "jest": "^20.0.1",
    "prettier": "^1.3.1",
    "prettier-eslint": "^6.2.2",
-    "react": "16.0.0-alpha.6",
-    "react-native": "^0.44.0",
+    "react": "16.0.0-alpha.12",
+    "react-native": "^0.45.1",
    "react-native-vector-icons": "^4.1.1",
    "react-test-renderer": "^15.4.2"
  },
-  "peerDependencies": {
-    "react": "*",
-    "react-native": "*"
-  },
-  "dependencies": {
-    "clamp": "^1.0.1",
-    "hoist-non-react-statics": "^1.2.0",
-    "path-to-regexp": "^1.7.0",
-    "prop-types": "^15.5.10",
-    "react-native-drawer-layout-polyfill": "^1.3.1",
-    "react-native-tab-view": "^0.0.66"
-  },
  "jest": {
    "notify": true,
    "preset": "react-native",
--- a/src/PlatformHelpers.web.js
+++ b/src/PlatformHelpers.web.js
--- a/src/TypeDefinition.js
+++ b/src/TypeDefinition.js
@@ -2,13 +2,29 @@

 import React from 'react';

-// @todo when we split types into common, native and web,
-// we can properly change Animated.Value to its real value
-type AnimatedValue = *;
+import {
+  Animated,
+  type ViewProps,
+  type TextProps,
+  type StyleDefinition,
+  type AnimatedViewStylePropTypes,
+} from 'react-native';
+
+export type ViewStyleProp = $PropertyType<ViewProps, 'style'>;
+export type TextStyleProp = $PropertyType<TextProps, 'style'>;
+export type AnimatedViewStyleProp = $PropertyType<
+  $PropertyType<Animated.View, 'props'>,
+  'style'
+>;
+export type AnimatedTextStyleProp = $PropertyType<
+  $PropertyType<Animated.Text, 'props'>,
+  'style'
+>;

 export type HeaderMode = 'float' | 'screen' | 'none';

-export type HeaderProps = NavigationSceneRendererProps & {
+export type HeaderProps = {
+  ...$Exact<NavigationSceneRendererProps>,
  mode: HeaderMode,
  router: NavigationRouter<
    NavigationState,
@@ -18,7 +34,7 @@ export type HeaderProps = NavigationSceneRendererProps & {
  getScreenDetails: NavigationScene => NavigationScreenDetails<
    NavigationStackScreenOptions
  >,
-  style: Style,
+  style: ViewStyleProp,
 };

 /**
@@ -66,7 +82,8 @@ export type NavigationLeafRoute = {
  params?: NavigationParams,
 };

-export type NavigationStateRoute = NavigationLeafRoute & {
+export type NavigationStateRoute = {
+  ...$Exact<NavigationLeafRoute>,
  index: number,
  routes: Array<NavigationRoute>,
 };
@@ -122,14 +139,6 @@ export type NavigationScreenOption<T> =
    config: T
  ) => T);

-export type Style =
-  | { [key: string]: any }
-  | number
-  | false
-  | null
-  | void
-  | Array<Style>;
-
 export type NavigationScreenDetails<T> = {
  options: T,
  state: NavigationRoute,
@@ -216,24 +225,25 @@ export type NavigationUriAction = {
 export type NavigationStackViewConfig = {
  mode?: 'card' | 'modal',
  headerMode?: HeaderMode,
-  cardStyle?: Style,
+  cardStyle?: ViewStyleProp,
  transitionConfig?: () => TransitionConfig,
  onTransitionStart?: () => void,
  onTransitionEnd?: () => void,
 };

-export type NavigationStackScreenOptions = NavigationScreenOptions & {
+export type NavigationStackScreenOptions = {
+  ...$Exact<NavigationScreenOptions>,
  header?: ?(React.Element<*> | (HeaderProps => React.Element<*>)),
  headerTitle?: string | React.Element<*>,
-  headerTitleStyle?: Style,
+  headerTitleStyle?: AnimatedTextStyleProp,
  headerTintColor?: string,
  headerLeft?: React.Element<*>,
  headerBackTitle?: string,
  headerTruncatedBackTitle?: string,
-  headerBackTitleStyle?: Style,
+  headerBackTitleStyle?: TextStyleProp,
  headerPressColorAndroid?: string,
  headerRight?: React.Element<*>,
-  headerStyle?: Style,
+  headerStyle?: ViewStyleProp,
  gesturesEnabled?: boolean,
 };

@@ -352,11 +362,11 @@ export type NavigationNavigatorProps<T> = {
 export type NavigationGestureDirection = 'horizontal' | 'vertical';

 export type NavigationLayout = {
-  height: AnimatedValue,
+  height: Animated.Value,
  initHeight: number,
  initWidth: number,
  isMeasured: boolean,
-  width: AnimatedValue,
+  width: Animated.Value,
 };

 export type NavigationScene = {
@@ -375,14 +385,14 @@ export type NavigationTransitionProps = {
  navigation: NavigationScreenProp<NavigationState, NavigationAction>,

  // The progressive index of the transitioner's navigation state.
-  position: AnimatedValue,
+  position: Animated.Value,

  // The value that represents the progress of the transition when navigation
  // state changes from one to another. Its numberic value will range from 0
  // to 1.
  //  progress.__getAnimatedValue() < 1 : transtion is happening.
  //  progress.__getAnimatedValue() == 1 : transtion completes.
-  progress: AnimatedValue,
+  progress: Animated.Value,

  // All the scenes of the transitioner.
  scenes: Array<NavigationScene>,
@@ -406,9 +416,9 @@ export type NavigationSceneRendererProps = NavigationTransitionProps;
 export type NavigationTransitionSpec = {
  duration?: number,
  // An easing function from `Easing`.
-  easing?: (t: number) => number,
+  easing?: (t?: number) => number,
  // A timing function such as `Animated.timing`.
-  timing?: (value: AnimatedValue, config: any) => any,
+  timing?: (value: Animated.Value, config: any) => any,
 };

 /**
@@ -422,11 +432,11 @@ export type TransitionConfig = {
  screenInterpolator?: (props: NavigationSceneRendererProps) => Object,
  // The style of the container. Useful when a scene doesn't have
  // 100% opacity and the underlying container is visible.
-  containerStyle?: Style,
+  containerStyle?: $PropertyType<ViewProps, 'style'>,
 };

 export type NavigationAnimationSetter = (
-  position: AnimatedValue,
+  position: Animated.Value,
  newState: NavigationState,
  lastState: NavigationState
 ) => void;
@@ -435,7 +445,7 @@ export type NavigationSceneRenderer = () => ?React.Element<*>;

 export type NavigationStyleInterpolator = (
  props: NavigationSceneRendererProps
-) => Style;
+) => AnimatedViewStylePropTypes;

 export type LayoutEvent = {
  nativeEvent: {
--- a/src/createNavigationContainer.js
+++ b/src/createNavigationContainer.js
@@ -163,7 +163,7 @@ export default function createNavigationContainer<T: *>(
      });

      Linking.getInitialURL().then(
-        (url: string) => url && this._handleOpenURL(url)
+        (url: ?string) => url && this._handleOpenURL(url)
      );
    }

--- a/src/react-navigation.js
+++ b/src/react-navigation.js
@@ -57,13 +57,13 @@ module.exports = {

  // Header
  get Header() {
-    return require('./views/Header').default;
+    return require('./views/Header/Header').default;
  },
  get HeaderTitle() {
-    return require('./views/HeaderTitle').default;
+    return require('./views/Header/HeaderTitle').default;
  },
  get HeaderBackButton() {
-    return require('./views/HeaderBackButton').default;
+    return require('./views/Header/HeaderBackButton').default;
  },

  // DrawerView
--- a/src/routers/tests/StackRouter-test.js
+++ b/src/routers/tests/StackRouter-test.js
@@ -752,7 +752,6 @@ describe('StackRouter', () => {
    expect(state2 && state2.routes[1].params).toEqual({ foo: '42' });
    /* $FlowFixMe */
    expect(state2 && state2.routes[1].routes).toEqual([
-      /* $FlowFixMe */
      expect.objectContaining({
        routeName: 'Baz',
        params: { foo: '42' },
@@ -819,7 +818,6 @@ describe('StackRouter', () => {
    }
    expect(state && state.index).toEqual(0);
    expect(state && state.routes[0]).toEqual(
-      // $FlowFixMe
      expect.objectContaining({
        routeName: 'Bar',
        type: undefined,
--- a/src/views/CardStack.js
+++ b/src/views/CardStack.js
@@ -14,7 +14,7 @@ import {
 } from 'react-native';

 import Card from './Card';
-import Header from './Header';
+import Header from './Header/Header';
 import NavigationActions from '../NavigationActions';
 import addNavigationHelpers from '../addNavigationHelpers';
 import SceneView from './SceneView';
@@ -29,7 +29,7 @@ import type {
  NavigationScreenDetails,
  NavigationStackScreenOptions,
  HeaderMode,
-  Style,
+  ViewStyleProp,
  TransitionConfig,
 } from '../TypeDefinition';

@@ -47,10 +47,10 @@ type Props = {
    NavigationAction,
    NavigationStackScreenOptions
  >,
-  cardStyle?: Style,
+  cardStyle?: ViewStyleProp,
  onTransitionStart?: () => void,
  onTransitionEnd?: () => void,
-  style?: any,
+  style?: any, // TODO: Remove
  /**
   * Optional custom animation when transitioning between screens.
   */
--- a/src/views/CardStackTransitioner.js
+++ b/src/views/CardStackTransitioner.js
@@ -17,7 +17,7 @@ import type {
  NavigationTransitionProps,
  NavigationRouter,
  HeaderMode,
-  Style,
+  ViewStyleProp,
  TransitionConfig,
 } from '../TypeDefinition';

@@ -34,10 +34,10 @@ type Props = {
    NavigationAction,
    NavigationStackScreenOptions
  >,
-  cardStyle?: Style,
+  cardStyle?: ViewStyleProp,
  onTransitionStart?: () => void,
  onTransitionEnd?: () => void,
-  style: Style,
+  style: ViewStyleProp,
  /**
   * Optional custom animation when transitioning between screens.
   */
@@ -88,7 +88,7 @@ class CardStackTransitioner extends Component<DefaultProps, Props, void> {
    if (
      !!NativeAnimatedModule &&
      // Native animation support also depends on the transforms used:
-      CardStackStyleInterpolator.canUseNativeDriver(isModal)
+      CardStackStyleInterpolator.canUseNativeDriver()
    ) {
      // Internal undocumented prop
      transitionSpec.useNativeDriver = true;
--- a/src/views/Drawer/DrawerNavigatorItems.js
+++ b/src/views/Drawer/DrawerNavigatorItems.js
@@ -10,7 +10,8 @@ import type {
  NavigationState,
  NavigationAction,
  NavigationRoute,
-  Style,
+  ViewStyleProp,
+  TextStyleProp,
 } from '../../TypeDefinition';
 import type { DrawerScene, DrawerItem } from './DrawerView.js';

@@ -25,8 +26,8 @@ type Props = {
  getLabel: (scene: DrawerScene) => ?(React.Element<*> | string),
  renderIcon: (scene: DrawerScene) => ?React.Element<*>,
  onItemPress: (info: DrawerItem) => void,
-  style?: Style,
-  labelStyle?: Style,
+  style?: ViewStyleProp,
+  labelStyle?: TextStyleProp,
 };

 /**
--- a/src/views/Drawer/DrawerSidebar.js
+++ b/src/views/Drawer/DrawerSidebar.js
@@ -14,7 +14,7 @@ import type {
  NavigationDrawerScreenOptions,
  NavigationState,
  NavigationStateRoute,
-  Style,
+  ViewStyleProp,
 } from '../../TypeDefinition';

 import type { DrawerScene, DrawerItem } from './DrawerView';
@@ -32,7 +32,7 @@ type Props = {
  contentComponent: ReactClass<*>,
  contentOptions?: {},
  screenProps?: {},
-  style?: Style,
+  style?: ViewStyleProp,
 };

 /**
--- a/src/views/Drawer/DrawerView.js
+++ b/src/views/Drawer/DrawerView.js
@@ -13,7 +13,7 @@ import type {
  NavigationState,
  NavigationAction,
  NavigationDrawerScreenOptions,
-  Style,
+  ViewStyleProp,
 } from '../../TypeDefinition';

 export type DrawerScene = {
@@ -33,7 +33,7 @@ export type DrawerViewConfig = {
  drawerPosition: 'left' | 'right',
  contentComponent: ReactClass<*>,
  contentOptions?: {},
-  style?: Style,
+  style?: ViewStyleProp,
 };

 type Props = DrawerViewConfig & {
--- a/src/views/Header/Header.js
+++ b/src/views/Header/Header.js
@@ -15,7 +15,7 @@ import type {
  NavigationStyleInterpolator,
  LayoutEvent,
  HeaderProps,
-} from '../TypeDefinition';
+} from '../../TypeDefinition';

 type SceneProps = {
  scene: NavigationScene,
@@ -23,7 +23,7 @@ type SceneProps = {
  progress: Animated.Value,
 };

-type SubViewRenderer = (props: SceneProps) => ?React.Element<any>;
+type SubViewRenderer<T> = (props: SceneProps) => ?React.Element<T>;

 type SubViewName = 'left' | 'title' | 'right';

@@ -81,7 +81,7 @@ class Header extends React.PureComponent<void, HeaderProps, HeaderState> {
    this.props.navigation.goBack(null);
  };

-  _renderTitleComponent = (props: SceneProps) => {
+  _renderTitleComponent = (props: SceneProps): ?React.Element<*> => {
    const details = this.props.getScreenDetails(props.scene);
    const headerTitle = details.options.headerTitle;
    if (headerTitle && typeof headerTitle !== 'string') {
@@ -115,7 +115,7 @@ class Header extends React.PureComponent<void, HeaderProps, HeaderState> {
    );
  };

-  _renderLeftComponent = (props: SceneProps) => {
+  _renderLeftComponent = (props: SceneProps): ?React.Element<*> => {
    const options = this.props.getScreenDetails(props.scene).options;
    if (typeof options.headerLeft !== 'undefined') {
      return options.headerLeft;
@@ -143,7 +143,7 @@ class Header extends React.PureComponent<void, HeaderProps, HeaderState> {
    );
  };

-  _renderRightComponent = (props: SceneProps) => {
+  _renderRightComponent = (props: SceneProps): ?React.Element<*> => {
    const details = this.props.getScreenDetails(props.scene);
    const { headerRight } = details.options;
    return headerRight || null;
@@ -187,10 +187,10 @@ class Header extends React.PureComponent<void, HeaderProps, HeaderState> {
    );
  }

-  _renderSubView(
+  _renderSubView<T>(
    props: SceneProps,
    name: SubViewName,
-    renderer: SubViewRenderer,
+    renderer: SubViewRenderer<T>,
    styleInterpolator: NavigationStyleInterpolator
  ): ?React.Element<*> {
    const { scene } = props;
@@ -283,7 +283,7 @@ class Header extends React.PureComponent<void, HeaderProps, HeaderState> {
      ...rest
    } = this.props;

-    const { options } = this.props.getScreenDetails(scene, screenProps);
+    const { options } = this.props.getScreenDetails(scene);
    const headerStyle = options.headerStyle;

    return (
--- a/src/views/Header/HeaderBackButton.js
+++ b/src/views/Header/HeaderBackButton.js
@@ -10,22 +10,22 @@ import {
  StyleSheet,
 } from 'react-native';

-import type { LayoutEvent, Style } from '../TypeDefinition';
+import type { LayoutEvent, TextStyleProp } from '../../TypeDefinition';

-import TouchableItem from './TouchableItem';
+import TouchableItem from '../TouchableItem';

 type Props = {
  onPress?: () => void,
-  pressColorAndroid?: ?string,
+  pressColorAndroid?: string,
  title?: ?string,
-  titleStyle?: ?Style,
+  titleStyle?: ?TextStyleProp,
  tintColor?: ?string,
  truncatedTitle?: ?string,
  width?: ?number,
 };

 type DefaultProps = {
-  pressColorAndroid: ?string,
+  pressColorAndroid: string,
  tintColor: ?string,
  truncatedTitle: ?string,
 };
@@ -88,14 +88,22 @@ class HeaderBackButton extends React.PureComponent<DefaultProps, Props, State> {
      >
        <View style={styles.container}>
          <Image
-            style={[styles.icon, title && styles.iconWithTitle, { tintColor }]}
+            style={[
+              styles.icon,
+              !!title && styles.iconWithTitle,
+              !!tintColor && { tintColor },
+            ]}
            source={asset}
          />
          {Platform.OS === 'ios' &&
            title &&
            <Text
              onLayout={this._onTextLayout}
-              style={[styles.title, { color: tintColor }, titleStyle]}
+              style={[
+                styles.title,
+                !!tintColor && { color: tintColor },
+                titleStyle,
+              ]}
              numberOfLines={1}
            >
              {backButtonTitle}
--- a/src/views/Header/HeaderStyleInterpolator.js
+++ b/src/views/Header/HeaderStyleInterpolator.js
@@ -1,8 +1,16 @@
 /* @flow */

-import { I18nManager } from 'react-native';
+import {
+  I18nManager,
+  Animated,
+  type StyleDefinition,
+  type AnimatedViewStylePropTypes,
+} from 'react-native';

-import type { NavigationSceneRendererProps } from '../TypeDefinition';
+import type {
+  NavigationSceneRendererProps,
+  AnimatedViewStyleProp,
+} from '../../TypeDefinition';

 /**
 * Utility that builds the style for the navigation header.
@@ -15,7 +23,9 @@ import type { NavigationSceneRendererProps } from '../TypeDefinition';
 * +-------------+-------------+-------------+
 */

-function forLeft(props: NavigationSceneRendererProps): Object {
+function forLeft(
+  props: NavigationSceneRendererProps
+): AnimatedViewStylePropTypes {
  const { position, scene } = props;
  const { index } = scene;
  return {
@@ -26,7 +36,9 @@ function forLeft(props: NavigationSceneRendererProps): Object {
  };
 }

-function forCenter(props: NavigationSceneRendererProps): Object {
+function forCenter(
+  props: NavigationSceneRendererProps
+): AnimatedViewStylePropTypes {
  const { position, scene } = props;
  const { index } = scene;
  return {
@@ -47,7 +59,9 @@ function forCenter(props: NavigationSceneRendererProps): Object {
  };
 }

-function forRight(props: NavigationSceneRendererProps): Object {
+function forRight(
+  props: NavigationSceneRendererProps
+): AnimatedViewStylePropTypes {
  const { position, scene } = props;
  const { index } = scene;
  return {
--- a/src/views/Header/HeaderTitle.js
+++ b/src/views/Header/HeaderTitle.js
@@ -2,17 +2,23 @@

 import React from 'react';

-import { Platform, StyleSheet, Animated } from 'react-native';
+import { Text, View, Platform, StyleSheet, Animated } from 'react-native';

-import type { Style } from '../TypeDefinition';
+type AnimatedTextStyleProp = $PropertyType<
+  $PropertyType<Animated.Text, 'props'>,
+  'style'
+>;

 type Props = {
-  tintColor?: ?string,
-  style?: Style,
+  children: React$Element<*>,
+  selectionColor?: string | number,
+  style?: AnimatedTextStyleProp,
 };

+const AnimatedText = Animated.Text;
+
 const HeaderTitle = ({ style, ...rest }: Props) => (
-  <Animated.Text
+  <AnimatedText
    numberOfLines={1}
    {...rest}
    style={[styles.title, style]}
--- a/src/views/TabView/TabBarBottom.js
+++ b/src/views/TabView/TabBarBottom.js
@@ -9,7 +9,8 @@ import type {
  NavigationRoute,
  NavigationState,
  NavigationScreenProp,
-  Style,
+  ViewStyleProp,
+  TextStyleProp,
 } from '../../TypeDefinition';

 import type { TabScene } from './TabView';
@@ -33,17 +34,14 @@ type Props = {
  getLabel: (scene: TabScene) => ?(React.Element<*> | string),
  renderIcon: (scene: TabScene) => React.Element<*>,
  showLabel: boolean,
-  style?: Style,
-  labelStyle?: Style,
-  tabStyle?: Style,
+  style?: ViewStyleProp,
+  labelStyle?: TextStyleProp,
+  tabStyle?: ViewStyleProp,
  showIcon: boolean,
 };

-export default class TabBarBottom extends PureComponent<
-  DefaultProps,
-  Props,
-  void
-> {
+export default class TabBarBottom
+  extends PureComponent<DefaultProps, Props, void> {
  // See https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/UIKitUICatalog/UITabBar.html
  static defaultProps = {
    activeTintColor: '#3478f6', // Default active tint color in iOS 10
@@ -78,7 +76,7 @@ export default class TabBarBottom extends PureComponent<
    );
    const color = position.interpolate({
      inputRange,
-      outputRange,
+      outputRange: (outputRange: Array<string>),
    });

    const tintColor = scene.focused ? activeTintColor : inactiveTintColor;
@@ -149,7 +147,7 @@ export default class TabBarBottom extends PureComponent<
          );
          const backgroundColor = position.interpolate({
            inputRange,
-            outputRange,
+            outputRange: (outputRange: Array<string>),
          });
          const justifyContent = this.props.showIcon ? 'flex-end' : 'center';
          return (
--- a/src/views/TabView/TabBarIcon.js
+++ b/src/views/TabView/TabBarIcon.js
@@ -7,7 +7,7 @@ import type {
  NavigationAction,
  NavigationState,
  NavigationScreenProp,
-  Style,
+  ViewStyleProp,
 } from '../../TypeDefinition';

 import type { TabScene } from './TabView';
@@ -19,7 +19,7 @@ type Props = {
  position: Animated.Value,
  navigation: NavigationScreenProp<NavigationState, NavigationAction>,
  renderIcon: (scene: TabScene) => React.Element<*>,
-  style?: Style,
+  style?: ViewStyleProp,
 };

 export default class TabBarIcon extends PureComponent<void, Props, void> {
--- a/src/views/TabView/TabBarTop.js
+++ b/src/views/TabView/TabBarTop.js
@@ -9,7 +9,8 @@ import type {
  NavigationAction,
  NavigationScreenProp,
  NavigationState,
-  Style,
+  ViewStyleProp,
+  TextStyleProp,
 } from '../../TypeDefinition';

 import type { TabScene } from './TabView';
@@ -32,8 +33,8 @@ type Props = {
  navigation: NavigationScreenProp<NavigationState, NavigationAction>,
  getLabel: (scene: TabScene) => ?(React.Element<*> | string),
  renderIcon: (scene: TabScene) => React.Element<*>,
-  labelStyle?: Style,
-  iconStyle?: Style,
+  labelStyle?: TextStyleProp,
+  iconStyle?: ViewStyleProp,
 };

 export default class TabBarTop
@@ -71,7 +72,7 @@ export default class TabBarTop
    );
    const color = position.interpolate({
      inputRange,
-      outputRange,
+      outputRange: (outputRange: Array<string>),
    });

    const tintColor = scene.focused ? activeTintColor : inactiveTintColor;
--- a/src/views/TouchableItem.js
+++ b/src/views/TouchableItem.js
@@ -16,27 +16,28 @@ import {
  TouchableOpacity,
  View,
 } from 'react-native';
-import type { Style } from '../TypeDefinition';
+import type { ViewStyleProp } from '../TypeDefinition';

 const ANDROID_VERSION_LOLLIPOP = 21;

 type Props = {
-  onPress: Function,
+  onPress: () => void,
  delayPressIn?: number,
  borderless?: boolean,
-  pressColor?: ?string,
+  pressColor?: string,
  activeOpacity?: number,
  children?: React.Element<*>,
-  style?: Style,
+  style?: ViewStyleProp,
 };

 type DefaultProps = {
-  pressColor: ?string,
+  pressColor: string,
 };

 export default class TouchableItem
  extends Component<DefaultProps, Props, void> {
  static defaultProps = {
+    borderless: false,
    pressColor: 'rgba(0, 0, 0, .32)',
  };

@@ -54,14 +55,13 @@ export default class TouchableItem
      Platform.Version >= ANDROID_VERSION_LOLLIPOP
    ) {
      const { style, ...rest } = this.props; // eslint-disable-line no-unused-vars
-
      return (
        <TouchableNativeFeedback
          {...rest}
          style={null}
          background={TouchableNativeFeedback.Ripple(
-            this.props.pressColor,
-            this.props.borderless
+            this.props.pressColor || '',
+            this.props.borderless || false
          )}
        >
          <View style={this.props.style}>
--- a/src/views/Transitioner.js
+++ b/src/views/Transitioner.js
@@ -25,8 +25,8 @@ type Props = {
    prevTransitionProps: ?NavigationTransitionProps
  ) => NavigationTransitionSpec,
  navigation: NavigationScreenProp<NavigationState, NavigationAction>,
-  onTransitionEnd?: () => void,
-  onTransitionStart?: () => void,
+  onTransitionEnd?: (...args: Array<mixed>) => void,
+  onTransitionStart?: (...args: Array<mixed>) => void,
  render: (
    transitionProps: NavigationTransitionProps,
    prevTransitionProps: ?NavigationTransitionProps
--- a/stubs/RelativeImageStub.js.flow
+++ b/stubs/RelativeImageStub.js.flow
@@ -0,0 +1,43 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule RelativeImageStub
+ * @flow
+ */
+'use strict';
+
+// This is a stub for flow to make it understand require('./icon.png')
+// See packager/src/Bundler/index.js
+
+type PackagerAsset = {
+  +__packager_asset: boolean,
+  +fileSystemLocation: string,
+  +httpServerLocation: string,
+  +width: ?number,
+  +height: ?number,
+  +scales: Array<number>,
+  +hash: string,
+  +name: string,
+  +type: string,
+};
+
+declare var AssetRegistry: {
+  registerAsset(asset: PackagerAsset): number,
+};
+
+module.exports = AssetRegistry.registerAsset({
+  __packager_asset: true,
+  fileSystemLocation: '/full/path/to/directory',
+  httpServerLocation: '/assets/full/path/to/directory',
+  width: 100,
+  height: 100,
+  scales: [1, 2, 3],
+  hash: 'nonsense',
+  name: 'icon',
+  type: 'png',
+});
--- a/yarn.lock
+++ b/yarn.lock
@@ -1,5 +1,7 @@
 # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
 # yarn lockfile v1
+# yarn v0.25.4
+# node v8.0.0


 abab@^1.0.3:
@@ -228,7 +230,7 @@ async@^1.4.0:
  version "1.5.2"
  resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"

-async@^2.0.1, async@^2.1.4:
+async@^2.1.4, async@^2.4.0:
  version "2.4.0"
  resolved "https://registry.yarnpkg.com/async/-/async-2.4.0.tgz#4990200f18ea5b837c2cc4f8c031a6985c385611"
  dependencies:
@@ -285,7 +287,7 @@ babel-code-frame@6.22.0, babel-code-frame@^6.16.0, babel-code-frame@^6.22.0:
    esutils "^2.0.2"
    js-tokens "^3.0.0"

-babel-core@^6.0.0, babel-core@^6.18.0, babel-core@^6.21.0, babel-core@^6.24.1, babel-core@^6.7.2:
+babel-core@^6.0.0, babel-core@^6.18.0, babel-core@^6.24.1, babel-core@^6.7.2:
  version "6.24.1"
  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.24.1.tgz#8c428564dce1e1f41fb337ec34f4c3b022b5ad83"
  dependencies:
@@ -318,7 +320,7 @@ babel-eslint@^7.2.3:
    babel-types "^6.23.0"
    babylon "^6.17.0"

-babel-generator@^6.18.0, babel-generator@^6.21.0, babel-generator@^6.24.1:
+babel-generator@^6.18.0, babel-generator@^6.24.1:
  version "6.24.1"
  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.24.1.tgz#e715f486c58ded25649d888944d52aa07c5d9497"
  dependencies:
@@ -975,9 +977,9 @@ babel-preset-fbjs@^1.0.0:
    babel-plugin-transform-object-rest-spread "^6.6.5"
    object-assign "^4.0.1"

-babel-preset-fbjs@^2.1.0:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-2.1.2.tgz#f52b2df56b1da883ffb7798b3b3be42c4c647a77"
+babel-preset-fbjs@^2.1.2:
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-2.1.4.tgz#22f358e6654073acf61e47a052a777d7bccf03af"
  dependencies:
    babel-plugin-check-es2015-constants "^6.8.0"
    babel-plugin-syntax-class-properties "^6.8.0"
@@ -1116,7 +1118,7 @@ babel-preset-stage-3@^6.24.1:
    babel-plugin-transform-exponentiation-operator "^6.24.1"
    babel-plugin-transform-object-rest-spread "^6.22.0"

-babel-register@^6.18.0, babel-register@^6.24.1:
+babel-register@^6.24.1:
  version "6.24.1"
  resolved "https://registry.yarnpkg.com/babel-register/-/babel-register-6.24.1.tgz#7e10e13a2f71065bdfad5a1787ba45bca6ded75f"
  dependencies:
@@ -1128,7 +1130,7 @@ babel-register@^6.18.0, babel-register@^6.24.1:
    mkdirp "^0.5.1"
    source-map-support "^0.4.2"

-babel-runtime@^6.0.0, babel-runtime@^6.18.0, babel-runtime@^6.2.0, babel-runtime@^6.20.0, babel-runtime@^6.22.0:
+babel-runtime@^6.0.0, babel-runtime@^6.18.0, babel-runtime@^6.2.0, babel-runtime@^6.22.0, babel-runtime@^6.23.0:
  version "6.23.0"
  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.23.0.tgz#0a9489f144de70efb3ce4300accdb329e2fc543b"
  dependencies:
@@ -1145,7 +1147,7 @@ babel-template@^6.16.0, babel-template@^6.24.1, babel-template@^6.3.0:
    babylon "^6.11.0"
    lodash "^4.2.0"

-babel-traverse@^6.18.0, babel-traverse@^6.21.0, babel-traverse@^6.23.1, babel-traverse@^6.24.1:
+babel-traverse@^6.18.0, babel-traverse@^6.23.1, babel-traverse@^6.24.1:
  version "6.24.1"
  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.24.1.tgz#ab36673fd356f9a0948659e7b338d5feadb31695"
  dependencies:
@@ -1159,7 +1161,7 @@ babel-traverse@^6.18.0, babel-traverse@^6.21.0, babel-traverse@^6.23.1, babel-tr
    invariant "^2.2.0"
    lodash "^4.2.0"

-babel-types@^6.18.0, babel-types@^6.19.0, babel-types@^6.21.0, babel-types@^6.23.0, babel-types@^6.24.1:
+babel-types@^6.18.0, babel-types@^6.19.0, babel-types@^6.23.0, babel-types@^6.24.1:
  version "6.24.1"
  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.24.1.tgz#a136879dc15b3606bda0d90c1fc74304c2ff0975"
  dependencies:
@@ -1172,7 +1174,7 @@ babylon@7.0.0-beta.8:
  version "7.0.0-beta.8"
  resolved "https://registry.yarnpkg.com/babylon/-/babylon-7.0.0-beta.8.tgz#2bdc5ae366041442c27e068cce6f0d7c06ea9949"

-babylon@^6.11.0, babylon@^6.13.0, babylon@^6.15.0, babylon@^6.16.1, babylon@^6.17.0:
+babylon@^6.11.0, babylon@^6.13.0, babylon@^6.15.0, babylon@^6.17.0:
  version "6.17.1"
  resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.17.1.tgz#17f14fddf361b695981fe679385e4f1c01ebd86f"

@@ -1286,18 +1288,12 @@ browser-resolve@^1.11.2:
  dependencies:
    resolve "1.1.7"

-bser@1.0.2:
+bser@1.0.2, bser@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/bser/-/bser-1.0.2.tgz#381116970b2a6deea5646dd15dd7278444b56169"
  dependencies:
    node-int64 "^0.4.0"

-bser@^1.0.2:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/bser/-/bser-1.0.3.tgz#d63da19ee17330a0e260d2a34422b21a89520317"
-  dependencies:
-    node-int64 "^0.4.0"
-
 bser@^2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/bser/-/bser-2.0.0.tgz#9ac78d3ed5d915804fd87acb158bc797147a1719"
@@ -1597,6 +1593,14 @@ crc@3.3.0:
  version "3.3.0"
  resolved "https://registry.yarnpkg.com/crc/-/crc-3.3.0.tgz#fa622e1bc388bf257309082d6b65200ce67090ba"

+create-react-class@^15.5.2:
+  version "15.6.0"
+  resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.0.tgz#ab448497c26566e1e29413e883207d57cfe7bed4"
+  dependencies:
+    fbjs "^0.8.9"
+    loose-envify "^1.3.1"
+    object-assign "^4.1.1"
+
 cross-spawn@^3.0.1:
  version "3.0.1"
  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-3.0.1.tgz#1256037ecb9f0c5f79e3d6ef135e30770184b982"
@@ -2167,7 +2171,7 @@ fbjs-scripts@^0.7.0:
    semver "^5.1.0"
    through2 "^2.0.0"

-fbjs@^0.8.12, fbjs@^0.8.9, fbjs@~0.8.9:
+fbjs@0.8.12, fbjs@^0.8.9:
  version "0.8.12"
  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.12.tgz#10b5d92f76d45575fd63a217d4ea02bea2f8ed04"
  dependencies:
@@ -2245,9 +2249,9 @@ flat-cache@^1.2.1:
    graceful-fs "^4.1.2"
    write "^0.2.1"

-flow-bin@0.42.0:
-  version "0.42.0"
-  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.42.0.tgz#05dd754b6b052de7b150f9210e2160746961e3cf"
+flow-bin@^0.49.1:
+  version "0.49.1"
+  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.49.1.tgz#c9e456b3173a7535a4ffaf28956352c63bb8e3e9"

 flow-parser@0.45.0:
  version "0.45.0"
@@ -2592,10 +2596,6 @@ image-size@^0.3.5:
  version "0.3.5"
  resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.3.5.tgz#83240eab2fb5b00b04aab8c74b0471e9cba7ad8c"

-immutable@~3.7.6:
-  version "3.7.6"
-  resolved "https://registry.yarnpkg.com/immutable/-/immutable-3.7.6.tgz#13b4d3cb12befa15482a26fe1b2ebae640071e4b"
-
 imurmurhash@^0.1.4:
  version "0.1.4"
  resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
@@ -2959,6 +2959,10 @@ jest-docblock@^20.0.1:
  version "20.0.1"
  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-20.0.1.tgz#055e0bbcb76798198479901f92d2733bf619f854"

+jest-docblock@^20.0.3:
+  version "20.0.3"
+  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-20.0.3.tgz#17bea984342cc33d83c50fbe1545ea0efaa44712"
+
 jest-environment-jsdom@^20.0.1:
  version "20.0.1"
  resolved "https://registry.yarnpkg.com/jest-environment-jsdom/-/jest-environment-jsdom-20.0.1.tgz#2d29f81368987d387c70ce4f500c6aa560f9b4f7"
@@ -2974,23 +2978,13 @@ jest-environment-node@^20.0.1:
    jest-mock "^20.0.1"
    jest-util "^20.0.1"

-jest-haste-map@19.0.0:
-  version "19.0.0"
-  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-19.0.0.tgz#adde00b62b1fe04432a104b3254fc5004514b55e"
-  dependencies:
-    fb-watchman "^2.0.0"
-    graceful-fs "^4.1.6"
-    micromatch "^2.3.11"
-    sane "~1.5.0"
-    worker-farm "^1.3.1"
-
-jest-haste-map@^20.0.1:
-  version "20.0.1"
-  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-20.0.1.tgz#e6ba4db99ab512e7c081a5b0a0af731d0e193d56"
+jest-haste-map@^20.0.1, jest-haste-map@^20.0.4:
+  version "20.0.4"
+  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-20.0.4.tgz#653eb55c889ce3c021f7b94693f20a4159badf03"
  dependencies:
    fb-watchman "^2.0.0"
    graceful-fs "^4.1.11"
-    jest-docblock "^20.0.1"
+    jest-docblock "^20.0.3"
    micromatch "^2.3.11"
    sane "~1.6.0"
    worker-farm "^1.3.1"
@@ -3443,6 +3437,12 @@ media-typer@0.3.0:
  version "0.3.0"
  resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"

+merge-stream@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-1.0.1.tgz#4041202d508a342ba00174008df0c251b8c135e1"
+  dependencies:
+    readable-stream "^2.0.1"
+
 merge@^1.1.3:
  version "1.2.0"
  resolved "https://registry.yarnpkg.com/merge/-/merge-1.2.0.tgz#7531e39d4949c281a66b8c5a6e0265e8b05894da"
@@ -3680,7 +3680,7 @@ object-assign@^3.0.0:
  version "3.0.0"
  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-3.0.0.tgz#9bedd5ca0897949bca47e7ff408062d549f587f2"

-object-assign@^4.0.1, object-assign@^4.1.0:
+object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
  version "4.1.1"
  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"

@@ -3980,7 +3980,7 @@ promise@^7.1.1:
  dependencies:
    asap "~2.0.3"

-prop-types@^15.5.10, prop-types@^15.5.8:
+prop-types@^15.5.10, prop-types@^15.5.6, prop-types@^15.5.8:
  version "15.5.10"
  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.10.tgz#2797dfc3126182e3a95e3dfbb2e893ddd7456154"
  dependencies:
@@ -4051,9 +4051,9 @@ react-deep-force-update@^1.0.0:
  version "1.0.1"
  resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.0.1.tgz#f911b5be1d2a6fe387507dd6e9a767aa2924b4c7"

-react-devtools-core@^2.0.8:
-  version "2.1.9"
-  resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-2.1.9.tgz#825e0582b7f8587cbf56bb5ef1ea94d8b158543e"
+react-devtools-core@^2.1.8:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-2.3.3.tgz#3a950e6f20f2c8e67d0419e428c8500e7d8bf347"
  dependencies:
    shell-quote "^1.6.1"
    ws "^2.0.3"
@@ -4088,15 +4088,15 @@ react-native-vector-icons@^4.1.1:
    prop-types "^15.5.8"
    yargs "^6.3.0"

-react-native@^0.44.0:
-  version "0.44.0"
-  resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.44.0.tgz#06427a30053f2d555c60fe0b9afcc6c778db09de"
+react-native@^0.45.1:
+  version "0.45.1"
+  resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.45.1.tgz#b3283c4a88233421f9c662a2ff1a4ccc8a9f07c0"
  dependencies:
    absolute-path "^0.0.0"
    art "^0.10.0"
-    async "^2.0.1"
-    babel-core "^6.21.0"
-    babel-generator "^6.21.0"
+    async "^2.4.0"
+    babel-core "^6.24.1"
+    babel-generator "^6.24.1"
    babel-plugin-external-helpers "^6.18.0"
    babel-plugin-syntax-trailing-function-commas "^6.20.0"
    babel-plugin-transform-async-to-generator "6.16.0"
@@ -4104,13 +4104,13 @@ react-native@^0.44.0:
    babel-plugin-transform-object-rest-spread "^6.20.2"
    babel-polyfill "^6.20.0"
    babel-preset-es2015-node "^6.1.1"
-    babel-preset-fbjs "^2.1.0"
+    babel-preset-fbjs "^2.1.2"
    babel-preset-react-native "^1.9.1"
-    babel-register "^6.18.0"
-    babel-runtime "^6.20.0"
-    babel-traverse "^6.21.0"
-    babel-types "^6.21.0"
-    babylon "^6.16.1"
+    babel-register "^6.24.1"
+    babel-runtime "^6.23.0"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+    babylon "^6.17.0"
    base64-js "^1.1.2"
    bser "^1.0.2"
    chalk "^1.1.1"
@@ -4118,25 +4118,26 @@ react-native@^0.44.0:
    concat-stream "^1.6.0"
    connect "^2.8.3"
    core-js "^2.2.2"
+    create-react-class "^15.5.2"
    debug "^2.2.0"
    denodeify "^1.2.1"
+    errno ">=0.1.1 <0.2.0-0"
    event-target-shim "^1.0.5"
-    fbjs "~0.8.9"
+    fbjs "0.8.12"
    fbjs-scripts "^0.7.0"
    form-data "^2.1.1"
    fs-extra "^1.0.0"
    glob "^7.1.1"
    graceful-fs "^4.1.3"
    image-size "^0.3.5"
-    immutable "~3.7.6"
-    imurmurhash "^0.1.4"
    inquirer "^0.12.0"
-    jest-haste-map "19.0.0"
+    jest-haste-map "^20.0.4"
    joi "^6.6.1"
    json-stable-stringify "^1.0.1"
    json5 "^0.4.0"
    left-pad "^1.1.3"
    lodash "^4.16.6"
+    merge-stream "^1.0.1"
    mime "^1.3.4"
    mime-types "2.1.11"
    minimist "^1.2.0"
@@ -4148,8 +4149,9 @@ react-native@^0.44.0:
    plist "^1.2.0"
    pretty-format "^4.2.1"
    promise "^7.1.1"
+    prop-types "^15.5.8"
    react-clone-referenced-element "^1.0.1"
-    react-devtools-core "^2.0.8"
+    react-devtools-core "^2.1.8"
    react-timer-mixin "^0.13.2"
    react-transform-hmr "^1.0.4"
    rebound "^0.0.13"
@@ -4166,12 +4168,12 @@ react-native@^0.44.0:
    uglify-js "2.7.5"
    whatwg-fetch "^1.0.0"
    wordwrap "^1.0.0"
-    worker-farm "^1.3.1"
    write-file-atomic "^1.2.0"
    ws "^1.1.0"
    xcode "^0.9.1"
    xmldoc "^0.4.0"
    xpipe "^1.0.5"
+    xtend ">=4.0.0 <4.1.0-0"
    yargs "^6.4.0"

 react-proxy@^1.1.7:
@@ -4199,13 +4201,15 @@ react-transform-hmr@^1.0.4:
    global "^4.3.0"
    react-proxy "^1.1.7"

-react@16.0.0-alpha.6:
-  version "16.0.0-alpha.6"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.0.0-alpha.6.tgz#2ccb1afb4425ccc12f78a123a666f2e4c141adb9"
+react@16.0.0-alpha.12:
+  version "16.0.0-alpha.12"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.0.0-alpha.12.tgz#8c59485281485df319b6f77682d8dd0621c08194"
  dependencies:
+    create-react-class "^15.5.2"
    fbjs "^0.8.9"
    loose-envify "^1.1.0"
    object-assign "^4.1.0"
+    prop-types "^15.5.6"

 read-pkg-up@^1.0.1:
  version "1.0.1"
@@ -4222,7 +4226,7 @@ read-pkg@^1.0.0:
    normalize-package-data "^2.3.2"
    path-type "^1.0.0"

-readable-stream@^2.0.2, readable-stream@^2.0.6, readable-stream@^2.1.4, readable-stream@^2.1.5, readable-stream@^2.2.2:
+readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.6, readable-stream@^2.1.4, readable-stream@^2.1.5, readable-stream@^2.2.2:
  version "2.2.9"
  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.2.9.tgz#cf78ec6f4a6d1eb43d26488cac97f042e74b7fc8"
  dependencies:
@@ -4485,18 +4489,6 @@ sane@~1.4.1:
    walker "~1.0.5"
    watch "~0.10.0"

-sane@~1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/sane/-/sane-1.5.0.tgz#a4adeae764d048621ecb27d5f9ecf513101939f3"
-  dependencies:
-    anymatch "^1.3.0"
-    exec-sh "^0.2.0"
-    fb-watchman "^1.8.0"
-    minimatch "^3.0.2"
-    minimist "^1.1.1"
-    walker "~1.0.5"
-    watch "~0.10.0"
-
 sane@~1.6.0:
  version "1.6.0"
  resolved "https://registry.yarnpkg.com/sane/-/sane-1.6.0.tgz#9610c452307a135d29c1fdfe2547034180c46775"