0.1.4

Close #668

README.md

@@ -23,12 +23,10 @@ it out](https://glitch.com/edit/#!/react-native-web-playground) on Glitch.
 
 ## Quick start
 
-NOTE: React Native for Web supports React/ReactDOM 15.4, 15.5, or 15.6.
-
 Install in your existing app using `yarn` or `npm`:
 
 ```
-yarn add react@15.6 react-dom@15.6 react-native-web
+yarn add react react-dom react-native-web
 ```
 
 Add the `react-native-web/babel` plugin to your Babel configuration. This will
@@ -46,6 +44,8 @@ by the app.
 }
 ```
 
+(For React/ReactDOM 15.4 – 15.6 support, install `react-native-web@<0.1.0`)
+
 See the [Getting Started](docs/guides/getting-started.md) guide for more details.
 
 ## Documentation
@@ -64,13 +64,6 @@ Guides:
 * [Advanced use](docs/guides/advanced.md)
 * [Known issues](docs/guides/known-issues.md)
 
-## Starter kits
-
-* [Glitch](https://glitch.com/edit/#!/react-native-web-playground)
-* [create-react-app](https://github.com/facebookincubator/create-react-app)
-* [react-native-web-starter](https://github.com/grabcode/react-native-web-starter)
-* [react-native-web-webpack](https://github.com/ndbroadbent/react-native-web-webpack)
-
 ## Example code
 
 ```js
@@ -110,6 +103,12 @@ AppRegistry.registerComponent('MyApp', () => App)
 AppRegistry.runApplication('MyApp', { rootTag: document.getElementById('react-root') })
 ```
 
+## Starter kits
+
+* [Glitch](https://glitch.com/edit/#!/react-native-web-playground)
+* [create-react-app](https://github.com/facebookincubator/create-react-app)
+* [re-start](https://github.com/react-everywhere/re-start)
+
 ## Related projects
 
 * [react-primitives](https://github.com/lelandrichardson/react-primitives/)

babel/__tests__/__snapshots__/index-test.js.snap

@@ -12,13 +12,14 @@ import View from 'react-native-web/dist/components/View';
 
 exports[`2. Rewrite react-native paths for react-native-web 1`] = `
 "
-import { Switch, Text, View as MyView } from 'react-native';
+import { Switch, Text, View as MyView, ViewPropTypes } from 'react-native';
 
       ↓ ↓ ↓ ↓ ↓ ↓
 
 import Switch from 'react-native-web/dist/components/Switch';
 import Text from 'react-native-web/dist/components/Text';
 import MyView from 'react-native-web/dist/components/View';
+import ViewPropTypes from 'react-native-web/dist/components/View/ViewPropTypes';
 "
 `;
 

babel/__tests__/index-test.js

@@ -7,7 +7,7 @@ pluginTester({
   tests: [
     // import react-native
     "import { View } from 'react-native';",
-    "import { Switch, Text, View as MyView } from 'react-native';",
+    "import { Switch, Text, View as MyView, ViewPropTypes } from 'react-native';",
     "import { createElement, Switch, StyleSheet } from 'react-native';",
     "import { InvalidThing, TouchableOpacity } from 'react-native';",
     "import * as RNW from 'react-native';",

babel/index.js

@@ -69,11 +69,15 @@ const getDistLocation = importName => {
     // propTypes
     case 'ColorPropType':
     case 'EdgeInsetsPropType':
-    case 'PointPropType':
-    case 'TextPropTypes':
-    case 'ViewPropTypes': {
+    case 'PointPropType': {
       return `${root}/propTypes/${importName}`;
     }
+    case 'TextPropTypes': {
+      return `${root}/components/Text/${importName}`;
+    }
+    case 'ViewPropTypes': {
+      return `${root}/components/View/${importName}`;
+    }
 
     default:
       return;

docs/apis/AppRegistry.md

@@ -1,60 +0,0 @@
-# AppRegistry
-
-`AppRegistry` is the control point for registering, running, prerendering, and
-unmounting all apps. App root components should register themselves with
-`AppRegistry.registerComponent`. Apps can be run by invoking
-`AppRegistry.runApplication` (see the [getting started guide](../guides/getting-started.md) for more details).
-
-To "stop" an application when a view should be destroyed, call
-`AppRegistry.unmountApplicationComponentAtRootTag` with the tag that was passed
-into `runApplication`. These should always be used as a pair.
-
-## Methods
-
-(web) static **getApplication**(appKey:string, appParameters: object)
-
-Returns the given application element. Use this for server-side rendering.
-Return object is of type `{ element: ReactElement; stylesheets: [ ReactElement ] }`.
-
-static **registerConfig**(config: Array<AppConfig>)
-
-Registry multiple applications. `AppConfig` is of type `{ appKey: string;
-component: ComponentProvider; run?: Function }`.
-
-static **registerComponent**(appKey: string, getComponentFunc: ComponentProvider)
-
-Register a component provider under the given `appKey`.
-
-static **registerRunnable**(appKey: string, run: Function)
-
-Register a custom render function for an application. The function will receive
-the `appParameters` passed to `runApplication`.
-
-static **getAppKeys**()
-
-Returns all registered app keys.
-
-static **runApplication**(appKey: string, appParameters?: object)
-
-Runs the application that was registered under `appKey`. The `appParameters`
-must include the `rootTag` into which the application is rendered, and
-optionally any `initialProps`.
-
-On web, if the `rootTag` is a sub-section of your application it should be
-styled as `position:relative` and given an explicit height.
-
-static **unmountApplicationComponentAtRootTag**(rootTag: HTMLElement)
-
-To "stop" an application when a view should be destroyed, call
-`AppRegistry.unmountApplicationComponentAtRootTag` with the tag that was passed
-into `runApplication`
-
-## Example
-
-```js
-AppRegistry.registerComponent('MyApp', () => AppComponent)
-AppRegistry.runApplication('MyApp', {
-  initialProps: {},
-  rootTag: document.getElementById('react-root')
-})
-```

docs/apis/AppState.md

@@ -1,60 +0,0 @@
-## AppState
-
-`AppState` can tell you if the app is in the foreground or background, and
-notify you when the state changes.
-
-States
-
-* `active` - The app is running in the foreground
-* `background` - The app is running in the background (i.e., the user has not focused the app's tab).
-
-## Properties
-
-static **currentState**
-
-Returns the current state of the app: `active` or `background`.
-
-## Methods
-
-static **addEventListener**(type: string, handler: Function)
-
-Add a handler to `AppState` changes by listening to the `change` event type and
-providing the `handler`. The handler is called with the app state value.
-
-static **removeEventListener**(type: string, handler: Function)
-
-Remove a handler by passing the change event `type` and the `handler`.
-
-## Examples
-
-To see the current state, you can check `AppState.currentState`, which will be
-kept up-to-date. This example will only ever appear to say "Current state is:
-active" because the app is only visible to the user when in the `active` state,
-and the null state will happen only momentarily.
-
-```js
-class Example extends React.Component {
-  constructor(props) {
-    super(props)
-    this.state = { currentAppState: AppState.currentState }
-  }
-
-  componentDidMount() {
-    AppState.addEventListener('change', this._handleAppStateChange);
-  }
-
-  componentWillUnmount() {
-    AppState.removeEventListener('change', this._handleAppStateChange);
-  }
-
-  _handleAppStateChange = (currentAppState) => {
-    this.setState({ currentAppState });
-  }
-
-  render() {
-    return (
-      <Text>Current state is: {this.state.currentAppState}</Text>
-    )
-  }
-}
-```

docs/apis/AsyncStorage.md

@@ -1,71 +0,0 @@
-# AsyncStorage
-
-`AsyncStorage` is a simple, asynchronous, persistent, key-value storage system
-that is global to the domain. It's a facade over, and should be used instead of
-`window.localStorage` to provide an asynchronous API and multi functions. Each
-method returns a `Promise` object.
-
-It is recommended that you use an abstraction on top of `AsyncStorage` instead
-of `AsyncStorage` directly for anything more than light usage since it operates
-globally.
-
-The batched functions are useful for executing a lot of operations at once,
-allowing for optimizations to provide the convenience of a single promise after
-all operations are complete.
-
-## Methods
-
-static **clear**()
-
-Erases all AsyncStorage. You probably don't want to call this - use
-`removeItem` or `multiRemove` to clear only your own keys instead. Returns a
-Promise object.
-
-static **getAllKeys**()
-
-Gets all known keys. Returns a Promise object.
-
-static **getItem**(key: string)
-
-Fetches the value of the given key. Returns a Promise object.
-
-static **mergeItem**(key: string, value: string)
-
-Merges existing value with input value, assuming they are stringified JSON.
-Returns a Promise object.
-
-static **multiGet**(keys: Array<string>)
-
-`multiGet` results in an array of key-value pair arrays that matches the input
-format of `multiSet`. Returns a Promise object.
-
-```js
-multiGet(['k1', 'k2']) -> [['k1', 'val1'], ['k2', 'val2']]
-```
-
-static **multiMerge**(keyValuePairs: Array<Array<string>>)
-
-multiMerge takes an array of key-value array pairs that match the output of
-`multiGet`. It merges existing values with input values, assuming they are
-stringified JSON. Returns a Promise object.
-
-static **multiRemove**(keys: Array<string>)
-
-Delete all the keys in the keys array. Returns a Promise object.
-
-static **multiSet**(keyValuePairs: Array<Array<string>>)
-
-`multiSet` takes an array of key-value array pairs that match the output of
-`multiGet`. Returns a Promise object.
-
-```js
-multiSet([['k1', 'val1'], ['k2', 'val2']]);
-```
-
-static **removeItem**(key: string)
-
-Removes the value of the given key. Returns a Promise object.
-
-static **setItem**(key: string, value: string)
-
-Sets the value of the given key. Returns a Promise object.

docs/apis/Clipboard.md

@@ -1,16 +0,0 @@
-# Clipboard
-
-Clipboard gives you an interface for setting to the clipboard. (Getting
-clipboard content is not supported on web.)
-
-## Methods
-
-static **getString**()
-
-Returns a `Promise` of an empty string.
-
-static **setString**(content: string): boolean
-
-Copies a string to the clipboard. On web, some browsers may not support copying
-to the clipboard, therefore, this function returns a boolean to indicate if the
-copy was successful.

docs/apis/Dimensions.md

@@ -1,13 +0,0 @@
-# Dimensions
-
-Note: dimensions may change (e.g due to device rotation) so any rendering logic
-or styles that depend on these constants should try to call this function on
-every render, rather than caching the value.
-
-## Methods
-
-static **get**(dimension: string)
-
-Get a dimension (e.g., `"window"` or `"screen"`).
-
-Example: `const { height, width } = Dimensions.get('window')`

docs/apis/I18nManager.md

@@ -1,25 +0,0 @@
-# I18nManager
-
-Control and set the layout and writing direction of the application.
-
-## Properties
-
-**isRTL**: bool = false
-
-Whether the application is currently in RTL mode.
-
-## Methods
-
-static **allowRTL**(allowRTL: bool)
-
-Allow the application to display in RTL mode.
-
-static **forceRTL**(forceRTL: bool)
-
-Force the application to display in RTL mode.
-
-static **setPreferredLanguageRTL**(isRTL: bool)
-
-Set the application's preferred writing direction to RTL. You will need to
-determine the user's preferred locale server-side (from HTTP headers) and
-decide whether it's an RTL language.

docs/apis/NetInfo.md

@@ -1,77 +0,0 @@
-# NetInfo
-
-`NetInfo` asynchronously determines the online/offline status of the
-application.
-
-Connection types:
-
-* `bluetooth` - The user agent is using a Bluetooth connection.
-* `cellular` - The user agent is using a cellular connection (e.g., EDGE, HSPA, LTE, etc.).
-* `ethernet` - The user agent is using an Ethernet connection.
-* `mixed` -  The user agent is using multiple connection types.
-* `none` - The user agent will not contact the network (offline).
-* `other` - The user agent is using a connection type that is not one of enumerated connection types.
-* `unknown` -  The user agent has established a network connection, but is unable to determine what is the underlying connection technology.
-* `wifi` - The user agent is using a Wi-Fi connection.
-* `wimax` -  The user agent is using a WiMAX connection.
-
-## Methods
-
-Note that support for retrieving the connection type depends upon browswer
-support (and is limited to mobile browsers). It will default to `unknown` when
-support is missing.
-
-static **addEventListener**(eventName: ChangeEventName, handler: Function)
-
-static **fetch**(): Promise
-
-static **removeEventListener**(eventName: ChangeEventName, handler: Function)
-
-## Properties
-
-**isConnected**: bool = true
-
-Available on all user agents. Asynchronously fetch a boolean to determine
-internet connectivity. Use this if you are only interested with whether the device has internet connectivity.
-
-**isConnected.addEventListener**(eventName: ChangeEventName, handler: Function)
-
-**isConnected.fetch**(): Promise
-
-**isConnected.removeEventListener**(eventName: ChangeEventName, handler: Function)
-
-## Examples
-
-Fetching the connection type:
-
-```js
-NetInfo.fetch().then((connectionType) => {
-  console.log('Connection type:', connectionType);
-});
-```
-
-Subscribing to changes in the connection type:
-
-```js
-const handleConnectivityTypeChange = (connectionType) => {
-  console.log('Current connection type:', connectionType);
-}
-NetInfo.addEventListener('change', handleConnectivityTypeChange);
-```
-
-Fetching the connection status:
-
-```js
-NetInfo.isConnected.fetch().then((isConnected) => {
-  console.log('Connection status:', (isConnected ? 'online' : 'offline'));
-});
-```
-
-Subscribing to changes in the connection status:
-
-```js
-const handleConnectivityStatusChange = (isConnected) => {
-  console.log('Current connection status:', (isConnected ? 'online' : 'offline'));
-}
-NetInfo.isConnected.addEventListener('change', handleConnectivityStatusChange);
-```

docs/apis/PixelRatio.md

@@ -1,51 +0,0 @@
-# PixelRatio
-
-`PixelRatio` gives access to the device pixel density.
-
-## Methods
-
-static **get**()
-
-Returns the device pixel density. Some examples:
-
-* PixelRatio.get() === 1
-  * mdpi Android devices (160 dpi)
-* PixelRatio.get() === 1.5
-  * hdpi Android devices (240 dpi)
-* PixelRatio.get() === 2
-  * iPhone 4, 4S
-  * iPhone 5, 5c, 5s
-  * iPhone 6
-  * xhdpi Android devices (320 dpi)
-* PixelRatio.get() === 3
-  * iPhone 6 plus
-  * xxhdpi Android devices (480 dpi)
-* PixelRatio.get() === 3.5
-  * Nexus 6
-
-static **getPixelSizeForLayoutSize**(layoutSize: number)
-
-Converts a layout size (dp) to pixel size (px). Guaranteed to return an integer
-number.
-
-static **roundToNearestPixel**(layoutSize: number)
-
-Rounds a layout size (dp) to the nearest layout size that corresponds to an
-integer number of pixels. For example, on a device with a PixelRatio of 3,
-`PixelRatio.roundToNearestPixel(8.4)` = `8.33`, which corresponds to exactly
-`(8.33 * 3)` = `25` pixels.
-
-## Examples
-
-Fetching a correctly sized image. You should get a higher resolution image if
-you are on a high pixel density device. A good rule of thumb is to multiply the
-size of the image you display by the pixel ratio.
-
-```js
-const image = getImage({
-  width: PixelRatio.getPixelSizeForLayoutSize(200),
-  height: PixelRatio.getPixelSizeForLayoutSize(100),
-});
-
-<Image source={image} style={{ width: 200, height: 100 }} />
-```

docs/apis/Platform.md

@@ -1,45 +0,0 @@
-# Platform
-
-Detect what is the platform in which the app is running. This piece of
-functionality can be useful when only small parts of a component are platform
-specific.
-
-## Properties
-
-**OS**: string
-
-`Platform.OS` will be `web` when running in a Web browser.
-
-```js
-import { Platform } from 'react-native';
-
-const styles = StyleSheet.create({
-  height: (Platform.OS === 'web') ? 200 : 100,
-});
-```
-
-## Methods
-
-**select**(object): any
-
-`Platform.select` takes an object containing `Platform.OS` as keys and returns
-the value for the platform you are currently running on.
-
-```js
-import { Platform } from 'react-native';
-
-const containerStyles = {
-  flex: 1,
-  ...Platform.select({
-    android: {
-      backgroundColor: 'blue'
-    },
-    ios: {
-      backgroundColor: 'red'
-    },
-    web: {
-      backgroundColor: 'green'
-    }
-  })
-});
-```

docs/apis/StyleSheet.md

@@ -1,80 +0,0 @@
-# StyleSheet
-
-The `StyleSheet` abstraction converts predefined styles to (vendor-prefixed)
-CSS without requiring a compile-time step. Styles that cannot be resolved
-outside of the render loop (e.g., dynamic positioning) are usually applied as
-inline styles. Read more about [how to style your
-application](../guides/style.md).
-
-## Methods
-
-**create**(obj: {[key: string]: any})
-
-Each key of the object passed to `create` must define a style object.
-
-**flatten**: function
-
-Flattens an array of styles into a single style object.
-
-(web) **getStyleSheets**: function
-
-Returns an array of stylesheets (`{ id, textContent }`). Useful for
-compile-time or server-side rendering.
-
-## Properties
-
-**absoluteFill**: number
-
-A very common pattern is to create overlays with position absolute and zero positioning,
-so `absoluteFill` can be used for convenience and to reduce duplication of these repeated
-styles.
-
-```js
-<View style={StyleSheet.absoluteFill} />
-```
-
-**absoluteFillObject**: object
-
-Sometimes you may want `absoluteFill` but with a couple tweaks - `absoluteFillObject` can be
-used to create a customized entry in a `StyleSheet`, e.g.:
-
-```js
-const styles = StyleSheet.create({
-  wrapper: {
-    ...StyleSheet.absoluteFillObject,
-    backgroundColor: 'transparent',
-    top: 10
-  }
-})
-```
-
-**hairlineWidth**: number
-
-## Example
-
-```js
-<View style={styles.container}>
-  <Text
-    children={'Title text'}
-    style={[
-      styles.title,
-      this.props.isActive && styles.activeTitle
-    ]}
-  />
-</View>
-
-const styles = StyleSheet.create({
-  container: {
-    borderRadius: 4,
-    borderWidth: 0.5,
-    borderColor: '#d6d7da',
-  },
-  title: {
-    fontSize: 19,
-    fontWeight: 'bold',
-  },
-  activeTitle: {
-    color: 'red',
-  }
-})
-```

docs/apis/Vibration.md

@@ -1,35 +0,0 @@
-# Vibration
-
-Vibration is described as a pattern of on-off pulses, which may be of varying
-lengths. The pattern may consist of either a single integer, describing the
-number of milliseconds to vibrate, or an array of integers describing a pattern
-of vibrations and pauses. Vibration is controlled with a single method:
-`Vibration.vibrate()`.
-
-The vibration is asynchronous so this method will return immediately. There
-will be no effect on devices that do not support vibration.
-
-## Methods
-
-static **cancel**()
-
-Stop the vibration.
-
-static **vibrate**(pattern)
-
-Start the vibration pattern.
-
-## Examples
-
-Vibrate once for 200ms:
-
-```js
-Vibration.vibrate(200);
-Vibration.vibrate([200]);
-```
-
-Vibrate for 200ms, pause for 100ms, vibrate for 200ms:
-
-```js
-Vibration.vibrate([200, 100, 200]);
-```

docs/components/ActivityIndicator.md

@@ -1,70 +0,0 @@
-# ActivityIndicator
-
-## Props
-
-[...View props](./View.md)
-
-**animating**: boolean = true
-
-Whether to show the indicator or hide it.
-
-**color**: ?color = '#1976D2'
-
-The foreground color of the spinner.
-
-**hidesWhenStopped**: ?boolean = true
-
-Whether the indicator should hide when not animating.
-
-**size**: ?enum('small, 'large') | number = 'small'
-
-Size of the indicator. Small has a height of `20`, large has a height of `36`.
-
-## Examples
-
-```js
-import React, { Component } from 'react'
-import { ActivityIndicator, StyleSheet, View } from 'react-native'
-
-class ToggleAnimatingActivityIndicator extends Component {
-  constructor(props) {
-    super(props)
-    this.state = { animating: true }
-  }
-
-  componentDidMount: function() {
-    this.setToggleTimeout();
-  }
-
-  render() {
-    return (
-      <ActivityIndicator
-        animating={this.state.animating}
-        size="large"
-        style={[styles.centering, { height: 80 }]}
-      />
-    );
-  }
-
-  _setToggleTimeout() {
-    setTimeout(() => {
-      this.setState({ animating: !this.state.animating })
-      this._setToggleTimeout()
-    }, 1200)
-  }
-})
-
-const styles = StyleSheet.create({
-  centering: {
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  gray: {
-    backgroundColor: '#cccccc'
-  },
-  horizontal: {
-    flexDirection: 'row',
-    justifyContent: 'space-around'
-  }
-})
-```

docs/components/Button.md

@@ -1,43 +0,0 @@
-# Button
-
-A basic button component. Supports a minimal level of customization. You can
-build your own custom button using `TouchableOpacity` or
-`TouchableNativeFeedback`.
-
-## Props
-
-**accessibilityLabel**: ?string
-
-Overrides the text that's read by a screen reader when the user interacts
-with the element.
-
-**color**: ?string
-
-Background color of the button.
-
-**disabled**: ?boolean
-
-If `true`, disable all interactions for this element.
-
-**onPress**: function
-
-This function is called on press.
-
-**testID**: ?string
-
-Used to locate this view in end-to-end tests.
-
-**title**: string
-
-Text to display inside the button.
-
-## Examples
-
-```js
-<Button
-  accessibilityLabel="Learn more about this purple button"
-  color="#841584"
-  onPress={onPressLearnMore}
-  title="Learn More"
-/>
-```

docs/components/Image.md

@@ -1,167 +0,0 @@
-# Image
-
-An accessibile image component with support for image resizing, default image,
-and child content.
-
-Unsupported React Native props:
-`capInsets` (ios),
-`onProgress` (ios)
-
-## Props
-
-**accessibilityLabel**: ?string
-
-The text that's read by a screenreader when someone interacts with the image.
-
-**accessible**: ?boolean
-
-When `true`, indicates the image is an accessibility element.
-
-**children**: ?any
-
-Content to display over the image.
-
-**defaultSource**: ?object
-
-An image to display as a placeholder while downloading the final image off the
-network. `{ uri: string, width, height }`
-
-**onError**: ?function
-
-Invoked on load error with `{nativeEvent: {error}}`.
-
-**onLayout**: ?function
-
-Invoked on mount and layout changes with `{ nativeEvent: { layout: { x, y, width,
-height } } }`, where `x` and `y` are the offsets from the parent node.
-
-**onLoad**: ?function
-
-Invoked when load completes successfully.
-
-**onLoadEnd**: ?function
-
-Invoked when load either succeeds or fails,
-
-**onLoadStart**: ?function
-
-Invoked on load start.
-
-**resizeMode**: ?enum('center', 'contain', 'cover', 'none', 'repeat', 'stretch') = 'cover'
-
-Determines how to resize the image when the frame doesn't match the raw image
-dimensions.
-
-**source**: ?object
-
-`uri` is a string representing the resource identifier for the image, which
-could be an http address or a base64 encoded image. `{ uri: string, width, height }`
-
-**style**: ?style
-
-+ ...[View#style](./View.md)
-+ `resizeMode`
-
-**testID**: ?string
-
-Used to locate a view in end-to-end tests.
-
-## Properties
-
-static **resizeMode**: object
-
-Example usage:
-
-```
-<Image resizeMode={Image.resizeMode.contain} />
-```
-
-## Methods
-
-static **getSize**(uri: string, success: (width, height) => {}, failure: function)
-
-Retrieve the width and height (in pixels) of an image prior to displaying it.
-This method can fail if the image cannot be found, or fails to download.
-
-(In order to retrieve the image dimensions, the image may first need to be
-loaded or downloaded, after which it will be cached. This means that in
-principle you could use this method to preload images, however it is not
-optimized for that purpose, and may in future be implemented in a way that does
-not fully load/download the image data.)
-
-static **prefetch**(url: string): Promise
-
-Prefetches a remote image for later use by downloading it.
-
-## Examples
-
-```js
-import placeholderAvatar from './placeholderAvatar.png'
-import React, { Component } from 'react'
-import { Image, PropTypes, StyleSheet } from 'react-native'
-
-export default class ImageExample extends Component {
-  constructor(props, context) {
-    super(props, context)
-    this.state = { loading: true }
-  }
-
-  static propTypes = {
-    size: PropTypes.oneOf(['small', 'normal', 'large']),
-    testID: Image.propTypes.testID,
-    user: PropTypes.object
-  }
-
-  static defaultProps = {
-    size: 'normal'
-  }
-
-  _onLoad(e) {
-    console.log('Avatar.onLoad', e)
-    this.setState({ loading: false })
-  }
-
-  render() {
-    const { size, testID, user } = this.props
-    const loadingStyle = this.state.loading ? { styles.loading } : { }
-
-    return (
-      <Image
-        accessibilityLabel={`${user.name}'s profile picture`}
-        defaultSource={{ uri: placeholderAvatar }}
-        onLoad={this._onLoad.bind(this)}
-        resizeMode='cover'
-        source={{ uri: user.avatarUrl }}
-        style={[
-          styles.base,
-          styles[size],
-          loadingStyle
-        ]}
-      />
-    )
-  }
-}
-
-const styles = StyleSheet.create({
-  base: {
-    borderColor: 'white',
-    borderRadius: 5,
-    borderWidth: 5
-  },
-  loading: {
-    opacity: 0.5
-  },
-  small: {
-    height: 32,
-    width: 32
-  },
-  normal: {
-    height: 48,
-    width: 48
-  },
-  large: {
-    height: 64,
-    width: 64
-  }
-})
-```

docs/components/ProgressBar.md

@@ -1,27 +0,0 @@
-# ProgressBar
-
-Display an activity progress bar.
-
-## Props
-
-[...View props](./View.md)
-
-**color**: ?string = '#1976D2'
-
-Color of the progress bar.
-
-**indeterminate**: ?boolean = true
-
-Whether the progress bar will show indeterminate progress.
-
-**progress**: ?number
-
-The progress value (between 0 and 1).
-
-**testID**: ?string
-
-Used to locate this view in end-to-end tests.
-
-(web) **trackColor**: ?string = 'transparent'
-
-Color of the track bar.

docs/components/ScrollView.md

@@ -1,134 +0,0 @@
-# ScrollView
-
-A scrollable `View` that provides itegration with the touch-locking "responder"
-system. `ScrollView`'s must have a bounded height: either set the height of the
-view directly (discouraged) or make sure all parent views have bounded height
-(e.g., transfer `{ flex: 1}` down the view stack).
-
-## Props
-
-[...View props](./View.md)
-
-**contentContainerStyle**: ?style
-
-These styles will be applied to the scroll view content container which wraps
-all of the child views.
-
-**horizontal**: ?boolean = false
-
-When `true`, the scroll view's children are arranged horizontally in a row
-instead of vertically in a column.
-
-**keyboardDismissMode**: ?enum('none', 'on-drag') = 'none'
-
-Determines whether the keyboard gets dismissed in response to a scroll drag.
-
-* `none` (the default), drags do not dismiss the keyboard.
-* `on-drag`, the keyboard is dismissed when a drag begins.
-* `interactive` (not supported on web; same as `none`)
-
-**onContentSizeChange**: ?function
-
-Called when scrollable content view of the `ScrollView` changes. It's
-implemented using the `onLayout` handler attached to the content container
-which this `ScrollView` renders.
-
-**onScroll**: ?function
-
-Fires at most once per frame during scrolling. The frequency of the events can
-be contolled using the `scrollEventThrottle` prop.
-
-Invoked on scroll with the following event:
-
-```js
-{
-  nativeEvent: {
-    contentOffset: { x, y },
-    contentSize: { height, width },
-    layoutMeasurement: { height, width }
-  }
-}
-```
-
-**refreshControl**: ?element
-
-TODO
-
-A [RefreshControl](../RefreshControl) component, used to provide
-pull-to-refresh functionality for the `ScrollView`.
-
-**scrollEnabled**: ?boolean = true
-
-When false, the content does not scroll.
-
-**scrollEventThrottle**: ?number = 0
-
-This controls how often the scroll event will be fired while scrolling (as a
-time interval in ms). A lower number yields better accuracy for code that is
-tracking the scroll position, but can lead to scroll performance problems. The
-default value is `0`, which means the scroll event will be sent only once each
-time the view is scrolled.
-
-## Instance methods
-
-**getInnerViewNode()**: any
-
-Returns a reference to the underlying content container DOM node within the `ScrollView`.
-
-**getScrollableNode()**: any
-
-Returns a reference to the underlying scrollable DOM node.
-
-**getScrollResponder()**: Component
-
-Returns a reference to the underlying scroll responder, which supports
-operations like `scrollTo`. All `ScrollView`-like components should implement
-this method so that they can be composed while providing access to the
-underlying scroll responder's methods.
-
-**scrollTo(options: { x: number = 0; y: number = 0; animated: boolean = true })**
-
-Scrolls to a given `x`, `y` offset (animation is not currently supported).
-
-## Examples
-
-```js
-import React, { Component } from 'react'
-import { ScrollView, StyleSheet } from 'react-native'
-import Item from './Item'
-
-export default class ScrollViewExample extends Component {
-  constructor(props, context) {
-    super(props, context)
-    this.state = {
-      items: Array.from(new Array(20)).map((_, i) => ({ id: i }))
-    }
-  }
-
-  onScroll(e) {
-    console.log(e)
-  }
-
-  render() {
-    return (
-      <ScrollView
-        children={this.state.items.map((item) => <Item {...item} />)}
-        contentContainerStyle={styles.container}
-        horizontal
-        onScroll={(e) => this.onScroll(e)}
-        scrollEventThrottle={100}
-        style={styles.root}
-      />
-    )
-  }
-}
-
-const styles = StyleSheet.create({
-  root: {
-    borderWidth: 1
-  },
-  container: {
-    padding: 10
-  }
-})
-```

docs/components/Switch.md

@@ -1,76 +0,0 @@
-# Switch
-
-This is a controlled component that requires an `onValueChange` callback that
-updates the value prop in order for the component to reflect user actions. If
-the `value` prop is not updated, the component will continue to render the
-supplied `value` prop instead of the expected result of any user actions.
-
-## Props
-
-[...View props](./View.md)
-
-**disabled**: ?boolean = false
-
-If `true` the user won't be able to interact with the switch.
-
-**onValueChange**: ?function
-
-Invoked with the new value when the value changes.
-
-**value**: ?boolean = false
-
-The value of the switch. If `true` the switch will be turned on.
-
-(web) **activeThumbColor**: ?color = #009688
-
-The color of the thumb grip when the switch is turned on.
-
-(web) **activeTrackColor**: ?color = #A3D3CF
-
-The color of the track when the switch is turned on.
-
-(web) **thumbColor**: ?color = #FAFAFA
-
-The color of the thumb grip when the switch is turned off.
-
-(web) **trackColor**: ?color = #939393
-
-The color of the track when the switch is turned off.
-
-## Examples
-
-```js
-import React, { Component } from 'react'
-import { Switch, View } from 'react-native'
-
-class ColorSwitchExample extends Component {
-  constructor(props) {
-    super(props)
-    this.state = {
-      colorTrueSwitchIsOn: true,
-      colorFalseSwitchIsOn: false
-    }
-  }
-
-  render() {
-    return (
-      <View>
-        <Switch
-          activeThumbColor='#428BCA'
-          activeTrackColor='#A0C4E3'
-          onValueChange={(value) => this.setState({ colorFalseSwitchIsOn: value })}
-          value={this.state.colorFalseSwitchIsOn}
-        />
-        <Switch
-          activeThumbColor='#5CB85C'
-          activeTrackColor='#ADDAAD'
-          onValueChange={(value) => this.setState({ colorTrueSwitchIsOn: value })}
-          thumbColor='#EBA9A7'
-          trackColor='#D9534F'
-          value={this.state.colorTrueSwitchIsOn}
-        />
-      </View>
-    )
-  }
-}
-```

docs/components/Text.md

@@ -1,161 +0,0 @@
-# Text
-
-`Text` is component for displaying text. It supports style, basic touch
-handling, and inherits typographic styles from ancestor elements.
-
-The `Text` is unique relative to layout: child elements use text layout
-(`inline`) rather than flexbox layout. This means that elements inside of a
-`Text` are not rectangles, as they wrap when reaching the edge of their
-container.
-
-Unsupported React Native props:
-`allowFontScaling` (ios),
-`suppressHighlighting` (ios)
-
-## Props
-
-NOTE: `Text` will transfer all other props to the rendered HTML element.
-
-(web) **accessibilityLabel**: ?string
-
-Overrides the text that's read by a screen reader when the user interacts
-with the element. (This is implemented using `aria-label`.)
-
-See the [Accessibility guide](../guides/accessibility) for more information.
-
-(web) **accessibilityRole**: ?oneOf(roles)
-
-Allows assistive technologies to present and support interaction with the view
-in a manner that is consistent with user expectations for similar views of that
-type. For example, marking a touchable view with an `accessibilityRole` of
-`button`. (This is implemented using [ARIA roles](http://www.w3.org/TR/wai-aria/roles#role_definitions)).
-
-See the [Accessibility guide](../guides/accessibility) for more information.
-
-**accessible**: ?boolean
-
-When `true`, indicates that the view is an accessibility element (i.e.,
-focusable) and groups its child content. By default, all the touchable elements
-and elements with `accessibilityRole` of `button` and `link` are accessible.
-(This is implemented using `tabindex`.)
-
-See the [Accessibility guide](../guides/accessibility) for more information.
-
-**children**: ?any
-
-Child content.
-
-**importantForAccessibility**: ?enum('auto', 'no-hide-descendants', 'yes')
-
-A value of `no` will remove the element from the tab flow.
-
-A value of `no-hide-descendants` will hide the element and its children from
-assistive technologies. (This is implemented using `aria-hidden`.)
-
-See the [Accessibility guide](../guides/accessibility) for more information.
-
-**numberOfLines**: ?number
-
-Truncates the text with an ellipsis after this many lines. Currently only supports `1`.
-
-**onLayout**: ?function
-
-Invoked on mount and layout changes with `{ nativeEvent: { layout: { x, y, width,
-height } } }`, where `x` and `y` are the offsets from the parent node.
-
-**onPress**: ?function
-
-This function is called on press.
-
-**selectable**: ?boolean
-
-When `false`, the text is not selectable.
-
-**style**: ?style
-
-+ ...[View#style](View.md)
-+ `color`
-+ `fontFamily`
-+ `fontFeatureSettings` ‡
-+ `fontSize`
-+ `fontStyle`
-+ `fontWeight`
-+ `letterSpacing`
-+ `lineHeight`
-+ `textAlign`
-+ `textAlignVertical`
-+ `textDecorationLine`
-+ `textIndent` ‡
-+ `textOverflow` ‡
-+ `textRendering` ‡
-+ `textShadowColor`
-+ `textShadowOffset`
-+ `textShadowRadius`
-+ `textTransform` ‡
-+ `unicodeBidi` ‡
-+ `whiteSpace`
-+ `wordWrap` ‡
-+ `writingDirection`
-
-‡ web only.
-
-**testID**: ?string
-
-Used to locate this view in end-to-end tests.
-
-## Examples
-
-```js
-import React, { Component, PropTypes } from 'react'
-import { StyleSheet, Text } from 'react-native'
-
-export default class PrettyText extends Component {
-  static propTypes = {
-    ...Text.propTypes,
-    color: PropTypes.oneOf(['white', 'gray', 'red']),
-    size: PropTypes.oneOf(['small', 'normal', 'large']),
-    weight: PropTypes.oneOf(['light', 'normal', 'bold'])
-  };
-
-  static defaultProps = {
-    ...Text.defaultProps,
-    color: 'gray',
-    size: 'normal',
-    weight: 'normal'
-  };
-
-  render() {
-    const { color, size, style, weight, ...other } = this.props;
-
-    return (
-      <Text
-        ...other
-        style={[
-          style,
-          colorStyles[color],
-          sizeStyles[size],
-          weightStyles[weight]
-        ]}
-      />
-    );
-  }
-}
-
-const colorStyles = StyleSheet.create({
-  white: { color: 'white' },
-  gray: { color: 'gray' },
-  red: { color: 'red' }
-})
-
-const sizeStyles = StyleSheet.create({
-  small: { fontSize: '0.85rem', padding: '0.5rem' },
-  normal: { fontSize: '1rem', padding: '0.75rem' },
-  large: { fontSize: '1.5rem', padding: '1rem' }
-})
-
-const weightStyles = StyleSheet.create({
-  light: { fontWeight: '300' },
-  normal: { fontWeight: '400' },
-  bold: { fontWeight: '700' }
-})
-```

docs/components/TextInput.md

@@ -1,226 +0,0 @@
-# TextInput
-
-Accessible single- and multi-line text input via a keyboard. Supports features
-such as auto-complete, auto-focus, placeholder text, and event callbacks.
-
-Note: some props are exclusive to or excluded from `multiline`.
-
-Unsupported React Native props:
-`onEndEditing`,
-`clearButtonMode` (ios),
-`enablesReturnKeyAutomatically` (ios),
-`placeholderTextColor`,
-`returnKeyType` (ios),
-`selectionState` (ios),
-`underlineColorAndroid` (android)
-
-## Props
-
-[...View props](./View.md)
-
-**autoCapitalize**: ?enum('characters', 'none', 'sentences', 'words') = 'sentences'
-
-Automatically capitalize certain characters (only available in Chrome and iOS Safari).
-
-* `characters`: Automatically capitalize all characters.
-* `none`: Completely disables automatic capitalization
-* `sentences`: Automatically capitalize the first letter of sentences.
-* `words`: Automatically capitalize the first letter of words.
-
-(web) **autoComplete**: ?string
-
-Indicates whether the value of the control can be automatically completed by
-the browser. [Accepted values](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input).
-
-**autoCorrect**: ?boolean = true
-
-Automatically correct spelling mistakes  (only available in iOS Safari).
-
-**autoFocus**: ?boolean = false
-
-If `true`, focuses the input on `componentDidMount`. Only the first form element
-in a document with `autofocus` is focused.
-
-**blurOnSubmit**: ?boolean
-
-If `true`, the text field will blur when submitted. The default value is `true`
-for single-line fields and `false` for multiline fields. Note, for multiline
-fields setting `blurOnSubmit` to `true` means that pressing return will blur
-the field and trigger the `onSubmitEditing` event instead of inserting a
-newline into the field.
-
-**clearTextOnFocus**: ?boolean = false
-
-If `true`, clears the text field automatically when focused.
-
-**defaultValue**: ?string
-
-Provides an initial value that will change when the user starts typing. Useful
-for simple use-cases where you don't want to deal with listening to events and
-updating the `value` prop to keep the controlled state in sync.
-
-**editable**: ?boolean = true
-
-If `false`, text is not editable (i.e., read-only).
-
-**keyboardType**: enum('default', 'email-address', 'numeric', 'phone-pad', 'search', 'url', 'web-search') = 'default'
-
-Determines which keyboard to open. (NOTE: Safari iOS requires an ancestral
-`<form action>` element to display the `search` keyboard).
-
-(Not available when `multiline` is `true`.)
-
-**maxLength**: ?number
-
-Limits the maximum number of characters that can be entered.
-
-**multiline**: ?boolean = false
-
-If true, the text input can be multiple lines.
-
-**numberOfLines**: ?number = 2
-
-Sets the number of lines for a multiline `TextInput`.
-
-(Requires `multiline` to be `true`.)
-
-**onBlur**: ?function
-
-Callback that is called when the text input is blurred.
-
-**onChange**: ?function
-
-Callback that is called when the text input's text changes.
-
-**onChangeText**: ?function
-
-Callback that is called when the text input's text changes. The text is passed
-as an argument to the callback handler.
-
-**onFocus**: ?function
-
-Callback that is called when the text input is focused.
-
-**onKeyPress**: ?function
-
-Callback that is called when a key is pressed. This will be called with `{
-nativeEvent: { key: keyValue } }` where keyValue is 'Enter` or 'Backspace' for
-respective keys and the typed-in character otherwise including ' ' for space.
-Modifier keys are also included in the nativeEvent. Fires before onChange
-callbacks.
-
-**onSelectionChange**: ?function
-
-Callback that is called when the text input's selection changes. This will be called with
-`{ nativeEvent: { selection: { start, end } } }`.
-
-**onSubmitEditing**: ?function
-
-Callback that is called when the keyboard's submit button is pressed.
-
-**placeholder**: ?string
-
-The string that will be rendered in an empty `TextInput` before text has been
-entered.
-
-**secureTextEntry**: ?boolean = false
-
-If true, the text input obscures the text entered so that sensitive text like
-passwords stay secure.
-
-(Not available when `multiline` is `true`.)
-
-**selection**: ?{ start: number, end: ?number }
-
-The start and end of the text input's selection. Set start and end to the same value to position the cursor.
-
-**selectTextOnFocus**: ?boolean = false
-
-If `true`, all text will automatically be selected on focus.
-
-**style**: ?style
-
-+ ...[Text#style](./Text.md)
-+ `resize` ‡
-
-‡ web only.
-
-**testID**: ?string
-
-Used to locate this view in end-to-end tests.
-
-**value**: ?string
-
-The value to show for the text input. `TextInput` is a controlled component,
-which means the native `value` will be forced to match this prop if provided.
-Read about how [React form
-components](https://facebook.github.io/react/docs/forms.html) work. To prevent
-user edits to the value set `editable={false}`.
-
-## Instance methods
-
-**blur()**
-
-Blur the underlying DOM input.
-
-**clear()**
-
-Clear the text from the underlying DOM input.
-
-**focus()**
-
-Focus the underlying DOM input.
-
-**isFocused()**
-
-Returns `true` if the input is currently focused; `false` otherwise.
-
-## Examples
-
-```js
-import React, { Component } from 'react'
-import { StyleSheet, TextInput } from 'react-native'
-
-export default class TextInputExample extends Component {
-  constructor(props, context) {
-    super(props, context)
-    this.state = { isFocused: false }
-  }
-
-  _onBlur(e) {
-    this.setState({ isFocused: false })
-  }
-
-  _onFocus(e) {
-    this.setState({ isFocused: true })
-  }
-
-  render() {
-    return (
-      <TextInput
-        accessibilityLabel='Write a status update'
-        maxNumberOfLines={5}
-        multiline
-        numberOfLines={2}
-        onBlur={this._onBlur.bind(this)}
-        onFocus={this._onFocus.bind(this)}
-        placeholder={`What's happening?`}
-        style={[
-          styles.default
-          this.state.isFocused && styles.focused
-        ]}
-      />
-    );
-  }
-}
-
-const styles = StyleSheet.create({
-  default: {
-    borderColor: 'gray',
-    borderBottomWidth: 2
-  },
-  focused: {
-    borderColor: 'blue'
-  }
-})
-```

docs/components/TouchableWithoutFeedback.md

@@ -1,46 +0,0 @@
-# TouchableWithoutFeedback
-
-Do not use unless you have a very good reason. All the elements that respond to
-press should have a visual feedback when touched. This is one of the primary
-reason a "web" app doesn't feel "native".
-
-**NOTE: `TouchableWithoutFeedback` supports only one child**. If you wish to have
-several child components, wrap them in a View.
-
-## Props
-
-[...View props](./View.md)
-
-**delayLongPress**: ?number
-
-Delay in ms, from `onPressIn`, before `onLongPress` is called.
-
-**delayPressIn**: ?number
-
-Delay in ms, from the start of the touch, before `onPressIn` is called.
-
-**delayPressOut**: ?number
-
-Delay in ms, from the release of the touch, before `onPressOut` is called.
-
-**disabled**: ?boolean
-
-If `true`, disable all interactions for this component.
-
-**onLongPress**: ?function
-
-**onPress**: ?function
-
-Called when the touch is released, but not if cancelled (e.g. by a scroll that steals the responder lock).
-
-**onPressIn**: ?function
-
-**onPressOut**: ?function
-
-**pressRetentionOffset**: ?`{top: number, left: number, bottom: number, right: number}`
-
-When the scroll view is disabled, this defines how far your touch may move off
-of the button, before deactivating the button. Once deactivated, try moving it
-back and you'll see that the button is once again reactivated! Move it back and
-forth several times while the scroll view is disabled. Ensure you pass in a
-constant to reduce memory allocations.

docs/components/View.md

@@ -1,317 +0,0 @@
-# View
-
-`View` is the fundamental UI building block. It is a component that supports
-style, layout with flexbox, and accessibility controls. It can be nested
-inside another `View` and has 0-to-many children of any type.
-
-Also, refer to React Native's documentation about the [Gesture Responder
-System](http://facebook.github.io/react-native/releases/0.22/docs/gesture-responder-system.html).
-
-Unsupported React Native props: `collapsable`, `onAccessibilityTap`, `onMagicTap`.
-
-## Props
-
-NOTE: `View` will transfer all other props to the rendered HTML element.
-
-**accessibilityLabel**: ?string
-
-Overrides the text that's read by a screen reader when the user interacts
-with the element. (This is implemented using `aria-label`.)
-
-See the [Accessibility guide](../guides/accessibility.md) for more information.
-
-**accessibilityLiveRegion**: ?enum('assertive', 'none', 'polite')
-
-Indicates to assistive technologies whether to notify the user when the view
-changes. The values of this attribute are expressed in degrees of importance.
-When regions are specified as `polite` (recommended), updates take low
-priority. When regions are specified as `assertive`, assistive technologies
-will interrupt and immediately notify the user. (This is implemented using
-[`aria-live`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-live).)
-
-See the [Accessibility guide](../guides/accessibility.md) for more information.
-
-(web) **accessibilityRole**: ?enum(roles)
-
-Allows assistive technologies to present and support interaction with the view
-in a manner that is consistent with user expectations for similar views of that
-type. For example, marking a touchable view with an `accessibilityRole` of
-`button`. (This is implemented using [ARIA roles](http://www.w3.org/TR/wai-aria/roles#role_definitions)).
-
-See the [Accessibility guide](../guides/accessibility.md) for more information.
-
-**accessible**: ?boolean
-
-When `true`, indicates that the view is an accessibility element (i.e.,
-focusable) and groups its child content. By default, all the touchable elements
-and elements with `accessibilityRole` of `button` and `link` are accessible.
-(This is implemented using `tabindex`.)
-
-See the [Accessibility guide](../guides/accessibility.md) for more information.
-
-**children**: ?element
-
-Child content.
-
-**hitSlop**: ?object
-
-This defines how far a touch event can start away from the view (in pixels).
-Typical interface guidelines recommend touch targets that are at least 30 - 40
-points/density-independent pixels.
-
-For example, if a touchable view has a height of `20` the touchable height can
-be extended to `40` with `hitSlop={{top: 10, bottom: 10, left: 0, right: 0}}`.
-
-**importantForAccessibility**: ?enum('auto', 'no', 'no-hide-descendants', 'yes')
-
-A value of `no` will remove the element from the tab flow.
-
-A value of `no-hide-descendants` will hide the element and its children from
-assistive technologies. (This is implemented using `aria-hidden`.)
-
-See the [Accessibility guide](../guides/accessibility.md) for more information.
-
-**onLayout**: ?function
-
-Invoked on mount and layout changes with `{ nativeEvent: { layout: { x, y, width,
-height } } }`, where `x` and `y` are the offsets from the parent node.
-
-**onMoveShouldSetResponder**: ?function => boolean
-
-Does this view want to "claim" touch responsiveness? This is called for every
-touch move on the `View` when it is not the responder.
-
-**onMoveShouldSetResponderCapture**: ?function => boolean
-
-If a parent `View` wants to prevent a child `View` from becoming responder on a
-move, it should have this handler return `true`.
-
-**onResponderGrant**: ?function
-
-The `View` is now responding to touch events. This is the time to highlight and
-show the user what is happening.  For most touch interactions, you'll simply
-want to wrap your component in `TouchableHighlight` or `TouchableOpacity`.
-
-**onResponderMove**: ?function
-
-The user is moving their finger.
-
-**onResponderReject**: ?function
-
-Another responder is already active and will not release it to the `View`
-asking to be the responder.
-
-**onResponderRelease**: ?function
-
-Fired at the end of the touch.
-
-**onResponderTerminate**: ?function
-
-The responder has been taken from the `View`.
-
-**onResponderTerminationRequest**: ?function
-
-Some other `View` wants to become responder and is asking this `View` to
-release its responder. Returning `true` allows its release.
-
-**onStartShouldSetResponder**: ?function => boolean
-
-Does this view want to become responder on the start of a touch?
-
-**onStartShouldSetResponderCapture**: ?function => boolean
-
-If a parent `View` wants to prevent a child `View` from becoming the responder
-on a touch start, it should have this handler return `true`.
-
-**pointerEvents**: ?enum('auto', 'box-only', 'box-none', 'none') = 'auto'
-
-Controls whether the View can be the target of touch events. The enhanced
-`pointerEvents` modes provided are not part of the CSS spec, therefore,
-`pointerEvents` is excluded from `style`.
-
-`box-none` is the equivalent of:
-
-```css
-.box-none { pointer-events: none !important; }
-.box-none > * { pointer-events: auto; }
-```
-
-`box-only` is the equivalent of:
-
-```css
-.box-only { pointer-events: auto !important; }
-.box-only > * { pointer-events: none; }
-```
-
-**style**: ?style
-
-+ `alignContent`
-+ `alignItems`
-+ `alignSelf`
-+ `animationDelay` ‡
-+ `animationDirection` ‡
-+ `animationDuration` ‡
-+ `animationFillMode` ‡
-+ `animationIterationCount` ‡
-+ `animationName` ‡
-+ `animationPlayState` ‡
-+ `animationTimingFunction` ‡
-+ `backfaceVisibility`
-+ `backgroundAttachment` ‡
-+ `backgroundBlendMode` ‡
-+ `backgroundClip` ‡
-+ `backgroundColor`
-+ `backgroundImage` ‡
-+ `backgroundOrigin` ‡
-+ `backgroundPosition` ‡
-+ `backgroundRepeat` ‡
-+ `backgroundSize` ‡
-+ `borderColor` (single value)
-+ `borderTopColor`
-+ `borderBottomColor`
-+ `borderRightColor`
-+ `borderLeftColor`
-+ `borderRadius` (single value)
-+ `borderTopLeftRadius`
-+ `borderTopRightRadius`
-+ `borderBottomLeftRadius`
-+ `borderBottomRightRadius`
-+ `borderStyle` (single value)
-+ `borderTopStyle`
-+ `borderRightStyle`
-+ `borderBottomStyle`
-+ `borderLeftStyle`
-+ `borderWidth` (single value)
-+ `borderBottomWidth`
-+ `borderLeftWidth`
-+ `borderRightWidth`
-+ `borderTopWidth`
-+ `bottom`
-+ `boxShadow` ‡
-+ `boxSizing`
-+ `clip` ‡
-+ `cursor` ‡
-+ `display`
-+ `filter` ‡
-+ `flex` (number)
-+ `flexBasis`
-+ `flexDirection`
-+ `flexGrow`
-+ `flexShrink`
-+ `flexWrap`
-+ `gridAutoColumns` ‡
-+ `gridAutoFlow` ‡
-+ `gridAutoRows` ‡
-+ `gridColumnEnd` ‡
-+ `gridColumnGap` ‡
-+ `gridColumnStart` ‡
-+ `gridRowEnd` ‡
-+ `gridRowGap` ‡
-+ `gridRowStart` ‡
-+ `gridTemplateColumns` ‡
-+ `gridTemplateRows` ‡
-+ `gridTemplateAreas` ‡
-+ `height`
-+ `justifyContent`
-+ `left`
-+ `margin` (single value)
-+ `marginBottom`
-+ `marginHorizontal`
-+ `marginLeft`
-+ `marginRight`
-+ `marginTop`
-+ `marginVertical`
-+ `maxHeight`
-+ `maxWidth`
-+ `minHeight`
-+ `minWidth`
-+ `opacity`
-+ `order`
-+ `outline` ‡
-+ `outlineColor` ‡
-+ `overflow`
-+ `overflowX` ‡
-+ `overflowY` ‡
-+ `padding` (single value)
-+ `paddingBottom`
-+ `paddingHorizontal`
-+ `paddingLeft`
-+ `paddingRight`
-+ `paddingTop`
-+ `paddingVertical`
-+ `perspective` ‡
-+ `perspectiveOrigin` ‡
-+ `position`
-+ `right`
-+ `shadowColor`
-+ `shadowOffset`
-+ `shadowOpacity`
-+ `shadowRadius`
-+ `top`
-+ `transform`
-+ `transformOrigin` ‡
-+ `transitionDelay` ‡
-+ `transitionDuration` ‡
-+ `transitionProperty` ‡
-+ `transitionTimingFunction` ‡
-+ `userSelect` ‡
-+ `visibility` ‡
-+ `width`
-+ `willChange` ‡
-+ `zIndex`
-
-‡ web only.
-
-Default:
-
-```js
-{
-  alignItems: 'stretch',
-  borderWidth: 0,
-  borderStyle: 'solid',
-  boxSizing: 'border-box',
-  display: 'flex',
-  flexBasis: 'auto',
-  flexDirection: 'column',
-  flexShrink: 0,
-  margin: 0,
-  padding: 0,
-  position: 'relative'
-};
-```
-
-(See [facebook/yoga](https://github.com/facebook/yoga)).
-
-**testID**: ?string
-
-Used to locate this view in end-to-end tests.
-
-## Examples
-
-```js
-import React, { Component, PropTypes } from 'react'
-import { StyleSheet, View } from 'react-native'
-
-export default class ViewExample extends Component {
-  render() {
-    return (
-      <View style={styles.row}>
-        {
-          ['1', '2', '3', '4', '5'].map((value, i) => {
-            return <View children={value} key={i} style={styles.cell} />
-          })
-        }
-      </View>
-    );
-  }
-}
-
-const styles = StyleSheet.create({
-  row: {
-    flexDirection: 'row'
-  },
-  cell: {
-    flexGrow: 1
-  }
-})
-```

docs/storybook/2-apis/NetInfo/NetInfoScreen.js

@@ -8,61 +8,94 @@ import UIExplorer, {
   Code,
   Description,
   DocItem,
+  ExternalLink,
   Section,
-  storiesOf,
-  TextList
+  storiesOf
 } from '../../ui-explorer';
 
 const NetInfoScreen = () => (
   <UIExplorer title="NetInfo" url="2-apis/NetInfo">
     <Description>
       <AppText>
-        NetInfo asynchronously determines the online/offline status of the application.
+        NetInfo asynchronously determines the online/offline status and additional connection
+        information (where available) of the application.
       </AppText>
       <AppText>
-        Note that support for retrieving the connection type depends upon browser support (and is
-        limited to mobile browsers). It will default to <Code>unknown</Code> when support is
-        missing.
+        Note that connection type information is limited to how well the browser supports the{' '}
+        <ExternalLink href="https://developer.mozilla.org/en-US/docs/Web/API/NetworkInformation">
+          NetworkInformation API
+        </ExternalLink>. Connection types will be <Code>unknown</Code> when support is missing.
       </AppText>
     </Description>
 
+    <Section title="Types">
+      <DocItem
+        description={
+          <AppText>
+            One of <Code>slow-2g</Code>, <Code>2g</Code>, <Code>3g</Code>, <Code>4g</Code>,{' '}
+            <Code>unknown</Code>.
+          </AppText>
+        }
+        name="ConnectionType"
+      />
+      <DocItem
+        description={
+          <AppText>
+            One of <Code>bluebooth</Code>, <Code>cellular</Code>, <Code>ethernet</Code>,{' '}
+            <Code>mixed</Code>, <Code>mixed</Code>, <Code>none</Code>, <Code>other</Code>,{' '}
+            <Code>unknown</Code>, <Code>wifi</Code>, <Code>wimax</Code>
+          </AppText>
+        }
+        name="EffectiveConnectionType"
+      />
+
+      <DocItem
+        description={
+          <Code>{`{
+  effectiveType: EffectiveConnectionType;
+  type: ConnectionType;
+  downlink?: number;
+  downlinkMax?: number;
+  rtt?: number;
+}`}</Code>
+        }
+        name="ConnectionEventType"
+      />
+    </Section>
+
     <Section title="Methods">
       <DocItem
-        description={[
+        description={
           <AppText>
-            Invokes the listener whenever network status changes. The listener receives one of the
-            following connectivity types (from the DOM connection API):
-          </AppText>,
-          <TextList
-            items={[
-              'bluetooth',
-              'cellular',
-              'ethernet',
-              'mixed',
-              'none',
-              'other',
-              'unknown',
-              'wifi',
-              'wimax'
-            ]}
-          />
-        ]}
+            Adds an event handler. The <Code>connectionChange</Code> event fires when the network
+            status changes. The argument to the event handler is an object of type{' '}
+            <Code>ConnectionEventType</Code>.
+          </AppText>
+        }
         example={{
-          code: "NetInfo.addEventListener('change', (connectionType) => {})"
+          code: `NetInfo.addEventListener('connectionChange', ({ effectiveType, type }) => {
+  console.log('Effective connection type:', effectiveType);
+  console.log('Connection type:', type);
+})`
         }}
         name="static addEventListener"
         typeInfo="(eventName, handler) => void"
       />
 
       <DocItem
-        description="Returns a promise that resolves with one of the connectivity types listed above."
+        description={
+          <AppText>
+            Returns a promise that resolves with an object of type <Code>ConnectionEventType</Code>.
+          </AppText>
+        }
         example={{
-          code: `NetInfo.fetch().then((connectionType) => {
-  console.log('Connection type:', connectionType);
+          code: `NetInfo.getConnectionInfo().then(({ effectiveType, type }) => {
+  console.log('Effective connection type:', effectiveType);
+  console.log('Connection type:', type);
 });`
         }}
-        name="static fetch"
-        typeInfo="() => Promise<string>"
+        name="static getConnectionInfo"
+        typeInfo="() => Promise<ConnectionEventType>"
       />
 
       <DocItem
@@ -76,7 +109,7 @@ const NetInfoScreen = () => (
       <DocItem
         description="An object with the same methods as above but the listener receives a boolean which represents the internet connectivity. Use this if you are only interested with whether the device has internet connectivity."
         example={{
-          code: `NetInfo.isConnected.fetch().then((isConnected) => {
+          code: `NetInfo.isConnected.getConnectionInfo().then((isConnected) => {
   console.log('Connection status:', (isConnected ? 'online' : 'offline'));
 });`
         }}

docs/storybook/ui-explorer/AppText.js

@@ -4,16 +4,27 @@
  * @flow
  */
 
+import { bool } from 'prop-types';
 import React from 'react';
 import { StyleSheet, Text } from 'react-native';
 
-const AppText = ({ style, ...rest }) => (
-  <Text
-    {...rest}
-    accessibilityRole={rest.href ? 'link' : undefined}
-    style={[styles.baseText, style, rest.href && styles.link]}
-  />
-);
+class AppText extends React.PureComponent {
+  static contextTypes = {
+    isInAParentText: bool
+  };
+
+  render() {
+    const { style, ...rest } = this.props;
+    const isInAParentText = this.context;
+    return (
+      <Text
+        {...rest}
+        accessibilityRole={rest.href ? 'link' : undefined}
+        style={[!isInAParentText && styles.baseText, style, rest.href && styles.link]}
+      />
+    );
+  }
+}
 
 export default AppText;
 

docs/storybook/ui-explorer/DocItem.js

@@ -31,13 +31,13 @@ const DocItem = ({ description, example = {}, name, typeInfo, label }) => (
     )}
     {description && <View style={styles.description}>{createDescription(description)}</View>}
     {(example.render || example.code) && (
-        <View style={styles.renderBox}>
-          <AppText style={styles.exampleText}>Example</AppText>
-          {example.render && <View>{example.render()}</View>}
-          {example.render && example.code && <View style={styles.verticalDivider} />}
-          {example.code && <Text style={styles.code}>{example.code}</Text>}
-        </View>
-      )}
+      <View style={styles.renderBox}>
+        <AppText style={styles.exampleText}>Example</AppText>
+        {example.render && <View>{example.render()}</View>}
+        {example.render && example.code && <View style={styles.verticalDivider} />}
+        {example.code && <Text style={styles.code}>{example.code}</Text>}
+      </View>
+    )}
   </View>
 );
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-web",
-  "version": "0.1.0",
+  "version": "0.1.4",
   "description": "React Native for Web",
   "main": "dist/index.js",
   "module": "dist/module.js",
@@ -30,17 +30,28 @@
     "test": "flow && jest"
   },
   "babel": {
-    "presets": [ "react-native" ],
+    "presets": [
+      "react-native"
+    ],
     "plugins": [
-      [ "transform-react-remove-prop-types", { "mode": "wrap" } ]
+      [
+        "transform-react-remove-prop-types",
+        {
+          "mode": "wrap"
+        }
+      ]
     ]
   },
   "jest": {
     "testEnvironment": "jsdom",
     "timers": "fake",
-    "setupFiles": [ "raf/polyfill" ],
+    "setupFiles": [
+      "raf/polyfill"
+    ],
     "setupTestFrameworkScriptFile": "<rootDir>/jest-setup-framework.js",
-    "snapshotSerializers": [ "enzyme-to-json/serializer" ]
+    "snapshotSerializers": [
+      "enzyme-to-json/serializer"
+    ]
   },
   "lint-staged": {
     "**/*.js": [
@@ -69,22 +80,22 @@
     "babel-eslint": "^7.2.3",
     "babel-loader": "^7.1.2",
     "babel-plugin-tester": "^4.0.0",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.8",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.9",
     "babel-preset-react-native": "^4.0.0",
     "caniuse-api": "^2.0.0",
     "del-cli": "^1.1.0",
     "enzyme": "^3.0.0",
     "enzyme-adapter-react-16": "^1.0.0",
-    "enzyme-to-json": "next",
+    "enzyme-to-json": "^3.0.1",
     "eslint": "^4.6.1",
-    "eslint-config-prettier": "^2.4.0",
+    "eslint-config-prettier": "^2.6.0",
     "eslint-plugin-promise": "^3.5.0",
-    "eslint-plugin-react": "^7.3.0",
-    "file-loader": "^0.11.2",
+    "eslint-plugin-react": "^7.4.0",
+    "file-loader": "^1.1.4",
     "flow-bin": "^0.49.1",
-    "jest": "^21.1.0",
+    "jest": "^21.2.1",
     "lint-staged": "^4.1.3",
-    "prettier": "^1.7.0",
+    "prettier": "^1.7.3",
     "raf": "^3.3.2",
     "react": "^16.0.0",
     "react-dom": "^16.0.0",

src/apis/NetInfo/__tests__/index-test.js

@@ -3,31 +3,44 @@
 import NetInfo from '..';
 
 describe('apis/NetInfo', () => {
+  describe('getConnectionInfo', () => {
+    test('fills out basic fields', done => {
+      NetInfo.getConnectionInfo().then(result => {
+        expect(result.effectiveType).toBeDefined();
+        expect(result.type).toBeDefined();
+        done();
+      });
+    });
+  });
+
   describe('isConnected', () => {
     const handler = () => {};
 
     afterEach(() => {
       try {
-        NetInfo.isConnected.removeEventListener('change', handler);
+        NetInfo.isConnected.removeEventListener('connectionChange', handler);
       } catch (e) {}
     });
 
     describe('addEventListener', () => {
       test('throws if the provided "eventType" is not supported', () => {
         expect(() => NetInfo.isConnected.addEventListener('foo', handler)).toThrow();
-        expect(() => NetInfo.isConnected.addEventListener('change', handler)).not.toThrow();
+        expect(() =>
+          NetInfo.isConnected.addEventListener('connectionChange', handler)
+        ).not.toThrow();
       });
     });
 
     describe('removeEventListener', () => {
       test('throws if the handler is not registered', () => {
-        expect(() => NetInfo.isConnected.removeEventListener('change', handler)).toThrow;
+        expect(() => NetInfo.isConnected.removeEventListener('connectionChange', handler)).toThrow;
       });
 
       test('throws if the provided "eventType" is not supported', () => {
-        NetInfo.isConnected.addEventListener('change', handler);
+        NetInfo.isConnected.addEventListener('connectionChange', handler);
         expect(() => NetInfo.isConnected.removeEventListener('foo', handler)).toThrow;
-        expect(() => NetInfo.isConnected.removeEventListener('change', handler)).not.toThrow;
+        expect(() => NetInfo.isConnected.removeEventListener('connectionChange', handler)).not
+          .toThrow;
       });
     });
   });

src/apis/NetInfo/index.js

@@ -20,7 +20,27 @@ const connection =
     window.navigator.mozConnection ||
     window.navigator.webkitConnection);
 
-const eventTypes = ['change'];
+// Prevent the underlying event handlers from leaking and include additional
+// properties available in browsers
+const getConnectionInfoObject = () => {
+  const result = {};
+  if (!connection) {
+    return result;
+  }
+  for (const prop in connection) {
+    if (typeof connection[prop] !== 'function') {
+      result[prop] = connection[prop];
+    }
+  }
+  return result;
+};
+
+// Map React Native events to browser equivalents
+const eventTypesMap = {
+  change: 'change',
+  connectionChange: 'change'
+};
+const eventTypes = Object.keys(eventTypesMap);
 
 const connectionListeners = [];
 
@@ -31,6 +51,9 @@ const connectionListeners = [];
 const NetInfo = {
   addEventListener(type: string, handler: Function): { remove: () => void } {
     invariant(eventTypes.indexOf(type) !== -1, 'Trying to subscribe to unknown event: "%s"', type);
+    if (type === 'change') {
+      console.warn('Listening to event `change` is deprecated. Use `connectionChange` instead.');
+    }
     if (!connection) {
       console.error(
         'Network Connection API is not supported. Not listening for connection type changes.'
@@ -40,21 +63,25 @@ const NetInfo = {
       };
     }
 
-    connection.addEventListener(type, handler);
+    connection.addEventListener(eventTypesMap[type], handler);
     return {
-      remove: () => NetInfo.removeEventListener(type, handler)
+      remove: () => NetInfo.removeEventListener(eventTypesMap[type], handler)
     };
   },
 
   removeEventListener(type: string, handler: Function): void {
     invariant(eventTypes.indexOf(type) !== -1, 'Trying to subscribe to unknown event: "%s"', type);
+    if (type === 'change') {
+      console.warn('Listening to event `change` is deprecated. Use `connectionChange` instead.');
+    }
     if (!connection) {
       return;
     }
-    connection.removeEventListener(type, handler);
+    connection.removeEventListener(eventTypesMap[type], handler);
   },
 
   fetch(): Promise<any> {
+    console.warn('`fetch` is deprecated. Use `getConnectionInfo` instead.');
     return new Promise((resolve, reject) => {
       try {
         resolve(connection.type);
@@ -64,6 +91,16 @@ const NetInfo = {
     });
   },
 
+  getConnectionInfo(): Promise<Object> {
+    return new Promise((resolve, reject) => {
+      resolve({
+        effectiveType: 'unknown',
+        type: 'unknown',
+        ...getConnectionInfoObject()
+      });
+    });
+  },
+
   isConnected: {
     addEventListener(type: string, handler: Function): { remove: () => void } {
       invariant(
@@ -71,6 +108,10 @@ const NetInfo = {
         'Trying to subscribe to unknown event: "%s"',
         type
       );
+      if (type === 'change') {
+        console.warn('Listening to event `change` is deprecated. Use `connectionChange` instead.');
+      }
+
       const onlineCallback = () => handler(true);
       const offlineCallback = () => handler(false);
       connectionListeners.push([handler, onlineCallback, offlineCallback]);
@@ -79,7 +120,7 @@ const NetInfo = {
       window.addEventListener('offline', offlineCallback, false);
 
       return {
-        remove: () => NetInfo.isConnected.removeEventListener(type, handler)
+        remove: () => NetInfo.isConnected.removeEventListener(eventTypesMap[type], handler)
       };
     },
 
@@ -89,6 +130,9 @@ const NetInfo = {
         'Trying to subscribe to unknown event: "%s"',
         type
       );
+      if (type === 'change') {
+        console.warn('Listening to event `change` is deprecated. Use `connectionChange` instead.');
+      }
 
       const listenerIndex = findIndex(connectionListeners, pair => pair[0] === handler);
       invariant(
@@ -103,7 +147,12 @@ const NetInfo = {
       connectionListeners.splice(listenerIndex, 1);
     },
 
-    fetch(): Promise<any> {
+    fetch(): Promise<boolean> {
+      console.warn('`fetch` is deprecated. Use `getConnectionInfo` instead.');
+      return NetInfo.isConnected.getConnectionInfo();
+    },
+
+    getConnectionInfo(): Promise<boolean> {
       return new Promise((resolve, reject) => {
         try {
           resolve(window.navigator.onLine);

src/index.js

@@ -1,136 +1,2 @@
-import {
-  // top-level API
-  findNodeHandle,
-  hydrate,
-  render,
-  unmountComponentAtNode,
-
-  // modules
-  createElement,
-  NativeModules,
-  processColor,
-
-  // APIs
-  Animated,
-  AppRegistry,
-  AppState,
-  AsyncStorage,
-  BackAndroid,
-  Clipboard,
-  Dimensions,
-  Easing,
-  I18nManager,
-  InteractionManager,
-  Keyboard,
-  Linking,
-  NetInfo,
-  PanResponder,
-  PixelRatio,
-  Platform,
-  StyleSheet,
-  UIManager,
-  Vibration,
-
-  // components
-  ActivityIndicator,
-  Button,
-  FlatList,
-  Image,
-  KeyboardAvoidingView,
-  ListView,
-  Modal,
-  Picker,
-  ProgressBar,
-  RefreshControl,
-  ScrollView,
-  SectionList,
-  Slider,
-  StatusBar,
-  Switch,
-  Text,
-  TextInput,
-  Touchable,
-  TouchableHighlight,
-  TouchableNativeFeedback,
-  TouchableOpacity,
-  TouchableWithoutFeedback,
-  View,
-  VirtualizedList,
-
-  // propTypes
-  ColorPropType,
-  EdgeInsetsPropType,
-  PointPropType,
-  TextPropTypes,
-  ViewPropTypes
-} from './module';
-
-const ReactNative = {
-  // top-level API
-  findNodeHandle,
-  hydrate,
-  render,
-  unmountComponentAtNode,
-
-  // modules
-  createElement,
-  NativeModules,
-  processColor,
-
-  // APIs
-  Animated,
-  AppRegistry,
-  AppState,
-  AsyncStorage,
-  BackAndroid,
-  BackHandler: BackAndroid,
-  Clipboard,
-  Dimensions,
-  Easing,
-  I18nManager,
-  InteractionManager,
-  Keyboard,
-  Linking,
-  NetInfo,
-  PanResponder,
-  PixelRatio,
-  Platform,
-  StyleSheet,
-  UIManager,
-  Vibration,
-
-  // components
-  ActivityIndicator,
-  Button,
-  FlatList,
-  Image,
-  KeyboardAvoidingView,
-  ListView,
-  Modal,
-  Picker,
-  ProgressBar,
-  RefreshControl,
-  ScrollView,
-  SectionList,
-  Slider,
-  StatusBar,
-  Switch,
-  Text,
-  TextInput,
-  Touchable,
-  TouchableHighlight,
-  TouchableNativeFeedback,
-  TouchableOpacity,
-  TouchableWithoutFeedback,
-  View,
-  VirtualizedList,
-
-  // propTypes
-  ColorPropType,
-  EdgeInsetsPropType,
-  PointPropType,
-  TextPropTypes,
-  ViewPropTypes
-};
-
+import ReactNative from './module';
 module.exports = ReactNative;

src/module.js

@@ -1,61 +1,192 @@
-export { default as createElement } from './modules/createElement';
-export { default as findNodeHandle } from './modules/findNodeHandle';
-export { default as NativeModules } from './modules/NativeModules';
-export { default as processColor } from './modules/processColor';
-export { hydrate, render, unmountComponentAtNode } from 'react-dom';
+import createElement from './modules/createElement';
+import findNodeHandle from './modules/findNodeHandle';
+import NativeModules from './modules/NativeModules';
+import processColor from './modules/processColor';
+import { hydrate, render, unmountComponentAtNode } from 'react-dom';
 
 // APIs
-export { default as Animated } from './apis/Animated';
-export { default as AppRegistry } from './apis/AppRegistry';
-export { default as AppState } from './apis/AppState';
-export { default as AsyncStorage } from './apis/AsyncStorage';
-export { default as BackAndroid } from './apis/BackAndroid';
-export { default as Clipboard } from './apis/Clipboard';
-export { default as Dimensions } from './apis/Dimensions';
-export { default as Easing } from './apis/Easing';
-export { default as I18nManager } from './apis/I18nManager';
-export { default as Keyboard } from './apis/Keyboard';
-export { default as InteractionManager } from './apis/InteractionManager';
-export { default as Linking } from './apis/Linking';
-export { default as NetInfo } from './apis/NetInfo';
-export { default as PanResponder } from './apis/PanResponder';
-export { default as PixelRatio } from './apis/PixelRatio';
-export { default as Platform } from './apis/Platform';
-export { default as StyleSheet } from './apis/StyleSheet';
-export { default as UIManager } from './apis/UIManager';
-export { default as Vibration } from './apis/Vibration';
+import Animated from './apis/Animated';
+import AppRegistry from './apis/AppRegistry';
+import AppState from './apis/AppState';
+import AsyncStorage from './apis/AsyncStorage';
+import BackAndroid from './apis/BackAndroid';
+import Clipboard from './apis/Clipboard';
+import Dimensions from './apis/Dimensions';
+import Easing from './apis/Easing';
+import I18nManager from './apis/I18nManager';
+import Keyboard from './apis/Keyboard';
+import InteractionManager from './apis/InteractionManager';
+import Linking from './apis/Linking';
+import NetInfo from './apis/NetInfo';
+import PanResponder from './apis/PanResponder';
+import PixelRatio from './apis/PixelRatio';
+import Platform from './apis/Platform';
+import StyleSheet from './apis/StyleSheet';
+import UIManager from './apis/UIManager';
+import Vibration from './apis/Vibration';
 
 // components
-export { default as ActivityIndicator } from './components/ActivityIndicator';
-export { default as Button } from './components/Button';
-export { default as FlatList } from './components/FlatList';
-export { default as Image } from './components/Image';
-export { default as KeyboardAvoidingView } from './components/KeyboardAvoidingView';
-export { default as ListView } from './components/ListView';
-export { default as Modal } from './components/Modal';
-export { default as Picker } from './components/Picker';
-export { default as ProgressBar } from './components/ProgressBar';
-export { default as RefreshControl } from './components/RefreshControl';
-export { default as ScrollView } from './components/ScrollView';
-export { default as SectionList } from './components/SectionList';
-export { default as Slider } from './components/Slider';
-export { default as StatusBar } from './components/StatusBar';
-export { default as Switch } from './components/Switch';
-export { default as Text } from './components/Text';
-export { default as TextInput } from './components/TextInput';
-export { default as Touchable } from './components/Touchable/Touchable';
-export { default as TouchableHighlight } from './components/Touchable/TouchableHighlight';
-export { default as TouchableNativeFeedback } from './components/Touchable/TouchableNativeFeedback';
-export { default as TouchableOpacity } from './components/Touchable/TouchableOpacity';
-export {
-  default as TouchableWithoutFeedback
-} from './components/Touchable/TouchableWithoutFeedback';
-export { default as View } from './components/View';
-export { default as VirtualizedList } from './components/VirtualizedList';
+import ActivityIndicator from './components/ActivityIndicator';
+import Button from './components/Button';
+import FlatList from './components/FlatList';
+import Image from './components/Image';
+import KeyboardAvoidingView from './components/KeyboardAvoidingView';
+import ListView from './components/ListView';
+import Modal from './components/Modal';
+import Picker from './components/Picker';
+import ProgressBar from './components/ProgressBar';
+import RefreshControl from './components/RefreshControl';
+import ScrollView from './components/ScrollView';
+import SectionList from './components/SectionList';
+import Slider from './components/Slider';
+import StatusBar from './components/StatusBar';
+import Switch from './components/Switch';
+import Text from './components/Text';
+import TextInput from './components/TextInput';
+import Touchable from './components/Touchable/Touchable';
+import TouchableHighlight from './components/Touchable/TouchableHighlight';
+import TouchableNativeFeedback from './components/Touchable/TouchableNativeFeedback';
+import TouchableOpacity from './components/Touchable/TouchableOpacity';
+import TouchableWithoutFeedback from './components/Touchable/TouchableWithoutFeedback';
+import View from './components/View';
+import VirtualizedList from './components/VirtualizedList';
 
 // propTypes
-export { default as ColorPropType } from './propTypes/ColorPropType';
-export { default as EdgeInsetsPropType } from './propTypes/EdgeInsetsPropType';
-export { default as PointPropType } from './propTypes/PointPropType';
-export { default as TextPropTypes } from './components/Text/TextPropTypes';
-export { default as ViewPropTypes } from './components/View/ViewPropTypes';
+import ColorPropType from './propTypes/ColorPropType';
+import EdgeInsetsPropType from './propTypes/EdgeInsetsPropType';
+import PointPropType from './propTypes/PointPropType';
+import TextPropTypes from './components/Text/TextPropTypes';
+import ViewPropTypes from './components/View/ViewPropTypes';
+
+export {
+  // top-level API
+  findNodeHandle,
+  hydrate,
+  render,
+  unmountComponentAtNode,
+  // modules
+  createElement,
+  NativeModules,
+  processColor,
+  // APIs
+  Animated,
+  AppRegistry,
+  AppState,
+  AsyncStorage,
+  BackAndroid,
+  Clipboard,
+  Dimensions,
+  Easing,
+  I18nManager,
+  InteractionManager,
+  Keyboard,
+  Linking,
+  NetInfo,
+  PanResponder,
+  PixelRatio,
+  Platform,
+  StyleSheet,
+  UIManager,
+  Vibration,
+  // components
+  ActivityIndicator,
+  Button,
+  FlatList,
+  Image,
+  KeyboardAvoidingView,
+  ListView,
+  Modal,
+  Picker,
+  ProgressBar,
+  RefreshControl,
+  ScrollView,
+  SectionList,
+  Slider,
+  StatusBar,
+  Switch,
+  Text,
+  TextInput,
+  Touchable,
+  TouchableHighlight,
+  TouchableNativeFeedback,
+  TouchableOpacity,
+  TouchableWithoutFeedback,
+  View,
+  VirtualizedList,
+  // propTypes
+  ColorPropType,
+  EdgeInsetsPropType,
+  PointPropType,
+  TextPropTypes,
+  ViewPropTypes
+};
+
+const ReactNative = {
+  // top-level API
+  findNodeHandle,
+  hydrate,
+  render,
+  unmountComponentAtNode,
+
+  // modules
+  createElement,
+  NativeModules,
+  processColor,
+
+  // APIs
+  Animated,
+  AppRegistry,
+  AppState,
+  AsyncStorage,
+  BackAndroid,
+  BackHandler: BackAndroid,
+  Clipboard,
+  Dimensions,
+  Easing,
+  I18nManager,
+  InteractionManager,
+  Keyboard,
+  Linking,
+  NetInfo,
+  PanResponder,
+  PixelRatio,
+  Platform,
+  StyleSheet,
+  UIManager,
+  Vibration,
+
+  // components
+  ActivityIndicator,
+  Button,
+  FlatList,
+  Image,
+  KeyboardAvoidingView,
+  ListView,
+  Modal,
+  Picker,
+  ProgressBar,
+  RefreshControl,
+  ScrollView,
+  SectionList,
+  Slider,
+  StatusBar,
+  Switch,
+  Text,
+  TextInput,
+  Touchable,
+  TouchableHighlight,
+  TouchableNativeFeedback,
+  TouchableOpacity,
+  TouchableWithoutFeedback,
+  View,
+  VirtualizedList,
+
+  // propTypes
+  ColorPropType,
+  EdgeInsetsPropType,
+  PointPropType,
+  TextPropTypes,
+  ViewPropTypes
+};
+
+export default ReactNative;

src/modules/ImageLoader/index.js

@@ -22,7 +22,7 @@ const ImageLoader = {
   getSize(uri, success, failure) {
     let complete = false;
     const interval = setInterval(callback, 16);
-    const requestId = ImageLoader.load(uri, callback, callback);
+    const requestId = ImageLoader.load(uri, callback, errorCallback);
 
     function callback() {
       const image = requests[`${requestId}`];
@@ -38,6 +38,14 @@ const ImageLoader = {
         clearInterval(interval);
       }
     }
+
+    function errorCallback() {
+      if (typeof failure === 'function') {
+        failure();
+      }
+      ImageLoader.abort(requestId);
+      clearInterval(interval);
+    }
   },
   load(uri, onLoad, onError): number {
     id += 1;

yarn.lock

@@ -73,6 +73,15 @@ ajv@^4.9.1:
     co "^4.6.0"
     json-stable-stringify "^1.0.1"
 
+ajv@^5.0.0:
+  version "5.2.3"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-5.2.3.tgz#c06f598778c44c6b161abafe3466b81ad1814ed2"
+  dependencies:
+    co "^4.6.0"
+    fast-deep-equal "^1.0.0"
+    json-schema-traverse "^0.3.0"
+    json-stable-stringify "^1.0.1"
+
 ajv@^5.1.5, ajv@^5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-5.2.0.tgz#c1735024c5da2ef75cc190713073d44f098bf486"
@@ -433,12 +442,12 @@ babel-helpers@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-jest@^21.0.2:
-  version "21.0.2"
-  resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-21.0.2.tgz#817ea52c23f1c6c4b684d6960968416b6a9e9c6c"
+babel-jest@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-21.2.0.tgz#2ce059519a9374a2c46f2455b6fbef5ad75d863e"
   dependencies:
     babel-plugin-istanbul "^4.0.0"
-    babel-preset-jest "^21.0.2"
+    babel-preset-jest "^21.2.0"
 
 babel-loader@^7.1.2:
   version "7.1.2"
@@ -468,9 +477,9 @@ babel-plugin-istanbul@^4.0.0:
     istanbul-lib-instrument "^1.4.2"
     test-exclude "^4.0.0"
 
-babel-plugin-jest-hoist@^21.0.2:
-  version "21.0.2"
-  resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.0.2.tgz#cfdce5bca40d772a056cb8528ad159c7bb4bb03d"
+babel-plugin-jest-hoist@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.2.0.tgz#2cef637259bd4b628a6cace039de5fcd14dbb006"
 
 babel-plugin-react-transform@^3.0.0:
   version "3.0.0"
@@ -498,7 +507,7 @@ babel-plugin-syntax-jsx@^6.5.0, babel-plugin-syntax-jsx@^6.8.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
 
-babel-plugin-syntax-object-rest-spread@^6.8.0:
+babel-plugin-syntax-object-rest-spread@^6.13.0, babel-plugin-syntax-object-rest-spread@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
 
@@ -668,11 +677,9 @@ babel-plugin-transform-react-jsx@^6.5.0:
     babel-plugin-syntax-jsx "^6.8.0"
     babel-runtime "^6.0.0"
 
-babel-plugin-transform-react-remove-prop-types@^0.4.8:
-  version "0.4.8"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.8.tgz#0aff04bc1d6564ec49cf23bcffb99c11881958db"
-  dependencies:
-    babel-traverse "^6.25.0"
+babel-plugin-transform-react-remove-prop-types@^0.4.9:
+  version "0.4.9"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.9.tgz#6805ef83d77bda94ded472ff2f2836bacd6ac44c"
 
 babel-plugin-transform-regenerator@^6.5.0:
   version "6.16.1"
@@ -697,11 +704,12 @@ babel-polyfill@^6.26.0:
     core-js "^2.5.0"
     regenerator-runtime "^0.10.5"
 
-babel-preset-jest@^21.0.2:
-  version "21.0.2"
-  resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-21.0.2.tgz#9db25def2329f49eace3f5ea0de42a0b898d12cc"
+babel-preset-jest@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-21.2.0.tgz#ff9d2bce08abd98e8a36d9a8a5189b9173b85638"
   dependencies:
-    babel-plugin-jest-hoist "^21.0.2"
+    babel-plugin-jest-hoist "^21.2.0"
+    babel-plugin-syntax-object-rest-spread "^6.13.0"
 
 babel-preset-react-native@^4.0.0:
   version "4.0.0"
@@ -768,7 +776,7 @@ babel-template@^6.16.0, babel-template@^6.24.1, babel-template@^6.26.0:
     babylon "^6.18.0"
     lodash "^4.17.4"
 
-babel-traverse@^6.18.0, babel-traverse@^6.23.1, babel-traverse@^6.24.1, babel-traverse@^6.25.0, babel-traverse@^6.26.0:
+babel-traverse@^6.18.0, babel-traverse@^6.23.1, babel-traverse@^6.24.1, babel-traverse@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.26.0.tgz#46a9cbd7edcc62c8e5c064e2d2d8d0f4035766ee"
   dependencies:
@@ -1694,9 +1702,9 @@ enzyme-adapter-utils@^1.0.0:
     object.assign "^4.0.4"
     prop-types "^15.5.10"
 
-enzyme-to-json@next:
-  version "3.0.0-beta6"
-  resolved "https://registry.yarnpkg.com/enzyme-to-json/-/enzyme-to-json-3.0.0-beta6.tgz#db537fbd9d7d06b8f65124d115c38694f798f055"
+enzyme-to-json@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/enzyme-to-json/-/enzyme-to-json-3.0.1.tgz#16468e2ff3e4db817d84f9df38760abbc322273d"
   dependencies:
     lodash "^4.17.4"
 
@@ -1824,9 +1832,9 @@ escope@^3.6.0:
     esrecurse "^4.1.0"
     estraverse "^4.1.1"
 
-eslint-config-prettier@^2.4.0:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-2.4.0.tgz#fb7cf29c0ab2ba61af5164fb1930f9bef3be2872"
+eslint-config-prettier@^2.6.0:
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-2.6.0.tgz#f21db0ebb438ad678fb98946097c4bb198befccc"
   dependencies:
     get-stdin "^5.0.1"
 
@@ -1834,9 +1842,9 @@ eslint-plugin-promise@^3.5.0:
   version "3.5.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-3.5.0.tgz#78fbb6ffe047201627569e85a6c5373af2a68fca"
 
-eslint-plugin-react@^7.3.0:
-  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.3.0.tgz#ca9368da36f733fbdc05718ae4e91f778f38e344"
+eslint-plugin-react@^7.4.0:
+  version "7.4.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.4.0.tgz#300a95861b9729c087d362dd64abcc351a74364a"
   dependencies:
     doctrine "^2.0.0"
     has "^1.0.1"
@@ -2014,16 +2022,16 @@ expand-range@^1.8.1:
   dependencies:
     fill-range "^2.1.0"
 
-expect@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/expect/-/expect-21.1.0.tgz#1c138ec803c72d28cbd10dfe97104966d967c24a"
+expect@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/expect/-/expect-21.2.1.tgz#003ac2ac7005c3c29e73b38a272d4afadd6d1d7b"
   dependencies:
     ansi-styles "^3.2.0"
-    jest-diff "^21.1.0"
-    jest-get-type "^21.0.2"
-    jest-matcher-utils "^21.1.0"
-    jest-message-util "^21.1.0"
-    jest-regex-util "^21.1.0"
+    jest-diff "^21.2.1"
+    jest-get-type "^21.2.0"
+    jest-matcher-utils "^21.2.1"
+    jest-message-util "^21.2.1"
+    jest-regex-util "^21.2.0"
 
 express@^4.15.2:
   version "4.15.2"
@@ -2084,6 +2092,10 @@ fast-deep-equal@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-0.1.0.tgz#5c6f4599aba6b333ee3342e2ed978672f1001f8d"
 
+fast-deep-equal@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz#96256a3bc975595eb36d82e9929d060d893439ff"
+
 fast-levenshtein@~2.0.4:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.5.tgz#bd33145744519ab1c36c3ee9f31f08e9079b67f2"
@@ -2126,11 +2138,12 @@ file-entry-cache@^2.0.0:
     flat-cache "^1.2.1"
     object-assign "^4.0.1"
 
-file-loader@^0.11.2:
-  version "0.11.2"
-  resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-0.11.2.tgz#4ff1df28af38719a6098093b88c82c71d1794a34"
+file-loader@^1.1.4:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-1.1.4.tgz#5ca9384adfafe008077c3439a435b2781a889ef5"
   dependencies:
     loader-utils "^1.0.2"
+    schema-utils "^0.3.0"
 
 filename-regex@^2.0.0:
   version "2.0.0"
@@ -2980,15 +2993,15 @@ istanbul-reports@^1.1.1:
   dependencies:
     handlebars "^4.0.3"
 
-jest-changed-files@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-21.1.0.tgz#e70f6b33b75d5987f4eae07e35bea5525635f92a"
+jest-changed-files@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-21.2.0.tgz#5dbeecad42f5d88b482334902ce1cba6d9798d29"
   dependencies:
     throat "^4.0.0"
 
-jest-cli@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-cli/-/jest-cli-21.1.0.tgz#4f671885ea3521803c96a1fd95baaa6a1ba8d70f"
+jest-cli@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-cli/-/jest-cli-21.2.1.tgz#9c528b6629d651911138d228bdb033c157ec8c00"
   dependencies:
     ansi-escapes "^3.0.0"
     chalk "^2.0.1"
@@ -2999,17 +3012,17 @@ jest-cli@^21.1.0:
     istanbul-lib-coverage "^1.0.1"
     istanbul-lib-instrument "^1.4.2"
     istanbul-lib-source-maps "^1.1.0"
-    jest-changed-files "^21.1.0"
-    jest-config "^21.1.0"
-    jest-environment-jsdom "^21.1.0"
-    jest-haste-map "^21.1.0"
-    jest-message-util "^21.1.0"
-    jest-regex-util "^21.1.0"
-    jest-resolve-dependencies "^21.1.0"
-    jest-runner "^21.1.0"
-    jest-runtime "^21.1.0"
-    jest-snapshot "^21.1.0"
-    jest-util "^21.1.0"
+    jest-changed-files "^21.2.0"
+    jest-config "^21.2.1"
+    jest-environment-jsdom "^21.2.1"
+    jest-haste-map "^21.2.0"
+    jest-message-util "^21.2.1"
+    jest-regex-util "^21.2.0"
+    jest-resolve-dependencies "^21.2.0"
+    jest-runner "^21.2.1"
+    jest-runtime "^21.2.1"
+    jest-snapshot "^21.2.1"
+    jest-util "^21.2.1"
     micromatch "^2.3.11"
     node-notifier "^5.0.2"
     pify "^3.0.0"
@@ -3020,76 +3033,76 @@ jest-cli@^21.1.0:
     worker-farm "^1.3.1"
     yargs "^9.0.0"
 
-jest-config@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-config/-/jest-config-21.1.0.tgz#7ef8778af679de30dad75e355a0dfbb0330b8d2f"
+jest-config@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-config/-/jest-config-21.2.1.tgz#c7586c79ead0bcc1f38c401e55f964f13bf2a480"
   dependencies:
     chalk "^2.0.1"
     glob "^7.1.1"
-    jest-environment-jsdom "^21.1.0"
-    jest-environment-node "^21.1.0"
-    jest-get-type "^21.0.2"
-    jest-jasmine2 "^21.1.0"
-    jest-regex-util "^21.1.0"
-    jest-resolve "^21.1.0"
-    jest-util "^21.1.0"
-    jest-validate "^21.1.0"
-    pretty-format "^21.1.0"
+    jest-environment-jsdom "^21.2.1"
+    jest-environment-node "^21.2.1"
+    jest-get-type "^21.2.0"
+    jest-jasmine2 "^21.2.1"
+    jest-regex-util "^21.2.0"
+    jest-resolve "^21.2.0"
+    jest-util "^21.2.1"
+    jest-validate "^21.2.1"
+    pretty-format "^21.2.1"
 
-jest-diff@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-diff/-/jest-diff-21.1.0.tgz#ca4c9d40272a6901dcde6c4c0bb2f568c363cc42"
+jest-diff@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-diff/-/jest-diff-21.2.1.tgz#46cccb6cab2d02ce98bc314011764bb95b065b4f"
   dependencies:
     chalk "^2.0.1"
     diff "^3.2.0"
-    jest-get-type "^21.0.2"
-    pretty-format "^21.1.0"
+    jest-get-type "^21.2.0"
+    pretty-format "^21.2.1"
 
-jest-docblock@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-21.1.0.tgz#43154be2441fb91403e36bb35cb791a5017cea81"
+jest-docblock@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-21.2.0.tgz#51529c3b30d5fd159da60c27ceedc195faf8d414"
 
-jest-environment-jsdom@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-environment-jsdom/-/jest-environment-jsdom-21.1.0.tgz#40729a60cd4544625f7d3a33c32bdaad63e57db7"
+jest-environment-jsdom@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-environment-jsdom/-/jest-environment-jsdom-21.2.1.tgz#38d9980c8259b2a608ec232deee6289a60d9d5b4"
   dependencies:
-    jest-mock "^21.1.0"
-    jest-util "^21.1.0"
+    jest-mock "^21.2.0"
+    jest-util "^21.2.1"
     jsdom "^9.12.0"
 
-jest-environment-node@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-environment-node/-/jest-environment-node-21.1.0.tgz#a11fd611e8ae6c3e02b785aa1b12a3009f4fd0f1"
+jest-environment-node@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-environment-node/-/jest-environment-node-21.2.1.tgz#98c67df5663c7fbe20f6e792ac2272c740d3b8c8"
   dependencies:
-    jest-mock "^21.1.0"
-    jest-util "^21.1.0"
+    jest-mock "^21.2.0"
+    jest-util "^21.2.1"
 
-jest-get-type@^21.0.2:
-  version "21.0.2"
-  resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-21.0.2.tgz#304e6b816dd33cd1f47aba0597bcad258a509fc6"
+jest-get-type@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-21.2.0.tgz#f6376ab9db4b60d81e39f30749c6c466f40d4a23"
 
-jest-haste-map@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-21.1.0.tgz#08e7a8c584008d4b790b8dddf7dd3e3db03b75d3"
+jest-haste-map@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-21.2.0.tgz#1363f0a8bb4338f24f001806571eff7a4b2ff3d8"
   dependencies:
     fb-watchman "^2.0.0"
     graceful-fs "^4.1.11"
-    jest-docblock "^21.1.0"
+    jest-docblock "^21.2.0"
     micromatch "^2.3.11"
     sane "^2.0.0"
     worker-farm "^1.3.1"
 
-jest-jasmine2@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-jasmine2/-/jest-jasmine2-21.1.0.tgz#975c3cd3ecd9d50d385bfe3c680dd61979f50c9c"
+jest-jasmine2@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-jasmine2/-/jest-jasmine2-21.2.1.tgz#9cc6fc108accfa97efebce10c4308548a4ea7592"
   dependencies:
     chalk "^2.0.1"
-    expect "^21.1.0"
+    expect "^21.2.1"
     graceful-fs "^4.1.11"
-    jest-diff "^21.1.0"
-    jest-matcher-utils "^21.1.0"
-    jest-message-util "^21.1.0"
-    jest-snapshot "^21.1.0"
+    jest-diff "^21.2.1"
+    jest-matcher-utils "^21.2.1"
+    jest-message-util "^21.2.1"
+    jest-snapshot "^21.2.1"
     p-cancelable "^0.3.0"
 
 jest-matcher-utils@^20.0.3:
@@ -3099,74 +3112,74 @@ jest-matcher-utils@^20.0.3:
     chalk "^1.1.3"
     pretty-format "^20.0.3"
 
-jest-matcher-utils@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-matcher-utils/-/jest-matcher-utils-21.1.0.tgz#b02e237b287c58915ce9a5bf3c7138dba95125a7"
+jest-matcher-utils@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-matcher-utils/-/jest-matcher-utils-21.2.1.tgz#72c826eaba41a093ac2b4565f865eb8475de0f64"
   dependencies:
     chalk "^2.0.1"
-    jest-get-type "^21.0.2"
-    pretty-format "^21.1.0"
+    jest-get-type "^21.2.0"
+    pretty-format "^21.2.1"
 
-jest-message-util@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-message-util/-/jest-message-util-21.1.0.tgz#7f9a52535d1a640af0d4c800edde737e14ea0526"
+jest-message-util@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-message-util/-/jest-message-util-21.2.1.tgz#bfe5d4692c84c827d1dcf41823795558f0a1acbe"
   dependencies:
     chalk "^2.0.1"
     micromatch "^2.3.11"
     slash "^1.0.0"
 
-jest-mock@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-mock/-/jest-mock-21.1.0.tgz#c4dddfa893a0b120b72b5ae87c7506745213a790"
+jest-mock@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-mock/-/jest-mock-21.2.0.tgz#7eb0770e7317968165f61ea2a7281131534b3c0f"
 
-jest-regex-util@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-regex-util/-/jest-regex-util-21.1.0.tgz#59e4bad74f5ffd62a3835225f9bc1ee3796b5adb"
+jest-regex-util@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-regex-util/-/jest-regex-util-21.2.0.tgz#1b1e33e63143babc3e0f2e6c9b5ba1eb34b2d530"
 
-jest-resolve-dependencies@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-resolve-dependencies/-/jest-resolve-dependencies-21.1.0.tgz#9f78852e65d864d04ad0919ac8226b3f1434e7b0"
+jest-resolve-dependencies@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-resolve-dependencies/-/jest-resolve-dependencies-21.2.0.tgz#9e231e371e1a736a1ad4e4b9a843bc72bfe03d09"
   dependencies:
-    jest-regex-util "^21.1.0"
+    jest-regex-util "^21.2.0"
 
-jest-resolve@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-resolve/-/jest-resolve-21.1.0.tgz#6bb806ca5ad876c250044fe62f298321d2da5c06"
+jest-resolve@^21.2.0:
+  version "21.2.0"
+  resolved "https://registry.yarnpkg.com/jest-resolve/-/jest-resolve-21.2.0.tgz#068913ad2ba6a20218e5fd32471f3874005de3a6"
   dependencies:
     browser-resolve "^1.11.2"
     chalk "^2.0.1"
     is-builtin-module "^1.0.0"
 
-jest-runner@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-runner/-/jest-runner-21.1.0.tgz#d7ea7e2fa10ed673d4dd25ba2f3faae2efb89a07"
+jest-runner@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-runner/-/jest-runner-21.2.1.tgz#194732e3e518bfb3d7cbfc0fd5871246c7e1a467"
   dependencies:
-    jest-config "^21.1.0"
-    jest-docblock "^21.1.0"
-    jest-haste-map "^21.1.0"
-    jest-jasmine2 "^21.1.0"
-    jest-message-util "^21.1.0"
-    jest-runtime "^21.1.0"
-    jest-util "^21.1.0"
+    jest-config "^21.2.1"
+    jest-docblock "^21.2.0"
+    jest-haste-map "^21.2.0"
+    jest-jasmine2 "^21.2.1"
+    jest-message-util "^21.2.1"
+    jest-runtime "^21.2.1"
+    jest-util "^21.2.1"
     pify "^3.0.0"
     throat "^4.0.0"
     worker-farm "^1.3.1"
 
-jest-runtime@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-runtime/-/jest-runtime-21.1.0.tgz#c9a180a9e06ef046d0ad157dea52355abb7cbad4"
+jest-runtime@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-runtime/-/jest-runtime-21.2.1.tgz#99dce15309c670442eee2ebe1ff53a3cbdbbb73e"
   dependencies:
     babel-core "^6.0.0"
-    babel-jest "^21.0.2"
+    babel-jest "^21.2.0"
     babel-plugin-istanbul "^4.0.0"
     chalk "^2.0.1"
     convert-source-map "^1.4.0"
     graceful-fs "^4.1.11"
-    jest-config "^21.1.0"
-    jest-haste-map "^21.1.0"
-    jest-regex-util "^21.1.0"
-    jest-resolve "^21.1.0"
-    jest-util "^21.1.0"
+    jest-config "^21.2.1"
+    jest-haste-map "^21.2.0"
+    jest-regex-util "^21.2.0"
+    jest-resolve "^21.2.0"
+    jest-util "^21.2.1"
     json-stable-stringify "^1.0.1"
     micromatch "^2.3.11"
     slash "^1.0.0"
@@ -3174,27 +3187,27 @@ jest-runtime@^21.1.0:
     write-file-atomic "^2.1.0"
     yargs "^9.0.0"
 
-jest-snapshot@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-21.1.0.tgz#a5fa9d52847d8f52e19a1df6ccae9de699193ccc"
+jest-snapshot@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-21.2.1.tgz#29e49f16202416e47343e757e5eff948c07fd7b0"
   dependencies:
     chalk "^2.0.1"
-    jest-diff "^21.1.0"
-    jest-matcher-utils "^21.1.0"
+    jest-diff "^21.2.1"
+    jest-matcher-utils "^21.2.1"
     mkdirp "^0.5.1"
     natural-compare "^1.4.0"
-    pretty-format "^21.1.0"
+    pretty-format "^21.2.1"
 
-jest-util@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-21.1.0.tgz#f92ff756422cc0609ddf5a9bfa4d34b2835d8c30"
+jest-util@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-21.2.1.tgz#a274b2f726b0897494d694a6c3d6a61ab819bb78"
   dependencies:
     callsites "^2.0.0"
     chalk "^2.0.1"
     graceful-fs "^4.1.11"
-    jest-message-util "^21.1.0"
-    jest-mock "^21.1.0"
-    jest-validate "^21.1.0"
+    jest-message-util "^21.2.1"
+    jest-mock "^21.2.0"
+    jest-validate "^21.2.1"
     mkdirp "^0.5.1"
 
 jest-validate@^20.0.3:
@@ -3206,20 +3219,20 @@ jest-validate@^20.0.3:
     leven "^2.1.0"
     pretty-format "^20.0.3"
 
-jest-validate@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest-validate/-/jest-validate-21.1.0.tgz#39d01115544a758bce49f221a5fcbb24ebdecc65"
+jest-validate@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest-validate/-/jest-validate-21.2.1.tgz#cc0cbca653cd54937ba4f2a111796774530dd3c7"
   dependencies:
     chalk "^2.0.1"
-    jest-get-type "^21.0.2"
+    jest-get-type "^21.2.0"
     leven "^2.1.0"
-    pretty-format "^21.1.0"
+    pretty-format "^21.2.1"
 
-jest@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/jest/-/jest-21.1.0.tgz#77c7baa8aa9e8bace7fe41a30d748ab56e89476a"
+jest@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/jest/-/jest-21.2.1.tgz#c964e0b47383768a1438e3ccf3c3d470327604e1"
   dependencies:
-    jest-cli "^21.1.0"
+    jest-cli "^21.2.1"
 
 jodid25519@^1.0.0:
   version "1.0.2"
@@ -4198,9 +4211,9 @@ preserve@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
 
-prettier@^1.7.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.7.0.tgz#47481588f41f7c90f63938feb202ac82554e7150"
+prettier@^1.7.3:
+  version "1.7.3"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.7.3.tgz#8e6974725273914b1c47439959dd3d3ba53664b6"
 
 pretty-format@^20.0.3:
   version "20.0.3"
@@ -4209,9 +4222,9 @@ pretty-format@^20.0.3:
     ansi-regex "^2.1.1"
     ansi-styles "^3.0.0"
 
-pretty-format@^21.1.0:
-  version "21.1.0"
-  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-21.1.0.tgz#557428254323832ee8b7c971cb613442bea67f61"
+pretty-format@^21.2.1:
+  version "21.2.1"
+  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-21.2.1.tgz#ae5407f3cf21066cd011aa1ba5fce7b6a2eddb36"
   dependencies:
     ansi-regex "^3.0.0"
     ansi-styles "^3.2.0"
@@ -4689,6 +4702,12 @@ sax@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.1.tgz#7b8e656190b228e81a66aea748480d828cd2d37a"
 
+schema-utils@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.3.0.tgz#f5877222ce3e931edae039f17eb3716e7137f8cf"
+  dependencies:
+    ajv "^5.0.0"
+
 semver-diff@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/semver-diff/-/semver-diff-2.1.0.tgz#4bbb8437c8d37e4b0cf1a68fd726ec6d645d6d36"