Bump to 0.8.0

- Suppressed TextInput.props warning
- Reverted layout-only UIView removal
- Reverted scroll view sticky header fix related to UIView removal

.flowconfig

@@ -9,10 +9,11 @@
 
 # Ignore react-tools where there are overlaps, but don't ignore anything that
 # react-native relies on
-.*/node_modules/react-tools/src/React.js
-.*/node_modules/react-tools/src/renderers/shared/event/EventPropagators.js
-.*/node_modules/react-tools/src/renderers/shared/event/eventPlugins/ResponderEventPlugin.js
-.*/node_modules/react-tools/src/shared/vendor/core/ExecutionEnvironment.js
+.*/node_modules/react-tools/src/vendor/core/ExecutionEnvironment.js
+.*/node_modules/react-tools/src/browser/eventPlugins/ResponderEventPlugin.js
+.*/node_modules/react-tools/src/browser/ui/React.js
+.*/node_modules/react-tools/src/core/ReactInstanceHandles.js
+.*/node_modules/react-tools/src/event/EventPropagators.js
 
 # Ignore commoner tests
 .*/node_modules/commoner/test/.*
@@ -35,15 +36,13 @@ Examples/UIExplorer/ImageMocks.js
 [options]
 module.system=haste
 
-munge_underscores=true
-
 suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
 suppress_type=$FixMe
 
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-4]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-4]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-3]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-3]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
 
 [version]
-0.14.0
+0.13.1

.gitignore

@@ -25,12 +25,6 @@ project.xcworkspace
 # OS X
 .DS_Store
 
-# Android/IJ
-.idea
-.gradle
-local.properties
-*.iml
-
 # Node
 node_modules
 *.log

.travis.yml

@@ -10,19 +10,19 @@ cache:
 before_install:
   - brew update
 install:
-  - brew reinstall xctool nvm
-  - rm -Rf `node -p "require('os').tmpDir()"`/jest_preprocess_cache
-  - npm install -g flow-bin@`node -p "require('fs').readFileSync('.flowconfig', 'utf8').split('[version]')[1].trim()"`
+  - brew reinstall flow xctool nvm
   - mkdir -p .nvm
-  - export NVM_DIR="$PWD/.nvm"
+  - cp $(brew --prefix nvm)/nvm-exec .nvm/
+  - export NVM_DIR=.nvm
   - source $(brew --prefix nvm)/nvm.sh
   - nvm install iojs-v2
-  - nvm use iojs-v2
   - npm config set spin=false
   - npm install
 
 script:
 - |
+  nvm use iojs-v2
+
   if [ "$TEST_TYPE" = objc ]
   then
 
@@ -37,7 +37,7 @@ script:
   then
 
     cd website
-    $(which npm) install
+    npm install
     ./setup.sh
     if [ "$TRAVIS_PULL_REQUEST" = false ] && [ "$TRAVIS_BRANCH" = master ]; then
       # Automatically publish the website

Examples/2048/2048.xcodeproj/project.pbxproj

@@ -12,7 +12,7 @@
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
 		1461632D1AC3E23900C2F5AD /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 1461632C1AC3E22900C2F5AD /* libReact.a */; };
-		5F82F1781B85785200FAE87E /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5F82F1771B85784500FAE87E /* libRCTWebSocket.a */; };
+		58C1E40E1ACF54E9006D1A47 /* libRCTAnimationExperimental.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 58C1E40B1ACF54B4006D1A47 /* libRCTAnimationExperimental.a */; };
 		832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
 /* End PBXBuildFile section */
 
@@ -24,12 +24,12 @@
 			remoteGlobalIDString = 83CBBA2E1A601D0E00E9B192;
 			remoteInfo = React;
 		};
-		5F82F1761B85784500FAE87E /* PBXContainerItemProxy */ = {
+		58C1E40A1ACF54B4006D1A47 /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
-			containerPortal = 5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */;
+			containerPortal = 13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */;
 			proxyType = 2;
-			remoteGlobalIDString = 3C86DF461ADF2C930047B81A;
-			remoteInfo = RCTWebSocket;
+			remoteGlobalIDString = 134814201AA4EA6300B7C361;
+			remoteInfo = RCTAnimationExperimental;
 		};
 		832341B41AAA6A8300B99B32 /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
@@ -41,6 +41,7 @@
 /* End PBXContainerItemProxy section */
 
 /* Begin PBXFileReference section */
+		13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAnimationExperimental.xcodeproj; path = ../../Libraries/Animation/RCTAnimationExperimental.xcodeproj; sourceTree = "<group>"; };
 		13B07F961A680F5B00A75B9A /* 2048.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = 2048.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = 2048/AppDelegate.h; sourceTree = "<group>"; };
 		13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = 2048/AppDelegate.m; sourceTree = "<group>"; };
@@ -49,7 +50,6 @@
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = 2048/Info.plist; sourceTree = "<group>"; };
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = 2048/main.m; sourceTree = "<group>"; };
 		146163271AC3E22900C2F5AD /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../React/React.xcodeproj; sourceTree = "<group>"; };
-		5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
 		832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
@@ -58,8 +58,8 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				5F82F1781B85785200FAE87E /* libRCTWebSocket.a in Frameworks */,
 				1461632D1AC3E23900C2F5AD /* libReact.a in Frameworks */,
+				58C1E40E1ACF54E9006D1A47 /* libRCTAnimationExperimental.a in Frameworks */,
 				832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
@@ -88,10 +88,10 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
-		5F82F1731B85784500FAE87E /* Products */ = {
+		58C1E4071ACF54B4006D1A47 /* Products */ = {
 			isa = PBXGroup;
 			children = (
-				5F82F1771B85784500FAE87E /* libRCTWebSocket.a */,
+				58C1E40B1ACF54B4006D1A47 /* libRCTAnimationExperimental.a */,
 			);
 			name = Products;
 			sourceTree = "<group>";
@@ -99,9 +99,9 @@
 		832341AE1AAA6A7D00B99B32 /* Libraries */ = {
 			isa = PBXGroup;
 			children = (
-				5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */,
 				146163271AC3E22900C2F5AD /* React.xcodeproj */,
 				832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
+				13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */,
 			);
 			name = Libraries;
 			sourceTree = "<group>";
@@ -175,12 +175,12 @@
 			projectDirPath = "";
 			projectReferences = (
 				{
-					ProductGroup = 832341B11AAA6A8300B99B32 /* Products */;
-					ProjectRef = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */;
+					ProductGroup = 58C1E4071ACF54B4006D1A47 /* Products */;
+					ProjectRef = 13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */;
 				},
 				{
-					ProductGroup = 5F82F1731B85784500FAE87E /* Products */;
-					ProjectRef = 5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */;
+					ProductGroup = 832341B11AAA6A8300B99B32 /* Products */;
+					ProjectRef = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */;
 				},
 				{
 					ProductGroup = 146163281AC3E22900C2F5AD /* Products */;
@@ -202,11 +202,11 @@
 			remoteRef = 1461632B1AC3E22900C2F5AD /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
-		5F82F1771B85784500FAE87E /* libRCTWebSocket.a */ = {
+		58C1E40B1ACF54B4006D1A47 /* libRCTAnimationExperimental.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;
-			path = libRCTWebSocket.a;
-			remoteRef = 5F82F1761B85784500FAE87E /* PBXContainerItemProxy */;
+			path = libRCTAnimationExperimental.a;
+			remoteRef = 58C1E40A1ACF54B4006D1A47 /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
 		832341B51AAA6A8300B99B32 /* libRCTText.a */ = {
@@ -266,7 +266,10 @@
 				);
 				INFOPLIST_FILE = "$(SRCROOT)/2048/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				LIBRARY_SEARCH_PATHS = "$(inherited)";
+				LIBRARY_SEARCH_PATHS = (
+					"$(inherited)",
+					"/Users/sahrens/src/fbobjc-hg/Libraries/FBReactKit/js/react-native-github/Libraries/Animation/build/Debug-iphoneos",
+				);
 				OTHER_LDFLAGS = "-ObjC";
 				PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = 2048;
@@ -284,7 +287,10 @@
 				);
 				INFOPLIST_FILE = "$(SRCROOT)/2048/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				LIBRARY_SEARCH_PATHS = "$(inherited)";
+				LIBRARY_SEARCH_PATHS = (
+					"$(inherited)",
+					"/Users/sahrens/src/fbobjc-hg/Libraries/FBReactKit/js/react-native-github/Libraries/Animation/build/Debug-iphoneos",
+				);
 				OTHER_LDFLAGS = "-ObjC";
 				PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = 2048;

Examples/2048/2048/AppDelegate.m

@@ -52,7 +52,6 @@
 
   RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                       moduleName:@"Game2048"
-                                               initialProperties:nil
                                                    launchOptions:launchOptions];
 
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

Examples/2048/Game2048.js

@@ -24,7 +24,7 @@ var {
   View,
 } = React;
 
-var Animated = require('Animated');
+var AnimationExperimental = require('AnimationExperimental');
 var GameBoard = require('GameBoard');
 var TouchableBounce = require('TouchableBounce');
 
@@ -53,58 +53,58 @@ class Board extends React.Component {
 }
 
 class Tile extends React.Component {
-  static _getPosition(index): number {
-    return BOARD_PADDING + (index * (CELL_SIZE + CELL_MARGIN * 2) + CELL_MARGIN);
-  }
-
-  constructor(props: {}) {
-    super(props);
-
-    var tile = this.props.tile;
-
-    this.state = {
-      opacity: new Animated.Value(0),
-      top: new Animated.Value(Tile._getPosition(tile.toRow())),
-      left: new Animated.Value(Tile._getPosition(tile.toColumn())),
-    };
-  }
-
   calculateOffset(): {top: number; left: number; opacity: number} {
     var tile = this.props.tile;
 
+    var pos = (i) => {
+      return BOARD_PADDING + (i * (CELL_SIZE + CELL_MARGIN * 2) + CELL_MARGIN);
+    };
+
+    var animationPosition = (i) => {
+      return pos(i) + (CELL_SIZE / 2);
+    };
+
     var offset = {
-      top: this.state.top,
-      left: this.state.left,
-      opacity: this.state.opacity,
+      top: pos(tile.toRow()),
+      left: pos(tile.toColumn()),
+      opacity: 1,
     };
 
     if (tile.isNew()) {
-      Animated.timing(this.state.opacity, {
-        duration: 100,
-        toValue: 1,
-      }).start();
+      offset.opacity = 0;
     } else {
-      Animated.parallel([
-        Animated.timing(offset.top, {
-          duration: 100,
-          toValue: Tile._getPosition(tile.toRow()),
-        }),
-        Animated.timing(offset.left, {
-          duration: 100,
-          toValue: Tile._getPosition(tile.toColumn()),
-        }),
-      ]).start();
+      var point = {
+        x: animationPosition(tile.toColumn()),
+        y: animationPosition(tile.toRow()),
+      };
+      AnimationExperimental.startAnimation({
+        node: this.refs['this'],
+        duration: 100,
+        easing: 'easeInOutQuad',
+        property: 'position',
+        toValue: point,
+      });
     }
     return offset;
   }
 
+  componentDidMount() {
+    AnimationExperimental.startAnimation({
+      node: this.refs['this'],
+      duration: 100,
+      easing: 'easeInOutQuad',
+      property: 'opacity',
+      toValue: 1,
+    });
+  }
+
   render() {
     var tile = this.props.tile;
 
     var tileStyles = [
       styles.tile,
       styles['tile' + tile.value],
-      this.calculateOffset(),
+      this.calculateOffset()
     ];
 
     var textStyles = [
@@ -115,9 +115,9 @@ class Tile extends React.Component {
     ];
 
     return (
-      <Animated.View style={tileStyles}>
+      <View ref="this" style={tileStyles}>
         <Text style={textStyles}>{tile.value}</Text>
-      </Animated.View>
+      </View>
     );
   }
 }
@@ -136,8 +136,10 @@ class GameEndOverlay extends React.Component {
     return (
       <View style={styles.overlay}>
         <Text style={styles.overlayMessage}>{message}</Text>
-        <TouchableBounce onPress={this.props.onRestart} style={styles.tryAgain}>
-          <Text style={styles.tryAgainText}>Try Again?</Text>
+        <TouchableBounce onPress={this.props.onRestart}>
+          <View style={styles.tryAgain}>
+            <Text style={styles.tryAgainText}>Try Again?</Text>
+          </View>
         </TouchableBounce>
       </View>
     );

Examples/Movies/Movies/AppDelegate.m

@@ -37,14 +37,14 @@
    * on the same Wi-Fi network.
    */
 
-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/Movies/MoviesApp.ios.includeRequire.runModule.bundle"];
+  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/Movies/MoviesApp.includeRequire.runModule.bundle"];
 
   /**
    * OPTION 2
    * Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
    * to your Xcode project folder in the terminal, and run
    *
-   * $ curl 'http://localhost:8081/Examples/Movies/MoviesApp.ios.includeRequire.runModule.bundle' -o main.jsbundle
+   * $ curl 'http://localhost:8081/Examples/Movies/MoviesApp.includeRequire.runModule.bundle' -o main.jsbundle
    *
    * then add the `main.jsbundle` file to your project and uncomment this line:
    */
@@ -53,7 +53,6 @@
 
   RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                       moduleName:@"MoviesApp"
-                                               initialProperties:nil
                                                    launchOptions:launchOptions];
 
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

Examples/Movies/MoviesApp.android.js

@@ -1,94 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @providesModule MoviesApp
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  AppRegistry,
-  BackAndroid,
-  Navigator,
-  StyleSheet,
-  ToolbarAndroid,
-  View,
-} = React;
-
-var MovieScreen = require('./MovieScreen');
-var SearchScreen = require('./SearchScreen');
-
-var _navigator;
-BackAndroid.addEventListener('hardwareBackPress', () => {
-  if (_navigator && _navigator.getCurrentRoutes().length > 1) {
-    _navigator.pop();
-    return true;
-  }
-  return false;
-});
-
-var RouteMapper = function(route, navigationOperations, onComponentRef) {
-  _navigator = navigationOperations;
-  if (route.name === 'search') {
-    return (
-      <SearchScreen navigator={navigationOperations} />
-    );
-  } else if (route.name === 'movie') {
-    return (
-      <View style={{flex: 1}}>
-        <ToolbarAndroid
-          actions={[]}
-          navIcon={require('image!android_back_white')}
-          onIconClicked={navigationOperations.pop}
-          style={styles.toolbar}
-          titleColor="white"
-          title={route.movie.title} />
-        <MovieScreen
-          style={{flex: 1}}
-          navigator={navigationOperations}
-          movie={route.movie}
-        />
-      </View>
-    );
-  }
-};
-
-var MoviesApp = React.createClass({
-  render: function() {
-    var initialRoute = {name: 'search'};
-    return (
-      <Navigator
-        style={styles.container}
-        initialRoute={initialRoute}
-        configureScene={() => Navigator.SceneConfigs.FadeAndroid}
-        renderScene={RouteMapper}
-      />
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: 'white',
-  },
-  toolbar: {
-    backgroundColor: '#a9a9a9',
-    height: 56,
-  },
-});
-
-AppRegistry.registerComponent('MoviesApp', () => MoviesApp);
-
-module.exports = MoviesApp;

Examples/Movies/SearchBar.android.js

@@ -1,104 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @providesModule SearchBar
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Image,
-  Platform,
-  ProgressBarAndroid,
-  TextInput,
-  StyleSheet,
-  TouchableNativeFeedback,
-  View,
-} = React;
-
-var IS_RIPPLE_EFFECT_SUPPORTED = Platform.Version >= 21;
-
-var SearchBar = React.createClass({
-  render: function() {
-    var loadingView;
-    if (this.props.isLoading) {
-      loadingView = (
-        <ProgressBarAndroid
-          styleAttr="Large"
-          style={styles.spinner}
-        />
-      );
-    } else {
-      loadingView = <View style={styles.spinner} />;
-    }
-    var background = IS_RIPPLE_EFFECT_SUPPORTED ?
-      TouchableNativeFeedback.SelectableBackgroundBorderless() :
-      TouchableNativeFeedback.SelectableBackground();
-    return (
-      <View style={styles.searchBar}>
-        <TouchableNativeFeedback
-            background={background}
-            onPress={() => this.refs.input && this.refs.input.focus()}>
-          <View>
-            <Image
-              source={require('image!android_search_white')}
-              style={styles.icon}
-            />
-          </View>
-        </TouchableNativeFeedback>
-        <TextInput
-          ref="input"
-          autoCapitalize="none"
-          autoCorrect={false}
-          autoFocus={true}
-          onChange={this.props.onSearchChange}
-          placeholder="Search a movie..."
-          placeholderTextColor="rgba(255, 255, 255, 0.5)"
-          onFocus={this.props.onFocus}
-          style={styles.searchBarInput}
-        />
-        {loadingView}
-      </View>
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  searchBar: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    backgroundColor: '#a9a9a9',
-    height: 56,
-  },
-  searchBarInput: {
-    flex: 1,
-    fontSize: 20,
-    fontWeight: 'bold',
-    color: 'white',
-    height: 50,
-    padding: 0,
-    backgroundColor: 'transparent'
-  },
-  spinner: {
-    width: 30,
-    height: 30,
-  },
-  icon: {
-    width: 24,
-    height: 24,
-    marginHorizontal: 8,
-  },
-});
-
-module.exports = SearchBar;

Examples/Movies/SearchScreen.js

@@ -262,7 +262,6 @@ var SearchScreen = React.createClass({
   ) {
     return (
       <MovieCell
-        key={movie.id}
         onSelect={() => this.selectMovie(movie)}
         onHighlight={() => highlightRowFunc(sectionID, rowID)}
         onUnhighlight={() => highlightRowFunc(null, null)}
@@ -308,7 +307,7 @@ var NoMovies = React.createClass({
   render: function() {
     var text = '';
     if (this.props.filter) {
-      text = `No results for "${this.props.filter}"`;
+      text = `No results for “${this.props.filter}”`;
     } else if (!this.props.isLoading) {
       // If we're looking at the latest movies, aren't currently loading, and
       // still have no results, show a message

Examples/Movies/android/app/build.gradle

@@ -1,35 +0,0 @@
-apply plugin: 'com.android.application'
-
-android {
-    compileSdkVersion 22
-    buildToolsVersion "23.0.1"
-
-    defaultConfig {
-        applicationId "com.facebook.react.movies"
-        minSdkVersion 16
-        targetSdkVersion 22
-        versionCode 1
-        versionName "1.0"
-        ndk {
-            abiFilters "armeabi-v7a", "x86"
-        }
-    }
-    buildTypes {
-        release {
-            minifyEnabled false
-            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
-        }
-    }
-}
-
-dependencies {
-    compile fileTree(dir: 'libs', include: ['*.jar'])
-    compile 'com.android.support:appcompat-v7:22.2.0'
-
-    // Depend on pre-built React Native
-    compile 'com.facebook.react:react-native:0.11.+'
-    
-    // Depend on React Native source.
-    // This is useful for testing your changes when working on React Native.
-    // compile project(':ReactAndroid')
-}

Examples/Movies/android/app/proguard-rules.pro

@@ -1,17 +0,0 @@
-# Add project specific ProGuard rules here.
-# By default, the flags in this file are appended to flags specified
-# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
-# You can edit the include path and order by changing the proguardFiles
-# directive in build.gradle.
-#
-# For more details, see
-#   http://developer.android.com/guide/developing/tools/proguard.html
-
-# Add any project specific keep options here:
-
-# If your project uses WebView with JS, uncomment the following
-# and specify the fully qualified class name to the JavaScript interface
-# class:
-#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
-#   public *;
-#}

Examples/Movies/android/app/src/main/AndroidManifest.xml

@@ -1,21 +0,0 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="com.facebook.react.movies">
-
-    <uses-permission android:name="android.permission.INTERNET" />
-
-    <application
-      android:allowBackup="true"
-      android:label="@string/app_name"
-      android:icon="@drawable/rotten_tomatoes_icon"
-      android:theme="@style/AppTheme">
-      <activity
-        android:name=".MoviesActivity">
-        <intent-filter>
-            <action android:name="android.intent.action.MAIN" />
-            <category android:name="android.intent.category.LAUNCHER" />
-        </intent-filter>
-      </activity>
-      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
-    </application>
-
-</manifest>

Examples/Movies/android/app/src/main/java/com/facebook/react/movies/MoviesActivity.java

@@ -1,89 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-package com.facebook.react.movies;
-
-import android.app.Activity;
-import android.os.Bundle;
-import android.view.KeyEvent;
-
-import com.facebook.react.LifecycleState;
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.ReactRootView;
-import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler;
-import com.facebook.react.shell.MainReactPackage;
-
-public class MoviesActivity extends Activity implements DefaultHardwareBackBtnHandler {
-
-  private ReactInstanceManager mReactInstanceManager;
-
-  @Override
-  protected void onCreate(Bundle savedInstanceState) {
-    super.onCreate(savedInstanceState);
-    setContentView(R.layout.activity_main);
-
-    mReactInstanceManager = ReactInstanceManager.builder()
-        .setApplication(getApplication())
-        .setBundleAssetName("MoviesApp.android.bundle")
-        .setJSMainModuleName("Examples/Movies/MoviesApp.android")
-        .addPackage(new MainReactPackage())
-        .setUseDeveloperSupport(true)
-        .setInitialLifecycleState(LifecycleState.RESUMED)
-        .build();
-
-    ((ReactRootView) findViewById(R.id.react_root_view))
-        .startReactApplication(mReactInstanceManager, "MoviesApp", null);
-  }
-
-  @Override
-  public boolean onKeyUp(int keyCode, KeyEvent event) {
-    if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) {
-      mReactInstanceManager.showDevOptionsDialog();
-      return true;
-    }
-    return super.onKeyUp(keyCode, event);
-  }
-
-  @Override
-  protected void onPause() {
-    super.onPause();
-
-    if (mReactInstanceManager != null) {
-      mReactInstanceManager.onPause();
-    }
-  }
-
-  @Override
-  protected void onResume() {
-    super.onResume();
-
-    if (mReactInstanceManager != null) {
-      mReactInstanceManager.onResume(this);
-    }
-  }
-
-  @Override
-  public void onBackPressed() {
-    if (mReactInstanceManager != null) {
-      mReactInstanceManager.onBackPressed();
-    } else {
-      super.onBackPressed();
-    }
-  }
-
-  @Override
-  public void invokeDefaultOnBackPressed() {
-    super.onBackPressed();
-  }
-}

Examples/Movies/android/app/src/main/res/layout/activity_main.xml

@@ -1,12 +0,0 @@
-<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
-    android:layout_width="match_parent"
-    android:layout_height="match_parent"
-    tools:context=".MoviesApp">
-
-    <com.facebook.react.ReactRootView
-      android:layout_width="match_parent"
-      android:layout_height="match_parent"
-      android:id="@+id/react_root_view"/>
-
-</RelativeLayout>

Examples/Movies/android/app/src/main/res/values/strings.xml

@@ -1,3 +0,0 @@
-<resources>
-    <string name="app_name">MoviesApp</string>
-</resources>

Examples/Movies/android/app/src/main/res/values/styles.xml

@@ -1,8 +0,0 @@
-<resources>
-
-    <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
-        <!-- Customize your theme here. -->
-    </style>
-
-</resources>

Examples/SampleApp/SampleApp.xcodeproj/project.pbxproj

@@ -106,27 +106,27 @@
 /* End PBXContainerItemProxy section */
 
 /* Begin PBXFileReference section */
-		008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = "<group>"; };
-		00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../../../Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
-		00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../../../Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
-		00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../../../Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
-		00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../../../Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
-		00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../../../Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
+		008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; name = main.jsbundle; path = iOS/main.jsbundle; sourceTree = "<group>"; };
+		00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../../Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
+		00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../../Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
+		00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../../Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
+		00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../../Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
+		00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../../Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
 		00E356EE1AD99517003FC87E /* SampleAppTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = SampleAppTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		00E356F21AD99517003FC87E /* SampleAppTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = SampleAppTests.m; sourceTree = "<group>"; };
-		139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../../../Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
-		139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
+		139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../../Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
+		139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
 		13B07F961A680F5B00A75B9A /* SampleApp.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = SampleApp.app; sourceTree = BUILT_PRODUCTS_DIR; };
-		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = AppDelegate.h; sourceTree = "<group>"; };
-		13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = AppDelegate.m; sourceTree = "<group>"; };
+		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = iOS/AppDelegate.h; sourceTree = "<group>"; };
+		13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = iOS/AppDelegate.m; sourceTree = "<group>"; };
 		13B07FB21A68108700A75B9A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/LaunchScreen.xib; sourceTree = "<group>"; };
-		13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Images.xcassets; sourceTree = "<group>"; };
-		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
-		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = main.m; sourceTree = "<group>"; };
-		146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../../React/React.xcodeproj; sourceTree = "<group>"; };
-		78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../../../Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
-		832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
+		13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = iOS/Images.xcassets; sourceTree = "<group>"; };
+		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = iOS/Info.plist; sourceTree = "<group>"; };
+		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = iOS/main.m; sourceTree = "<group>"; };
+		146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../React/React.xcodeproj; sourceTree = "<group>"; };
+		78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../../Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
+		832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -233,15 +233,15 @@
 		13B07FAE1A68108700A75B9A /* SampleApp */ = {
 			isa = PBXGroup;
 			children = (
+				008F07F21AC5B25A0029DE68 /* main.jsbundle */,
 				13B07FAF1A68108700A75B9A /* AppDelegate.h */,
 				13B07FB01A68108700A75B9A /* AppDelegate.m */,
 				13B07FB51A68108700A75B9A /* Images.xcassets */,
 				13B07FB61A68108700A75B9A /* Info.plist */,
 				13B07FB11A68108700A75B9A /* LaunchScreen.xib */,
-				008F07F21AC5B25A0029DE68 /* main.jsbundle */,
 				13B07FB71A68108700A75B9A /* main.m */,
 			);
-			path = SampleApp;
+			name = SampleApp;
 			sourceTree = "<group>";
 		};
 		146834001AC3E56700842450 /* Products */ = {
@@ -289,8 +289,8 @@
 			isa = PBXGroup;
 			children = (
 				13B07FAE1A68108700A75B9A /* SampleApp */,
-				00E356EF1AD99517003FC87E /* SampleAppTests */,
 				832341AE1AAA6A7D00B99B32 /* Libraries */,
+				00E356EF1AD99517003FC87E /* SampleAppTests */,
 				83CBBA001A601CBA00E9B192 /* Products */,
 			);
 			indentWidth = 2;
@@ -548,6 +548,7 @@
 				13B07FB21A68108700A75B9A /* Base */,
 			);
 			name = LaunchScreen.xib;
+			path = iOS;
 			sourceTree = "<group>";
 		};
 /* End PBXVariantGroup section */
@@ -565,11 +566,6 @@
 					"DEBUG=1",
 					"$(inherited)",
 				);
-				HEADER_SEARCH_PATHS = (
-					"$(inherited)",
-					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../../../React/**",
-				);
 				INFOPLIST_FILE = SampleAppTests/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 8.2;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
@@ -587,11 +583,6 @@
 					"$(SDKROOT)/Developer/Library/Frameworks",
 					"$(inherited)",
 				);
-				HEADER_SEARCH_PATHS = (
-					"$(inherited)",
-					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../../../React/**",
-				);
 				INFOPLIST_FILE = SampleAppTests/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 8.2;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
@@ -607,9 +598,9 @@
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../../../React/**",
+					"$(SRCROOT)/../../React/**",
 				);
-				INFOPLIST_FILE = "$(SRCROOT)/SampleApp/Info.plist";
+				INFOPLIST_FILE = "iOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				OTHER_LDFLAGS = "-ObjC";
 				PRODUCT_NAME = SampleApp;
@@ -623,9 +614,9 @@
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../../../React/**",
+					"$(SRCROOT)/../../React/**",
 				);
-				INFOPLIST_FILE = "$(SRCROOT)/SampleApp/Info.plist";
+				INFOPLIST_FILE = "iOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				OTHER_LDFLAGS = "-ObjC";
 				PRODUCT_NAME = SampleApp;

Examples/SampleApp/SampleApp.xcodeproj/xcshareddata/xcschemes/SampleApp.xcscheme

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
-   LastUpgradeVersion = "0630"
+   LastUpgradeVersion = "0620"
    version = "1.3">
    <BuildAction
       parallelizeBuildables = "YES"

Examples/SampleApp/SampleAppTests/SampleAppTests.m

@@ -10,7 +10,8 @@
 #import <UIKit/UIKit.h>
 #import <XCTest/XCTest.h>
 
-#import "RCTLog.h"
+#import "RCTAssert.h"
+#import "RCTRedBox.h"
 #import "RCTRootView.h"
 
 #define TIMEOUT_SECONDS 240
@@ -22,6 +23,7 @@
 
 @implementation SampleAppTests
 
+
 - (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test
 {
   if (test(view)) {
@@ -35,23 +37,18 @@
   return NO;
 }
 
-- (void)testRendersWelcomeScreen
-{
+- (void)testRendersWelcomeScreen {
   UIViewController *vc = [[[[UIApplication sharedApplication] delegate] window] rootViewController];
   NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS];
   BOOL foundElement = NO;
-
-  __block NSString *redboxError = nil;
-  RCTSetLogFunction(^(RCTLogLevel level, NSString *fileName, NSNumber *lineNumber, NSString *message) {
-    if (level >= RCTLogLevelError) {
-      redboxError = message;
-    }
-  });
+  NSString *redboxError = nil;
 
   while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) {
     [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
     [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
 
+    redboxError = [[RCTRedBox sharedInstance] currentErrorMessage];
+
     foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) {
       if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) {
         return YES;
@@ -60,8 +57,6 @@
     }];
   }
 
-  RCTSetLogFunction(RCTDefaultLogFunction);
-
   XCTAssertNil(redboxError, @"RedBox error: %@", redboxError);
   XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS);
 }

Examples/SampleApp/_flowconfig

@@ -9,11 +9,11 @@
 
 # Ignore react-tools where there are overlaps, but don't ignore anything that
 # react-native relies on
-.*/node_modules/react-tools/src/React.js
-.*/node_modules/react-tools/src/renderers/shared/event/EventPropagators.js
-.*/node_modules/react-tools/src/renderers/shared/event/eventPlugins/ResponderEventPlugin.js
-.*/node_modules/react-tools/src/shared/vendor/core/ExecutionEnvironment.js
-
+.*/node_modules/react-tools/src/vendor/core/ExecutionEnvironment.js
+.*/node_modules/react-tools/src/browser/eventPlugins/ResponderEventPlugin.js
+.*/node_modules/react-tools/src/browser/ui/React.js
+.*/node_modules/react-tools/src/core/ReactInstanceHandles.js
+.*/node_modules/react-tools/src/event/EventPropagators.js
 
 # Ignore commoner tests
 .*/node_modules/commoner/test/.*
@@ -32,15 +32,13 @@ node_modules/react-native/Libraries/react-native/react-native-interface.js
 [options]
 module.system=haste
 
-munge_underscores=true
-
 suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
 suppress_type=$FixMe
 
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-4]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-4]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-3]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-3]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
 
 [version]
-0.14.0
+0.13.1

Examples/SampleApp/_watchmanconfig

@@ -1 +0,0 @@
-{}

Examples/SampleApp/android/app/build.gradle

@@ -1,35 +0,0 @@
-apply plugin: 'com.android.application'
-
-android {
-    compileSdkVersion 23
-    buildToolsVersion "23.0.1"
-
-    defaultConfig {
-        applicationId "com.facebook.react.sample"
-        minSdkVersion 16
-        targetSdkVersion 22
-        versionCode 1
-        versionName "1.0"
-        ndk {
-            abiFilters "armeabi-v7a", "x86"
-        }
-    }
-    buildTypes {
-        release {
-            minifyEnabled false
-            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
-        }
-    }
-}
-
-dependencies {
-    compile fileTree(dir: 'libs', include: ['*.jar'])
-    compile 'com.android.support:appcompat-v7:23.0.0'
-
-    // Depend on pre-built React Native
-    compile 'com.facebook.react:react-native:0.11.+'
-    
-    // Depend on React Native source.
-    // This is useful for testing your changes when working on React Native.
-    // compile project(':ReactAndroid')
-}

Examples/SampleApp/android/app/proguard-rules.pro

@@ -1,17 +0,0 @@
-# Add project specific ProGuard rules here.
-# By default, the flags in this file are appended to flags specified
-# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
-# You can edit the include path and order by changing the proguardFiles
-# directive in build.gradle.
-#
-# For more details, see
-#   http://developer.android.com/guide/developing/tools/proguard.html
-
-# Add any project specific keep options here:
-
-# If your project uses WebView with JS, uncomment the following
-# and specify the fully qualified class name to the JavaScript interface
-# class:
-#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
-#   public *;
-#}

Examples/SampleApp/android/app/src/main/AndroidManifest.xml

@@ -1,21 +0,0 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="com.facebook.react.sample">
-
-    <uses-permission android:name="android.permission.INTERNET" />
-
-    <application
-      android:allowBackup="true"
-      android:label="@string/app_name"
-      android:icon="@mipmap/ic_launcher"
-      android:theme="@style/AppTheme">
-      <activity
-        android:name=".MainActivity">
-        <intent-filter>
-            <action android:name="android.intent.action.MAIN" />
-            <category android:name="android.intent.category.LAUNCHER" />
-        </intent-filter>
-      </activity>
-      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
-    </application>
-
-</manifest>

Examples/SampleApp/android/app/src/main/java/com/facebook/react/sample/MainActivity.java

@@ -1,88 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-package com.facebook.react.sample;
-
-import android.app.Activity;
-import android.os.Bundle;
-import android.view.KeyEvent;
-
-import com.facebook.react.LifecycleState;
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.ReactRootView;
-import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler;
-import com.facebook.react.shell.MainReactPackage;
-import com.facebook.soloader.SoLoader;
-
-public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
-
-    private ReactInstanceManager mReactInstanceManager;
-    private ReactRootView mReactRootView;
-
-    @Override
-    protected void onCreate(Bundle savedInstanceState) {
-        super.onCreate(savedInstanceState);
-        SoLoader.init(this, false);
-        mReactRootView = new ReactRootView(this);
-
-        mReactInstanceManager = ReactInstanceManager.builder()
-                .setApplication(getApplication())
-                .setBundleAssetName("index.android.bundle")
-                .setJSMainModuleName("Examples/SampleApp/index.android")
-                .addPackage(new MainReactPackage())
-                .setUseDeveloperSupport(BuildConfig.DEBUG)
-                .setInitialLifecycleState(LifecycleState.RESUMED)
-                .build();
-
-        mReactRootView.startReactApplication(
-                mReactInstanceManager,
-                "SampleApp",
-                null);
-
-        setContentView(mReactRootView);
-    }
-
-    @Override
-    public boolean onKeyUp(int keyCode, KeyEvent event) {
-        if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) {
-            mReactInstanceManager.showDevOptionsDialog();
-            return true;
-        }
-        return super.onKeyUp(keyCode, event);
-
-    }
-
-    @Override
-    public void invokeDefaultOnBackPressed() {
-        super.onBackPressed();
-    }
-
-    @Override
-    protected void onPause() {
-        super.onPause();
-
-        if (mReactInstanceManager != null) {
-            mReactInstanceManager.onPause();
-        }
-    }
-
-    @Override
-    protected void onResume() {
-        super.onResume();
-
-        if (mReactInstanceManager != null) {
-            mReactInstanceManager.onResume(this);
-        }
-    }
-}

Examples/SampleApp/android/app/src/main/res/values/strings.xml

@@ -1,3 +0,0 @@
-<resources>
-    <string name="app_name">SampleApp</string>
-</resources>

Examples/SampleApp/android/app/src/main/res/values/styles.xml

@@ -1,8 +0,0 @@
-<resources>
-
-    <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
-        <!-- Customize your theme here. -->
-    </style>
-
-</resources>

Examples/SampleApp/iOS/AppDelegate.m

@@ -31,7 +31,7 @@
    * on the same Wi-Fi network.
    */
 
-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle"];
+  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/SampleApp/index.ios.bundle"];
 
   /**
    * OPTION 2
@@ -46,8 +46,7 @@
 //   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
 
   RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
-                                                      moduleName:@"<%= name %>"
-                                               initialProperties:nil
+                                                      moduleName:@"SampleApp"
                                                    launchOptions:launchOptions];
 
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

Examples/SampleApp/iOS/Base.lproj/LaunchScreen.xib

@@ -1,8 +1,8 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="6751" systemVersion="14C1510" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="7702" systemVersion="14D136" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES">
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6736"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="7701"/>
         <capability name="Constraints with non-1.0 multipliers" minToolsVersion="5.1"/>
     </dependencies>
     <objects>

Examples/SampleApp/iOS/SampleApp/AppDelegate.m

@@ -1,61 +0,0 @@
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- *
- * This source code is licensed under the BSD-style license found in the
- * LICENSE file in the root directory of this source tree. An additional grant
- * of patent rights can be found in the PATENTS file in the same directory.
- */
-
-#import "AppDelegate.h"
-
-#import "RCTRootView.h"
-
-@implementation AppDelegate
-
-- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
-{
-  NSURL *jsCodeLocation;
-
-  /**
-   * Loading JavaScript code - uncomment the one you want.
-   *
-   * OPTION 1
-   * Load from development server. Start the server from the repository root:
-   *
-   * $ npm start
-   *
-   * To run on device, change `localhost` to the IP address of your computer
-   * (you can get this by typing `ifconfig` into the terminal and selecting the
-   * `inet` value under `en0:`) and make sure your computer and iOS device are
-   * on the same Wi-Fi network.
-   */
-
-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/SampleApp/index.ios.bundle"];
-
-  /**
-   * OPTION 2
-   * Load from pre-bundled file on disk. To re-generate the static bundle
-   * from the root of your project directory, run
-   *
-   * $ react-native bundle --minify
-   *
-   * see http://facebook.github.io/react-native/docs/runningondevice.html
-   */
-
-//   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
-
-  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
-                                                      moduleName:@"SampleApp"
-                                               initialProperties:nil
-                                                   launchOptions:launchOptions];
-
-  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
-  UIViewController *rootViewController = [UIViewController new];
-  rootViewController.view = rootView;
-  self.window.rootViewController = rootViewController;
-  [self.window makeKeyAndVisible];
-  return YES;
-}
-
-@end

Examples/SampleApp/index.android.js

@@ -1,52 +0,0 @@
-/**
- * Sample React Native App
- * https://github.com/facebook/react-native
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  AppRegistry,
-  StyleSheet,
-  Text,
-  View,
-} = React;
-
-var SampleApp = React.createClass({
-  render: function() {
-    return (
-      <View style={styles.container}>
-        <Text style={styles.welcome}>
-          Welcome to React Native!
-        </Text>
-        <Text style={styles.instructions}>
-          To get started, edit index.android.js
-        </Text>
-        <Text style={styles.instructions}>
-          Shake or press menu button for dev menu
-        </Text>
-      </View>
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: '#F5FCFF',
-  },
-  welcome: {
-    fontSize: 20,
-    textAlign: 'center',
-    margin: 10,
-  },
-  instructions: {
-    textAlign: 'center',
-    color: '#333333',
-    marginBottom: 5,
-  },
-});
-
-AppRegistry.registerComponent('SampleApp', () => SampleApp);

Examples/TicTacToe/TicTacToe.xcodeproj/project.pbxproj

@@ -14,7 +14,6 @@
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
 		144C5F691AC3E5E300B004E7 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 144C5F681AC3E5D800B004E7 /* libReact.a */; };
 		58C572511AA6229D00CDF9C8 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 58C5724D1AA6224400CDF9C8 /* libRCTText.a */; };
-		5FF8942E1B85571A007731BE /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */; };
 		832044981B492C2500E297FC /* libRCTSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832044951B492C1E00E297FC /* libRCTSettings.a */; };
 /* End PBXBuildFile section */
 
@@ -40,13 +39,6 @@
 			remoteGlobalIDString = 58B5119B1A9E6C1200147676;
 			remoteInfo = RCTText;
 		};
-		5FF8942C1B8556F8007731BE /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */;
-			proxyType = 2;
-			remoteGlobalIDString = 3C86DF461ADF2C930047B81A;
-			remoteInfo = RCTWebSocket;
-		};
 		832044941B492C1E00E297FC /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
 			containerPortal = 8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */;
@@ -67,7 +59,6 @@
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = TicTacToe/main.m; sourceTree = "<group>"; };
 		144C5F631AC3E5D800B004E7 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../React/React.xcodeproj; sourceTree = "<group>"; };
 		587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
-		5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
 		8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../../Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
@@ -76,7 +67,6 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				5FF8942E1B85571A007731BE /* libRCTWebSocket.a in Frameworks */,
 				144C5F691AC3E5E300B004E7 /* libReact.a in Frameworks */,
 				1341803E1AA91802003F314A /* libRCTImage.a in Frameworks */,
 				58C572511AA6229D00CDF9C8 /* libRCTText.a in Frameworks */,
@@ -119,7 +109,6 @@
 		58C572071AA6126D00CDF9C8 /* Libraries */ = {
 			isa = PBXGroup;
 			children = (
-				5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */,
 				144C5F631AC3E5D800B004E7 /* React.xcodeproj */,
 				134180381AA917ED003F314A /* RCTImage.xcodeproj */,
 				8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */,
@@ -136,14 +125,6 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
-		5FF894291B8556F8007731BE /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
 		832044901B492C1E00E297FC /* Products */ = {
 			isa = PBXGroup;
 			children = (
@@ -224,10 +205,6 @@
 					ProductGroup = 58C572481AA6224300CDF9C8 /* Products */;
 					ProjectRef = 587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */;
 				},
-				{
-					ProductGroup = 5FF894291B8556F8007731BE /* Products */;
-					ProjectRef = 5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */;
-				},
 				{
 					ProductGroup = 144C5F641AC3E5D800B004E7 /* Products */;
 					ProjectRef = 144C5F631AC3E5D800B004E7 /* React.xcodeproj */;
@@ -262,13 +239,6 @@
 			remoteRef = 58C5724C1AA6224400CDF9C8 /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
-		5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */ = {
-			isa = PBXReferenceProxy;
-			fileType = archive.ar;
-			path = libRCTWebSocket.a;
-			remoteRef = 5FF8942C1B8556F8007731BE /* PBXContainerItemProxy */;
-			sourceTree = BUILT_PRODUCTS_DIR;
-		};
 		832044951B492C1E00E297FC /* libRCTSettings.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;

Examples/TicTacToe/TicTacToe/AppDelegate.m

@@ -52,7 +52,6 @@
 
   RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                       moduleName:@"TicTacToeApp"
-                                                initialProperties:nil
                                                    launchOptions:launchOptions];
 
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

Examples/UIExplorer/AccessibilityAndroidExample.android.js

@@ -1,213 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  StyleSheet,
-  Text,
-  View,
-  ToastAndroid,
-  TouchableWithoutFeedback,
-} = React;
-
-var UIExplorerBlock = require('./UIExplorerBlock');
-var UIExplorerPage = require('./UIExplorerPage');
-
-var importantForAccessibilityValues = ['auto', 'yes', 'no', 'no-hide-descendants'];
-
-var AccessibilityAndroidExample = React.createClass({
-
-  statics: {
-    title: 'Accessibility',
-    description: 'Examples of using Accessibility API.',
-  },
-
-  getInitialState: function() {
-    return {
-      count: 0,
-      backgroundImportantForAcc: 0,
-      forgroundImportantForAcc: 0,
-    };
-  },
-
-  _addOne: function() {
-    this.setState({
-      count: ++this.state.count,
-    });
-  },
-
-  _changeBackgroundImportantForAcc: function() {
-    this.setState({
-      backgroundImportantForAcc: (this.state.backgroundImportantForAcc + 1) % 4,
-    });
-  },
-
-  _changeForgroundImportantForAcc: function() {
-    this.setState({
-      forgroundImportantForAcc: (this.state.forgroundImportantForAcc + 1) % 4,
-    });
-  },
-
-  render: function() {
-    return (
-      <UIExplorerPage title={'Accessibility'}>
-
-        <UIExplorerBlock title="Nonaccessible view with TextViews">
-          <View>
-            <Text style={{color: 'green',}}>
-              This is
-            </Text>
-            <Text style={{color: 'blue'}}>
-              nontouchable normal view.
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Accessible view with TextViews wihout label">
-          <View accessible={true}>
-            <Text style={{color: 'green',}}>
-              This is
-            </Text>
-            <Text style={{color: 'blue'}}>
-              nontouchable accessible view without label.
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Accessible view with TextViews with label">
-          <View accessible={true}
-            accessibilityLabel="I have label, so I read it instead of embedded text.">
-            <Text style={{color: 'green',}}>
-              This is
-            </Text>
-            <Text style={{color: 'blue'}}>
-              nontouchable accessible view with label.
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Touchable with component type = button">
-          <TouchableWithoutFeedback
-            onPress={() => ToastAndroid.show('Toasts work by default', ToastAndroid.SHORT)}
-            accessibilityComponentType="button">
-            <View style={styles.embedded}>
-              <Text>Click me</Text>
-              <Text>Or not</Text>
-            </View>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="LiveRegion">
-          <TouchableWithoutFeedback onPress={this._addOne}>
-            <View style={styles.embedded}>
-              <Text>Click me</Text>
-            </View>
-          </TouchableWithoutFeedback>
-          <Text accessibilityLiveRegion="polite">
-            Clicked {this.state.count} times
-          </Text>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Overlapping views and importantForAccessibility property">
-          <View style={styles.container}>
-            <View
-              style={{
-                position: 'absolute',
-                left: 10,
-                top: 10,
-                right: 10,
-                height: 100,
-                backgroundColor: 'green'}}
-              accessible={true}
-              accessibilityLabel="First layout"
-              importantForAccessibility={
-                importantForAccessibilityValues[this.state.backgroundImportantForAcc]}>
-              <View accessible={true}>
-                <Text style={{fontSize: 25}}>
-                  Hello
-                </Text>
-              </View>
-            </View>
-            <View
-              style={{
-                position: 'absolute',
-                left: 10,
-                top: 25,
-                right: 10,
-                height: 110,
-                backgroundColor: 'yellow', opacity: 0.5}}
-              accessible={true}
-              accessibilityLabel="Second layout"
-              importantForAccessibility={
-                importantForAccessibilityValues[this.state.forgroundImportantForAcc]}>
-              <View accessible={true}>
-                <Text style={{fontSize: 20}}>
-                  world
-                </Text>
-              </View>
-            </View>
-          </View>
-          <TouchableWithoutFeedback onPress={this._changeBackgroundImportantForAcc}>
-            <View style={styles.embedded}>
-              <Text>
-                Change importantForAccessibility for background layout.
-              </Text>
-            </View>
-          </TouchableWithoutFeedback>
-          <View accessible={true}>
-            <Text>
-              Background layout importantForAccessibility
-            </Text>
-            <Text>
-              {importantForAccessibilityValues[this.state.backgroundImportantForAcc]}
-            </Text>
-          </View>
-          <TouchableWithoutFeedback onPress={this._changeForgroundImportantForAcc}>
-            <View style={styles.embedded}>
-              <Text>
-                Change importantForAccessibility for forground layout.
-              </Text>
-            </View>
-          </TouchableWithoutFeedback>
-          <View accessible={true}>
-            <Text>
-              Forground layout importantForAccessibility
-            </Text>
-            <Text>
-              {importantForAccessibilityValues[this.state.forgroundImportantForAcc]}
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-      </UIExplorerPage>
-    );
-  },
-});
-
-var styles = StyleSheet.create({
-   embedded: {
-    backgroundColor: 'yellow',
-    padding:10,
-  },
-  container: {
-    flex: 1,
-    backgroundColor: 'white',
-    padding: 10,
-    height:150,
-  },
-});
-
-module.exports = AccessibilityAndroidExample;

Examples/UIExplorer/AccessibilityAndroidExample.js

@@ -1,256 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  StyleSheet,
-  Text,
-  View,
-  TouchableWithoutFeedback,
-} = React;
-var ToastAndroid = require('ToastAndroid');
-var AccessibilityInfo = require('AccessibilityInfo');
-
-var UIExplorerBlock = require('./UIExplorerBlock');
-var UIExplorerPage = require('./UIExplorerPage');
-
-var importantForAccessibilityValues = ['auto', 'yes', 'no', 'no-hide-descendants'];
-
-var AccessibilityAndroidExample = React.createClass({
-
-  statics: {
-    title: 'Accessibility',
-    description: 'Examples of using Accessibility API.',
-  },
-
-  getInitialState: function() {
-    return {
-      count: 0,
-      talkbackEnabled: false,
-      backgroundImportantForAcc: 0,
-      forgroundImportantForAcc: 0,
-    };
-  },
-
-   componentDidMount: function() {
-    AccessibilityInfo.addEventListener(
-      'change',
-      this._handleTouchExplorationChange
-    );
-    AccessibilityInfo.fetch().done((enabled) => {
-      this.setState({
-        count: this.state.count,
-        talkbackEnabled: enabled}); }
-    );
-  },
-
-  componentWillUnmount: function() {
-    AccessibilityInfo.removeEventListener(
-      'change',
-      this._handleTouchExplorationChange
-    );
-  },
-
-  _handleTouchExplorationChange: function(isEnabled) {
-    this.setState({
-      count: this.state.count,
-      talkbackEnabled: isEnabled,
-    });
-  },
-
-  _showAccessibilityToast: function() {
-    var text = 'TouchExploration is ' + (this.state.talkbackEnabled ? 'enabled' : 'disabled');
-    ToastAndroid.show(text, ToastAndroid.SHORT);
-  },
-
-  _addOne: function() {
-    this.setState({
-      count: ++this.state.count,
-      talkbackEnabled: this.state.talkbackEnabled,
-    });
-  },
-
-  _changeBackgroundImportantForAcc: function() {
-    this.setState({
-      backgroundImportantForAcc: (this.state.backgroundImportantForAcc + 1) % 4,
-    });
-  },
-
-  _changeForgroundImportantForAcc: function() {
-    this.setState({
-      forgroundImportantForAcc: (this.state.forgroundImportantForAcc + 1) % 4,
-    });
-  },
-
-  render: function() {
-    return (
-      <UIExplorerPage title={'Accessibility'}>
-
-        <UIExplorerBlock title="Nonaccessible view with TextViews">
-          <View>
-            <Text style={{color: 'green',}}>
-              This is
-            </Text>
-            <Text style={{color: 'blue'}}>
-              nontouchable normal view.
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Accessible view with TextViews wihout label">
-          <View accessible={true}>
-            <Text style={{color: 'green',}}>
-              This is
-            </Text>
-            <Text style={{color: 'blue'}}>
-              nontouchable accessible view without label.
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Accessible view with TextViews with label">
-          <View accessible={true}
-            accessibilityLabel="I have label, so I read it instead of embedded text.">
-            <Text style={{color: 'green',}}>
-              This is
-            </Text>
-            <Text style={{color: 'blue'}}>
-              nontouchable accessible view with label.
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Touchable with component type = button">
-          <TouchableWithoutFeedback
-            onPress={() => ToastAndroid.show('Toasts work by default', ToastAndroid.SHORT)}>
-            <View style={styles.embedded} accessibilityComponentType="button">
-              <Text>Click me</Text>
-              <Text>Or not</Text>
-            </View>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="LiveRegion">
-          <TouchableWithoutFeedback onPress={this._addOne}>
-            <View style={styles.embedded} accessibilityComponentType="button">
-              <Text>Click me</Text>
-            </View>
-          </TouchableWithoutFeedback>
-          <Text accessibilityLiveRegion="polite">
-            Clicked {this.state.count} times
-          </Text>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Check if TouchExploration is enabled">
-          <TouchableWithoutFeedback onPress={this._showAccessibilityToast}>
-            <View style={styles.embedded}>
-              <Text>
-                Click to check TouchExploration
-              </Text>
-            </View>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Overlapping views and importantForAccessibility property">
-          <View style={styles.container}>
-            <View
-              style={{
-                position: 'absolute',
-                left: 10,
-                top: 10,
-                right: 10,
-                height: 100,
-                backgroundColor: 'green'}}
-              accessible={true}
-              accessibilityLabel="First layout"
-              importantForAccessibility={
-                importantForAccessibilityValues[this.state.backgroundImportantForAcc]}>
-              <View accessible={true}>
-                <Text style={{fontSize: 25}}>
-                  Hello
-                </Text>
-              </View>
-            </View>
-            <View
-              style={{
-                position: 'absolute',
-                left: 10,
-                top: 25,
-                right: 10,
-                height: 110,
-                backgroundColor: 'yellow', opacity: 0.5}}
-              accessible={true}
-              accessibilityLabel="Second layout"
-              importantForAccessibility={
-                importantForAccessibilityValues[this.state.forgroundImportantForAcc]}>
-              <View accessible={true}>
-                <Text style={{fontSize: 20}}>
-                  world
-                </Text>
-              </View>
-            </View>
-          </View>
-          <TouchableWithoutFeedback onPress={this._changeBackgroundImportantForAcc}>
-            <View style={styles.embedded}>
-              <Text>
-                Change importantForAccessibility for background layout.
-              </Text>
-            </View>
-          </TouchableWithoutFeedback>
-          <View accessible={true}>
-            <Text>
-              Background layout importantForAccessibility
-            </Text>
-            <Text>
-              {importantForAccessibilityValues[this.state.backgroundImportantForAcc]}
-            </Text>
-          </View>
-          <TouchableWithoutFeedback onPress={this._changeForgroundImportantForAcc}>
-            <View style={styles.embedded}>
-              <Text>
-                Change importantForAccessibility for forground layout.
-              </Text>
-            </View>
-          </TouchableWithoutFeedback>
-          <View accessible={true}>
-            <Text>
-              Forground layout importantForAccessibility
-            </Text>
-            <Text>
-              {importantForAccessibilityValues[this.state.forgroundImportantForAcc]}
-            </Text>
-          </View>
-        </UIExplorerBlock>
-
-      </UIExplorerPage>
-    );
-  },
-});
-
-var styles = StyleSheet.create({
-   embedded: {
-    backgroundColor: 'yellow',
-    padding:10,
-  },
-  container: {
-    flex: 1,
-    backgroundColor: 'white',
-    padding: 10,
-    height:150,
-  },
-});
-
-module.exports = AccessibilityAndroidExample;

Examples/UIExplorer/AnimationExample/AnExApp.js

@@ -38,11 +38,9 @@ class Circle extends React.Component {
     super();
     this._onLongPress = this._onLongPress.bind(this);
     this._toggleIsActive = this._toggleIsActive.bind(this);
-    this.state = {
-      isActive: false,
-      pan: new Animated.ValueXY(), // Vectors reduce boilerplate.  (step1: uncomment)
-      pop: new Animated.Value(0),  // Initial value.               (step2a: uncomment)
-    };
+    this.state = {isActive: false};
+    this.state.pan = new Animated.ValueXY(); // Vectors reduce boilerplate.  (step1: uncomment)
+    this.state.pop = new Animated.Value(0);  // Initial value.               (step2a: uncomment)
   }
 
   _onLongPress(): void {

Examples/UIExplorer/AssetScaledImageExample.js

@@ -1,98 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Image,
-  StyleSheet,
-  View,
-  ScrollView
-} = React;
-
-var AssetScaledImageExample = React.createClass({
-
-  getInitialState() {
-    return {
-      asset: this.props.asset
-    };
-  },
-
-  render() {
-    var image = this.state.asset.node.image;
-    return (
-      <ScrollView>
-        <View style={styles.row}>
-          <Image source={image} style={styles.imageWide}/>
-        </View>
-        <View style={styles.row}>
-          <Image source={image} style={styles.imageThumb}/>
-          <Image source={image} style={styles.imageThumb}/>
-          <Image source={image} style={styles.imageThumb}/>
-        </View>
-        <View style={styles.row}>
-          <Image source={image} style={styles.imageT1}/>
-          <Image source={image} style={styles.imageT2}/>
-        </View>
-      </ScrollView>
-    );
-  },
-});
-
-var styles = StyleSheet.create({
-  row: {
-    padding: 5,
-    flex: 1,
-    flexDirection: 'row',
-    alignSelf: 'center',
-  },
-  textColumn: {
-    flex: 1,
-    flexDirection: 'column',
-  },
-  imageWide: {
-    borderWidth: 1,
-    borderColor: 'black',
-    width: 320,
-    height: 240,
-    margin: 5,
-  },
-  imageThumb: {
-    borderWidth: 1,
-    borderColor: 'black',
-    width: 100,
-    height: 100,
-    margin: 5,
-  },
-  imageT1: {
-    borderWidth: 1,
-    borderColor: 'black',
-    width: 212,
-    height: 320,
-    margin: 5,
-  },
-  imageT2: {
-    borderWidth: 1,
-    borderColor: 'black',
-    width: 100,
-    height: 320,
-    margin: 5,
-  },
-});
-
-exports.title = '<AssetScaledImageExample>';
-exports.description = 'Example component that displays the automatic scaling capabilities of the <Image /> tag';
-module.exports = AssetScaledImageExample;

Examples/UIExplorer/AsyncStorageExample.js

@@ -29,23 +29,18 @@ var COLORS = ['red', 'orange', 'yellow', 'green', 'blue'];
 
 var BasicStorageExample = React.createClass({
   componentDidMount() {
-    this._loadInitialState().done();
+    AsyncStorage.getItem(STORAGE_KEY)
+      .then((value) => {
+        if (value !== null){
+          this.setState({selectedValue: value});
+          this._appendMessage('Recovered selection from disk: ' + value);
+        } else {
+          this._appendMessage('Initialized with no selection on disk.');
+        }
+      })
+      .catch((error) => this._appendMessage('AsyncStorage error: ' + error.message))
+      .done();
   },
-
-  async _loadInitialState() {
-    try {
-      var value = await AsyncStorage.getItem(STORAGE_KEY);
-      if (value !== null){
-        this.setState({selectedValue: value});
-        this._appendMessage('Recovered selection from disk: ' + value);
-      } else {
-        this._appendMessage('Initialized with no selection on disk.');
-      }
-    } catch (error) {
-      this._appendMessage('AsyncStorage error: ' + error.message);
-    }
-  },
-
   getInitialState() {
     return {
       selectedValue: COLORS[0],
@@ -85,23 +80,19 @@ var BasicStorageExample = React.createClass({
     );
   },
 
-  async _onValueChange(selectedValue) {
+  _onValueChange(selectedValue) {
     this.setState({selectedValue});
-    try {
-      await AsyncStorage.setItem(STORAGE_KEY, selectedValue);
-      this._appendMessage('Saved selection to disk: ' + selectedValue);
-    } catch (error) {
-      this._appendMessage('AsyncStorage error: ' + error.message);
-    }
+    AsyncStorage.setItem(STORAGE_KEY, selectedValue)
+      .then(() => this._appendMessage('Saved selection to disk: ' + selectedValue))
+      .catch((error) => this._appendMessage('AsyncStorage error: ' + error.message))
+      .done();
   },
 
-  async _removeStorage() {
-    try {
-      await AsyncStorage.removeItem(STORAGE_KEY);
-      this._appendMessage('Selection removed from disk.');
-    } catch (error) {
-      this._appendMessage('AsyncStorage error: ' + error.message);
-    }
+  _removeStorage() {
+    AsyncStorage.removeItem(STORAGE_KEY)
+      .then(() => this._appendMessage('Selection removed from disk.'))
+      .catch((error) => { this._appendMessage('AsyncStorage error: ' + error.message) })
+      .done();
   },
 
   _appendMessage(message) {

Examples/UIExplorer/CameraRollExample.ios.js

@@ -24,11 +24,9 @@ var {
   SwitchIOS,
   Text,
   View,
-  TouchableOpacity
 } = React;
 
 var CameraRollView = require('./CameraRollView.ios');
-var AssetScaledImageExampleView = require('./AssetScaledImageExample');
 
 var CAMERA_ROLL_VIEW = 'camera_roll_view';
 
@@ -56,7 +54,7 @@ var CameraRollExample = React.createClass({
         <Text>{'Group Type: ' + this.state.groupTypes}</Text>
         <CameraRollView
           ref={CAMERA_ROLL_VIEW}
-          batchSize={20}
+          batchSize={5}
           groupTypes={this.state.groupTypes}
           renderImage={this._renderImage}
         />
@@ -64,35 +62,24 @@ var CameraRollExample = React.createClass({
     );
   },
 
-  loadAsset(asset){
-    this.props.navigator.push({
-      title: 'Camera Roll Image',
-      component: AssetScaledImageExampleView,
-      backButtonTitle: 'Back',
-      passProps: { asset: asset },
-    });
-  },
-
   _renderImage(asset) {
     var imageSize = this.state.bigImages ? 150 : 75;
     var imageStyle = [styles.image, {width: imageSize, height: imageSize}];
     var location = asset.node.location.longitude ?
       JSON.stringify(asset.node.location) : 'Unknown location';
     return (
-      <TouchableOpacity onPress={ this.loadAsset.bind( this, asset ) }>
-        <View key={asset} style={styles.row}>
-          <Image
-            source={asset.node.image}
-            style={imageStyle}
-          />
-          <View style={styles.info}>
-            <Text style={styles.url}>{asset.node.image.uri}</Text>
-            <Text>{location}</Text>
-            <Text>{asset.node.group_name}</Text>
-            <Text>{new Date(asset.node.timestamp).toString()}</Text>
-          </View>
+      <View key={asset} style={styles.row}>
+        <Image
+          source={asset.node.image}
+          style={imageStyle}
+        />
+        <View style={styles.info}>
+          <Text style={styles.url}>{asset.node.image.uri}</Text>
+          <Text>{location}</Text>
+          <Text>{asset.node.group_name}</Text>
+          <Text>{new Date(asset.node.timestamp).toString()}</Text>
         </View>
-      </TouchableOpacity>
+      </View>
     );
   },
 
@@ -128,7 +115,7 @@ var styles = StyleSheet.create({
   },
 });
 
-exports.title = 'Camera Roll';
+exports.title = '<CameraRollView>';
 exports.description = 'Example component that uses CameraRoll to list user\'s photos';
 exports.examples = [
   {

Examples/UIExplorer/ImageEditingExample.js

@@ -1,305 +0,0 @@
-
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  CameraRoll,
-  Image,
-  NativeModules,
-  ScrollView,
-  StyleSheet,
-  Text,
-  TouchableHighlight,
-  View,
-} = React;
-var ImageEditingManager = NativeModules.ImageEditingManager;
-var RCTScrollViewConsts = NativeModules.UIManager.RCTScrollView.Constants;
-
-var PAGE_SIZE = 20;
-
-type ImageOffset = {
-  x: number;
-  y: number;
-};
-
-type ImageSize = {
-  width: number;
-  height: number;
-};
-
-type TransformData = {
-  offset: ImageOffset;
-  size: ImageSize;
-}
-
-class SquareImageCropper extends React.Component {
-  _isMounted: boolean;
-  _transformData: TransformData;
-
-  constructor(props) {
-    super(props);
-    this._isMounted = true;
-    this.state = {
-      randomPhoto: null,
-      measuredSize: null,
-      croppedImageURI: null,
-      cropError: null,
-    };
-    this._fetchRandomPhoto();
-  }
-
-  _fetchRandomPhoto() {
-    CameraRoll.getPhotos(
-      {first: PAGE_SIZE},
-      (data) => {
-        if (!this._isMounted) {
-          return;
-        }
-        var edges = data.edges;
-        var edge = edges[Math.floor(Math.random() * edges.length)];
-        var randomPhoto = edge && edge.node && edge.node.image;
-        if (randomPhoto) {
-          this.setState({randomPhoto});
-        }
-      },
-      (error) => undefined
-    );
-  }
-
-  componentWillUnmount() {
-    this._isMounted = false;
-  }
-
-  render() {
-    if (!this.state.measuredSize) {
-      return (
-        <View
-          style={styles.container}
-          onLayout={(event) => {
-            var measuredWidth = event.nativeEvent.layout.width;
-            if (!measuredWidth) {
-              return;
-            }
-            this.setState({
-              measuredSize: {width: measuredWidth, height: measuredWidth},
-            });
-          }}
-        />
-      );
-    }
-
-    if (!this.state.croppedImageURI) {
-      return this._renderImageCropper();
-    }
-    return this._renderCroppedImage();
-  }
-
-  _renderImageCropper() {
-    if (!this.state.randomPhoto) {
-      return (
-        <View style={styles.container} />
-      );
-    }
-    var error = null;
-    if (this.state.cropError) {
-      error = (
-        <Text>{this.state.cropError.message}</Text>
-      );
-    }
-    return (
-      <View style={styles.container}>
-        <Text>Drag the image within the square to crop:</Text>
-        <ImageCropper
-          image={this.state.randomPhoto}
-          size={this.state.measuredSize}
-          style={[styles.imageCropper, this.state.measuredSize]}
-          onTransformDataChange={(data) => this._transformData = data}
-        />
-        <TouchableHighlight
-          style={styles.cropButtonTouchable}
-          onPress={this._crop.bind(this)}>
-          <View style={styles.cropButton}>
-            <Text style={styles.cropButtonLabel}>
-              Crop
-            </Text>
-          </View>
-        </TouchableHighlight>
-        {error}
-      </View>
-    );
-  }
-
-  _renderCroppedImage() {
-    return (
-      <View style={styles.container}>
-        <Text>Here is the cropped image:</Text>
-        <Image
-          source={{uri: this.state.croppedImageURI}}
-          style={[styles.imageCropper, this.state.measuredSize]}
-        />
-        <TouchableHighlight
-          style={styles.cropButtonTouchable}
-          onPress={this._reset.bind(this)}>
-          <View style={styles.cropButton}>
-            <Text style={styles.cropButtonLabel}>
-              Try again
-            </Text>
-          </View>
-        </TouchableHighlight>
-      </View>
-    );
-  }
-
-  _crop() {
-    ImageEditingManager.cropImage(
-      this.state.randomPhoto.uri,
-      this._transformData,
-      (croppedImageURI) => this.setState({croppedImageURI}),
-      (cropError) => this.setState({cropError})
-    );
-  }
-
-  _reset() {
-    this.setState({
-      randomPhoto: null,
-      croppedImageURI: null,
-      cropError: null,
-    });
-    this._fetchRandomPhoto();
-  }
-
-}
-
-class ImageCropper extends React.Component {
-  _scaledImageSize: ImageSize;
-  _contentOffset: ImageOffset;
-
-  componentWillMount() {
-    // Scale an image to the minimum size that is large enough to completely
-    // fill the crop box.
-    var widthRatio = this.props.image.width / this.props.size.width;
-    var heightRatio = this.props.image.height / this.props.size.height;
-    if (widthRatio < heightRatio) {
-      this._scaledImageSize = {
-        width: this.props.size.width,
-        height: this.props.image.height / widthRatio,
-      };
-    } else {
-      this._scaledImageSize = {
-        width: this.props.image.width / heightRatio,
-        height: this.props.size.height,
-      };
-    }
-    this._contentOffset = {
-      x: (this._scaledImageSize.width - this.props.size.width) / 2,
-      y: (this._scaledImageSize.height - this.props.size.height) / 2,
-    };
-    this._updateTransformData(
-      this._contentOffset,
-      this._scaledImageSize,
-      this.props.size
-    );
-  }
-
-  _onScroll(event) {
-    this._updateTransformData(
-      event.nativeEvent.contentOffset,
-      event.nativeEvent.contentSize,
-      event.nativeEvent.layoutMeasurement
-    );
-  }
-
-  _updateTransformData(offset, scaledImageSize, croppedImageSize) {
-    var offsetRatioX = offset.x / scaledImageSize.width;
-    var offsetRatioY = offset.y / scaledImageSize.height;
-    var sizeRatioX = croppedImageSize.width / scaledImageSize.width;
-    var sizeRatioY = croppedImageSize.height / scaledImageSize.height;
-
-    this.props.onTransformDataChange && this.props.onTransformDataChange({
-      offset: {
-        x: this.props.image.width * offsetRatioX,
-        y: this.props.image.height * offsetRatioY,
-      },
-      size: {
-        width: this.props.image.width * sizeRatioX,
-        height: this.props.image.height * sizeRatioY,
-      },
-    });
-  }
-
-  render() {
-    var decelerationRate =
-      RCTScrollViewConsts && RCTScrollViewConsts.DecelerationRate ?
-        RCTScrollViewConsts.DecelerationRate.Fast :
-        0;
-
-    return (
-      <ScrollView
-        alwaysBounceVertical={true}
-        automaticallyAdjustContentInsets={false}
-        contentOffset={this._contentOffset}
-        decelerationRate={decelerationRate}
-        horizontal={true}
-        maximumZoomScale={3.0}
-        onMomentumScrollEnd={this._onScroll.bind(this)}
-        onScrollEndDrag={this._onScroll.bind(this)}
-        showsHorizontalScrollIndicator={false}
-        showsVerticalScrollIndicator={false}
-        style={this.props.style}
-        scrollEventThrottle={16}>
-        <Image source={this.props.image} style={this._scaledImageSize} />
-      </ScrollView>
-    );
-  }
-
-}
-
-exports.framework = 'React';
-exports.title = 'ImageEditingManager';
-exports.description = 'Cropping and scaling with ImageEditingManager';
-exports.examples = [{
-  title: 'Image Cropping',
-  render() {
-    return <SquareImageCropper/>;
-  }
-}];
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    alignSelf: 'stretch',
-  },
-  imageCropper: {
-    alignSelf: 'center',
-    marginTop: 12,
-  },
-  cropButtonTouchable: {
-    alignSelf: 'center',
-    marginTop: 12,
-  },
-  cropButton: {
-    padding: 12,
-    backgroundColor: 'blue',
-    borderRadius: 4,
-  },
-  cropButtonLabel: {
-    color: 'white',
-    fontSize: 16,
-    fontWeight: '500',
-  },
-});

Examples/UIExplorer/ImageExample.js

@@ -21,41 +21,10 @@ var {
   StyleSheet,
   Text,
   View,
-  ActivityIndicatorIOS
 } = React;
 
 var ImageCapInsetsExample = require('./ImageCapInsetsExample');
 
-var NetworkImageExample = React.createClass({
-  watchID: (null: ?number),
-
-  getInitialState: function() {
-    return {
-      error: false,
-      loading: false,
-      progress: 0
-    };
-  },
-  render: function() {
-    var loader = this.state.loading ?
-      <View style={styles.progress}>
-        <Text>{this.state.progress}%</Text>
-        <ActivityIndicatorIOS style={{marginLeft:5}}/>
-      </View> : null;
-    return this.state.error ?
-      <Text>{this.state.error}</Text> :
-      <Image
-        source={this.props.source}
-        style={[styles.base, {overflow: 'visible'}]}
-        onLoadStart={(e) => this.setState({loading: true})}
-        onError={(e) => this.setState({error: e.nativeEvent.error, loading: false})}
-        onProgress={(e) => this.setState({progress: Math.round(100 * e.nativeEvent.loaded / e.nativeEvent.total)})}
-        onLoad={() => this.setState({loading: false, error: false})}>
-        {loader}
-      </Image>;
-  }
-});
-
 exports.displayName = (undefined: ?string);
 exports.framework = 'React';
 exports.title = '<Image>';
@@ -90,22 +59,6 @@ exports.examples = [
       );
     },
   },
-  {
-    title: 'Error Handler',
-    render: function() {
-      return (
-        <NetworkImageExample source={{uri: 'http://TYPO_ERROR_facebook.github.io/react/img/logo_og.png'}} />
-      );
-    },
-  },
-  {
-    title: 'Image Download Progress',
-    render: function() {
-      return (
-        <NetworkImageExample source={{uri: 'http://facebook.github.io/origami/public/images/blog-hero.jpg?r=1'}}/>
-      );
-    },
-  },
   {
     title: 'Border Color',
     render: function() {
@@ -241,46 +194,23 @@ exports.examples = [
       'pixels to the tint color.',
     render: function() {
       return (
-        <View>
-          <View style={styles.horizontal}>
-            <Image
-              source={require('image!uie_thumb_normal')}
-              style={[styles.icon, {tintColor: '#5ac8fa' }]}
-            />
-            <Image
-              source={require('image!uie_thumb_normal')}
-              style={[styles.icon, styles.leftMargin, {tintColor: '#4cd964' }]}
-            />
-            <Image
-              source={require('image!uie_thumb_normal')}
-              style={[styles.icon, styles.leftMargin, {tintColor: '#ff2d55' }]}
-            />
-            <Image
-              source={require('image!uie_thumb_normal')}
-              style={[styles.icon, styles.leftMargin, {tintColor: '#8e8e93' }]}
-            />
-          </View>
-          <Text style={styles.sectionText}>
-            It also works with downloaded images:
-          </Text>
-          <View style={styles.horizontal}>
-            <Image
-              source={smallImage}
-              style={[styles.base, {tintColor: '#5ac8fa' }]}
-            />
-            <Image
-              source={smallImage}
-              style={[styles.base, styles.leftMargin, {tintColor: '#4cd964' }]}
-            />
-            <Image
-              source={smallImage}
-              style={[styles.base, styles.leftMargin, {tintColor: '#ff2d55' }]}
-            />
-            <Image
-              source={smallImage}
-              style={[styles.base, styles.leftMargin, {tintColor: '#8e8e93' }]}
-            />
-          </View>
+        <View style={styles.horizontal}>
+          <Image
+            source={require('image!uie_thumb_normal')}
+            style={[styles.icon, {tintColor: 'blue' }]}
+          />
+          <Image
+            source={require('image!uie_thumb_normal')}
+            style={[styles.icon, styles.leftMargin, {tintColor: 'green' }]}
+          />
+          <Image
+            source={require('image!uie_thumb_normal')}
+            style={[styles.icon, styles.leftMargin, {tintColor: 'red' }]}
+          />
+          <Image
+            source={require('image!uie_thumb_normal')}
+            style={[styles.icon, styles.leftMargin, {tintColor: 'black' }]}
+          />
         </View>
       );
     },
@@ -340,28 +270,19 @@ exports.examples = [
 ];
 
 var fullImage = {uri: 'http://facebook.github.io/react/img/logo_og.png'};
-var smallImage = {uri: 'http://facebook.github.io/react/img/logo_small_2x.png'};
+var smallImage = {uri: 'http://facebook.github.io/react/img/logo_small.png'};
 
 var styles = StyleSheet.create({
   base: {
     width: 38,
     height: 38,
   },
-  progress: {
-    flex: 1,
-    alignItems: 'center',
-    flexDirection: 'row',
-    width: 100
-  },
   leftMargin: {
     marginLeft: 10,
   },
   background: {
     backgroundColor: '#222222'
   },
-  sectionText: {
-    marginVertical: 6,
-  },
   nestedText: {
     marginLeft: 12,
     marginTop: 20,

Examples/UIExplorer/ImageMocks.js

@@ -15,37 +15,37 @@
  */
 'use strict';
 
-/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
- * into a proptype shape */
 declare module 'image!story-background' {
+  /* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
+   * into a proptype shape */
   declare var uri: string;
   declare var isStatic: boolean;
 }
 
-/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
- * into a proptype shape */
 declare module 'image!uie_comment_highlighted' {
+  /* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
+   * into a proptype shape */
   declare var uri: string;
   declare var isStatic: boolean;
 }
 
-/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
- * into a proptype shape */
 declare module 'image!uie_comment_normal' {
+  /* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
+   * into a proptype shape */
   declare var uri: string;
   declare var isStatic: boolean;
 }
 
-/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
- * into a proptype shape */
 declare module 'image!uie_thumb_normal' {
+  /* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
+   * into a proptype shape */
   declare var uri: string;
   declare var isStatic: boolean;
 }
 
-/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
- * into a proptype shape */
 declare module 'image!uie_thumb_selected' {
+  /* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
+   * into a proptype shape */
   declare var uri: string;
   declare var isStatic: boolean;
 }

Examples/UIExplorer/LayoutEventsExample.js

@@ -49,7 +49,8 @@ var LayoutEventExample = React.createClass({
       () => {
         console.log('layout animation done.');
         this.addWrapText();
-      }
+      },
+      (error) => { throw new Error(JSON.stringify(error)); }
     );
     this.setState({
       viewStyle: {
@@ -138,11 +139,11 @@ var styles = StyleSheet.create({
   },
 });
 
-exports.title = 'Layout Events';
+exports.title = 'onLayout';
 exports.description = 'Layout events can be used to measure view size and position.';
 exports.examples = [
 {
-  title: 'LayoutEventExample',
+  title: 'onLayout',
   render: function(): ReactElement {
     return <LayoutEventExample />;
   },

Examples/UIExplorer/ListViewGridLayoutExample.js

@@ -1,149 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Image,
-  ListView,
-  TouchableHighlight,
-  StyleSheet,
-  Text,
-  View,
-} = React;
-
-var THUMB_URLS = [
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-ash3/t39.1997/p128x128/851549_767334479959628_274486868_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851561_767334496626293_1958532586_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-ash3/t39.1997/p128x128/851579_767334503292959_179092627_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851589_767334513292958_1747022277_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851563_767334559959620_1193692107_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851593_767334566626286_1953955109_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851591_767334523292957_797560749_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851567_767334529959623_843148472_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851548_767334489959627_794462220_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851575_767334539959622_441598241_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-ash3/t39.1997/p128x128/851573_767334549959621_534583464_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851583_767334573292952_1519550680_n.png',
-];
-
-var ListViewGridLayoutExample = React.createClass({
-
-  statics: {
-    title: '<ListView> - Grid Layout',
-    description: 'Flexbox grid layout.'
-  },
-
-  getInitialState: function() {
-    var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
-    return {
-      dataSource: ds.cloneWithRows(this._genRows({})),
-    };
-  },
-
-  _pressData: ({}: {[key: number]: boolean}),
-
-  componentWillMount: function() {
-    this._pressData = {};
-  },
-
-  render: function() {
-    return (
-      // ListView wraps ScrollView and so takes on its properties.
-      // With that in mind you can use the ScrollView's contentContainerStyle prop to style the items.
-      <ListView
-        contentContainerStyle={styles.list}
-        dataSource={this.state.dataSource}
-        renderRow={this._renderRow}
-      />
-    );
-  },
-
-  _renderRow: function(rowData: string, sectionID: number, rowID: number) {
-    var rowHash = Math.abs(hashCode(rowData));
-    var imgSource = {
-      uri: THUMB_URLS[rowHash % THUMB_URLS.length],
-    };
-    return (
-      <TouchableHighlight onPress={() => this._pressRow(rowID)} underlayColor="transparent">
-        <View>
-          <View style={styles.row}>
-            <Image style={styles.thumb} source={imgSource} />
-            <Text style={styles.text}>
-              {rowData}
-            </Text>
-          </View>
-        </View>
-      </TouchableHighlight>
-    );
-  },
-
-  _genRows: function(pressData: {[key: number]: boolean}): Array<string> {
-    var dataBlob = [];
-    for (var ii = 0; ii < 100; ii++) {
-      var pressedText = pressData[ii] ? ' (X)' : '';
-      dataBlob.push('Cell ' + ii + pressedText);
-    }
-    return dataBlob;
-  },
-
-  _pressRow: function(rowID: number) {
-    this._pressData[rowID] = !this._pressData[rowID];
-    this.setState({dataSource: this.state.dataSource.cloneWithRows(
-      this._genRows(this._pressData)
-    )});
-  },
-});
-
-/* eslint no-bitwise: 0 */
-var hashCode = function(str) {
-  var hash = 15;
-  for (var ii = str.length - 1; ii >= 0; ii--) {
-    hash = ((hash << 5) - hash) + str.charCodeAt(ii);
-  }
-  return hash;
-};
-
-var styles = StyleSheet.create({
-  list: {
-    justifyContent: 'space-around',
-    flexDirection: 'row',
-    flexWrap: 'wrap'
-  },
-  row: {
-    justifyContent: 'center',
-    padding: 5,
-    margin: 3,
-    width: 100,
-    height: 100,
-    backgroundColor: '#F6F6F6',
-    alignItems: 'center',
-    borderWidth: 1,
-    borderRadius: 5,
-    borderColor: '#CCC'
-  },
-  thumb: {
-    width: 64,
-    height: 64
-  },
-  text: {
-    flex: 1,
-    marginTop: 5,
-    fontWeight: 'bold'
-  },
-});
-
-module.exports = ListViewGridLayoutExample;

Examples/UIExplorer/ListViewPagingExample.js

@@ -48,19 +48,19 @@ var Thumb = React.createClass({
   },
   render: function() {
     return (
-      <TouchableOpacity
-        onPress={this._onPressThumb}
-        style={[styles.buttonContents, {flexDirection: this.state.dir}]}>
-        <Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
-        <Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
-        <Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
-        {this.state.dir === 'column' ?
-          <Text>
-            Oooo, look at this new text!  So awesome it may just be crazy.
-            Let me keep typing here so it wraps at least one line.
-          </Text> :
-          <Text />
-        }
+      <TouchableOpacity onPress={this._onPressThumb}>
+        <View style={[styles.buttonContents, {flexDirection: this.state.dir}]}>
+          <Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
+          <Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
+          <Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
+          {this.state.dir === 'column' ?
+            <Text>
+              Oooo, look at this new text!  So awesome it may just be crazy.
+              Let me keep typing here so it wraps at least one line.
+            </Text> :
+            <Text />
+          }
+        </View>
       </TouchableOpacity>
     );
   }
@@ -127,12 +127,14 @@ var ListViewPagingExample = React.createClass({
       <View><Text style={styles.text}>1 Like</Text></View> :
       null;
     return (
-      <TouchableOpacity onPress={this._onPressHeader} style={styles.header}>
-        {headerLikeText}
-        <View>
-          <Text style={styles.text}>
-            Table Header (click me)
-          </Text>
+      <TouchableOpacity onPress={this._onPressHeader}>
+        <View style={styles.header}>
+          {headerLikeText}
+          <View>
+            <Text style={styles.text}>
+              Table Header (click me)
+            </Text>
+          </View>
         </View>
       </TouchableOpacity>
     );

Examples/UIExplorer/ModalExample.js

@@ -1,172 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Modal,
-  StyleSheet,
-  SwitchIOS,
-  Text,
-  TouchableHighlight,
-  View,
-} = React;
-
-exports.displayName = (undefined: ?string);
-exports.framework = 'React';
-exports.title = '<Modal>';
-exports.description = 'Component for presenting modal views.';
-
-var Button = React.createClass({
-  getInitialState() {
-    return {
-      active: false,
-    };
-  },
-
-  _onHighlight() {
-    this.setState({active: true});
-  },
-
-  _onUnhighlight() {
-    this.setState({active: false});
-  },
-
-  render() {
-    var colorStyle = {
-      color: this.state.active ? '#fff' : '#000',
-    };
-    return (
-      <TouchableHighlight
-        onHideUnderlay={this._onUnhighlight}
-        onPress={this.props.onPress}
-        onShowUnderlay={this._onHighlight}
-        style={[styles.button, this.props.style]}
-        underlayColor="#a9d9d4">
-          <Text style={[styles.buttonText, colorStyle]}>{this.props.children}</Text>
-      </TouchableHighlight>
-    );
-  }
-});
-
-var ModalExample = React.createClass({
-  getInitialState() {
-    return {
-      animated: true,
-      modalVisible: false,
-      transparent: false,
-    };
-  },
-
-  _setModalVisible(visible) {
-    this.setState({modalVisible: visible});
-  },
-
-  _toggleAnimated() {
-    this.setState({animated: !this.state.animated});
-  },
-
-  _toggleTransparent() {
-    this.setState({transparent: !this.state.transparent});
-  },
-
-  render() {
-    var modalBackgroundStyle = {
-      backgroundColor: this.state.transparent ? 'rgba(0, 0, 0, 0.5)' : '#f5fcff',
-    };
-    var innerContainerTransparentStyle = this.state.transparent
-      ? {backgroundColor: '#fff', padding: 20}
-      : null;
-
-    return (
-      <View>
-        <Modal
-          animated={this.state.animated}
-          transparent={this.state.transparent}
-          visible={this.state.modalVisible}>
-          <View style={[styles.container, modalBackgroundStyle]}>
-            <View style={[styles.innerContainer, innerContainerTransparentStyle]}>
-              <Text>This modal was presented {this.state.animated ? 'with' : 'without'} animation.</Text>
-              <Button
-                onPress={this._setModalVisible.bind(this, false)}
-                style={styles.modalButton}>
-                Close
-              </Button>
-            </View>
-          </View>
-        </Modal>
-
-        <View style={styles.row}>
-          <Text style={styles.rowTitle}>Animated</Text>
-          <SwitchIOS value={this.state.animated} onValueChange={this._toggleAnimated} />
-        </View>
-
-        <View style={styles.row}>
-          <Text style={styles.rowTitle}>Transparent</Text>
-          <SwitchIOS value={this.state.transparent} onValueChange={this._toggleTransparent} />
-        </View>
-
-        <Button onPress={this._setModalVisible.bind(this, true)}>
-          Present
-        </Button>
-      </View>
-    );
-  },
-});
-
-exports.examples = [
-  {
-    title: 'Modal Presentation',
-    description: 'Modals can be presented with or without animation',
-    render: () => <ModalExample />,
-  },
-];
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'center',
-    padding: 20,
-  },
-  innerContainer: {
-    borderRadius: 10,
-  },
-  row: {
-    alignItems: 'center',
-    flex: 1,
-    flexDirection: 'row',
-    marginBottom: 20,
-  },
-  rowTitle: {
-    flex: 1,
-    fontWeight: 'bold',
-  },
-  button: {
-    borderRadius: 5,
-    flex: 1,
-    height: 44,
-    justifyContent: 'center',
-    overflow: 'hidden',
-  },
-  buttonText: {
-    fontSize: 18,
-    margin: 5,
-    textAlign: 'center',
-  },
-  modalButton: {
-    marginTop: 10,
-  },
-});

Examples/UIExplorer/Navigator/BreadcrumbNavSample.js

@@ -55,24 +55,26 @@ var BreadcrumbNavSample = React.createClass({
         return (
           <TouchableOpacity
             onPress={() => navigator.push(_getRandomRoute())}>
-            <Text style={styles.titleText}>{route.title}</Text>
+            <View>
+              <Text style={styles.titleText}>{route.title}</Text>
+            </View>
           </TouchableOpacity>
         );
       },
       iconForRoute: function(route, navigator) {
         return (
-          <TouchableOpacity
-            onPress={() => { navigator.popToRoute(route); }}
-            style={styles.crumbIconPlaceholder}
-          />
+          <TouchableOpacity onPress={() => {
+            navigator.popToRoute(route);
+          }}>
+            <View style={styles.crumbIconPlaceholder} />
+          </TouchableOpacity>
         );
       },
       separatorForRoute: function(route, navigator) {
         return (
-          <TouchableOpacity
-            onPress={navigator.pop}
-            style={styles.crumbSeparatorPlaceholder}
-          />
+          <TouchableOpacity onPress={navigator.pop}>
+            <View style={styles.crumbSeparatorPlaceholder} />
+          </TouchableOpacity>
         );
       }
     };

Examples/UIExplorer/Navigator/NavigationBarSample.js

@@ -51,11 +51,12 @@ var NavigationBarRouteMapper = {
     var previousRoute = navState.routeStack[index - 1];
     return (
       <TouchableOpacity
-        onPress={() => navigator.pop()}
-        style={styles.navBarLeftButton}>
-        <Text style={[styles.navBarText, styles.navBarButtonText]}>
-          {previousRoute.title}
-        </Text>
+        onPress={() => navigator.pop()}>
+        <View style={styles.navBarLeftButton}>
+          <Text style={[styles.navBarText, styles.navBarButtonText]}>
+            {previousRoute.title}
+          </Text>
+        </View>
       </TouchableOpacity>
     );
   },
@@ -63,11 +64,12 @@ var NavigationBarRouteMapper = {
   RightButton: function(route, navigator, index, navState) {
     return (
       <TouchableOpacity
-        onPress={() => navigator.push(newRandomRoute())}
-        style={styles.navBarRightButton}>
-        <Text style={[styles.navBarText, styles.navBarButtonText]}>
-          Next
-        </Text>
+        onPress={() => navigator.push(newRandomRoute())}>
+        <View style={styles.navBarRightButton}>
+          <Text style={[styles.navBarText, styles.navBarButtonText]}>
+            Next
+          </Text>
+        </View>
       </TouchableOpacity>
     );
   },

Examples/UIExplorer/ProgressBarAndroidExample.android.js

@@ -1,62 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var ProgressBar = require('ProgressBarAndroid');
-var React = require('React');
-var UIExplorerBlock = require('UIExplorerBlock');
-var UIExplorerPage = require('UIExplorerPage');
-
-var ProgressBarAndroidExample = React.createClass({
-
-  statics: {
-    title: '<ProgressBarAndroid>',
-    description: 'Visual indicator of progress of some operation. ' +
-        'Shows either a cyclic animation or a horizontal bar.',
-  },
-
-  render: function() {
-    return (
-      <UIExplorerPage title="ProgressBar Examples">
-        <UIExplorerBlock title="Default ProgressBar">
-          <ProgressBar />
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Small ProgressBar">
-          <ProgressBar styleAttr="Small" />
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Large ProgressBar">
-          <ProgressBar styleAttr="Large" />
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Inverse ProgressBar">
-          <ProgressBar styleAttr="Inverse" />
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Small Inverse ProgressBar">
-          <ProgressBar styleAttr="SmallInverse" />
-        </UIExplorerBlock>
-
-        <UIExplorerBlock title="Large Inverse ProgressBar">
-          <ProgressBar styleAttr="LargeInverse" />
-        </UIExplorerBlock>
-      </UIExplorerPage>
-    );
-  },
-});
-
-module.exports = ProgressBarAndroidExample;

Examples/UIExplorer/ScrollViewSimpleExample.js

@@ -1,83 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  ScrollView,
-  StyleSheet,
-  Text,
-  TouchableOpacity
-} = React;
-
-var NUM_ITEMS = 20;
-
-var ScrollViewSimpleExample = React.createClass({
-  statics: {
-    title: '<ScrollView>',
-    description: 'Component that enables scrolling through child components.'
-  },
-
-  makeItems: function(nItems: number, styles): Array<any> {
-    var items = [];
-    for (var i = 0; i < nItems; i++) {
-       items[i] = (
-         <TouchableOpacity key={i} style={styles}>
-           <Text>{'Item ' + i}</Text>
-         </TouchableOpacity>
-       );
-    }
-    return items;
-  },
-
-  render: function() {
-    // One of the items is a horizontal scroll view
-    var items = this.makeItems(NUM_ITEMS, styles.itemWrapper);
-    items[4] = (
-      <ScrollView key={'scrollView'} horizontal={true}>
-        {this.makeItems(NUM_ITEMS, [styles.itemWrapper, styles.horizontalItemWrapper])}
-      </ScrollView>
-    );
-
-    var verticalScrollView = (
-      <ScrollView style={styles.verticalScrollView}>
-        {items}
-      </ScrollView>
-    );
-
-    return verticalScrollView;
-  }
-});
-
-var styles = StyleSheet.create({
-  verticalScrollView: {
-    margin: 10,
-  },
-  itemWrapper: {
-    backgroundColor: '#dddddd',
-    alignItems: 'center',
-    borderRadius: 5,
-    borderWidth: 5,
-    borderColor: '#a52a2a',
-    padding: 30,
-    margin: 5,
-  },
-  horizontalItemWrapper: {
-    padding: 50
-  }
-});
-
-module.exports = ScrollViewSimpleExample;

Examples/UIExplorer/StatusBarIOSExample.js

@@ -83,26 +83,6 @@ exports.examples = [{
       </View>
     );
   },
-}, {
-  title: 'Status Bar Network Activity Indicator',
-  render() {
-    return (
-      <View>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => StatusBarIOS.setNetworkActivityIndicatorVisible(true)}>
-          <View style={styles.button}>
-            <Text>setNetworkActivityIndicatorVisible(true)</Text>
-          </View>
-        </TouchableHighlight>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => StatusBarIOS.setNetworkActivityIndicatorVisible(false)}>
-          <View style={styles.button}>
-            <Text>setNetworkActivityIndicatorVisible(false)</Text>
-          </View>
-        </TouchableHighlight>
-      </View>
-    );
-  },
 }];
 
 var styles = StyleSheet.create({

Examples/UIExplorer/SwitchAndroidExample.android.js

@@ -1,80 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-'use strict';
-
-var React = require('React');
-
-var SwitchAndroid = require('SwitchAndroid');
-var Text = require('Text');
-var UIExplorerBlock = require('UIExplorerBlock');
-var UIExplorerPage = require('UIExplorerPage');
-
-var SwitchAndroidExample = React.createClass({
-  statics: {
-    title: '<SwitchAndroid>',
-    description: 'Standard Android two-state toggle component'
-  },
-
-  getInitialState : function() {
-    return {
-      trueSwitchIsOn: true,
-      falseSwitchIsOn: false,
-      colorTrueSwitchIsOn: true,
-      colorFalseSwitchIsOn: false,
-      eventSwitchIsOn: false,
-    };
-  },
-
-  render: function() {
-    return (
-      <UIExplorerPage title="<SwitchAndroid>">
-        <UIExplorerBlock title="Switches can be set to true or false">
-          <SwitchAndroid
-            onValueChange={(value) => this.setState({falseSwitchIsOn: value})}
-            style={{marginBottom: 10}}
-            value={this.state.falseSwitchIsOn} />
-          <SwitchAndroid
-            onValueChange={(value) => this.setState({trueSwitchIsOn: value})}
-            value={this.state.trueSwitchIsOn} />
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Switches can be disabled">
-          <SwitchAndroid
-            disabled={true}
-            style={{marginBottom: 10}}
-            value={true} />
-          <SwitchAndroid
-            disabled={true}
-            value={false} />
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Change events can be detected">
-          <SwitchAndroid
-            onValueChange={(value) => this.setState({eventSwitchIsOn: value})}
-            style={{marginBottom: 10}}
-            value={this.state.eventSwitchIsOn} />
-          <SwitchAndroid
-            onValueChange={(value) => this.setState({eventSwitchIsOn: value})}
-            style={{marginBottom: 10}}
-            value={this.state.eventSwitchIsOn} />
-          <Text>{this.state.eventSwitchIsOn ? "On" : "Off"}</Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Switches are controlled components">
-          <SwitchAndroid />
-          <SwitchAndroid value={true} />
-        </UIExplorerBlock>
-      </UIExplorerPage>
-    );
-  }
-});
-
-module.exports = SwitchAndroidExample;

Examples/UIExplorer/TabBarIOSExample.js

@@ -23,8 +23,6 @@ var {
   View,
 } = React;
 
-var base64Icon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAQAAACSR7JhAAADtUlEQVR4Ac3YA2Bj6QLH0XPT1Fzbtm29tW3btm3bfLZtv7e2ObZnms7d8Uw098tuetPzrxv8wiISrtVudrG2JXQZ4VOv+qUfmqCGGl1mqLhoA52oZlb0mrjsnhKpgeUNEs91Z0pd1kvihA3ULGVHiQO2narKSHKkEMulm9VgUyE60s1aWoMQUbpZOWE+kaqs4eLEjdIlZTcFZB0ndc1+lhB1lZrIuk5P2aib1NBpZaL+JaOGIt0ls47SKzLC7CqrlGF6RZ09HGoNy1lYl2aRSWL5GuzqWU1KafRdoRp0iOQEiDzgZPnG6DbldcomadViflnl/cL93tOoVbsOLVM2jylvdWjXolWX1hmfZbGR/wjypDjFLSZIRov09BgYmtUqPQPlQrPapecLgTIy0jMgPKtTeob2zWtrGH3xvjUkPCtNg/tm1rjwrMa+mdUkPd3hWbH0jArPGiU9ufCsNNWFZ40wpwn+62/66R2RUtoso1OB34tnLOcy7YB1fUdc9e0q3yru8PGM773vXsuZ5YIZX+5xmHwHGVvlrGPN6ZSiP1smOsMMde40wKv2VmwPPVXNut4sVpUreZiLBHi0qln/VQeI/LTMYXpsJtFiclUN+5HVZazim+Ky+7sAvxWnvjXrJFneVtLWLyPJu9K3cXLWeOlbMTlrIelbMDlrLenrjEQOtIF+fuI9xRp9ZBFp6+b6WT8RrxEpdK64BuvHgDk+vUy+b5hYk6zfyfs051gRoNO1usU12WWRWL73/MMEy9pMi9qIrR4ZpV16Rrvduxazmy1FSvuFXRkqTnE7m2kdb5U8xGjLw/spRr1uTov4uOgQE+0N/DvFrG/Jt7i/FzwxbA9kDanhf2w+t4V97G8lrT7wc08aA2QNUkuTfW/KimT01wdlfK4yEw030VfT0RtZbzjeMprNq8m8tnSTASrTLti64oBNdpmMQm0eEwvfPwRbUBywG5TzjPCsdwk3IeAXjQblLCoXnDVeoAz6SfJNk5TTzytCNZk/POtTSV40NwOFWzw86wNJRpubpXsn60NJFlHeqlYRbslqZm2jnEZ3qcSKgm0kTli3zZVS7y/iivZTweYXJ26Y+RTbV1zh3hYkgyFGSTKPfRVbRqWWVReaxYeSLarYv1Qqsmh1s95S7G+eEWK0f3jYKTbV6bOwepjfhtafsvUsqrQvrGC8YhmnO9cSCk3yuY984F1vesdHYhWJ5FvASlacshUsajFt2mUM9pqzvKGcyNJW0arTKN1GGGzQlH0tXwLDgQTurS8eIQAAAABJRU5ErkJggg==';
-
 var TabBarExample = React.createClass({
   statics: {
     title: '<TabBarIOS>',
@@ -41,11 +39,11 @@ var TabBarExample = React.createClass({
     };
   },
 
-  _renderContent: function(color: string, pageText: string, num?: number) {
+  _renderContent: function(color: string, pageText: string) {
     return (
       <View style={[styles.tabContent, {backgroundColor: color}]}>
         <Text style={styles.tabText}>{pageText}</Text>
-        <Text style={styles.tabText}>{num} re-renders of the {pageText}</Text>
+        <Text style={styles.tabText}>{this.state.presses} re-renders of the More tab</Text>
       </View>
     );
   },
@@ -53,11 +51,10 @@ var TabBarExample = React.createClass({
   render: function() {
     return (
       <TabBarIOS
-        tintColor="white"
-        barTintColor="darkslateblue">
+        tintColor="black"
+        barTintColor="#3abeff">
         <TabBarIOS.Item
           title="Blue Tab"
-          icon={{uri: base64Icon, scale: 3}}
           selected={this.state.selectedTab === 'blueTab'}
           onPress={() => {
             this.setState({
@@ -76,7 +73,7 @@ var TabBarExample = React.createClass({
               notifCount: this.state.notifCount + 1,
             });
           }}>
-          {this._renderContent('#783E33', 'Red Tab', this.state.notifCount)}
+          {this._renderContent('#783E33', 'Red Tab')}
         </TabBarIOS.Item>
         <TabBarIOS.Item
           systemIcon="more"
@@ -87,7 +84,7 @@ var TabBarExample = React.createClass({
               presses: this.state.presses + 1
             });
           }}>
-          {this._renderContent('#21551C', 'Green Tab', this.state.presses)}
+          {this._renderContent('#21551C', 'Green Tab')}
         </TabBarIOS.Item>
       </TabBarIOS>
     );

Examples/UIExplorer/TextExample.android.js

@@ -1,349 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  StyleSheet,
-  Text,
-  View,
-} = React;
-var UIExplorerBlock = require('./UIExplorerBlock');
-var UIExplorerPage = require('./UIExplorerPage');
-
-var Entity = React.createClass({
-  render: function() {
-    return (
-      <Text style={{fontWeight: 'bold', color: '#527fe4'}}>
-        {this.props.children}
-      </Text>
-    );
-  }
-});
-
-var AttributeToggler = React.createClass({
-  getInitialState: function() {
-    return {fontWeight: 'bold', fontSize: 15};
-  },
-  toggleWeight: function() {
-    this.setState({
-      fontWeight: this.state.fontWeight === 'bold' ? 'normal' : 'bold'
-    });
-  },
-  increaseSize: function() {
-    this.setState({
-      fontSize: this.state.fontSize + 1
-    });
-  },
-  render: function() {
-    var curStyle = {fontWeight: this.state.fontWeight, fontSize: this.state.fontSize};
-    return (
-      <View>
-        <Text style={curStyle}>
-          Tap the controls below to change attributes.
-        </Text>
-        <Text>
-          <Text>See how it will even work on <Text style={curStyle}>this nested text</Text></Text>
-        </Text>
-        <Text>
-          <Text onPress={this.toggleWeight}>Toggle Weight</Text>
-          {' (with highlight onPress)'}
-        </Text>
-        <Text onPress={this.increaseSize} suppressHighlighting={true}>
-          Increase Size (suppressHighlighting true)
-        </Text>
-      </View>
-    );
-  }
-});
-
-var TextExample = React.createClass({
-  statics: {
-    title: '<Text>',
-    description: 'Base component for rendering styled text.',
-  },
-  render: function() {
-    return (
-      <UIExplorerPage title="<Text>">
-        <UIExplorerBlock title="Wrap">
-          <Text>
-            The text should wrap if it goes on multiple lines.
-            See, this is going to the next line.
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Padding">
-          <Text style={{padding: 10}}>
-            This text is indented by 10px padding on all sides.
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Font Family">
-          <Text style={{fontFamily: 'sans-serif'}}>
-            Sans-Serif
-          </Text>
-          <Text style={{fontFamily: 'sans-serif', fontWeight: 'bold'}}>
-            Sans-Serif Bold
-          </Text>
-          <Text style={{fontFamily: 'serif'}}>
-            Serif
-          </Text>
-          <Text style={{fontFamily: 'serif', fontWeight: 'bold'}}>
-            Serif Bold
-          </Text>
-          <Text style={{fontFamily: 'monospace'}}>
-            Monospace
-          </Text>
-          <Text style={{fontFamily: 'monospace', fontWeight: 'bold'}}>
-            Monospace Bold (After 5.0)
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Android Material Design fonts">
-          <View style={{flexDirection: 'row', alignItems: 'flex-start'}}>
-            <View style={{flex: 1}}>
-              <Text style={{fontFamily: 'sans-serif'}}>
-                Roboto Regular
-              </Text>
-              <Text style={{fontFamily: 'sans-serif', fontStyle: 'italic'}}>
-                Roboto Italic
-              </Text>
-              <Text style={{fontFamily: 'sans-serif', fontWeight: 'bold'}}>
-                Roboto Bold
-              </Text>
-              <Text style={{fontFamily: 'sans-serif', fontStyle: 'italic', fontWeight: 'bold'}}>
-                Roboto Bold Italic
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-light'}}>
-                Roboto Light
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-light', fontStyle: 'italic'}}>
-                Roboto Light Italic
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-thin'}}>
-                Roboto Thin (After 4.2)
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-thin', fontStyle: 'italic'}}>
-                Roboto Thin Italic (After 4.2)
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-condensed'}}>
-                Roboto Condensed
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-condensed', fontStyle: 'italic'}}>
-                Roboto Condensed Italic
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-condensed', fontWeight: 'bold'}}>
-                Roboto Condensed Bold
-              </Text>
-              <Text style={{
-                  fontFamily: 'sans-serif-condensed',
-                  fontStyle: 'italic',
-                  fontWeight: 'bold'}}>
-                Roboto Condensed Bold Italic
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-medium'}}>
-                Roboto Medium (After 5.0)
-              </Text>
-              <Text style={{fontFamily: 'sans-serif-medium', fontStyle: 'italic'}}>
-                Roboto Medium Italic (After 5.0)
-              </Text>
-            </View>
-          </View>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Font Size">
-          <Text style={{fontSize: 23}}>
-            Size 23
-          </Text>
-          <Text style={{fontSize: 8}}>
-            Size 8
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Color">
-          <Text style={{color: 'red'}}>
-            Red color
-          </Text>
-          <Text style={{color: 'blue'}}>
-            Blue color
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Font Weight">
-          <Text style={{fontWeight: 'bold'}}>
-            Move fast and be bold
-          </Text>
-          <Text style={{fontWeight: 'normal'}}>
-            Move fast and be bold
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Font Style">
-          <Text style={{fontStyle: 'italic'}}>
-            Move fast and be bold
-          </Text>
-          <Text style={{fontStyle: 'normal'}}>
-            Move fast and be bold
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Font Style and Weight">
-          <Text style={{fontStyle: 'italic', fontWeight: 'bold'}}>
-            Move fast and be bold
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Nested">
-          <Text onPress={() => console.log('1st')}>
-            (Normal text,
-            <Text style={{fontWeight: 'bold'}} onPress={() => console.log('2nd')}>
-              (and bold
-              <Text style={{fontStyle: 'italic', fontSize: 11, color: '#527fe4'}} onPress={() => console.log('3rd')}>
-                (and tiny bold italic blue
-                <Text style={{fontWeight: 'normal', fontStyle: 'normal'}} onPress={() => console.log('4th')}>
-                  (and tiny normal blue)
-                </Text>
-                )
-              </Text>
-              )
-            </Text>
-            )
-          </Text>
-          <Text style={{fontFamily: 'serif'}} onPress={() => console.log('1st')}>
-            (Serif
-            <Text style={{fontStyle: 'italic', fontWeight: 'bold'}} onPress={() => console.log('2nd')}>
-              (Serif Bold Italic
-              <Text
-                style={{fontFamily: 'monospace', fontStyle: 'normal', fontWeight: 'normal'}}
-                onPress={() => console.log('3rd')}>
-                (Monospace Normal
-                <Text
-                  style={{fontFamily: 'sans-serif', fontWeight: 'bold'}}
-                  onPress={() => console.log('4th')}>
-                  (Sans-Serif Bold
-                  <Text style={{fontWeight: 'normal'}} onPress={() => console.log('5th')}>
-                    (and Sans-Serif Normal)
-                  </Text>
-                  )
-                </Text>
-                )
-              </Text>
-              )
-            </Text>
-            )
-          </Text>
-          <Text style={{fontSize: 12}}>
-            <Entity>Entity Name</Entity>
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Text Align">
-          <Text>
-            auto (default) - english LTR
-          </Text>
-          <Text>
-            أحب اللغة العربية auto (default) - arabic RTL
-          </Text>
-          <Text style={{textAlign: 'left'}}>
-            left left left left left left left left left left left left left left left
-          </Text>
-          <Text style={{textAlign: 'center'}}>
-            center center center center center center center center center center center
-          </Text>
-          <Text style={{textAlign: 'right'}}>
-            right right right right right right right right right right right right right
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Unicode">
-          <View style={{flex: 1}}>
-            <View style={{flexDirection: 'row'}}>
-              <Text style={{backgroundColor: 'red'}}>
-                星际争霸是世界上最好的游戏。
-              </Text>
-            </View>
-            <View style={{flex: 1}}>
-              <Text style={{backgroundColor: 'red'}}>
-                星际争霸是世界上最好的游戏。
-              </Text>
-            </View>
-            <View style={{flex: 1, alignItems: 'center'}}>
-              <Text style={{backgroundColor: 'red'}}>
-                星际争霸是世界上最好的游戏。
-              </Text>
-            </View>
-            <View style={{flex: 1}}>
-              <Text style={{backgroundColor: 'red'}}>
-                星际争霸是世界上最好的游戏。星际争霸是世界上最好的游戏。星际争霸是世界上最好的游戏。星际争霸是世界上最好的游戏。
-              </Text>
-            </View>
-          </View>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Spaces">
-          <Text>
-            A {'generated'} {' '} {'string'} and    some &nbsp;&nbsp;&nbsp; spaces
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Line Height">
-          <Text style={{lineHeight: 35}}>
-            Holisticly formulate inexpensive ideas before best-of-breed benefits. <Text style={{fontSize: 20}}>Continually</Text> expedite magnetic potentialities rather than client-focused interfaces.
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Empty Text">
-          <Text />
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Toggling Attributes">
-          <AttributeToggler />
-        </UIExplorerBlock>
-        <UIExplorerBlock title="backgroundColor attribute">
-          <Text style={{backgroundColor: '#ffaaaa'}}>
-            Red background,
-            <Text style={{backgroundColor: '#aaaaff'}}>
-              {' '}blue background,
-              <Text>
-                {' '}inherited blue background,
-                <Text style={{backgroundColor: '#aaffaa'}}>
-                  {' '}nested green background.
-                </Text>
-              </Text>
-            </Text>
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="containerBackgroundColor attribute">
-          <View style={{flexDirection: 'row', height: 85}}>
-            <View style={{backgroundColor: '#ffaaaa', width: 150}} />
-            <View style={{backgroundColor: '#aaaaff', width: 150}} />
-          </View>
-          <Text style={[styles.backgroundColorText, {top: -80}]}>
-            Default containerBackgroundColor (inherited) + backgroundColor wash
-          </Text>
-          <Text style={[styles.backgroundColorText, {top: -70, backgroundColor: 'transparent'}]}>
-            {"containerBackgroundColor: 'transparent' + backgroundColor wash"}
-          </Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="numberOfLines attribute">
-          <Text numberOfLines={1}>
-            Maximum of one line no matter now much I write here. If I keep writing it{"'"}ll just truncate after one line
-          </Text>
-          <Text numberOfLines={2} style={{marginTop: 20}}>
-            Maximum of two lines no matter now much I write here. If I keep writing it{"'"}ll just truncate after two lines
-          </Text>
-          <Text style={{marginTop: 20}}>
-            No maximum lines specified no matter now much I write here. If I keep writing it{"'"}ll just keep going and going
-          </Text>
-        </UIExplorerBlock>
-      </UIExplorerPage>
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  backgroundColorText: {
-    left: 5,
-    backgroundColor: 'rgba(100, 100, 100, 0.3)'
-  },
-});
-
-module.exports = TextExample;

Examples/UIExplorer/TextExample.ios.js

@@ -269,7 +269,7 @@ exports.examples = [
           right right right right right right right right right right right right right
         </Text>
         <Text style={{textAlign: 'justify'}}>
-          justify: this text component{"'"}s contents are laid out with "textAlign: justify"
+          justify: this text component's contents are laid out with "textAlign: justify"
           and as you can see all of the lines except the last one span the
           available width of the parent container.
         </Text>
@@ -369,34 +369,6 @@ exports.examples = [
       </View>
     );
   },
-}, {
-  title: 'Text highlighting (tap the link to see highlight)',
-  render: function() {
-    return (
-      <View>
-        <Text>Lorem ipsum dolor sit amet, <Text suppressHighlighting={false} style={{backgroundColor: 'white', textDecorationLine: 'underline', color: 'blue'}} onPress={() => null}>consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud</Text> exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</Text>
-      </View>
-    );
-  },
-}, {
-  title: 'allowFontScaling attribute',
-  render: function() {
-    return (
-      <View>
-        <Text>
-          By default, text will respect Text Size accessibility setting on iOS.
-          It means that all font sizes will be increased or descreased depending on the value of Text Size setting in
-          {" "}<Text style={{fontWeight: 'bold'}}>Settings.app - Display & Brightness - Text Size</Text>
-        </Text>
-        <Text style={{marginTop: 10}}>
-          You can disable scaling for your Text component by passing {"\""}allowFontScaling={"{"}false{"}\""} prop.
-        </Text>
-        <Text allowFontScaling={false} style={{marginTop: 20}}>
-          This text will not scale.
-        </Text>
-      </View>
-    );
-  },
 }];
 
 var styles = StyleSheet.create({

Examples/UIExplorer/TextInputExample.android.js

@@ -1,316 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Text,
-  TextInput,
-  View,
-  StyleSheet,
-} = React;
-
-var TextEventsExample = React.createClass({
-  getInitialState: function() {
-    return {
-      curText: '<No Event>',
-      prevText: '<No Event>',
-      prev2Text: '<No Event>',
-    };
-  },
-
-  updateText: function(text) {
-    this.setState((state) => {
-      return {
-        curText: text,
-        prevText: state.curText,
-        prev2Text: state.prevText,
-      };
-    });
-  },
-
-  render: function() {
-    return (
-      <View>
-        <TextInput
-          autoCapitalize="none"
-          placeholder="Enter text to see events"
-          autoCorrect={false}
-          onFocus={() => this.updateText('onFocus')}
-          onBlur={() => this.updateText('onBlur')}
-          onChange={(event) => this.updateText(
-            'onChange text: ' + event.nativeEvent.text
-          )}
-          onEndEditing={(event) => this.updateText(
-            'onEndEditing text: ' + event.nativeEvent.text
-          )}
-          onSubmitEditing={(event) => this.updateText(
-            'onSubmitEditing text: ' + event.nativeEvent.text
-          )}
-          style={styles.singleLine}
-        />
-        <Text style={styles.eventLabel}>
-          {this.state.curText}{'\n'}
-          (prev: {this.state.prevText}){'\n'}
-          (prev2: {this.state.prev2Text})
-        </Text>
-      </View>
-    );
-  }
-});
-
-class RewriteExample extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {text: ''};
-  }
-  render() {
-    return (
-      <TextInput
-        onChangeText={(text) => {
-          text = text.replace(/ /g, '_');
-          this.setState({text});
-        }}
-        style={styles.singleLine}
-        value={this.state.text}
-      />
-    );
-  }
-}
-
-var styles = StyleSheet.create({
-  multiline: {
-    height: 60,
-    fontSize: 16,
-    padding: 4,
-    marginBottom: 10,
-  },
-  eventLabel: {
-    margin: 3,
-    fontSize: 12,
-  },
-  singleLine: {
-    fontSize: 16,
-    padding: 4,
-  },
-  singleLineWithHeightTextInput: {
-    height: 30,
-  },
-});
-
-exports.title = '<TextInput>';
-exports.description = 'Single and multi-line text inputs.';
-exports.examples = [
-  {
-    title: 'Auto-focus',
-    render: function() {
-      return <TextInput autoFocus={true} style={styles.singleLine} />;
-    }
-  },
-  {
-    title: "Live Re-Write (<sp>  ->  '_')",
-    render: function() {
-      return <RewriteExample />;
-    }
-  },
-  {
-    title: 'Auto-capitalize',
-    render: function() {
-      var autoCapitalizeTypes = [
-        'none',
-        'sentences',
-        'words',
-        'characters',
-      ];
-      var examples = autoCapitalizeTypes.map((type) => {
-        return (
-          <TextInput
-            autoCapitalize={type}
-            placeholder={'autoCapitalize: ' + type}
-            style={styles.singleLine}
-          />
-        );
-      });
-      return <View>{examples}</View>;
-    }
-  },
-  {
-    title: 'Auto-correct',
-    render: function() {
-      return (
-        <View>
-          <TextInput
-            autoCorrect={true}
-            placeholder="This has autoCorrect"
-            style={styles.singleLine}
-          />
-          <TextInput
-            autoCorrect={false}
-            placeholder="This does not have autoCorrect"
-            style={styles.singleLine}
-          />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Keyboard types',
-    render: function() {
-      var keyboardTypes = [
-        'default',
-        'email-address',
-        'numeric',
-      ];
-      var examples = keyboardTypes.map((type) => {
-        return (
-          <TextInput
-            keyboardType={type}
-            placeholder={'keyboardType: ' + type}
-            style={styles.singleLine}
-          />
-        );
-      });
-      return <View>{examples}</View>;
-    }
-  },
-  {
-    title: 'Event handling',
-    render: function(): ReactElement { return <TextEventsExample />; },
-  },
-  {
-    title: 'Colors and text inputs',
-    render: function() {
-      return (
-        <View>
-          <TextInput
-            style={[styles.singleLine]}
-            defaultValue="Default color text"
-          />
-          <TextInput
-            style={[styles.singleLine, {color: 'green'}]}
-            defaultValue="Green Text"
-          />
-          <TextInput
-            placeholder="Default placeholder text color"
-            style={styles.singleLine}
-          />
-          <TextInput
-            placeholder="Red placeholder text color"
-            placeholderTextColor="red"
-            style={styles.singleLine}
-          />
-          <TextInput
-            placeholder="Default underline color"
-            style={styles.singleLine}
-          />
-          <TextInput
-            placeholder="Blue underline color"
-            style={styles.singleLine}
-            underlineColorAndroid="blue"
-          />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Text input, themes and heights',
-    render: function() {
-      return (
-        <TextInput
-          placeholder="If you set height, beware of padding set from themes"
-          style={[styles.singleLineWithHeightTextInput]}
-        />
-      );
-    }
-  },
-  {
-    title: 'Passwords',
-    render: function() {
-      return (
-        <TextInput
-          defaultValue="iloveturtles"
-          password={true}
-          style={styles.singleLine}
-        />
-      );
-    }
-  },
-  {
-    title: 'Editable',
-    render: function() {
-      return (
-        <TextInput
-           defaultValue="Can't touch this! (>'-')> ^(' - ')^ <('-'<) (>'-')> ^(' - ')^"
-           editable={false}
-           style={styles.singleLine}
-         />
-      );
-    }
-  },
-  {
-    title: 'Multiline',
-    render: function() {
-      return (
-        <View>
-          <TextInput
-            autoCorrect={true}
-            placeholder="multiline, aligned top-left"
-            placeholderTextColor="red"
-            multiline={true}
-            textAlign="start"
-            textAlignVertical="top"
-            style={styles.multiline}
-          />
-          <TextInput
-            autoCorrect={true}
-            placeholder="multiline, aligned center"
-            placeholderTextColor="green"
-            multiline={true}
-            textAlign="center"
-            textAlignVertical="center"
-            style={[styles.multiline]}
-          />
-          <TextInput
-            autoCorrect={true}
-            multiline={true}
-            textAlign="end"
-            textAlignVertical="bottom"
-            style={[styles.multiline, {color: 'blue'}]}>
-            <Text style={styles.multiline}>multiline with children, aligned bottom-right</Text>
-          </TextInput>
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Fixed number of lines',
-    platform: 'android',
-    render: function() {
-      return (
-        <View>
-          <TextInput numberOfLines={2}
-            multiline={true}
-            placeholder="Two line input"
-          />
-          <TextInput numberOfLines={5}
-            multiline={true}
-            placeholder="Five line input"
-          />
-        </View>
-      );
-    }
-  },
-];

Examples/UIExplorer/TextInputExample.js

@@ -33,7 +33,7 @@ var WithLabel = React.createClass({
         {this.props.children}
       </View>
     );
-  },
+  }
 });
 
 var TextEventsExample = React.createClass({
@@ -41,17 +41,13 @@ var TextEventsExample = React.createClass({
     return {
       curText: '<No Event>',
       prevText: '<No Event>',
-      prev2Text: '<No Event>',
     };
   },
 
   updateText: function(text) {
-    this.setState((state) => {
-      return {
-        curText: text,
-        prevText: state.curText,
-        prev2Text: state.prevText,
-      };
+    this.setState({
+      curText: text,
+      prevText: this.state.curText,
     });
   },
 
@@ -77,43 +73,13 @@ var TextEventsExample = React.createClass({
         />
         <Text style={styles.eventLabel}>
           {this.state.curText}{'\n'}
-          (prev: {this.state.prevText}){'\n'}
-          (prev2: {this.state.prev2Text})
+          (prev: {this.state.prevText})
         </Text>
       </View>
     );
   }
 });
 
-class RewriteExample extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {text: ''};
-  }
-  render() {
-    var limit = 20;
-    var remainder = limit - this.state.text.length;
-    var remainderColor = remainder > 5 ? 'blue' : 'red';
-    return (
-      <View style={styles.rewriteContainer}>
-        <TextInput
-          multiline={false}
-          maxLength={limit}
-          onChangeText={(text) => {
-            text = text.replace(/ /g, '_');
-            this.setState({text});
-          }}
-          style={styles.default}
-          value={this.state.text}
-        />
-        <Text style={[styles.remainder, {color: remainderColor}]}>
-          {remainder}
-        </Text>
-      </View>
-    );
-  }
-}
-
 var styles = StyleSheet.create({
   page: {
     paddingBottom: 300,
@@ -159,19 +125,12 @@ var styles = StyleSheet.create({
     flex: 1,
   },
   label: {
-    width: 115,
-    alignItems: 'flex-end',
+    width: 120,
+    justifyContent: 'flex-end',
+    flexDirection: 'row',
     marginRight: 10,
     paddingTop: 2,
   },
-  rewriteContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  remainder: {
-    textAlign: 'right',
-    width: 24,
-  },
 });
 
 exports.displayName = (undefined: ?string);
@@ -184,12 +143,6 @@ exports.examples = [
       return <TextInput autoFocus={true} style={styles.default} />;
     }
   },
-  {
-    title: "Live Re-Write (<sp>  ->  '_') + maxLength",
-    render: function() {
-      return <RewriteExample />;
-    }
-  },
   {
     title: 'Auto-capitalize',
     render: function() {
@@ -315,7 +268,7 @@ exports.examples = [
       return (
         <View>
           <WithLabel label="true">
-            <TextInput password={true} style={styles.default} defaultValue="abc" />
+            <TextInput password={true} style={styles.default} value="abc" />
           </WithLabel>
         </View>
       );
@@ -323,7 +276,7 @@ exports.examples = [
   },
   {
     title: 'Event handling',
-    render: function(): ReactElement { return <TextEventsExample />; },
+    render: function(): ReactElement { return <TextEventsExample /> },
   },
   {
     title: 'Colored input text',
@@ -332,11 +285,11 @@ exports.examples = [
         <View>
           <TextInput
             style={[styles.default, {color: 'blue'}]}
-            defaultValue="Blue"
+            value="Blue"
           />
           <TextInput
             style={[styles.default, {color: 'green'}]}
-            defaultValue="Green"
+            value="Green"
           />
         </View>
       );
@@ -383,7 +336,7 @@ exports.examples = [
           <WithLabel label="clearTextOnFocus">
             <TextInput
               placeholder="text is cleared on focus"
-              defaultValue="text is cleared on focus"
+              value="text is cleared on focus"
               style={styles.default}
               clearTextOnFocus={true}
             />
@@ -391,7 +344,7 @@ exports.examples = [
           <WithLabel label="selectTextOnFocus">
             <TextInput
               placeholder="text is selected on focus"
-              defaultValue="text is selected on focus"
+              value="text is selected on focus"
               style={styles.default}
               selectTextOnFocus={true}
             />
@@ -411,7 +364,7 @@ exports.examples = [
             style={styles.multiline}
           />
           <TextInput
-            placeholder="multiline text input with font styles and placeholder"
+            placeholder="mutliline text input with font styles and placeholder"
             multiline={true}
             clearTextOnFocus={true}
             autoCorrect={true}
@@ -421,7 +374,7 @@ exports.examples = [
             style={[styles.multiline, styles.multilineWithFontStyles]}
           />
           <TextInput
-            placeholder="uneditable multiline text input"
+            placeholder="uneditable mutliline text input"
             editable={false}
             multiline={true}
             style={styles.multiline}

Examples/UIExplorer/ToastAndroidExample.android.js

@@ -1,68 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  StyleSheet,
-  Text,
-  ToastAndroid,
-  TouchableWithoutFeedback
-} = React;
-
-var UIExplorerBlock = require('UIExplorerBlock');
-var UIExplorerPage = require('UIExplorerPage');
-
-var ToastExample = React.createClass({
-
-  statics: {
-    title: 'Toast Example',
-    description: 'Toast Example',
-  },
-
-  getInitialState: function() {
-    return {};
-  },
-
-  render: function() {
-    return (
-      <UIExplorerPage title="ToastAndroid">
-        <UIExplorerBlock title="Simple toast">
-          <TouchableWithoutFeedback
-            onPress={() =>
-              ToastAndroid.show('This is a toast with short duration', ToastAndroid.SHORT)}>
-            <Text style={styles.text}>Click me.</Text>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Toast with long duration">
-          <TouchableWithoutFeedback
-            onPress={() =>
-              ToastAndroid.show('This is a toast with long duration', ToastAndroid.LONG)}>
-            <Text style={styles.text}>Click me too.</Text>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-      </UIExplorerPage>
-    );
-  },
-});
-
-var styles = StyleSheet.create({
-  text: {
-    color: 'black',
-  },
-});
-
-module.exports = ToastExample;

Examples/UIExplorer/ToolbarAndroidExample.android.js

@@ -1,119 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  StyleSheet,
-  Text,
-  View,
-} = React;
-var UIExplorerBlock = require('./UIExplorerBlock');
-var UIExplorerPage = require('./UIExplorerPage');
-
-var SwitchAndroid = require('SwitchAndroid');
-var ToolbarAndroid = require('ToolbarAndroid');
-
-var ToolbarAndroidExample = React.createClass({
-  statics: {
-    title: '<ToolbarAndroid>',
-    description: 'Examples of using the Android toolbar.'
-  },
-  getInitialState: function() {
-    return {
-      actionText: 'Example app with toolbar component',
-      toolbarSwitch: false,
-      colorProps: {
-        titleColor: '#3b5998',
-        subtitleColor: '#6a7180',
-      },
-    };
-  },
-  render: function() {
-    return (
-      <UIExplorerPage title="<ToolbarAndroid>">
-        <UIExplorerBlock title="Toolbar with title/subtitle and actions">
-          <ToolbarAndroid
-            actions={toolbarActions}
-            navIcon={require('image!ic_menu_black_24dp')}
-            onActionSelected={this._onActionSelected}
-            onIconClicked={() => this.setState({actionText: 'Icon clicked'})}
-            style={styles.toolbar}
-            subtitle={this.state.actionText}
-            title="Toolbar" />
-          <Text>{this.state.actionText}</Text>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Toolbar with logo & custom title view (a View with Switch+Text)">
-          <ToolbarAndroid
-            logo={require('image!launcher_icon')}
-            style={styles.toolbar}>
-            <View style={{height: 56, flexDirection: 'row', alignItems: 'center'}}>
-              <SwitchAndroid
-                value={this.state.toolbarSwitch}
-                onValueChange={(value) => this.setState({'toolbarSwitch': value})} />
-              <Text>{'\'Tis but a switch'}</Text>
-            </View>
-          </ToolbarAndroid>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Toolbar with no icon">
-          <ToolbarAndroid
-            actions={toolbarActions}
-            style={styles.toolbar}
-            subtitle="There be no icon here" />
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Toolbar with navIcon & logo, no title">
-          <ToolbarAndroid
-            actions={toolbarActions}
-            logo={require('image!launcher_icon')}
-            navIcon={require('image!ic_menu_black_24dp')}
-            style={styles.toolbar} />
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Toolbar with custom title colors">
-          <ToolbarAndroid
-            navIcon={require('image!ic_menu_black_24dp')}
-            onIconClicked={() => this.setState({colorProps: {}})}
-            title="Wow, such toolbar"
-            style={styles.toolbar}
-            subtitle="Much native"
-            {...this.state.colorProps} />
-          <Text>
-            Touch the icon to reset the custom colors to the default (theme-provided) ones.
-          </Text>
-        </UIExplorerBlock>
-      </UIExplorerPage>
-    );
-  },
-  _onActionSelected: function(position) {
-    this.setState({
-      actionText: 'Selected ' + toolbarActions[position].title,
-    });
-  },
-});
-
-var toolbarActions = [
-  {title: 'Create', icon: require('image!ic_create_black_48dp'), show: 'always'},
-  {title: 'Filter'},
-  {title: 'Settings', icon: require('image!ic_settings_black_48dp'), show: 'always'},
-];
-
-var styles = StyleSheet.create({
-  toolbar: {
-    backgroundColor: '#e9eaed',
-    height: 56,
-  },
-});
-
-module.exports = ToolbarAndroidExample;

Examples/UIExplorer/TouchableExample.js

@@ -27,7 +27,6 @@ var {
 } = React;
 
 exports.displayName = (undefined: ?string);
-exports.description = 'Touchable and onPress examples';
 exports.title = '<Touchable*> and onPress';
 exports.examples = [
 {

Examples/UIExplorer/TransformExample.js

@@ -1,85 +1,61 @@
 /**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
+ * Copyright 2004-present Facebook. All Rights Reserved.
  *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ * @providesModule TransformExample
  */
 'use strict';
 
-var React = require('react-native');
+var React = require('React');
 var {
-  Animated,
   StyleSheet,
-  Text,
   View,
 } = React;
 
-var Flip = React.createClass({
+var TimerMixin = require('react-timer-mixin');
+var UIExplorerBlock = require('./UIExplorerBlock');
+var UIExplorerPage = require('./UIExplorerPage');
+
+var TransformExample = React.createClass({
+
+  mixins: [TimerMixin],
+
   getInitialState() {
     return {
-      theta: new Animated.Value(45),
+      interval: this.setInterval(this._update, 800),
+      pulse: false,
     };
   },
 
-  componentDidMount() {
-    this._animate();
-  },
-
-  _animate() {
-    this.state.theta.setValue(0);
-    Animated.timing(this.state.theta, {
-      toValue: 360,
-      duration: 5000,
-    }).start(this._animate);
-  },
-
   render() {
     return (
-      <View style={styles.flipCardContainer}>
-        <Animated.View style={[
-          styles.flipCard,
-          {transform: [
-            {perspective: 850},
-            {rotateX: this.state.theta.interpolate({
-              inputRange: [0, 180],
-              outputRange: ['0deg', '180deg']
-            })},
-          ]}]}>
-          <Text style={styles.flipText}>
-            This text is flipping great.
-          </Text>
-        </Animated.View>
-        <Animated.View style={[styles.flipCard, {
-          position: 'absolute',
-          top: 0,
-          backgroundColor: 'red',
-          transform: [
-            {perspective: 850},
-            {rotateX: this.state.theta.interpolate({
-              inputRange: [0, 180],
-              outputRange: ['180deg', '360deg']
-            })},
-          ]}]}>
-          <Text style={styles.flipText}>
-            On the flip side...
-          </Text>
-        </Animated.View>
-      </View>
+      <UIExplorerPage title="Transforms">
+        <UIExplorerBlock title="foo bar">
+          <View style={{height: 500}}>
+            <View style={styles.box1} />
+            <View style={styles.box2} />
+            <View style={styles.box3step1} />
+            <View style={styles.box3step2} />
+            <View style={styles.box3step3} />
+            <View style={styles.box4} />
+            <View style={[
+              styles.box5,
+              this.state.pulse ? styles.box5Transform : null
+            ]} />
+          </View>
+        </UIExplorerBlock>
+      </UIExplorerPage>
     );
-  }
+  },
+
+  _update() {
+    this.setState({
+      pulse: !this.state.pulse,
+    });
+  },
+
 });
 
 var styles = StyleSheet.create({
-  container: {
-    height: 500,
-  },
   box1: {
     left: 0,
     backgroundColor: 'green',
@@ -112,7 +88,7 @@ var styles = StyleSheet.create({
   },
   box3step1: {
     left: 0,
-    backgroundColor: 'lightpink',
+    backgroundColor: '#ffb6c1', // lightpink
     height: 50,
     position: 'absolute',
     top: 0,
@@ -123,7 +99,7 @@ var styles = StyleSheet.create({
   },
   box3step2: {
     left: 0,
-    backgroundColor: 'hotpink',
+    backgroundColor: '#ff69b4', //hotpink
     height: 50,
     opacity: 0.5,
     position: 'absolute',
@@ -137,7 +113,7 @@ var styles = StyleSheet.create({
   },
   box3step3: {
     left: 0,
-    backgroundColor: 'deeppink',
+    backgroundColor: '#ff1493', // deeppink
     height: 50,
     opacity: 0.5,
     position: 'absolute',
@@ -153,7 +129,7 @@ var styles = StyleSheet.create({
   },
   box4: {
     left: 0,
-    backgroundColor: 'darkorange',
+    backgroundColor: '#ff8c00', // darkorange
     height: 50,
     position: 'absolute',
     top: 0,
@@ -165,7 +141,7 @@ var styles = StyleSheet.create({
     width: 100,
   },
   box5: {
-    backgroundColor: 'maroon',
+    backgroundColor: '#800000', // maroon
     height: 50,
     position: 'absolute',
     right: 0,
@@ -179,110 +155,7 @@ var styles = StyleSheet.create({
       {scale: 2},
     ],
   },
-  flipCardContainer: {
-    marginVertical: 40,
-    flex: 1,
-    alignSelf: 'center',
-  },
-  flipCard: {
-    width: 200,
-    height: 200,
-    alignItems: 'center',
-    justifyContent: 'center',
-    backgroundColor: 'blue',
-    backfaceVisibility: 'hidden',
-  },
-  flipText: {
-    width: 90,
-    fontSize: 20,
-    color: 'white',
-    fontWeight: 'bold',
-  }
 });
 
-exports.title = 'Transforms';
-exports.description = 'View transforms';
-exports.examples = [
-  {
-    title: 'Perspective',
-    description: 'perspective: 850, rotateX: Animated.timing(0 -> 360)',
-    render(): ReactElement { return <Flip />; }
-  },
-  {
-    title: 'Translate, Rotate, Scale',
-    description: "translateX: 100, translateY: 50, rotate: '30deg', scaleX: 2, scaleY: 2",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={styles.box1} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Scale, Translate, Rotate, ',
-    description: "scaleX: 2, scaleY: 2, translateX: 100, translateY: 50, rotate: '30deg'",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={styles.box2} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Rotate',
-    description: "rotate: '30deg'",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={styles.box3step1} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Rotate, Scale',
-    description: "rotate: '30deg', scaleX: 2, scaleY: 2",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={styles.box3step2} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Rotate, Scale, Translate ',
-    description: "rotate: '30deg', scaleX: 2, scaleY: 2, translateX: 100, translateY: 50",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={styles.box3step3} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Translate, Scale, Rotate',
-    description: "translate: [200, 350], scale: 2.5, rotate: '-0.2rad'",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={styles.box4} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Translate, Rotate, Scale',
-    description: "translate: [-50, 35], rotate: '50deg', scale: 2",
-    render() {
-      return (
-        <View style={styles.container}>
-          <View style={[styles.box5, styles.box5Transform]} />
-        </View>
-      );
-    }
-  }
-];
+
+module.exports = TransformExample;

Examples/UIExplorer/UIExplorer.xcodeproj/project.pbxproj

@@ -7,25 +7,19 @@
 	objects = {
 
 /* Begin PBXBuildFile section */
-		1300627F1B59179B0043FE5A /* RCTGzipTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1300627E1B59179B0043FE5A /* RCTGzipTests.m */; };
 		13417FE91AA91432003F314A /* libRCTImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 13417FE81AA91428003F314A /* libRCTImage.a */; };
 		134180011AA9153C003F314A /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 13417FEF1AA914B8003F314A /* libRCTText.a */; };
 		1341802C1AA9178B003F314A /* libRCTNetwork.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 1341802B1AA91779003F314A /* libRCTNetwork.a */; };
 		134454601AAFCABD003F0779 /* libRCTAdSupport.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 1344545A1AAFCAAE003F0779 /* libRCTAdSupport.a */; };
 		134A8A2A1AACED7A00945AAE /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 134A8A251AACED6A00945AAE /* libRCTGeolocation.a */; };
-		138D6A171B53CD440074A87E /* RCTCacheTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 138D6A151B53CD440074A87E /* RCTCacheTests.m */; };
-		138D6A181B53CD440074A87E /* RCTShadowViewTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 138D6A161B53CD440074A87E /* RCTShadowViewTests.m */; };
-		1393D0381B68CD1300E1B601 /* RCTModuleMethodTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1393D0371B68CD1300E1B601 /* RCTModuleMethodTests.m */; };
 		139FDEDB1B0651FB00C62182 /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139FDED91B0651EA00C62182 /* libRCTWebSocket.a */; };
 		13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };
 		13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; };
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
-		13DB03481B5D2ED500C27245 /* RCTJSONTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 13DB03471B5D2ED500C27245 /* RCTJSONTests.m */; };
-		13DF61B61B67A45000EDB188 /* RCTMethodArgumentTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 13DF61B51B67A45000EDB188 /* RCTMethodArgumentTests.m */; };
 		141FC1211B222EBB004D5FFB /* IntegrationTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 141FC1201B222EBB004D5FFB /* IntegrationTests.m */; };
 		143BC5A11B21E45C00462512 /* UIExplorerSnapshotTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 143BC5A01B21E45C00462512 /* UIExplorerSnapshotTests.m */; };
-		144D21241B2204C5006DB32B /* RCTImageUtilTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 144D21231B2204C5006DB32B /* RCTImageUtilTests.m */; };
+		144D21241B2204C5006DB32B /* RCTClippingTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 144D21231B2204C5006DB32B /* RCTClippingTests.m */; };
 		147CED4C1AB3532B00DA3E4C /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 147CED4B1AB34F8C00DA3E4C /* libRCTActionSheet.a */; };
 		1497CFAC1B21F5E400C1F8F2 /* RCTAllocationTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1497CFA41B21F5E400C1F8F2 /* RCTAllocationTests.m */; };
 		1497CFAD1B21F5E400C1F8F2 /* RCTBridgeTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1497CFA51B21F5E400C1F8F2 /* RCTBridgeTests.m */; };
@@ -53,8 +47,6 @@
 		14DC67F41AB71881001358AB /* libRCTPushNotification.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 14DC67F11AB71876001358AB /* libRCTPushNotification.a */; };
 		3578590A1B28D2CF00341EDB /* libRCTLinking.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 357859011B28D2C500341EDB /* libRCTLinking.a */; };
 		834C36EC1AF8DED70019C93C /* libRCTSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 834C36D21AF8DA610019C93C /* libRCTSettings.a */; };
-		83636F8F1B53F22C009F943E /* RCTUIManagerScenarioTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 83636F8E1B53F22C009F943E /* RCTUIManagerScenarioTests.m */; };
-		83A936C81B7E0F08005B9C36 /* RCTConvert_UIColorTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 83A936C71B7E0F08005B9C36 /* RCTConvert_UIColorTests.m */; };
 		D85B829E1AB6D5D7003F4FE2 /* libRCTVibration.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D85B829C1AB6D5CE003F4FE2 /* libRCTVibration.a */; };
 /* End PBXBuildFile section */
 
@@ -161,15 +153,11 @@
 
 /* Begin PBXFileReference section */
 		004D289E1AAF61C70097A701 /* UIExplorerUnitTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = UIExplorerUnitTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
-		1300627E1B59179B0043FE5A /* RCTGzipTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTGzipTests.m; sourceTree = "<group>"; };
 		13417FE31AA91428003F314A /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../../Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
 		13417FEA1AA914B8003F314A /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
 		134180261AA91779003F314A /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../../Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
 		134454551AAFCAAE003F0779 /* RCTAdSupport.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAdSupport.xcodeproj; path = ../../Libraries/AdSupport/RCTAdSupport.xcodeproj; sourceTree = "<group>"; };
 		134A8A201AACED6A00945AAE /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../../Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
-		138D6A151B53CD440074A87E /* RCTCacheTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTCacheTests.m; sourceTree = "<group>"; };
-		138D6A161B53CD440074A87E /* RCTShadowViewTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTShadowViewTests.m; sourceTree = "<group>"; };
-		1393D0371B68CD1300E1B601 /* RCTModuleMethodTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTModuleMethodTests.m; sourceTree = "<group>"; };
 		139FDECA1B0651EA00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
 		13B07F961A680F5B00A75B9A /* UIExplorer.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = UIExplorer.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = UIExplorer/AppDelegate.h; sourceTree = "<group>"; };
@@ -179,8 +167,6 @@
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = UIExplorer/Info.plist; sourceTree = "<group>"; };
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = UIExplorer/main.m; sourceTree = "<group>"; };
 		13CC9D481AEED2B90020D1C2 /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../../Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
-		13DB03471B5D2ED500C27245 /* RCTJSONTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTJSONTests.m; sourceTree = "<group>"; };
-		13DF61B51B67A45000EDB188 /* RCTMethodArgumentTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTMethodArgumentTests.m; sourceTree = "<group>"; };
 		141FC1201B222EBB004D5FFB /* IntegrationTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = IntegrationTests.m; sourceTree = "<group>"; };
 		143BC57E1B21E18100462512 /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		143BC5811B21E18100462512 /* testLayoutExampleSnapshot_1@2x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "testLayoutExampleSnapshot_1@2x.png"; sourceTree = "<group>"; };
@@ -192,7 +178,7 @@
 		143BC5951B21E3E100462512 /* UIExplorerIntegrationTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = UIExplorerIntegrationTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		143BC5981B21E3E100462512 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		143BC5A01B21E45C00462512 /* UIExplorerSnapshotTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = UIExplorerSnapshotTests.m; sourceTree = "<group>"; };
-		144D21231B2204C5006DB32B /* RCTImageUtilTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTImageUtilTests.m; sourceTree = "<group>"; };
+		144D21231B2204C5006DB32B /* RCTClippingTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTClippingTests.m; sourceTree = "<group>"; };
 		1497CFA41B21F5E400C1F8F2 /* RCTAllocationTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTAllocationTests.m; sourceTree = "<group>"; };
 		1497CFA51B21F5E400C1F8F2 /* RCTBridgeTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTBridgeTests.m; sourceTree = "<group>"; };
 		1497CFA61B21F5E400C1F8F2 /* RCTContextExecutorTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTContextExecutorTests.m; sourceTree = "<group>"; };
@@ -216,8 +202,6 @@
 		14E0EEC81AB118F7000DECC3 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../../Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
 		357858F81B28D2C400341EDB /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../../Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
 		58005BE41ABA80530062E044 /* RCTTest.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTTest.xcodeproj; path = ../../Libraries/RCTTest/RCTTest.xcodeproj; sourceTree = "<group>"; };
-		83636F8E1B53F22C009F943E /* RCTUIManagerScenarioTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTUIManagerScenarioTests.m; sourceTree = "<group>"; };
-		83A936C71B7E0F08005B9C36 /* RCTConvert_UIColorTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTConvert_UIColorTests.m; sourceTree = "<group>"; };
 		D85B82911AB6D5CE003F4FE2 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../../Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
@@ -358,18 +342,11 @@
 			children = (
 				1497CFA41B21F5E400C1F8F2 /* RCTAllocationTests.m */,
 				1497CFA51B21F5E400C1F8F2 /* RCTBridgeTests.m */,
-				138D6A151B53CD440074A87E /* RCTCacheTests.m */,
+				144D21231B2204C5006DB32B /* RCTClippingTests.m */,
 				1497CFA61B21F5E400C1F8F2 /* RCTContextExecutorTests.m */,
 				1497CFA71B21F5E400C1F8F2 /* RCTConvert_NSURLTests.m */,
-				83A936C71B7E0F08005B9C36 /* RCTConvert_UIColorTests.m */,
 				1497CFA81B21F5E400C1F8F2 /* RCTConvert_UIFontTests.m */,
 				1497CFA91B21F5E400C1F8F2 /* RCTEventDispatcherTests.m */,
-				1300627E1B59179B0043FE5A /* RCTGzipTests.m */,
-				144D21231B2204C5006DB32B /* RCTImageUtilTests.m */,
-				13DB03471B5D2ED500C27245 /* RCTJSONTests.m */,
-				13DF61B51B67A45000EDB188 /* RCTMethodArgumentTests.m */,
-				1393D0371B68CD1300E1B601 /* RCTModuleMethodTests.m */,
-				138D6A161B53CD440074A87E /* RCTShadowViewTests.m */,
 				1497CFAA1B21F5E400C1F8F2 /* RCTSparseArrayTests.m */,
 				1497CFAB1B21F5E400C1F8F2 /* RCTUIManagerTests.m */,
 				143BC57E1B21E18100462512 /* Info.plist */,
@@ -406,7 +383,6 @@
 			children = (
 				141FC1201B222EBB004D5FFB /* IntegrationTests.m */,
 				143BC5A01B21E45C00462512 /* UIExplorerSnapshotTests.m */,
-				83636F8E1B53F22C009F943E /* RCTUIManagerScenarioTests.m */,
 				143BC5971B21E3E100462512 /* Supporting Files */,
 			);
 			path = UIExplorerIntegrationTests;
@@ -796,21 +772,14 @@
 			buildActionMask = 2147483647;
 			files = (
 				1497CFB01B21F5E400C1F8F2 /* RCTConvert_UIFontTests.m in Sources */,
-				144D21241B2204C5006DB32B /* RCTImageUtilTests.m in Sources */,
-				1393D0381B68CD1300E1B601 /* RCTModuleMethodTests.m in Sources */,
+				144D21241B2204C5006DB32B /* RCTClippingTests.m in Sources */,
 				1497CFB21B21F5E400C1F8F2 /* RCTSparseArrayTests.m in Sources */,
-				1300627F1B59179B0043FE5A /* RCTGzipTests.m in Sources */,
 				1497CFAF1B21F5E400C1F8F2 /* RCTConvert_NSURLTests.m in Sources */,
 				1497CFAE1B21F5E400C1F8F2 /* RCTContextExecutorTests.m in Sources */,
 				1497CFAD1B21F5E400C1F8F2 /* RCTBridgeTests.m in Sources */,
 				1497CFB11B21F5E400C1F8F2 /* RCTEventDispatcherTests.m in Sources */,
 				1497CFB31B21F5E400C1F8F2 /* RCTUIManagerTests.m in Sources */,
-				138D6A171B53CD440074A87E /* RCTCacheTests.m in Sources */,
-				13DB03481B5D2ED500C27245 /* RCTJSONTests.m in Sources */,
 				1497CFAC1B21F5E400C1F8F2 /* RCTAllocationTests.m in Sources */,
-				83A936C81B7E0F08005B9C36 /* RCTConvert_UIColorTests.m in Sources */,
-				13DF61B61B67A45000EDB188 /* RCTMethodArgumentTests.m in Sources */,
-				138D6A181B53CD440074A87E /* RCTShadowViewTests.m in Sources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -828,7 +797,6 @@
 			buildActionMask = 2147483647;
 			files = (
 				141FC1211B222EBB004D5FFB /* IntegrationTests.m in Sources */,
-				83636F8F1B53F22C009F943E /* RCTUIManagerScenarioTests.m in Sources */,
 				143BC5A11B21E45C00462512 /* UIExplorerSnapshotTests.m in Sources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
@@ -1046,11 +1014,9 @@
 				GCC_SYMBOLS_PRIVATE_EXTERN = NO;
 				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
 				GCC_WARN_ABOUT_MISSING_NEWLINE = YES;
-				GCC_WARN_ABOUT_MISSING_PROTOTYPES = YES;
 				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
 				GCC_WARN_INITIALIZER_NOT_FULLY_BRACKETED = YES;
 				GCC_WARN_MULTIPLE_DEFINITION_TYPES_FOR_SELECTOR = YES;
-				GCC_WARN_SHADOW = YES;
 				GCC_WARN_STRICT_SELECTOR_MATCH = YES;
 				GCC_WARN_UNDECLARED_SELECTOR = YES;
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
@@ -1062,7 +1028,6 @@
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
 					"$(SRCROOT)/../../React/**",
-					"$(SRCROOT)/../../Libraries/**",
 				);
 				IPHONEOS_DEPLOYMENT_TARGET = 7.0;
 				MTL_ENABLE_DEBUG_INFO = YES;
@@ -1103,11 +1068,9 @@
 				GCC_C_LANGUAGE_STANDARD = gnu99;
 				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
 				GCC_WARN_ABOUT_MISSING_NEWLINE = YES;
-				GCC_WARN_ABOUT_MISSING_PROTOTYPES = YES;
 				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
 				GCC_WARN_INITIALIZER_NOT_FULLY_BRACKETED = YES;
 				GCC_WARN_MULTIPLE_DEFINITION_TYPES_FOR_SELECTOR = YES;
-				GCC_WARN_SHADOW = YES;
 				GCC_WARN_STRICT_SELECTOR_MATCH = YES;
 				GCC_WARN_UNDECLARED_SELECTOR = YES;
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
@@ -1119,7 +1082,6 @@
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
 					"$(SRCROOT)/../../React/**",
-					"$(SRCROOT)/../../Libraries/**",
 				);
 				IPHONEOS_DEPLOYMENT_TARGET = 7.0;
 				MTL_ENABLE_DEBUG_INFO = NO;

Examples/UIExplorer/UIExplorer/AppDelegate.m

@@ -14,77 +14,56 @@
 
 #import "AppDelegate.h"
 
-#import "RCTBridge.h"
-#import "RCTJavaScriptLoader.h"
 #import "RCTRootView.h"
 
-@interface AppDelegate() <RCTBridgeDelegate>
-
-@end
-
 @implementation AppDelegate
 
 - (BOOL)application:(__unused UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
 {
-  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self
-                                            launchOptions:launchOptions];
+  NSURL *jsCodeLocation;
 
-  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
-                                                   moduleName:@"UIExplorerApp"
-                                            initialProperties:nil];
+  /**
+   * Loading JavaScript code - uncomment the one you want.
+   *
+   * OPTION 1
+   * Load from development server. Start the server from the repository root:
+   *
+   * $ npm start
+   *
+   * To run on device, change `localhost` to the IP address of your computer
+   * (you can get this by typing `ifconfig` into the terminal and selecting the
+   * `inet` value under `en0:`) and make sure your computer and iOS device are
+   * on the same Wi-Fi network.
+   */
+
+  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true"];
+
+  /**
+   * OPTION 2
+   * Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
+   * to your Xcode project folder and run
+   *
+   * $ curl 'http://localhost:8081/Examples/UIExplorer/UIExplorerApp.includeRequire.runModule.bundle' -o main.jsbundle
+   *
+   * then add the `main.jsbundle` file to your project and uncomment this line:
+   */
+
+//  jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+
+#if RUNNING_ON_CI
+   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+#endif
+
+  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
+                                                      moduleName:@"UIExplorerApp"
+                                                   launchOptions:launchOptions];
 
   self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
-  UIViewController *rootViewController = [UIViewController new];
+  UIViewController *rootViewController = [[UIViewController alloc] init];
   rootViewController.view = rootView;
   self.window.rootViewController = rootViewController;
   [self.window makeKeyAndVisible];
   return YES;
 }
 
-- (NSURL *)sourceURLForBridge:(__unused RCTBridge *)bridge
-{
-    NSURL *sourceURL;
-
-    /**
-     * Loading JavaScript code - uncomment the one you want.
-     *
-     * OPTION 1
-     * Load from development server. Start the server from the repository root:
-     *
-     * $ npm start
-     *
-     * To run on device, change `localhost` to the IP address of your computer
-     * (you can get this by typing `ifconfig` into the terminal and selecting the
-     * `inet` value under `en0:`) and make sure your computer and iOS device are
-     * on the same Wi-Fi network.
-     */
-
-    sourceURL = [NSURL URLWithString:@"http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true"];
-
-    /**
-     * OPTION 2
-     * Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
-     * to your Xcode project folder and run
-     *
-     * $ curl 'http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle' -o main.jsbundle
-     *
-     * then add the `main.jsbundle` file to your project and uncomment this line:
-     */
-
-  //  sourceURL = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
-
-  #if RUNNING_ON_CI
-     sourceURL = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
-  #endif
-
-  return sourceURL;
-}
-
-- (void)loadSourceForBridge:(RCTBridge *)bridge
-                  withBlock:(RCTSourceLoadBlock)loadCallback
-{
-  [RCTJavaScriptLoader loadBundleAtURL:[self sourceURLForBridge:bridge]
-                            onComplete:loadCallback];
-}
-
 @end

Examples/UIExplorer/UIExplorerApp.android.js

@@ -18,42 +18,34 @@
 
 var React = require('react-native');
 var {
-  AppRegistry,
-  BackAndroid,
   Dimensions,
-  DrawerLayoutAndroid,
   StyleSheet,
-  ToolbarAndroid,
   View,
 } = React;
-var UIExplorerList = require('./UIExplorerList.android');
+var UIExplorerList = require('./UIExplorerList');
+
+// TODO: these should be exposed by the 'react-native' module.
+var DrawerLayoutAndroid = require('DrawerLayoutAndroid');
+var ToolbarAndroid = require('ToolbarAndroid');
 
 var DRAWER_WIDTH_LEFT = 56;
 
 var UIExplorerApp = React.createClass({
+
   getInitialState: function() {
     return {
-      example: this._getUIExplorerHome(),
+      example: {
+        title: 'UIExplorer',
+        component: this._renderHome(),
+      },
     };
   },
 
-  _getUIExplorerHome: function() {
-    return {
-      title: 'UIExplorer',
-      component: this._renderHome(),
-    };
-  },
-
-  componentWillMount: function() {
-    BackAndroid.addEventListener('hardwareBackPress', this._handleBackButtonPress);
-  },
-
   render: function() {
     return (
       <DrawerLayoutAndroid
         drawerPosition={DrawerLayoutAndroid.positions.Left}
         drawerWidth={Dimensions.get('window').width - DRAWER_WIDTH_LEFT}
-        keyboardDismissMode="on-drag"
         ref={(drawer) => { this.drawer = drawer; }}
         renderNavigationView={this._renderNavigationView}>
         {this._renderNavigation()}
@@ -72,11 +64,14 @@ var UIExplorerApp = React.createClass({
 
   onSelectExample: function(example) {
     this.drawer.closeDrawer();
-    if (example.title === this._getUIExplorerHome().title) {
-      example = this._getUIExplorerHome();
+    if (example.title === 'UIExplorer') {
+      example.component = this._renderHome();
     }
     this.setState({
-      example: example,
+      example: {
+        title: example.title,
+        component: example.component,
+      },
     });
   },
 
@@ -110,16 +105,16 @@ var UIExplorerApp = React.createClass({
     );
   },
 
-  _handleBackButtonPress: function() {
-    if (this.state.example.title !== this._getUIExplorerHome().title) {
-      this.onSelectExample(this._getUIExplorerHome());
-      return true;
-    }
-    return false;
-  },
 });
 
 var styles = StyleSheet.create({
+  messageText: {
+    fontSize: 17,
+    fontWeight: '500',
+    padding: 15,
+    marginTop: 50,
+    marginLeft: 15,
+  },
   container: {
     flex: 1,
   },
@@ -129,6 +124,4 @@ var styles = StyleSheet.create({
   },
 });
 
-AppRegistry.registerComponent('UIExplorerApp', () => UIExplorerApp);
-
 module.exports = UIExplorerApp;

Examples/UIExplorer/UIExplorerApp.ios.js

@@ -17,7 +17,7 @@
 'use strict';
 
 var React = require('react-native');
-var UIExplorerList = require('./UIExplorerList.ios');
+var UIExplorerList = require('./UIExplorerList');
 var {
   AppRegistry,
   NavigatorIOS,

Examples/UIExplorer/UIExplorerIntegrationTests/IntegrationTests.m

@@ -26,11 +26,11 @@
 - (void)setUp
 {
 #if __LP64__
-  RCTAssert(NO, @"Tests should be run on 32-bit device simulators (e.g. iPhone 5)");
+  RCTAssert(false, @"Tests should be run on 32-bit device simulators (e.g. iPhone 5)");
 #endif
 
-  NSOperatingSystemVersion version = [NSProcessInfo processInfo].operatingSystemVersion;
-  RCTAssert(version.majorVersion == 8 || version.minorVersion >= 3, @"Tests should be run on iOS 8.3+, found %zd.%zd.%zd", version.majorVersion, version.minorVersion, version.patchVersion);
+  NSOperatingSystemVersion version = [[NSProcessInfo processInfo] operatingSystemVersion];
+  RCTAssert(version.majorVersion == 8 || version.minorVersion == 3, @"Tests should be run on iOS 8.3, found %zd.%zd.%zd", version.majorVersion, version.minorVersion, version.patchVersion);
   _runner = RCTInitRunnerForApp(@"Examples/UIExplorer/UIExplorerIntegrationTests/js/IntegrationTestsApp", nil);
 }
 

Examples/UIExplorer/UIExplorerIntegrationTests/RCTUIManagerScenarioTests.m

@@ -45,12 +45,12 @@
 {
   [super setUp];
 
-  _uiManager = [RCTUIManager new];
+  _uiManager = [[RCTUIManager alloc] init];
 
   // Register 20 views to use in the tests
   for (NSInteger i = 1; i <= 20; i++) {
-    UIView *registeredView = [UIView new];
-    registeredView.reactTag = @(i);
+    UIView *registeredView = [[UIView alloc] init];
+    [registeredView setReactTag:@(i)];
     _uiManager.viewRegistry[i] = registeredView;
   }
 }
@@ -92,7 +92,7 @@
 
   NSArray *removeAtIndices = @[@0, @4, @8, @12, @16];
   for (NSNumber *index in removeAtIndices) {
-    NSNumber *reactTag = @(index.integerValue + 2);
+    NSNumber *reactTag = @([index integerValue] + 2);
     [removedViews addObject:_uiManager.viewRegistry[reactTag]];
   }
   for (NSInteger i = 2; i < 20; i++) {

Examples/UIExplorer/UIExplorerIntegrationTests/UIExplorerSnapshotTests.m

@@ -32,12 +32,11 @@
 
 - (void)setUp
 {
-#if __LP64__
-  RCTAssert(NO, @"Tests should be run on 32-bit device simulators (e.g. iPhone 5)");
+#ifdef __LP64__
+  RCTAssert(!__LP64__, @"Snapshot tests should be run on 32-bit device simulators (e.g. iPhone 5)");
 #endif
-
-  NSOperatingSystemVersion version = [NSProcessInfo processInfo].operatingSystemVersion;
-  RCTAssert(version.majorVersion == 8 || version.minorVersion >= 3, @"Snapshot tests should be run on iOS 8.3+, found %zd.%zd.%zd", version.majorVersion, version.minorVersion, version.patchVersion);
+  NSString *version = [[UIDevice currentDevice] systemVersion];
+  RCTAssert([version isEqualToString:@"8.3"], @"Snapshot tests should be run on iOS 8.3, found %@", version);
   _runner = RCTInitRunnerForApp(@"Examples/UIExplorer/UIExplorerApp.ios", nil);
   _runner.recordMode = NO;
 }

Examples/UIExplorer/UIExplorerIntegrationTests/js/IntegrationTestsApp.js

@@ -10,8 +10,6 @@
  */
 'use strict';
 
-require('regenerator/runtime');
-
 var React = require('react-native');
 
 var {
@@ -61,12 +59,12 @@ var IntegrationTestsApp = React.createClass({
         <View style={styles.separator} />
         <ScrollView>
           {TESTS.map((test) => [
-            <TouchableOpacity
-              onPress={() => this.setState({test})}
-              style={styles.row}>
-              <Text style={styles.testName}>
-                {test.displayName}
-              </Text>
+            <TouchableOpacity onPress={() => this.setState({test})}>
+              <View style={styles.row}>
+                <Text style={styles.testName}>
+                  {test.displayName}
+                </Text>
+              </View>
             </TouchableOpacity>,
             <View style={styles.separator} />
           ])}

Examples/UIExplorer/UIExplorerIntegrationTests/js/LayoutEventsTest.js

@@ -51,7 +51,8 @@ var LayoutEventsTest = React.createClass({
       () => {
         debug('layout animation done.');
         this.checkLayout(this.addWrapText);
-      }
+      },
+      (error) => { throw new Error(JSON.stringify(error)); }
     );
     this.setState({viewStyle: {margin: 60}});
   },

Examples/UIExplorer/UIExplorerIntegrationTests/js/PromiseTest.js

@@ -17,18 +17,13 @@ var PromiseTest = React.createClass({
 
   shouldResolve: false,
   shouldReject: false,
-  shouldSucceedAsync: false,
-  shouldThrowAsync: false,
 
   componentDidMount() {
     Promise.all([
       this.testShouldResolve(),
       this.testShouldReject(),
-      this.testShouldSucceedAsync(),
-      this.testShouldThrowAsync(),
     ]).then(() => RCTTestModule.markTestPassed(
-      this.shouldResolve && this.shouldReject &&
-      this.shouldSucceedAsync && this.shouldThrowAsync
+      this.shouldResolve && this.shouldReject
     ));
   },
 
@@ -46,24 +41,6 @@ var PromiseTest = React.createClass({
       .catch(() => this.shouldReject = true);
   },
 
-  async testShouldSucceedAsync() {
-    try {
-      await RCTTestModule.shouldResolve();
-      this.shouldSucceedAsync = true;
-    } catch (e) {
-      this.shouldSucceedAsync = false;
-    }
-  },
-
-  async testShouldThrowAsync() {
-    try {
-      await RCTTestModule.shouldReject();
-      this.shouldThrowAsync = false;
-    } catch (e) {
-      this.shouldThrowAsync = true;
-    }
-  },
-
   render() {
     return <React.View />;
   }

Examples/UIExplorer/UIExplorerList.android.js

@@ -1,99 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  StyleSheet,
-  View,
-} = React;
-var UIExplorerListBase = require('./UIExplorerListBase');
-
-var COMPONENTS = [
-  require('./ImageExample'),
-  require('./ProgressBarAndroidExample'),
-  require('./ScrollViewSimpleExample'),
-  require('./SwitchAndroidExample'),
-  require('./TextExample.android'),
-  require('./TextInputExample.android'),
-  require('./ToolbarAndroidExample'),
-  require('./TouchableExample'),
-  require('./ViewExample'),
-];
-
-var APIS = [
-  require('./AccessibilityAndroidExample.android'),
-  require('./BorderExample'),
-  require('./LayoutEventsExample'),
-  require('./LayoutExample'),
-  require('./PanResponderExample'),
-  require('./PointerEventsExample'),
-  require('./TimerExample'),
-  require('./ToastAndroidExample.android'),
-  require('./XHRExample'),
-];
-
-type Props = {
-  onSelectExample: Function,
-  isInDrawer: bool,
-};
-
-class UIExplorerList extends React.Component {
-  props: Props;
-
-  render() {
-    return (
-      <UIExplorerListBase
-        components={COMPONENTS}
-        apis={APIS}
-        searchText=""
-        renderAdditionalView={this.renderAdditionalView.bind(this)}
-        onPressRow={this.onPressRow.bind(this)}
-      />
-    );
-  }
-
-  renderAdditionalView(renderRow, renderTextInput): React.Component {
-    if (this.props.isInDrawer) {
-      var homePage = renderRow({
-        title: 'UIExplorer',
-        description: 'List of examples',
-      }, -1);
-      return (
-        <View>
-          {homePage}
-        </View>
-      );
-    }
-    return renderTextInput(styles.searchTextInput);
-  }
-
-  onPressRow(example: any) {
-    var Component = UIExplorerListBase.makeRenderable(example);
-    this.props.onSelectExample({
-      title: Component.title,
-      component: Component,
-    });
-  }
-}
-
-var styles = StyleSheet.create({
-  searchTextInput: {
-    padding: 2,
-  },
-});
-
-module.exports = UIExplorerList;

Examples/UIExplorer/UIExplorerList.ios.js

@@ -1,158 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  AppRegistry,
-  Settings,
-  StyleSheet,
-} = React;
-
-var { TestModule } = React.addons;
-
-import type { NavigationContext } from 'NavigationContext';
-
-var UIExplorerListBase = require('./UIExplorerListBase');
-
-var COMPONENTS = [
-  require('./ActivityIndicatorIOSExample'),
-  require('./DatePickerIOSExample'),
-  require('./ImageExample'),
-  require('./LayoutEventsExample'),
-  require('./ListViewExample'),
-  require('./ListViewGridLayoutExample'),
-  require('./ListViewPagingExample'),
-  require('./MapViewExample'),
-  require('./ModalExample'),
-  require('./Navigator/NavigatorExample'),
-  require('./NavigatorIOSColorsExample'),
-  require('./NavigatorIOSExample'),
-  require('./PickerIOSExample'),
-  require('./ProgressViewIOSExample'),
-  require('./ScrollViewExample'),
-  require('./SegmentedControlIOSExample'),
-  require('./SliderIOSExample'),
-  require('./SwitchIOSExample'),
-  require('./TabBarIOSExample'),
-  require('./TextExample.ios'),
-  require('./TextInputExample.ios'),
-  require('./TouchableExample'),
-  require('./ViewExample'),
-  require('./WebViewExample'),
-];
-
-var APIS = [
-  require('./AccessibilityIOSExample'),
-  require('./ActionSheetIOSExample'),
-  require('./AdSupportIOSExample'),
-  require('./AlertIOSExample'),
-  require('./AnimationExample/AnExApp'),
-  require('./AppStateIOSExample'),
-  require('./AsyncStorageExample'),
-  require('./BorderExample'),
-  require('./CameraRollExample.ios'),
-  require('./GeolocationExample'),
-  require('./LayoutExample'),
-  require('./NetInfoExample'),
-  require('./PanResponderExample'),
-  require('./PointerEventsExample'),
-  require('./PushNotificationIOSExample'),
-  require('./StatusBarIOSExample'),
-  require('./TimerExample'),
-  require('./VibrationIOSExample'),
-  require('./XHRExample.ios'),
-  require('./ImageEditingExample'),
-];
-
-// Register suitable examples for snapshot tests
-COMPONENTS.concat(APIS).forEach((Example) => {
-  if (Example.displayName) {
-    var Snapshotter = React.createClass({
-      componentDidMount: function() {
-        // View is still blank after first RAF :\
-        global.requestAnimationFrame(() =>
-          global.requestAnimationFrame(() => TestModule.verifySnapshot(
-            TestModule.markTestPassed
-          )
-        ));
-      },
-      render: function() {
-        var Renderable = UIExplorerListBase.makeRenderable(Example);
-        return <Renderable />;
-      },
-    });
-    AppRegistry.registerComponent(Example.displayName, () => Snapshotter);
-  }
-});
-
-type Props = {
-  navigator: {
-    navigationContext: NavigationContext,
-    push: (route: {title: string, component: ReactClass<any,any,any>}) => void,
-  },
-  onExternalExampleRequested: Function,
-};
-
-class UIExplorerList extends React.Component {
-  props: Props;
-
-  render() {
-    return (
-      <UIExplorerListBase
-        components={COMPONENTS}
-        apis={APIS}
-        searchText={Settings.get('searchText')}
-        renderAdditionalView={this.renderAdditionalView.bind(this)}
-        search={this.search.bind(this)}
-        onPressRow={this.onPressRow.bind(this)}
-      />
-    );
-  }
-
-  renderAdditionalView(renderRow: Function, renderTextInput: Function): React.Component {
-    return renderTextInput(styles.searchTextInput);
-  }
-
-  search(text: mixed) {
-    Settings.set({searchText: text});
-  }
-
-  _openExample(example: any) {
-    if (example.external) {
-      this.props.onExternalExampleRequested(example);
-      return;
-    }
-
-    var Component = UIExplorerListBase.makeRenderable(example);
-    this.props.navigator.push({
-      title: Component.title,
-      component: Component,
-    });
-  }
-
-  onPressRow(example: any) {
-    this._openExample(example);
-  }
-}
-
-var styles = StyleSheet.create({
-  searchTextInput: {
-    height: 30,
-  },
-});
-
-module.exports = UIExplorerList;

Examples/UIExplorer/UIExplorerList.js

@@ -0,0 +1,351 @@
+/**
+ * The examples provided by Facebook are for non-commercial testing and
+ * evaluation purposes only.
+ *
+ * Facebook reserves all rights not expressly granted.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
+ * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
+ * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
+ * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ *
+ * @flow
+ */
+'use strict';
+
+var React = require('react-native');
+var {
+  AppRegistry,
+  ListView,
+  PixelRatio,
+  Platform,
+  Settings,
+  StyleSheet,
+  Text,
+  TextInput,
+  TouchableHighlight,
+  View,
+} = React;
+
+var { TestModule } = React.addons;
+
+import type { ExampleModule } from 'ExampleTypes';
+import type { NavigationContext } from 'NavigationContext';
+
+var createExamplePage = require('./createExamplePage');
+
+var COMMON_COMPONENTS = [
+  require('./ImageExample'),
+  require('./LayoutEventsExample'),
+  require('./ListViewExample'),
+  require('./ListViewPagingExample'),
+  require('./MapViewExample'),
+  require('./Navigator/NavigatorExample'),
+  require('./ScrollViewExample'),
+  require('./TextInputExample'),
+  require('./TouchableExample'),
+  require('./ViewExample'),
+  require('./WebViewExample'),
+];
+
+var COMMON_APIS = [
+  require('./AnimationExample/AnExApp'),
+  require('./GeolocationExample'),
+  require('./LayoutExample'),
+  require('./PanResponderExample'),
+  require('./PointerEventsExample'),
+];
+
+if (Platform.OS === 'ios') {
+  var COMPONENTS = COMMON_COMPONENTS.concat([
+    require('./ActivityIndicatorIOSExample'),
+    require('./DatePickerIOSExample'),
+    require('./NavigatorIOSColorsExample'),
+    require('./NavigatorIOSExample'),
+    require('./PickerIOSExample'),
+    require('./ProgressViewIOSExample'),
+    require('./SegmentedControlIOSExample'),
+    require('./SliderIOSExample'),
+    require('./SwitchIOSExample'),
+    require('./TabBarIOSExample'),
+    require('./TextExample.ios'),
+  ]);
+
+  var APIS = COMMON_APIS.concat([
+    require('./AccessibilityIOSExample'),
+    require('./ActionSheetIOSExample'),
+    require('./AdSupportIOSExample'),
+    require('./AlertIOSExample'),
+    require('./AppStateIOSExample'),
+    require('./AsyncStorageExample'),
+    require('./BorderExample'),
+    require('./CameraRollExample.ios'),
+    require('./NetInfoExample'),
+    require('./PushNotificationIOSExample'),
+    require('./StatusBarIOSExample'),
+    require('./TimerExample'),
+    require('./VibrationIOSExample'),
+    require('./XHRExample'),
+  ]);
+
+} else if (Platform.OS === 'android') {
+  var COMPONENTS = COMMON_COMPONENTS.concat([
+  ]);
+
+  var APIS = COMMON_APIS.concat([
+  ]);
+}
+
+var ds = new ListView.DataSource({
+  rowHasChanged: (r1, r2) => r1 !== r2,
+  sectionHeaderHasChanged: (h1, h2) => h1 !== h2,
+});
+
+function makeRenderable(example: any): ReactClass<any, any, any> {
+  return example.examples ?
+    createExamplePage(null, example) :
+    example;
+}
+
+// Register suitable examples for snapshot tests
+COMPONENTS.concat(APIS).forEach((Example) => {
+  if (Example.displayName) {
+    var Snapshotter = React.createClass({
+      componentDidMount: function() {
+        // View is still blank after first RAF :\
+        global.requestAnimationFrame(() =>
+          global.requestAnimationFrame(() => TestModule.verifySnapshot(
+            TestModule.markTestPassed
+          )
+        ));
+      },
+      render: function() {
+        var Renderable = makeRenderable(Example);
+        return <Renderable />;
+      },
+    });
+    AppRegistry.registerComponent(Example.displayName, () => Snapshotter);
+  }
+});
+
+type Props = {
+  navigator: {
+    navigationContext: NavigationContext,
+    push: (route: {title: string, component: ReactClass<any,any,any>}) => void,
+  },
+  onExternalExampleRequested: Function,
+  onSelectExample: Function,
+  isInDrawer: bool,
+};
+
+class UIExplorerList extends React.Component {
+  props: Props;
+
+  constructor(props: Props) {
+    super(props);
+    this.state = {
+      dataSource: ds.cloneWithRowsAndSections({
+        components: COMPONENTS,
+        apis: APIS,
+      }),
+      searchText: Platform.OS === 'ios' ? Settings.get('searchText') : '',
+    };
+  }
+
+  componentWillMount() {
+    this.props.navigator.navigationContext.addListener('didfocus', function(event) {
+      if (event.data.route.title === 'UIExplorer') {
+        Settings.set({visibleExample: null});
+      }
+    });
+  }
+
+  componentDidMount() {
+    this._search(this.state.searchText);
+
+    var visibleExampleTitle = Settings.get('visibleExample');
+    if (visibleExampleTitle) {
+      var predicate = (example) => example.title === visibleExampleTitle;
+      var foundExample = APIS.find(predicate) || COMPONENTS.find(predicate);
+      if (foundExample) {
+        setTimeout(() => this._openExample(foundExample), 100);
+      }
+    }
+  }
+
+  render() {
+    if (Platform.OS === 'ios' ||
+      (Platform.OS === 'android' && !this.props.isInDrawer)) {
+      var platformTextInputStyle =
+        Platform.OS === 'ios' ? styles.searchTextInputIOS :
+        Platform.OS === 'android' ? styles.searchTextInputAndroid : {};
+      var textInput = (
+        <View style={styles.searchRow}>
+          <TextInput
+            autoCapitalize="none"
+            autoCorrect={false}
+            clearButtonMode="always"
+            onChangeText={this._search.bind(this)}
+            placeholder="Search..."
+            style={[styles.searchTextInput, platformTextInputStyle]}
+            testID="explorer_search"
+            value={this.state.searchText}
+          />
+        </View>);
+    }
+
+    var homePage;
+    if (Platform.OS === 'android' && this.props.isInDrawer) {
+      homePage = this._renderRow({
+        title: 'UIExplorer',
+        description: 'List of examples',
+      }, -1);
+    }
+
+    return (
+      <View style={styles.listContainer}>
+        {textInput}
+        {homePage}
+        <ListView
+          style={styles.list}
+          dataSource={this.state.dataSource}
+          renderRow={this._renderRow.bind(this)}
+          renderSectionHeader={this._renderSectionHeader}
+          keyboardShouldPersistTaps={true}
+          automaticallyAdjustContentInsets={false}
+          keyboardDismissMode="on-drag"
+        />
+      </View>
+    );
+  }
+
+  _renderSectionHeader(data: any, section: string) {
+    return (
+      <View style={styles.sectionHeader}>
+        <Text style={styles.sectionHeaderTitle}>
+          {section.toUpperCase()}
+        </Text>
+      </View>
+    );
+  }
+
+  _renderRow(example: any, i: number) {
+    return (
+      <View key={i}>
+        <TouchableHighlight onPress={() => this._onPressRow(example)}>
+          <View style={styles.row}>
+            <Text style={styles.rowTitleText}>
+              {example.title}
+            </Text>
+            <Text style={styles.rowDetailText}>
+              {example.description}
+            </Text>
+          </View>
+        </TouchableHighlight>
+        <View style={styles.separator} />
+      </View>
+    );
+  }
+
+  _search(text: mixed) {
+    var regex = new RegExp(text, 'i');
+    var filter = (component) => regex.test(component.title);
+
+    this.setState({
+      dataSource: ds.cloneWithRowsAndSections({
+        components: COMPONENTS.filter(filter),
+        apis: APIS.filter(filter),
+      }),
+      searchText: text,
+    });
+    Settings.set({searchText: text});
+  }
+
+  _openExample(example: any) {
+    if (example.external) {
+      this.props.onExternalExampleRequested(example);
+      return;
+    }
+
+    var Component = makeRenderable(example);
+    if (Platform.OS === 'ios') {
+      this.props.navigator.push({
+        title: Component.title,
+        component: Component,
+      });
+    } else if (Platform.OS === 'android') {
+      this.props.onSelectExample({
+        title: Component.title,
+        component: Component,
+      });
+    }
+  }
+
+  _onPressRow(example: any) {
+    Settings.set({visibleExample: example.title});
+    this._openExample(example);
+  }
+}
+
+var styles = StyleSheet.create({
+  listContainer: {
+    flex: 1,
+  },
+  list: {
+    backgroundColor: '#eeeeee',
+  },
+  sectionHeader: {
+    padding: 5,
+  },
+  group: {
+    backgroundColor: 'white',
+  },
+  sectionHeaderTitle: {
+    fontWeight: '500',
+    fontSize: 11,
+  },
+  row: {
+    backgroundColor: 'white',
+    justifyContent: 'center',
+    paddingHorizontal: 15,
+    paddingVertical: 8,
+  },
+  separator: {
+    height: 1 / PixelRatio.get(),
+    backgroundColor: '#bbbbbb',
+    marginLeft: 15,
+  },
+  rowTitleText: {
+    fontSize: 17,
+    fontWeight: '500',
+  },
+  rowDetailText: {
+    fontSize: 15,
+    color: '#888888',
+    lineHeight: 20,
+  },
+  searchRow: {
+    backgroundColor: '#eeeeee',
+    paddingTop: 75,
+    paddingLeft: 10,
+    paddingRight: 10,
+    paddingBottom: 10,
+  },
+  searchTextInput: {
+    backgroundColor: 'white',
+    borderColor: '#cccccc',
+    borderRadius: 3,
+    borderWidth: 1,
+    paddingLeft: 8,
+  },
+  searchTextInputIOS: {
+    height: 30,
+  },
+  searchTextInputAndroid: {
+    padding: 2,
+  },
+});
+
+module.exports = UIExplorerList;

Examples/UIExplorer/UIExplorerListBase.js

@@ -1,195 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- *
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  ListView,
-  PixelRatio,
-  StyleSheet,
-  Text,
-  TextInput,
-  TouchableHighlight,
-  View,
-} = React;
-var createExamplePage = require('./createExamplePage');
-
-var ds = new ListView.DataSource({
-  rowHasChanged: (r1, r2) => r1 !== r2,
-  sectionHeaderHasChanged: (h1, h2) => h1 !== h2,
-});
-
-class UIExplorerListBase extends React.Component {
-  constructor(props: any) {
-    super(props);
-    this.state = {
-      dataSource: ds.cloneWithRowsAndSections({
-        components: [],
-        apis: [],
-      }),
-      searchText: this.props.searchText,
-    };
-  }
-
-  componentDidMount(): void {
-    this.search(this.state.searchText);
-  }
-
-  render() {
-    var topView = this.props.renderAdditionalView &&
-      this.props.renderAdditionalView(this.renderRow.bind(this), this.renderTextInput.bind(this));
-
-    return (
-      <View style={styles.listContainer}>
-        {topView}
-        <ListView
-          style={styles.list}
-          dataSource={this.state.dataSource}
-          renderRow={this.renderRow.bind(this)}
-          renderSectionHeader={this._renderSectionHeader}
-          keyboardShouldPersistTaps={true}
-          automaticallyAdjustContentInsets={false}
-          keyboardDismissMode="on-drag"
-        />
-      </View>
-    );
-  }
-
-  renderTextInput(searchTextInputStyle: any) {
-    return (
-      <View style={styles.searchRow}>
-        <TextInput
-          autoCapitalize="none"
-          autoCorrect={false}
-          clearButtonMode="always"
-          onChangeText={this.search.bind(this)}
-          placeholder="Search..."
-          style={[styles.searchTextInput, searchTextInputStyle]}
-          testID="explorer_search"
-          value={this.state.searchText}
-        />
-      </View>
-    );
-  }
-
-  _renderSectionHeader(data: any, section: string) {
-    return (
-      <View style={styles.sectionHeader}>
-        <Text style={styles.sectionHeaderTitle}>
-          {section.toUpperCase()}
-        </Text>
-      </View>
-    );
-  }
-
-  renderRow(example: any, i: number) {
-    return (
-      <View key={i}>
-        <TouchableHighlight onPress={() => this.onPressRow(example)}>
-          <View style={styles.row}>
-            <Text style={styles.rowTitleText}>
-              {example.title}
-            </Text>
-            <Text style={styles.rowDetailText}>
-              {example.description}
-            </Text>
-          </View>
-        </TouchableHighlight>
-        <View style={styles.separator} />
-      </View>
-    );
-  }
-
-  search(text: mixed): void {
-    this.props.search && this.props.search(text);
-
-    var regex = new RegExp(text, 'i');
-    var filter = (component) => regex.test(component.title);
-
-    this.setState({
-      dataSource: ds.cloneWithRowsAndSections({
-        components: this.props.components.filter(filter),
-        apis: this.props.apis.filter(filter),
-      }),
-      searchText: text,
-    });
-  }
-
-  onPressRow(example: any): void {
-    this.props.onPressRow && this.props.onPressRow(example);
-  }
-
-  static makeRenderable(example: any): ReactClass<any, any, any> {
-    return example.examples ?
-      createExamplePage(null, example) :
-      example;
-  }
-}
-
-var styles = StyleSheet.create({
-  listContainer: {
-    flex: 1,
-  },
-  list: {
-    backgroundColor: '#eeeeee',
-  },
-  sectionHeader: {
-    padding: 5,
-  },
-  group: {
-    backgroundColor: 'white',
-  },
-  sectionHeaderTitle: {
-    fontWeight: '500',
-    fontSize: 11,
-  },
-  row: {
-    backgroundColor: 'white',
-    justifyContent: 'center',
-    paddingHorizontal: 15,
-    paddingVertical: 8,
-  },
-  separator: {
-    height: 1 / PixelRatio.get(),
-    backgroundColor: '#bbbbbb',
-    marginLeft: 15,
-  },
-  rowTitleText: {
-    fontSize: 17,
-    fontWeight: '500',
-  },
-  rowDetailText: {
-    fontSize: 15,
-    color: '#888888',
-    lineHeight: 20,
-  },
-  searchRow: {
-    backgroundColor: '#eeeeee',
-    paddingTop: 75,
-    paddingLeft: 10,
-    paddingRight: 10,
-    paddingBottom: 10,
-  },
-  searchTextInput: {
-    backgroundColor: 'white',
-    borderColor: '#cccccc',
-    borderRadius: 3,
-    borderWidth: 1,
-    paddingLeft: 8,
-  },
-});
-
-module.exports = UIExplorerListBase;

Examples/UIExplorer/UIExplorerUnitTests/RCTAllocationTests.m

@@ -1,34 +1,23 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
+// Copyright 2004-present Facebook. All Rights Reserved.
 
 #import <Foundation/Foundation.h>
 #import <XCTest/XCTest.h>
 
 #import "RCTBridge.h"
 #import "RCTContextExecutor.h"
-#import "RCTModuleMethod.h"
 #import "RCTRootView.h"
 
-#define RUN_RUNLOOP_WHILE(CONDITION) \
+#define RUN_RUNLOOP_WHILE(CONDITION, TIMEOUT) \
 _Pragma("clang diagnostic push") \
 _Pragma("clang diagnostic ignored \"-Wshadow\"") \
-NSDate *timeout = [[NSDate date] dateByAddingTimeInterval:0.1]; \
+NSDate *timeout = [[NSDate date] dateByAddingTimeInterval:TIMEOUT]; \
 while ((CONDITION) && [timeout timeIntervalSinceNow] > 0) { \
   [[NSRunLoop currentRunLoop] runMode:NSDefaultRunLoopMode beforeDate:timeout]; \
 } \
 _Pragma("clang diagnostic pop")
 
+#define DEFAULT_TIMEOUT 2
+
 @interface RCTBridge (RCTAllocationTests)
 
 @property (nonatomic, weak) RCTBridge *batchedBridge;
@@ -42,16 +31,15 @@ _Pragma("clang diagnostic pop")
 @end
 
 @interface AllocationTestModule : NSObject<RCTBridgeModule, RCTInvalidating>
-
-@property (nonatomic, assign, getter=isValid) BOOL valid;
-
 @end
 
 @implementation AllocationTestModule
 
 RCT_EXPORT_MODULE();
 
-- (instancetype)init
+@synthesize valid = _valid;
+
+- (id)init
 {
   if ((self = [super init])) {
     _valid = YES;
@@ -64,11 +52,6 @@ RCT_EXPORT_MODULE();
   _valid = NO;
 }
 
-RCT_EXPORT_METHOD(test:(__unused NSString *)a
-                      :(__unused NSNumber *)b
-                      :(__unused RCTResponseSenderBlock)c
-                      :(__unused RCTResponseErrorBlock)d) {}
-
 @end
 
 @interface RCTAllocationTests : XCTestCase
@@ -82,19 +65,19 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
   @autoreleasepool {
     RCTRootView *view = [[RCTRootView alloc] initWithBundleURL:nil
                                                     moduleName:@""
-                                             initialProperties:nil
                                                  launchOptions:nil];
     weakBridge = view.bridge;
     XCTAssertNotNil(weakBridge, @"RCTBridge should have been created");
     (void)view;
   }
 
+  sleep(DEFAULT_TIMEOUT);
   XCTAssertNil(weakBridge, @"RCTBridge should have been deallocated");
 }
 
 - (void)testModulesAreInvalidated
 {
-  AllocationTestModule *module = [AllocationTestModule new];
+  AllocationTestModule *module = [[AllocationTestModule alloc] init];
   @autoreleasepool {
     RCTBridge *bridge = [[RCTBridge alloc] initWithBundleURL:nil
                                               moduleProvider:^{
@@ -105,7 +88,12 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
     (void)bridge;
   }
 
-  RUN_RUNLOOP_WHILE(module.isValid)
+  /**
+   * Sleep on the main thread to allow js thread deallocations then run the runloop
+   * to allow the module to be deallocated on the main thread
+   */
+  sleep(1);
+  RUN_RUNLOOP_WHILE(module.isValid, 1)
   XCTAssertFalse(module.isValid, @"AllocationTestModule should have been invalidated by the bridge");
 }
 
@@ -113,7 +101,7 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
 {
   __weak AllocationTestModule *weakModule;
   @autoreleasepool {
-    AllocationTestModule *module = [AllocationTestModule new];
+    AllocationTestModule *module = [[AllocationTestModule alloc] init];
     RCTBridge *bridge = [[RCTBridge alloc] initWithBundleURL:nil
                                 moduleProvider:^{
                                   return @[module];
@@ -124,23 +112,15 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
     (void)bridge;
   }
 
-  RUN_RUNLOOP_WHILE(weakModule)
+  /**
+   * Sleep on the main thread to allow js thread deallocations then run the runloop
+   * to allow the module to be deallocated on the main thread
+   */
+  sleep(1);
+  RUN_RUNLOOP_WHILE(weakModule, 1)
   XCTAssertNil(weakModule, @"AllocationTestModule should have been deallocated");
 }
 
-- (void)testModuleMethodsAreDeallocated
-{
-  __weak RCTModuleMethod *weakMethod;
-  @autoreleasepool {
-    __autoreleasing RCTModuleMethod *method = [[RCTModuleMethod alloc] initWithObjCMethodName:@"test:(NSString *)a :(nonnull NSNumber *)b :(RCTResponseSenderBlock)c :(RCTResponseErrorBlock)d" JSMethodName:@"" moduleClass:[AllocationTestModule class]];
-    weakMethod = method;
-    XCTAssertNotNil(method, @"RCTModuleMethod should have been created");
-  }
-
-  RUN_RUNLOOP_WHILE(weakMethod)
-  XCTAssertNil(weakMethod, @"RCTModuleMethod should have been deallocated");
-}
-
 - (void)testJavaScriptExecutorIsDeallocated
 {
   __weak id<RCTJavaScriptExecutor> weakExecutor;
@@ -153,7 +133,8 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
     (void)bridge;
   }
 
-  RUN_RUNLOOP_WHILE(weakExecutor);
+  RUN_RUNLOOP_WHILE(weakExecutor, 1);
+  sleep(1);
   XCTAssertNil(weakExecutor, @"JavaScriptExecutor should have been released");
 }
 
@@ -165,12 +146,13 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
                                               moduleProvider:nil
                                                launchOptions:nil];
     id executor = [bridge.batchedBridge valueForKey:@"javaScriptExecutor"];
-    RUN_RUNLOOP_WHILE(!(weakContext = [executor valueForKey:@"context"]));
+    RUN_RUNLOOP_WHILE(!(weakContext = [executor valueForKey:@"context"]), DEFAULT_TIMEOUT);
     XCTAssertNotNil(weakContext, @"RCTJavaScriptContext should have been created");
     (void)bridge;
   }
 
-  RUN_RUNLOOP_WHILE(weakContext);
+  RUN_RUNLOOP_WHILE(weakContext, 1);
+  sleep(1);
   XCTAssertNil(weakContext, @"RCTJavaScriptContext should have been deallocated");
 }
 
@@ -179,15 +161,16 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
   RCTBridge *bridge = [[RCTBridge alloc] initWithBundleURL:nil
                                             moduleProvider:nil
                                              launchOptions:nil];
-  __weak UIView *rootContentView;
+  __weak id rootContentView;
   @autoreleasepool {
-    RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"" initialProperties:nil];
-    RUN_RUNLOOP_WHILE(!(rootContentView = [rootView valueForKey:@"contentView"]))
-    XCTAssertTrue(rootContentView.userInteractionEnabled, @"RCTContentView should be valid");
+    RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@""];
+    RUN_RUNLOOP_WHILE(!(rootContentView = [rootView valueForKey:@"contentView"]), DEFAULT_TIMEOUT)
+    XCTAssertTrue([rootContentView isValid], @"RCTContentView should be valid");
     (void)rootView;
   }
 
-  XCTAssertFalse(rootContentView.userInteractionEnabled, @"RCTContentView should have been invalidated");
+  sleep(DEFAULT_TIMEOUT);
+  XCTAssertFalse([rootContentView isValid], @"RCTContentView should have been invalidated");
 }
 
 - (void)testUnderlyingBridgeIsDeallocated
@@ -201,7 +184,8 @@ RCT_EXPORT_METHOD(test:(__unused NSString *)a
     [bridge reload];
   }
 
-  RUN_RUNLOOP_WHILE(batchedBridge != nil)
+  // Use RUN_RUNLOOP_WHILE because `batchedBridge` deallocates on the main thread.
+  RUN_RUNLOOP_WHILE(batchedBridge != nil, DEFAULT_TIMEOUT)
 
   XCTAssertNotNil(bridge, @"RCTBridge should not have been deallocated");
   XCTAssertNil(batchedBridge, @"RCTBatchedBridge should have been deallocated");

Examples/UIExplorer/UIExplorerUnitTests/RCTBridgeTests.m

@@ -1,16 +1,4 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
+// Copyright 2004-present Facebook. All Rights Reserved.
 
 #import <Foundation/Foundation.h>
 #import <XCTest/XCTest.h>
@@ -24,7 +12,7 @@
 
 @property (nonatomic, strong, readonly) RCTBridge *batchedBridge;
 
-- (void)_handleBuffer:(id)buffer;
+- (void)_handleBuffer:(id)buffer context:(NSNumber *)context;
 - (void)setUp;
 
 @end
@@ -57,6 +45,7 @@ RCT_EXPORT_MODULE()
 - (void)executeJSCall:(__unused NSString *)name
                method:(__unused NSString *)method
             arguments:(__unused NSArray *)arguments
+              context:(__unused NSNumber *)executorID
              callback:(RCTJavaScriptCallback)onComplete
 {
   onComplete(nil, nil);
@@ -120,22 +109,10 @@ RCT_EXPORT_MODULE(TestModule)
   [_bridge invalidate];
 }
 
-#define RUN_RUNLOOP_WHILE(CONDITION) \
-_Pragma("clang diagnostic push") \
-_Pragma("clang diagnostic ignored \"-Wshadow\"") \
-NSDate *timeout = [[NSDate date] dateByAddingTimeInterval:0.1]; \
-while ((CONDITION) && [timeout timeIntervalSinceNow] > 0) { \
-  [[NSRunLoop currentRunLoop] runMode:NSDefaultRunLoopMode beforeDate:timeout]; \
-} \
-_Pragma("clang diagnostic pop")
-
 - (void)testHookRegistration
 {
   TestExecutor *executor =  [_bridge.batchedBridge valueForKey:@"_javaScriptExecutor"];
-
-  NSString *injectedStuff;
-  RUN_RUNLOOP_WHILE(!(injectedStuff = executor.injectedStuff[@"__fbBatchedBridgeConfig"]));
-
+  NSString *injectedStuff = executor.injectedStuff[@"__fbBatchedBridgeConfig"];
   NSDictionary *moduleConfig = RCTJSONParse(injectedStuff, NULL);
   NSDictionary *remoteModuleConfig = moduleConfig[@"remoteModuleConfig"];
   NSDictionary *testModuleConfig = remoteModuleConfig[@"TestModule"];
@@ -154,10 +131,7 @@ _Pragma("clang diagnostic pop")
 - (void)testCallNativeMethod
 {
   TestExecutor *executor =  [_bridge.batchedBridge valueForKey:@"_javaScriptExecutor"];
-
-  NSString *injectedStuff;
-  RUN_RUNLOOP_WHILE(!(injectedStuff = executor.injectedStuff[@"__fbBatchedBridgeConfig"]));
-
+  NSString *injectedStuff = executor.injectedStuff[@"__fbBatchedBridgeConfig"];
   NSDictionary *moduleConfig = RCTJSONParse(injectedStuff, NULL);
   NSDictionary *remoteModuleConfig = moduleConfig[@"remoteModuleConfig"];
   NSDictionary *testModuleConfig = remoteModuleConfig[@"TestModule"];
@@ -169,7 +143,7 @@ _Pragma("clang diagnostic pop")
   NSArray *args = @[@1234, @5678, @"stringy", @{@"a": @1}, @42];
   NSArray *buffer = @[@[testModuleID], @[testMethodID], @[args], @[], @1234567];
 
-  [_bridge.batchedBridge _handleBuffer:buffer];
+  [_bridge.batchedBridge _handleBuffer:buffer context:RCTGetExecutorID(executor)];
 
   dispatch_sync(_methodQueue, ^{
     // clear the queue
@@ -185,7 +159,7 @@ _Pragma("clang diagnostic pop")
 }
 
 RCT_EXPORT_METHOD(testMethod:(NSInteger)integer
-                  number:(nonnull NSNumber *)number
+                  number:(NSNumber *)number
                   string:(NSString *)string
                   dictionary:(NSDictionary *)dict
                   callback:(RCTResponseSenderBlock)callback)

Examples/UIExplorer/UIExplorerUnitTests/RCTCacheTests.m

@@ -1,168 +0,0 @@
-/**
- * The examples provided by Facebook are for non-commercial testing and
- * evaluation purposes only.
- *
- * Facebook reserves all rights not expressly granted.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
- * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
- * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
- * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-#import <XCTest/XCTest.h>
-#import "RCTCache.h"
-
-// Silence silly sign warnings when using int literals
-#pragma clang diagnostic ignored "-Wsign-compare"
-
-@interface RCTCache (Private)
-
-- (void)cleanUpAllObjects;
-- (void)resequence;
-- (NSDictionary *)cache;
-- (void)setSequenceNumber:(NSInteger)number;
-
-@end
-
-@interface RCTCacheTests : XCTestCase
-
-@property (nonatomic, strong) RCTCache *cache;
-
-@end
-
-@implementation RCTCacheTests
-
-- (void)setUp
-{
-  self.cache = [RCTCache new];
-  self.cache.countLimit = 3;
-  self.cache.totalCostLimit = 100;
-}
-
-- (void)tearDown
-{
-  self.cache = nil;
-}
-
-- (void)testInsertion
-{
-  [self.cache setObject:@1 forKey:@"foo" cost:1];
-  [self.cache setObject:@2 forKey:@"bar" cost:2];
-  [self.cache setObject:@3 forKey:@"baz" cost:3];
-
-  XCTAssertEqual([self.cache count], 3);
-  XCTAssertEqual([self.cache totalCost], 6);
-}
-
-- (void)testRemoval
-{
-  [self.cache setObject:@1 forKey:@"foo" cost:1];
-  [self.cache setObject:@2 forKey:@"bar" cost:2];
-  [self.cache setObject:@3 forKey:@"baz" cost:3];
-
-  [self.cache removeObjectForKey:@"bar"];
-
-  XCTAssertEqual([self.cache count], 2);
-  XCTAssertNil([self.cache objectForKey:@"bar"]);
-}
-
-- (void)testCountEviction
-{
-  [self.cache setObject:@1 forKey:@"foo"];
-  [self.cache setObject:@2 forKey:@"bar"];
-  [self.cache setObject:@3 forKey:@"baz"];
-  [self.cache setObject:@4 forKey:@"bam"];
-
-  XCTAssertEqual([self.cache count], 3);
-  XCTAssertNil([self.cache objectForKey:@"foo"]);
-
-  [self.cache setObject:@5 forKey:@"boo"];
-
-  XCTAssertEqual([self.cache count], 3);
-  XCTAssertNil([self.cache objectForKey:@"bar"]);
-}
-
-- (void)testCostEviction
-{
-  [self.cache setObject:@1 forKey:@"foo" cost:99];
-  [self.cache setObject:@2 forKey:@"bar" cost:2];
-
-  XCTAssertEqual([self.cache count], 1);
-  XCTAssertEqual([self.cache totalCost], 2);
-  XCTAssertNil([self.cache objectForKey:@"foo"]);
-
-  [self.cache setObject:@3 forKey:@"baz" cost:999];
-
-  XCTAssertEqual([self.cache count], 0);
-  XCTAssertEqual([self.cache totalCost], 0);
-}
-
-- (void)testCleanup
-{
-  [self.cache setObject:@1 forKey:@"foo"];
-  [self.cache setObject:@2 forKey:@"bar"];
-  [self.cache setObject:@3 forKey:@"baz"];
-
-  //simulate memory warning
-  [self.cache cleanUpAllObjects];
-
-  XCTAssertEqual([self.cache count], 0);
-  XCTAssertEqual([self.cache totalCost], 0);
-}
-
-- (void)testResequence
-{
-  [self.cache setObject:@1 forKey:@"foo"];
-  [self.cache setObject:@2 forKey:@"bar"];
-  [self.cache setObject:@3 forKey:@"baz"];
-
-  [self.cache resequence];
-
-  NSDictionary *innerCache = [self.cache cache];
-  XCTAssertEqualObjects([innerCache[@"foo"] valueForKey:@"sequenceNumber"], @0);
-  XCTAssertEqualObjects([innerCache[@"bar"] valueForKey:@"sequenceNumber"], @1);
-  XCTAssertEqualObjects([innerCache[@"baz"] valueForKey:@"sequenceNumber"], @2);
-
-  [self.cache removeObjectForKey:@"foo"];
-  [self.cache resequence];
-
-  XCTAssertEqualObjects([innerCache[@"bar"] valueForKey:@"sequenceNumber"], @0);
-  XCTAssertEqualObjects([innerCache[@"baz"] valueForKey:@"sequenceNumber"], @1);
-}
-
-- (void)testResequenceTrigger
-{
-  [self.cache setObject:@1 forKey:@"foo"];
-  [self.cache setObject:@2 forKey:@"bar"];
-
-  //first object should now be bar with sequence number of 1
-  [self.cache removeObjectForKey:@"foo"];
-
-  //should trigger resequence
-  [self.cache setSequenceNumber:NSIntegerMax];
-  [self.cache setObject:@3 forKey:@"baz"];
-
-  NSDictionary *innerCache = [self.cache cache];
-  XCTAssertEqualObjects([innerCache[@"bar"] valueForKey:@"sequenceNumber"], @0);
-  XCTAssertEqualObjects([innerCache[@"baz"] valueForKey:@"sequenceNumber"], @1);
-
-  //first object should now be baz with sequence number of 1
-  [self.cache removeObjectForKey:@"bar"];
-
-  //should also trigger resequence
-  [self.cache setSequenceNumber:NSIntegerMax];
-  [self.cache objectForKey:@"baz"];
-
-  XCTAssertEqualObjects([innerCache[@"baz"] valueForKey:@"sequenceNumber"], @0);
-}
-
-- (void)testName
-{
-  self.cache.name = @"Hello";
-  XCTAssertEqualObjects(self.cache.name, @"Hello");
-}
-
-@end

Examples/UIExplorer/UIExplorerUnitTests/RCTClippingTests.m

@@ -16,7 +16,10 @@
 #import <Foundation/Foundation.h>
 #import <UIKit/UIView.h>
 #import <XCTest/XCTest.h>
-#import "RCTImageUtils.h"
+
+extern CGRect RCTClipRect(CGSize contentSize, CGFloat contentScale,
+                          CGSize targetSize, CGFloat targetScale,
+                          UIViewContentMode resizeMode);
 
 #define RCTAssertEqualPoints(a, b) { \
 XCTAssertEqual(a.x, b.x); \
@@ -33,11 +36,11 @@ RCTAssertEqualPoints(a.origin, b.origin); \
 RCTAssertEqualSizes(a.size, b.size); \
 }
 
-@interface RCTImageUtilTests : XCTestCase
+@interface ClippingTests : XCTestCase
 
 @end
 
-@implementation RCTImageUtilTests
+@implementation ClippingTests
 
 - (void)testLandscapeSourceLandscapeTarget
 {
@@ -46,19 +49,19 @@ RCTAssertEqualSizes(a.size, b.size); \
 
   {
     CGRect expected = {CGPointZero, {100, 20}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleToFill);
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleToFill);
     RCTAssertEqualRects(expected, result);
   }
 
   {
     CGRect expected = {CGPointZero, {100, 10}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleAspectFit);
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleAspectFit);
     RCTAssertEqualRects(expected, result);
   }
 
   {
     CGRect expected = {{-50, 0}, {200, 20}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleAspectFill);
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleAspectFill);
     RCTAssertEqualRects(expected, result);
   }
 }
@@ -69,20 +72,20 @@ RCTAssertEqualSizes(a.size, b.size); \
   CGSize target = {100, 20};
 
   {
-    CGRect expected = {CGPointZero, {100, 20}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleToFill);
+    CGRect expected = {CGPointZero, {10, 20}};
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleToFill);
     RCTAssertEqualRects(expected, result);
   }
 
   {
     CGRect expected = {CGPointZero, {2, 20}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleAspectFit);
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleAspectFit);
     RCTAssertEqualRects(expected, result);
   }
 
   {
-    CGRect expected = {{0, -490}, {100, 1000}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleAspectFill);
+    CGRect expected = {{0, -49}, {10, 100}};
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleAspectFill);
     RCTAssertEqualRects(expected, result);
   }
 }
@@ -93,32 +96,20 @@ RCTAssertEqualSizes(a.size, b.size); \
   CGSize target = {20, 50};
 
   {
-    CGRect expected = {CGPointZero, {20, 50}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleToFill);
+    CGRect expected = {CGPointZero, {10, 50}};
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleToFill);
     RCTAssertEqualRects(expected, result);
   }
 
   {
     CGRect expected = {CGPointZero, {5, 50}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleAspectFit);
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleAspectFit);
     RCTAssertEqualRects(expected, result);
   }
 
   {
-    CGRect expected = {{0, -75}, {20, 200}};
-    CGRect result = RCTTargetRect(content, target, 2, UIViewContentModeScaleAspectFill);
-    RCTAssertEqualRects(expected, result);
-  }
-}
-
-- (void)testRounding
-{
-  CGSize content = {10, 100};
-  CGSize target = {20, 50};
-
-  {
-    CGRect expected = {{0, -75}, {20, 200}};
-    CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleAspectFill);
+    CGRect expected = {{0, -37.5}, {10, 100}};
+    CGRect result = RCTClipRect(content, 1, target, 1, UIViewContentModeScaleAspectFill);
     RCTAssertEqualRects(expected, result);
   }
 }
@@ -129,7 +120,7 @@ RCTAssertEqualSizes(a.size, b.size); \
   CGSize target = {3, 3};
 
   CGRect expected = {CGPointZero, {3, 3}};
-  CGRect result = RCTTargetRect(content, target, 1, UIViewContentModeScaleToFill);
+  CGRect result = RCTClipRect(content, 2, target, 1, UIViewContentModeScaleToFill);
   RCTAssertEqualRects(expected, result);
 }