0.3.8

2025-11-01 09:14:26 +00:00 · 2015-04-10 12:29:40 -07:00
2034 changed files with 28845 additions and 178970 deletions
@@ -1,6 +0,0 @@
-
-[android]
-  target = Google Inc.:Google APIs:23
-
-[maven_repositories]
-  central = https://repo1.maven.org/maven2
@@ -1 +0,0 @@
-Xmx512m -XX:+HeapDumpOnOutOfMemoryError
@@ -1,11 +0,0 @@
-# EditorConfig is awesome: http://EditorConfig.org
-
-# top-most EditorConfig file
-root = true
-
-# Unix-style newlines with a newline ending every file
-[*]
-end_of_line = lf
-insert_final_newline = true
-indent_style = space
-indent_size = 2
@@ -1,5 +1,3 @@
-# node_modules ignored by default
-
+**/node_modules/**/.*js
 **/staticBundle.js
 **/main.js
-Libraries/vendor/**/*
@@ -1,25 +1,13 @@
 {
-  "parser": "babel-eslint",
-
-  "ecmaFeatures": {
-    "jsx": true
-  },
-
  "env": {
-    "es6": true,
    "jasmine": true,
  },

-  "plugins": [
-    "react"
-  ],
-
  // Map from global var to bool specifying if it can be redefined
  "globals": {
    "__DEV__": true,
    "__dirname": false,
    "__fbBatchedBridgeConfig": false,
-    "alert": false,
    "cancelAnimationFrame": false,
    "clearImmediate": true,
    "clearInterval": false,
@@ -27,11 +15,7 @@
    "console": false,
    "document": false,
    "escape": false,
-    "Event": false,
-    "EventTarget": false,
    "exports": false,
-    "fetch": false,
-    "FormData": false,
    "global": false,
    "jest": false,
    "Map": true,
@@ -47,40 +31,19 @@
    "setTimeout": false,
    "window": false,
    "XMLHttpRequest": false,
-    "pit": false,
-
-    // Flow global types.
-    "ReactComponent": false,
-    "ReactClass": false,
-    "ReactElement": false,
-    "ReactPropsCheckType": false,
-    "ReactPropsChainableTypeChecker": false,
-    "ReactPropTypes": false,
-    "SyntheticEvent": false,
-    "$Either": false,
-    "$All": false,
-    "$Tuple": false,
-    "$Supertype": false,
-    "$Subtype": false,
-    "$Shape": false,
-    "$Diff": false,
-    "$Keys": false,
-    "$Enum": false,
-    "$Exports": false,
-    "$FlowIssue": false,
-    "$FlowFixMe": false,
-    "$FixMe": false
+    "pit": false
  },

  "rules": {
-    "comma-dangle": 0,               // disallow trailing commas in object literals
    "no-cond-assign": 1,             // disallow assignment in conditional expressions
    "no-console": 0,                 // disallow use of console (off by default in the node environment)
    "no-constant-condition": 0,      // disallow use of constant expressions in conditions
+    "no-comma-dangle": 0,            // disallow trailing commas in object literals
    "no-control-regex": 1,           // disallow control characters in regular expressions
    "no-debugger": 1,                // disallow use of debugger
    "no-dupe-keys": 1,               // disallow duplicate keys when creating object literals
    "no-empty": 0,                   // disallow empty statements
+    "no-empty-class": 1,             // disallow the use of empty character classes in regular expressions
    "no-ex-assign": 1,               // disallow assigning to the exception in a catch block
    "no-extra-boolean-cast": 1,      // disallow double-negation boolean casts in a boolean context
    "no-extra-parens": 0,            // disallow unnecessary parentheses (off by default)
@@ -143,7 +106,6 @@
    "no-warning-comments": 0,        // disallow usage of configurable warning terms in comments": 1,                        // e.g. TODO or FIXME (off by default)
    "no-with": 1,                    // disallow use of the with statement
    "radix": 1,                      // require use of the second argument for parseInt() (off by default)
-    "semi-spacing": 1,	             // require a space after a semi-colon
    "vars-on-top": 0,                // requires to declare all vars on top of their containing scope (off by default)
    "wrap-iife": 0,                  // require immediate function invocation to be wrapped in parentheses (off by default)
    "yoda": 1,                       // require or disallow Yoda conditions
@@ -151,7 +113,9 @@
  // Strict Mode
  // These rules relate to using strict mode.

-    "strict": [2, "global"],         // require or disallow the "use strict" pragma in the global scope (off by default in the node environment)
+    "global-strict": [2, "always"],  // require or disallow the "use strict" pragma in the global scope (off by default in the node environment)
+    "no-extra-strict": 1,            // disallow unnecessary use of "use strict"; when already in strict mode
+    "strict": 0,                     // require that all functions are run in strict mode

  // Variables
  // These rules have to do with variable declarations.
@@ -197,11 +161,13 @@
    "no-lonely-if": 0,               // disallow if as the only statement in an else block (off by default)
    "no-new-object": 1,              // disallow use of the Object constructor
    "no-spaced-func": 1,             // disallow space between function identifier and application
+    "no-space-before-semi": 1,       // disallow space before semicolon
    "no-ternary": 0,                 // disallow the use of ternary operators (off by default)
    "no-trailing-spaces": 1,         // disallow trailing whitespace at the end of lines
    "no-underscore-dangle": 0,       // disallow dangling underscores in identifiers
+    "no-wrap-func": 1,               // disallow wrapping of non-IIFE statements in parens
    "no-mixed-spaces-and-tabs": 1,   // disallow mixed spaces and tabs for indentation
-    "quotes": [1, "single", "avoid-escape"], // specify whether double or single quotes should be used
+    "quotes": [1, "single"],         // specify whether double or single quotes should be used
    "quote-props": 0,                // require quotes around object literal property names (off by default)
    "semi": 1,                       // require or disallow use of semicolons instead of ASI
    "sort-vars": 0,                  // sort variables within the same declaration block (off by default)
@@ -210,7 +176,7 @@
    "space-in-parens": 0,            // require or disallow spaces inside parentheses (off by default)
    "space-infix-ops": 1,            // require spaces around operators
    "space-return-throw-case": 1,    // require a space after return, throw, and case
-    "space-unary-ops": [1, { "words": true, "nonwords": false }], // require or disallow spaces before/after unary operators (words on by default, nonwords off by default)
+    "space-unary-word-ops": 1,       // require a space around word operators such as typeof (off by default)
    "max-nested-callbacks": 0,       // specify the maximum depth callbacks can be nested (off by default)
    "one-var": 0,                    // allow just one var statement per function (off by default)
    "wrap-regex": 0,                 // require regex literals to be wrapped in parentheses (off by default)
@@ -223,22 +189,6 @@
    "max-params": 0,                 // limits the number of parameters that can be used in the function declaration. (off by default)
    "max-statements": 0,             // specify the maximum number of statement allowed in a function (off by default)
    "no-bitwise": 1,                 // disallow use of bitwise operators (off by default)
-    "no-plusplus": 0,                // disallow use of unary operators, ++ and -- (off by default)
-
-    "react/display-name": 0,
-    "react/jsx-boolean-value": 0,
-    "react/jsx-quotes": [1, "double", "avoid-escape"],
-    "react/jsx-no-undef": 1,
-    "react/jsx-sort-props": 0,
-    "react/jsx-uses-react": 0,
-    "react/jsx-uses-vars": 1,
-    "react/no-did-mount-set-state": [1, "allow-in-func"],
-    "react/no-did-update-set-state": [1, "allow-in-func"],
-    "react/no-multi-comp": 0,
-    "react/no-unknown-property": 0,
-    "react/prop-types": 0,
-    "react/react-in-jsx-scope": 0,
-    "react/self-closing-comp": 1,
-    "react/wrap-multilines": 0
+    "no-plusplus": 0                 // disallow use of unary operators, ++ and -- (off by default)
  }
 }
@@ -7,35 +7,16 @@
 # Some modules have their own node_modules with overlap
 .*/node_modules/node-haste/.*

-# Ugh
-.*/node_modules/babel.*
-.*/node_modules/babylon.*
-.*/node_modules/invariant.*
-
-# Ignore react and fbjs where there are overlaps, but don't ignore
-# anything that react-native relies on
-.*/node_modules/fbjs/lib/Map.js
-.*/node_modules/fbjs/lib/Promise.js
-.*/node_modules/fbjs/lib/fetch.js
-.*/node_modules/fbjs/lib/ExecutionEnvironment.js
-.*/node_modules/fbjs/lib/isEmpty.js
-.*/node_modules/fbjs/lib/crc32.js
-.*/node_modules/fbjs/lib/ErrorUtils.js
-
-# Flow has a built-in definition for the 'react' module which we prefer to use
-# over the currently-untyped source
-.*/node_modules/react/react.js
-.*/node_modules/react/lib/React.js
-.*/node_modules/react/lib/ReactDOM.js
-
-# Ignore commoner tests
-.*/node_modules/commoner/test/.*
-
-# See https://github.com/facebook/flow/issues/442
-.*/react-tools/node_modules/commoner/lib/reader.js
+# Ignore react-tools where there are overlaps, but don't ignore anything that
+# react-native relies on
+.*/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 jest
-.*/node_modules/jest-cli/.*
+.*/react-native/node_modules/jest-cli/.*

 # Ignore Website
 .*/website/.*
@@ -44,22 +25,7 @@

 [libs]
 Libraries/react-native/react-native-interface.js
+Examples/UIExplorer/ImageMocks.js

 [options]
 module.system=haste
-
-munge_underscores=true
-
-module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
-module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\)$' -> 'RelativeImageStub'
-
-suppress_type=$FlowIssue
-suppress_type=$FlowFixMe
-suppress_type=$FixMe
-
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-1]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-1]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
-
-[version]
-0.21.0
@@ -1,6 +0,0 @@
-# Force LF line endings for Bash scripts.   On Windows the rest of the source
-# files will typically have CR+LF endings (Git default on Windows), but Bash
-# scripts need to have LF endings to work (under Cygwin), thus override to force
-# that.
-gradlew text eol=lf
-*.sh text eol=lf
@@ -4,6 +4,7 @@
 !**/*.xcworkspacedata
 !**/*.xcsettings
 !**/*.xcscheme
+build/
 *.pbxuser
 !default.pbxuser
 *.mode1v3
@@ -19,27 +20,9 @@ DerivedData
 *.hmap
 *.ipa
 *.xcuserstate
-project.xcworkspace
-
-# Gradle
-/build/
-/Examples/**/android/app/build/
-/ReactAndroid/build/
-
-# Buck
-.buckd
-buck-out
-
-# Android
-.idea
-.gradle
-local.properties
-*.iml
-
-# Node
-node_modules
-*.log
-.nvm

 # OS X
 .DS_Store
+
+# Node
+node_modules
@@ -1,21 +1,13 @@
 language: objective-c

-osx_image: xcode7.2
-
 cache:
-    directories:
-        - node_modules
-        - .nvm
+  directories:
+  - node_modules

+before_install:
+  - brew update
 install:
-  - brew reinstall nvm
-  - mkdir -p .nvm
-  - export NVM_DIR="$PWD/.nvm"
-  - source $(brew --prefix nvm)/nvm.sh
-  - nvm install 5
-  - rm -Rf "${TMPDIR}/jest_preprocess_cache"
-  - npm config set spin=false
-  - npm install -g flow-bin@`node -p "require('fs').readFileSync('.flowconfig', 'utf8').split('[version]')[1].trim()"`
+  - brew reinstall flow watchman xctool
  - npm install

 script:
@@ -23,29 +15,37 @@ script:
  if [ "$TEST_TYPE" = objc ]
  then

-    ./scripts/objc-test.sh
+    (npm start > packager.log 2>&1 &)
+    echo $! > packager.pid
+
+    xctool \
+      -project Examples/UIExplorer/UIExplorer.xcodeproj \
+      -scheme UIExplorer -sdk iphonesimulator8.1
+      test
+
+    pkill -9 -F packager.pid
+    cat packager.log
+    rm packager.log packager.pid

  elif [ "$TEST_TYPE" = js ]
  then

-    npm install github@0.2.4
-    cat <(echo eslint; npm run lint --silent -- --format=json; echo flow; flow --json) | GITHUB_TOKEN="af6ef0d15709bc91d""06a6217a5a826a226fb57b7" node bots/code-analysis-bot.js
-    flow check && npm test -- '\/Libraries\/'
+    flow check && npm test

-  elif [ "$TEST_TYPE" = packager ]
+  elif [ "$TEST_TYPE" = build_website ]
  then

-    npm test -- '\/packager\/'
-
-  elif [ "$TEST_TYPE" = cli ]
-  then
-
-    npm test -- '\/(local|private|react-native)-cli\/'
-
-  elif [ "$TEST_TYPE" = e2e ]
-  then
-
-    ./scripts/e2e-test.sh
+    cd website
+    npm install
+    ./setup.sh
+    if [ "$TRAVIS_PULL_REQUEST" = false ] && [ "$TRAVIS_BRANCH" = master ]; then
+      # Automatically publish the website
+      echo "machine github.com login reactjs-bot password $GITHUB_TOKEN" >~/.netrc
+      ./publish.sh
+    else
+      # Make sure the website builds without error
+      node server/generate.js
+    fi

  else
    echo "Unknown test type: $TEST_TYPE"
@@ -56,16 +56,10 @@ env:
  matrix:
    - TEST_TYPE=objc
    - TEST_TYPE=js
-    - TEST_TYPE=packager
-    - TEST_TYPE=cli
-    - TEST_TYPE=e2e
+    - TEST_TYPE=build_website
  global:
-    # $APPETIZE_TOKEN
-    - secure: "egsvVSpszTzrNd6bN62DsVAzMiSZI/OHgdizfPryqvqWBf655ztE6XFQSEFNpuIAzSKDDF25ioT8iPfVsbC1iK6HDWHfmqYxML0L+OoU0gi+hV2oKUBFZDZ1fwSnFoWuBdNdMDpLlUxvJp6N1WyfNOB2dxuZUt8eTt48Hi3+Hpc="
-    # $S3_TOKEN
-    - secure: "lY8JZPA0A7zT7L5KF9BBg34XYWIeR/RJiEvE7l7oVr88KnEPtyd//79eHhhVKnUnav7zsk5QJwkcX0MxKTp/dp4G0Am+zOX+sfA8kQrJ+2/+FzFW7AEsW/kHByfaIEIly9DQvUFt4I4oMm8nQZysJLahDgNWglyI3RTuJp//hcY="
+    - secure: "HlmG8M2DmBUSBh6KH1yVIe/8gR4iibg4WfcHq1x/xYQxGbvleq7NOo04V6eFHnl9cvZCu+PKH0841WLnGR7c4BBf47GVu/o16nXzggPumHKy++lDzxFPlJ1faMDfjg/5vjbAxRUe7D3y98hQSeGHH4tedc8LvTaFLVu7iiGqvjU="

 branches:
  only:
    - master
-    - /^.*-stable$/
@@ -19,30 +19,11 @@ The core team will be monitoring for pull requests. When we get one, we'll run s
 1. Fork the repo and create your branch from `master`.
 2. If you've added code that should be tested, add tests!
 3. If you've changed APIs, update the documentation.
-4. Add the copyright notice to the top of any new files you've added.
-5. Ensure tests pass on Travis and Circle CI.
-6. Make sure your code lints (`node linter.js <files touched>`).
-7. Squash your commits (`git rebase -i`).
-8. If you haven't already, sign the [CLA](https://code.facebook.com/cla).
+4. Ensure the test suite passes.
+5. Make sure your code lints - we've done our best to make sure these rules match our internal linting guidelines.
+6. If you haven't already, complete the CLA.

-#### Copyright Notice for files
-
-Copy and paste this to the top of your new file(s):
-
-```JS
-/**
- * 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.
- */
-```
-
-If you've added a new module, add a `@providesModule <moduleName>` at the end of the comment. This will allow the haste package manager to find it.
-
-### Contributor License Agreement (CLA)
+### Contributor License Agreement ("CLA")

 In order to accept your pull request, we need you to submit a CLA. You only need to do this once, so if you've done this for another Facebook open source project, you're good to go. If you are submitting a pull request for the first time, just let us know that you have completed the CLA and we can cross-check with your GitHub username.

@@ -52,11 +33,11 @@ In order to accept your pull request, we need you to submit a CLA. You only need

 ### Where to Find Known Issues

-We are using GitHub Issues for our public bugs. We keep a close eye on this and try to make it clear when we have an internal fix in progress. Before filing a new task, try to make sure your problem doesn't already exist.
+We will be using GitHub Issues for our public bugs. We will keep a close eye on this and try to make it clear when we have an internal fix in progress. Before filing a new task, try to make sure your problem doesn't already exist.

 ### Reporting New Issues

-The best way to get your bug fixed is to provide a reduced test case. Please provide either a public repository with a runnable example or a [React Native Playground](https://rnplay.org/) snippet.
+The best way to get your bug fixed is to provide a reduced test case.

 ### Security Bugs

@@ -64,48 +45,20 @@ Facebook has a [bounty program](https://www.facebook.com/whitehat/) for the safe

 ## How to Get in Touch

-* [Facebook group](https://www.facebook.com/groups/react.native.community/)
-* Reactiflux — [#react-native](http://join.reactiflux.com/)
+* IRC - [#reactnative on freenode](http://webchat.freenode.net/?channels=reactnative)

 ## Style Guide

 ### Code

-#### General
-
+* Use semicolons;
 * Add trailing commas,
 * 2 spaces for indentation (no tabs)
-* "Attractive"
-
-#### JavaScript
-
-* Use semicolons;
-* `'use strict';`
 * Prefer `'` over `"`
-* Do not use the optional parameters of `setTimeout` and `setInterval`
+* `'use strict';`
 * 80 character line length
-
-#### JSX
-
-* Prefer `'` over `"` for string literal props
-* When wrapping opening tags over multiple lines, place one prop per line
-* `{}` of props should hug their values (no spaces)
-* Place the closing `>` of opening tags on the same line as the last prop
-* Place the closing `/>` of self-closing tags on their own line and left-align them with the opening `<`
-
-#### Objective-C
-
-* Space after `@property` declarations
-* Brackets on *every* `if`, on the *same* line
-* `- method`, `@interface`, and `@implementation` brackets on the following line
-* *Try* to keep it around 80 characters line length (sometimes it's just not possible...)
-* `*` operator goes with the variable name (e.g. `NSObject *variableName;`)
-
-#### Java
-
-* If a method call spans multiple lines closing bracket is on the same line as the last argument.
-* If a method header doesn't fit on one line each argument goes on a separate line.
-* 100 character line length
+* "Attractive"
+* Do not use the optional parameters of `setTimeout` and `setInterval`

 ### Documentation

@@ -1,5 +0,0 @@
-{
-  "rules": {
-    "no-alert": 0
-  }
-}
@@ -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>";
@@ -159,7 +159,7 @@
 		83CBB9F71A601CBA00E9B192 /* Project object */ = {
 			isa = PBXProject;
 			attributes = {
-				LastUpgradeCheck = 0700;
+				LastUpgradeCheck = 0610;
 				ORGANIZATIONNAME = Facebook;
 			};
 			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "2048" */;
@@ -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,9 +266,11 @@
 				);
 				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;
 			};
 			name = Debug;
@@ -284,9 +286,11 @@
 				);
 				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;
 			};
 			name = Release;
@@ -311,7 +315,6 @@
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
 				COPY_PHASE_STRIP = NO;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
-				ENABLE_TESTABILITY = YES;
 				GCC_C_LANGUAGE_STANDARD = gnu99;
 				GCC_DYNAMIC_NO_PIC = NO;
 				GCC_OPTIMIZATION_LEVEL = 0;
@@ -22,41 +22,31 @@
 {
  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.
-   */
+  // Loading JavaScript code - uncomment the one you want.

-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/2048/Game2048.bundle?platform=ios&dev=true"];
+  // 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, and make sure your computer and
+  // iOS device are on the same Wi-Fi network.
+  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/2048/Game2048.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/2048/Game2048.bundle?platform=ios' -o main.jsbundle
-   *
-   * then add the `main.jsbundle` file to your project and uncomment this line:
-   */
-
-//  jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+  // OPTION 2
+  // Load from pre-bundled file on disk. To re-generate the static bundle, run
+  //
+  // $ curl http://localhost:8081/Examples/2048/Game2048.includeRequire.runModule.bundle -o main.jsbundle
+  //
+  // and uncomment the next following line
+  // jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"Game2048"
-                                               initialProperties:nil
                                                   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];
@@ -7,7 +7,7 @@
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
-	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<string>com.facebook.$(PRODUCT_NAME:rfc1034identifier)</string>
 	<key>CFBundleInfoDictionaryVersion</key>
 	<string>6.0</string>
 	<key>CFBundleName</key>
@@ -22,11 +22,6 @@
 	<string>1</string>
 	<key>LSRequiresIPhoneOS</key>
 	<true/>
-	<key>NSAppTransportSecurity</key>
-	<dict>
-		<key>NSAllowsArbitraryLoads</key>
-		<true/>
-	</dict>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIRequiredDeviceCapabilities</key>
@@ -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>
    );
@@ -148,7 +150,7 @@ class Game2048 extends React.Component {
  startX: number;
  startY: number;

-  constructor(props: {}) {
+  constructor(props) {
    super(props);
    this.state = {
      board: new GameBoard(),
@@ -237,7 +239,7 @@ var styles = StyleSheet.create({
    marginBottom: 20,
  },
  tryAgain: {
-    backgroundColor: '#887761',
+    backgroundColor: '#887766',
    padding: 20,
    borderRadius: 5,
  },
@@ -279,7 +281,7 @@ var styles = StyleSheet.create({
    backgroundColor: '#eeeecc',
  },
  tile8: {
-    backgroundColor: '#ffbb87',
+    backgroundColor: '#ffbb88',
  },
  tile16: {
    backgroundColor: '#ff9966',
@@ -17,7 +17,7 @@
 'use strict';

 // NB: Taken straight from: https://github.com/IvanVergiliev/2048-react/blob/master/src/board.js
-//     with no modification except to format it for CommonJS and fix lint/flow errors
+//     with no modificiation except to format it for CommonJS and fix lint/flow errors

 var rotateLeft = function (matrix) {
  var rows = matrix.length;
@@ -18,11 +18,10 @@
 var React = require('react-native');
 var {
  Image,
-  Platform,
+  PixelRatio,
  StyleSheet,
  Text,
  TouchableHighlight,
-  TouchableNativeFeedback,
  View
 } = React;

@@ -33,20 +32,10 @@ var getTextFromScore = require('./getTextFromScore');
 var MovieCell = React.createClass({
  render: function() {
    var criticsScore = this.props.movie.ratings.critics_score;
-    var TouchableElement = TouchableHighlight;
-    if (Platform.OS === 'android') {
-      TouchableElement = TouchableNativeFeedback;
-    }
    return (
      <View>
-        <TouchableElement
-          onPress={this.props.onSelect}
-          onShowUnderlay={this.props.onHighlight}
-          onHideUnderlay={this.props.onUnhighlight}>
+        <TouchableHighlight onPress={this.props.onSelect}>
          <View style={styles.row}>
-            {/* $FlowIssue #7363964 - There's a bug in Flow where you cannot
-              * omit a property or set it to undefined if it's inside a shape,
-              * even if it isn't required */}
            <Image
              source={getImageSource(this.props.movie, 'det')}
              style={styles.cellImage}
@@ -64,7 +53,8 @@ var MovieCell = React.createClass({
              </Text>
            </View>
          </View>
-        </TouchableElement>
+        </TouchableHighlight>
+        <View style={styles.cellBorder} />
      </View>
    );
  }
@@ -98,7 +88,8 @@ var styles = StyleSheet.create({
  },
  cellBorder: {
    backgroundColor: 'rgba(0, 0, 0, 0.1)',
-    height: StyleSheet.hairlineWidth,
+    // Trick to get the thinest line the device can display
+    height: 1 / PixelRatio.get(),
    marginLeft: 4,
  },
 });
@@ -18,6 +18,7 @@
 var React = require('react-native');
 var {
  Image,
+  PixelRatio,
  ScrollView,
  StyleSheet,
  Text,
@@ -33,9 +34,6 @@ var MovieScreen = React.createClass({
    return (
      <ScrollView contentContainerStyle={styles.contentContainer}>
        <View style={styles.mainSection}>
-          {/* $FlowIssue #7363964 - There's a bug in Flow where you cannot
-            * omit a property or set it to undefined if it's inside a shape,
-            * even if it isn't required */}
          <Image
            source={getImageSource(this.props.movie, 'det')}
            style={styles.detailsImage}
@@ -151,7 +149,7 @@ var styles = StyleSheet.create({
  },
  separator: {
    backgroundColor: 'rgba(0, 0, 0, 0.1)',
-    height: StyleSheet.hairlineWidth,
+    height: 1 / PixelRatio.get(),
    marginVertical: 10,
  },
  castTitle: {
@@ -16,7 +16,6 @@
 		140D9B661AC36C42004F25EE /* libRCTLinking.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 14312D241AC3654D00CDC950 /* libRCTLinking.a */; };
 		14A2D4421AC3E43800CC738A /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 14A2D4411AC3E41A00CC738A /* libReact.a */; };
 		58C5726B1AA6239E00CDF9C8 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 58C5725B1AA6236500CDF9C8 /* libRCTText.a */; };
-		67C95F201B0E64A30040BCE2 /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 67C95F1E1B0E647A0040BCE2 /* libRCTWebSocket.a */; };
 /* End PBXBuildFile section */

 /* Begin PBXContainerItemProxy section */
@@ -55,13 +54,6 @@
 			remoteGlobalIDString = 58B5119B1A9E6C1200147676;
 			remoteInfo = RCTText;
 		};
-		67C95F1D1B0E647A0040BCE2 /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 67C95F151B0E647A0040BCE2 /* RCTWebSocket.xcodeproj */;
-			proxyType = 2;
-			remoteGlobalIDString = 3C86DF461ADF2C930047B81A;
-			remoteInfo = RCTWebSocket;
-		};
 /* End PBXContainerItemProxy section */

 /* Begin PBXFileReference section */
@@ -77,7 +69,6 @@
 		14312D1E1AC3654D00CDC950 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../../Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
 		14A2D43C1AC3E41A00CC738A /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../React/React.xcodeproj; sourceTree = "<group>"; };
 		587650F61A9EB120008B8F17 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = SOURCE_ROOT; };
-		67C95F151B0E647A0040BCE2 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
 /* End PBXFileReference section */

 /* Begin PBXFrameworksBuildPhase section */
@@ -85,7 +76,6 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				67C95F201B0E64A30040BCE2 /* libRCTWebSocket.a in Frameworks */,
 				14A2D4421AC3E43800CC738A /* libReact.a in Frameworks */,
 				140D9B661AC36C42004F25EE /* libRCTLinking.a in Frameworks */,
 				1341801E1AA91750003F314A /* libRCTNetwork.a in Frameworks */,
@@ -145,7 +135,6 @@
 		58C571FC1AA6124500CDF9C8 /* Libraries */ = {
 			isa = PBXGroup;
 			children = (
-				67C95F151B0E647A0040BCE2 /* RCTWebSocket.xcodeproj */,
 				14A2D43C1AC3E41A00CC738A /* React.xcodeproj */,
 				14312D1E1AC3654D00CDC950 /* RCTLinking.xcodeproj */,
 				134180151AA91740003F314A /* RCTNetwork.xcodeproj */,
@@ -163,14 +152,6 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
-		67C95F161B0E647A0040BCE2 /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				67C95F1E1B0E647A0040BCE2 /* libRCTWebSocket.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
 		83CBB9F61A601CBA00E9B192 = {
 			isa = PBXGroup;
 			children = (
@@ -216,7 +197,7 @@
 		83CBB9F71A601CBA00E9B192 /* Project object */ = {
 			isa = PBXProject;
 			attributes = {
-				LastUpgradeCheck = 0700;
+				LastUpgradeCheck = 0610;
 				ORGANIZATIONNAME = Facebook;
 			};
 			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "Movies" */;
@@ -247,10 +228,6 @@
 					ProductGroup = 58C572571AA6236500CDF9C8 /* Products */;
 					ProjectRef = 587650F61A9EB120008B8F17 /* RCTText.xcodeproj */;
 				},
-				{
-					ProductGroup = 67C95F161B0E647A0040BCE2 /* Products */;
-					ProjectRef = 67C95F151B0E647A0040BCE2 /* RCTWebSocket.xcodeproj */;
-				},
 				{
 					ProductGroup = 14A2D43D1AC3E41A00CC738A /* Products */;
 					ProjectRef = 14A2D43C1AC3E41A00CC738A /* React.xcodeproj */;
@@ -299,13 +276,6 @@
 			remoteRef = 58C5725A1AA6236500CDF9C8 /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
-		67C95F1E1B0E647A0040BCE2 /* libRCTWebSocket.a */ = {
-			isa = PBXReferenceProxy;
-			fileType = archive.ar;
-			path = libRCTWebSocket.a;
-			remoteRef = 67C95F1D1B0E647A0040BCE2 /* PBXContainerItemProxy */;
-			sourceTree = BUILT_PRODUCTS_DIR;
-		};
 /* End PBXReferenceProxy section */

 /* Begin PBXResourcesBuildPhase section */
@@ -358,7 +328,6 @@
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = "$(inherited)";
 				OTHER_LDFLAGS = "-ObjC";
-				PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = Movies;
 				USER_HEADER_SEARCH_PATHS = "$(SRCROOT)/../../Libraries/**";
 			};
@@ -377,7 +346,6 @@
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = "$(inherited)";
 				OTHER_LDFLAGS = "-ObjC";
-				PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = Movies;
 				USER_HEADER_SEARCH_PATHS = "$(SRCROOT)/../../Libraries/**";
 			};
@@ -403,7 +371,6 @@
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
 				COPY_PHASE_STRIP = NO;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
-				ENABLE_TESTABILITY = YES;
 				GCC_C_LANGUAGE_STANDARD = gnu99;
 				GCC_DYNAMIC_NO_PIC = NO;
 				GCC_OPTIMIZATION_LEVEL = 0;
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
-   LastUpgradeVersion = "0700"
+   LastUpgradeVersion = "0610"
   version = "1.3">
   <BuildAction
      parallelizeBuildables = "YES"
@@ -38,8 +38,6 @@
            ReferencedContainer = "container:Movies.xcodeproj">
         </BuildableReference>
      </MacroExpansion>
-      <AdditionalOptions>
-      </AdditionalOptions>
   </TestAction>
   <LaunchAction
      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
@@ -49,10 +47,8 @@
      buildConfiguration = "Debug"
      ignoresPersistentStateOnLaunch = "NO"
      debugDocumentVersioning = "YES"
-      debugServiceExtension = "internal"
      allowLocationSimulation = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
+      <BuildableProductRunnable>
         <BuildableReference
            BuildableIdentifier = "primary"
            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
@@ -70,8 +66,7 @@
      useCustomWorkingDirectory = "NO"
      buildConfiguration = "Release"
      debugDocumentVersioning = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
+      <BuildableProductRunnable>
         <BuildableReference
            BuildableIdentifier = "primary"
            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
@@ -23,41 +23,31 @@
 {
  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.
-   */
+  // Loading JavaScript code - uncomment the one you want.

-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/Movies/MoviesApp.ios.bundle?platform=ios&dev=true"];
+  // 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, and make sure your computer and
+  // iOS device are on the same Wi-Fi network.
+  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.bundle?platform=ios&dev=true' -o main.jsbundle
-   *
-   * then add the `main.jsbundle` file to your project and uncomment this line:
-   */
-
-//  jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+  // OPTION 2
+  // Load from pre-bundled file on disk. To re-generate the static bundle, run
+  //
+  // $ curl http://localhost:8081/Examples/Movies/MoviesApp.includeRequire.runModule.bundle -o main.jsbundle
+  //
+  // and uncomment the next following line
+  // jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"MoviesApp"
-                                               initialProperties:nil
                                                   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];
@@ -7,7 +7,7 @@
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
-	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<string>com.facebook.$(PRODUCT_NAME:rfc1034identifier)</string>
 	<key>CFBundleInfoDictionaryVersion</key>
 	<string>6.0</string>
 	<key>CFBundleName</key>
@@ -33,11 +33,6 @@
 	<string>1</string>
 	<key>LSRequiresIPhoneOS</key>
 	<true/>
-	<key>NSAppTransportSecurity</key>
-	<dict>
-		<key>NSAllowsArbitraryLoads</key>
-		<true/>
-	</dict>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIRequiredDeviceCapabilities</key>
@@ -17,6 +17,6 @@

 int main(int argc, char * argv[]) {
  @autoreleasepool {
-    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
+      return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
  }
 }
@@ -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;
@@ -1,42 +0,0 @@
-# Movies app
-
-The Movies app is a demonstration of basic concepts, such as fetching data, rendering a list of data including images, and navigating between different screens.
-
-## Running this app
-
-Before running the app, make sure you ran:
-
-    git clone https://github.com/facebook/react-native.git
-    cd react-native
-    npm install
-
-### Running on iOS
-
-Mac OS and Xcode are required.
-
- Open `Examples/Movies/Movies.xcodeproj` in Xcode
- Hit the Run button
-
-See [Running on device](https://facebook.github.io/react-native/docs/running-on-device-ios.html) if you want to use a physical device.
-
-### Running on Android
-
-You'll need to have all the [prerequisites](https://github.com/facebook/react-native/tree/master/ReactAndroid#prerequisites) (SDK, NDK) for Building React Native installed.
-
-Start an Android emulator ([Genymotion](https://www.genymotion.com) is recommended).
-
-    cd react-native
-    ./gradlew :Examples:Movies:android:app:installDebug
-    ./packager/packager.sh
-
-_Note: Building for the first time can take a while._
-
-Open the Movies app in your emulator.
-
-See [Running on Device](https://facebook.github.io/react-native/docs/running-on-device-android.html) in case you want to use a physical device.
-
-## Built from source
-
-Building the app on both iOS and Android means building the React Native framework from source. This way you're running the latest native and JS code the way you see it in your clone of the github repo.
-
-This is different from apps created using `react-native init` which have a dependency on a specific version of React Native JS and native code, declared in a `package.json` file (and `build.gradle` for Android apps).
@@ -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;
@@ -1,66 +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 {
-  ActivityIndicatorIOS,
-  TextInput,
-  StyleSheet,
-  View,
-} = React;
-
-var SearchBar = React.createClass({
-  render: function() {
-    return (
-      <View style={styles.searchBar}>
-        <TextInput
-          autoCapitalize="none"
-          autoCorrect={false}
-          onChange={this.props.onSearchChange}
-          placeholder="Search a movie..."
-          onFocus={this.props.onFocus}
-          style={styles.searchBarInput}
-        />
-        <ActivityIndicatorIOS
-          animating={this.props.isLoading}
-          style={styles.spinner}
-        />
-      </View>
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  searchBar: {
-    marginTop: 64,
-    padding: 3,
-    paddingLeft: 8,
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  searchBarInput: {
-    fontSize: 15,
-    flex: 1,
-    height: 30,
-  },
-  spinner: {
-    width: 30,
-  },
-});
-
-module.exports = SearchBar;
@@ -19,20 +19,17 @@ var React = require('react-native');
 var {
  ActivityIndicatorIOS,
  ListView,
-  Platform,
-  ProgressBarAndroid,
  StyleSheet,
  Text,
+  TextInput,
  View,
 } = React;
 var TimerMixin = require('react-timer-mixin');

-var invariant = require('invariant');
-var dismissKeyboard = require('dismissKeyboard');
-
 var MovieCell = require('./MovieCell');
 var MovieScreen = require('./MovieScreen');
-var SearchBar = require('SearchBar');
+
+var fetch = require('fetch');

 /**
 * This is for demo purposes only, and rate limited.
@@ -78,7 +75,7 @@ var SearchScreen = React.createClass({
    this.searchMovies('');
  },

-  _urlForQueryAndPage: function(query: string, pageNumber: number): string {
+  _urlForQueryAndPage: function(query: string, pageNumber: ?number): string {
    var apiKey = API_KEYS[this.state.queryNumber % API_KEYS.length];
    if (query) {
      return (
@@ -179,7 +176,6 @@ var SearchScreen = React.createClass({
    });

    var page = resultsCache.nextPageNumberForQuery[query];
-    invariant(page != null, 'Next page number for "%s" is missing', query);
    fetch(this._urlForQueryAndPage(query, page))
      .then((response) => response.json())
      .catch((error) => {
@@ -222,20 +218,11 @@ var SearchScreen = React.createClass({
  },

  selectMovie: function(movie: Object) {
-    if (Platform.OS === 'ios') {
-      this.props.navigator.push({
-        title: movie.title,
-        component: MovieScreen,
-        passProps: {movie},
-      });
-    } else {
-      dismissKeyboard();
-      this.props.navigator.push({
-        title: movie.title,
-        name: 'movie',
-        movie: movie,
-      });
-    }
+    this.props.navigator.push({
+      title: movie.title,
+      component: MovieScreen,
+      passProps: {movie},
+    });
  },

  onSearchChange: function(event: Object) {
@@ -249,43 +236,13 @@ var SearchScreen = React.createClass({
    if (!this.hasMore() || !this.state.isLoadingTail) {
      return <View style={styles.scrollSpinner} />;
    }
-    if (Platform.OS === 'ios') {
-      return <ActivityIndicatorIOS style={styles.scrollSpinner} />;
-    } else {
-      return (
-        <View  style={{alignItems: 'center'}}>
-          <ProgressBarAndroid styleAttr="Large"/>
-        </View>
-      );
-    }
+    return <ActivityIndicatorIOS style={styles.scrollSpinner} />;
  },

-  renderSeparator: function(
-    sectionID: number | string,
-    rowID: number | string,
-    adjacentRowHighlighted: boolean
-  ) {
-    var style = styles.rowSeparator;
-    if (adjacentRowHighlighted) {
-        style = [style, styles.rowSeparatorHide];
-    }
-    return (
-      <View key={'SEP_' + sectionID + '_' + rowID}  style={style}/>
-    );
-  },
-
-  renderRow: function(
-    movie: Object,
-    sectionID: number | string,
-    rowID: number | string,
-    highlightRowFunc: (sectionID: ?number | string, rowID: ?number | string) => void,
-  ) {
+  renderRow: function(movie: Object)  {
    return (
      <MovieCell
-        key={movie.id}
        onSelect={() => this.selectMovie(movie)}
-        onHighlight={() => highlightRowFunc(sectionID, rowID)}
-        onUnhighlight={() => highlightRowFunc(null, null)}
        movie={movie}
      />
    );
@@ -299,13 +256,12 @@ var SearchScreen = React.createClass({
      /> :
      <ListView
        ref="listview"
-        renderSeparator={this.renderSeparator}
        dataSource={this.state.dataSource}
        renderFooter={this.renderFooter}
        renderRow={this.renderRow}
        onEndReached={this.onEndReached}
        automaticallyAdjustContentInsets={false}
-        keyboardDismissMode="on-drag"
+        keyboardDismissMode="onDrag"
        keyboardShouldPersistTaps={true}
        showsVerticalScrollIndicator={false}
      />;
@@ -315,8 +271,7 @@ var SearchScreen = React.createClass({
        <SearchBar
          onSearchChange={this.onSearchChange}
          isLoading={this.state.isLoading}
-          onFocus={() =>
-            this.refs.listview && this.refs.listview.getScrollResponder().scrollTo(0, 0)}
+          onFocus={() => this.refs.listview.getScrollResponder().scrollTo(0, 0)}
        />
        <View style={styles.separator} />
        {content}
@@ -329,7 +284,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
@@ -344,6 +299,27 @@ var NoMovies = React.createClass({
  }
 });

+var SearchBar = React.createClass({
+  render: function() {
+    return (
+      <View style={styles.searchBar}>
+        <TextInput
+          autoCapitalize="none"
+          autoCorrect={false}
+          onChange={this.props.onSearchChange}
+          placeholder="Search a movie..."
+          onFocus={this.props.onFocus}
+          style={styles.searchBarInput}
+        />
+        <ActivityIndicatorIOS
+          animating={this.props.isLoading}
+          style={styles.spinner}
+        />
+      </View>
+    );
+  }
+});
+
 var styles = StyleSheet.create({
  container: {
    flex: 1,
@@ -356,21 +332,28 @@ var styles = StyleSheet.create({
    marginTop: 80,
    color: '#888888',
  },
+  searchBar: {
+    marginTop: 64,
+    padding: 3,
+    paddingLeft: 8,
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  searchBarInput: {
+    fontSize: 15,
+    flex: 1,
+    height: 30,
+  },
  separator: {
    height: 1,
    backgroundColor: '#eeeeee',
  },
+  spinner: {
+    width: 30,
+  },
  scrollSpinner: {
    marginVertical: 20,
  },
-  rowSeparator: {
-    backgroundColor: 'rgba(0, 0, 0, 0.1)',
-    height: 1,
-    marginLeft: 4,
-  },
-  rowSeparatorHide: {
-    opacity: 0.0,
-  },
 });

 module.exports = SearchScreen;
@@ -1,31 +0,0 @@
-apply plugin: 'com.android.application'
-
-android {
-    compileSdkVersion 23
-    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:23.0.1'
-
-    // Build React Native from source
-    compile project(':ReactAndroid')
-}
@@ -1 +0,0 @@
-android.useDeprecatedNdk=true
@@ -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 *;
-#}
@@ -1,22 +0,0 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="com.facebook.react.movies">
-
-    <uses-permission android:name="android.permission.INTERNET" />
-    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
-
-    <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>
@@ -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, this);
-    }
-  }
-
-  @Override
-  public void onBackPressed() {
-    if (mReactInstanceManager != null) {
-      mReactInstanceManager.onBackPressed();
-    } else {
-      super.onBackPressed();
-    }
-  }
-
-  @Override
-  public void invokeDefaultOnBackPressed() {
-    super.onBackPressed();
-  }
-}
@@ -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>
@@ -1,3 +0,0 @@
-<resources>
-    <string name="app_name">MoviesApp</string>
-</resources>
@@ -1,8 +0,0 @@
-<resources>
-
-    <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
-        <!-- Customize your theme here. -->
-    </style>
-
-</resources>
@@ -22,9 +22,7 @@ var {

 var MAX_VALUE = 200;

-import type { StyleObj } from 'StyleSheetTypes';
-
-function getStyleFromScore(score: number): StyleObj {
+function getStyleFromScore(score: number): {color: string} {
  if (score < 0) {
    return styles.noScore;
  }
@@ -20,13 +20,6 @@ DerivedData
 *.hmap
 *.ipa
 *.xcuserstate
-project.xcworkspace
-
-# Android/IJ
-#
-.idea
-.gradle
-local.properties

 # node.js
 #
@@ -7,15 +7,15 @@
 	objects = {

 /* Begin PBXBuildFile section */
+		00481BE81AC0C86700671115 /* libRCTWebSocketDebugger.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00481BE61AC0C7FA00671115 /* libRCTWebSocketDebugger.a */; };
+		008F07F31AC5B25A0029DE68 /* main.jsbundle in Resources */ = {isa = PBXBuildFile; fileRef = 008F07F21AC5B25A0029DE68 /* main.jsbundle */; };
 		00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; };
+		00C302E61ABCBA2D00DB3ED1 /* libRCTAdSupport.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302B41ABCB8E700DB3ED1 /* libRCTAdSupport.a */; };
 		00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; };
 		00C302E81ABCBA2D00DB3ED1 /* libRCTImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302C01ABCB91800DB3ED1 /* libRCTImage.a */; };
 		00C302E91ABCBA2D00DB3ED1 /* libRCTNetwork.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302DC1ABCB9D200DB3ED1 /* libRCTNetwork.a */; };
 		00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302E41ABCB9EE00DB3ED1 /* libRCTVibration.a */; };
-		00E356F31AD99517003FC87E /* <%= name %>Tests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* <%= name %>Tests.m */; };
 		133E29F31AD74F7200F7D852 /* libRCTLinking.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 78C398B91ACF4ADC00677621 /* libRCTLinking.a */; };
-		139105C61AF99C1200B5F7CC /* libRCTSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139105C11AF99BAD00B5F7CC /* libRCTSettings.a */; };
-		139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139FDEF41B06529B00C62182 /* 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 */; };
@@ -25,6 +25,13 @@
 /* End PBXBuildFile section */

 /* Begin PBXContainerItemProxy section */
+		00481BE51AC0C7FA00671115 /* PBXContainerItemProxy */ = {
+			isa = PBXContainerItemProxy;
+			containerPortal = 00481BDB1AC0C7FA00671115 /* RCTWebSocketDebugger.xcodeproj */;
+			proxyType = 2;
+			remoteGlobalIDString = 832C81801AAF6DEF007FA2F7;
+			remoteInfo = RCTWebSocketDebugger;
+		};
 		00C302AB1ABCB8CE00DB3ED1 /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
 			containerPortal = 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */;
@@ -32,6 +39,13 @@
 			remoteGlobalIDString = 134814201AA4EA6300B7C361;
 			remoteInfo = RCTActionSheet;
 		};
+		00C302B31ABCB8E700DB3ED1 /* PBXContainerItemProxy */ = {
+			isa = PBXContainerItemProxy;
+			containerPortal = 00C302AF1ABCB8E700DB3ED1 /* RCTAdSupport.xcodeproj */;
+			proxyType = 2;
+			remoteGlobalIDString = 832C81801AAF6DEF007FA2F7;
+			remoteInfo = RCTAdSupport;
+		};
 		00C302B91ABCB90400DB3ED1 /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
 			containerPortal = 00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */;
@@ -60,27 +74,6 @@
 			remoteGlobalIDString = 832C81801AAF6DEF007FA2F7;
 			remoteInfo = RCTVibration;
 		};
-		00E356F41AD99517003FC87E /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 83CBB9F71A601CBA00E9B192 /* Project object */;
-			proxyType = 1;
-			remoteGlobalIDString = 13B07F861A680F5B00A75B9A;
-			remoteInfo = <%= name %>;
-		};
-		139105C01AF99BAD00B5F7CC /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */;
-			proxyType = 2;
-			remoteGlobalIDString = 134814201AA4EA6300B7C361;
-			remoteInfo = RCTSettings;
-		};
-		139FDEF31B06529B00C62182 /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */;
-			proxyType = 2;
-			remoteGlobalIDString = 3C86DF461ADF2C930047B81A;
-			remoteInfo = RCTWebSocket;
-		};
 		146834031AC3E56700842450 /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
 			containerPortal = 146833FF1AC3E56700842450 /* React.xcodeproj */;
@@ -105,57 +98,55 @@
 /* End PBXContainerItemProxy section */

 /* Begin PBXFileReference section */
-		008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; name = main.jsbundle; path = main.jsbundle; sourceTree = "<group>"; };
-		00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
-		00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../node_modules/react-native/Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
-		00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../node_modules/react-native/Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
-		00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../node_modules/react-native/Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
-		00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../node_modules/react-native/Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
-		00E356EE1AD99517003FC87E /* <%= name %>Tests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = <%= name %>Tests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
-		00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
-		00E356F21AD99517003FC87E /* <%= name %>Tests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = <%= name %>Tests.m; sourceTree = "<group>"; };
-		139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../node_modules/react-native/Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
-		139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../node_modules/react-native/Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
-		13B07F961A680F5B00A75B9A /* <%= name %>.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = <%= name %>.app; sourceTree = BUILT_PRODUCTS_DIR; };
-		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = <%= name %>/AppDelegate.h; sourceTree = "<group>"; };
-		13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = <%= name %>/AppDelegate.m; sourceTree = "<group>"; };
+		00481BDB1AC0C7FA00671115 /* RCTWebSocketDebugger.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocketDebugger.xcodeproj; path = ../../Libraries/RCTWebSocketDebugger/RCTWebSocketDebugger.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>"; };
+		00C302AF1ABCB8E700DB3ED1 /* RCTAdSupport.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAdSupport.xcodeproj; path = ../../Libraries/AdSupport/RCTAdSupport.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>"; };
+		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; 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; name = Images.xcassets; path = <%= name %>/Images.xcassets; sourceTree = "<group>"; };
-		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = <%= name %>/Info.plist; sourceTree = "<group>"; };
-		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = <%= name %>/main.m; sourceTree = "<group>"; };
-		146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../node_modules/react-native/React/React.xcodeproj; sourceTree = "<group>"; };
-		78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
-		832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../node_modules/react-native/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 */
-		00E356EB1AD99517003FC87E /* Frameworks */ = {
-			isa = PBXFrameworksBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
 		13B07F8C1A680F5B00A75B9A /* Frameworks */ = {
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
 				146834051AC3E58100842450 /* libReact.a in Frameworks */,
+				00481BE81AC0C86700671115 /* libRCTWebSocketDebugger.a in Frameworks */,
 				00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */,
+				00C302E61ABCBA2D00DB3ED1 /* libRCTAdSupport.a in Frameworks */,
 				00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */,
 				00C302E81ABCBA2D00DB3ED1 /* libRCTImage.a in Frameworks */,
 				133E29F31AD74F7200F7D852 /* libRCTLinking.a in Frameworks */,
 				00C302E91ABCBA2D00DB3ED1 /* libRCTNetwork.a in Frameworks */,
-				139105C61AF99C1200B5F7CC /* libRCTSettings.a in Frameworks */,
-				832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
 				00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */,
-				139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */,
+				832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
 /* End PBXFrameworksBuildPhase section */

 /* Begin PBXGroup section */
+		00481BDC1AC0C7FA00671115 /* Products */ = {
+			isa = PBXGroup;
+			children = (
+				00481BE61AC0C7FA00671115 /* libRCTWebSocketDebugger.a */,
+			);
+			name = Products;
+			sourceTree = "<group>";
+		};
 		00C302A81ABCB8CE00DB3ED1 /* Products */ = {
 			isa = PBXGroup;
 			children = (
@@ -164,6 +155,14 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
+		00C302B01ABCB8E700DB3ED1 /* Products */ = {
+			isa = PBXGroup;
+			children = (
+				00C302B41ABCB8E700DB3ED1 /* libRCTAdSupport.a */,
+			);
+			name = Products;
+			sourceTree = "<group>";
+		};
 		00C302B61ABCB90400DB3ED1 /* Products */ = {
 			isa = PBXGroup;
 			children = (
@@ -196,40 +195,7 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
-		00E356EF1AD99517003FC87E /* <%= name %>Tests */ = {
-			isa = PBXGroup;
-			children = (
-				00E356F21AD99517003FC87E /* <%= name %>Tests.m */,
-				00E356F01AD99517003FC87E /* Supporting Files */,
-			);
-			path = <%= name %>Tests;
-			sourceTree = "<group>";
-		};
-		00E356F01AD99517003FC87E /* Supporting Files */ = {
-			isa = PBXGroup;
-			children = (
-				00E356F11AD99517003FC87E /* Info.plist */,
-			);
-			name = "Supporting Files";
-			sourceTree = "<group>";
-		};
-		139105B71AF99BAD00B5F7CC /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				139105C11AF99BAD00B5F7CC /* libRCTSettings.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
-		139FDEE71B06529A00C62182 /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				139FDEF41B06529B00C62182 /* libRCTWebSocket.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
-		13B07FAE1A68108700A75B9A /* <%= name %> */ = {
+		13B07FAE1A68108700A75B9A /* SampleApp */ = {
 			isa = PBXGroup;
 			children = (
 				008F07F21AC5B25A0029DE68 /* main.jsbundle */,
@@ -240,7 +206,7 @@
 				13B07FB11A68108700A75B9A /* LaunchScreen.xib */,
 				13B07FB71A68108700A75B9A /* main.m */,
 			);
-			name = <%= name %>;
+			name = SampleApp;
 			sourceTree = "<group>";
 		};
 		146834001AC3E56700842450 /* Products */ = {
@@ -262,16 +228,16 @@
 		832341AE1AAA6A7D00B99B32 /* Libraries */ = {
 			isa = PBXGroup;
 			children = (
+				78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */,
 				146833FF1AC3E56700842450 /* React.xcodeproj */,
+				832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
 				00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */,
+				00C302AF1ABCB8E700DB3ED1 /* RCTAdSupport.xcodeproj */,
 				00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */,
 				00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */,
-				78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */,
 				00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */,
-				139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */,
-				832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
 				00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */,
-				139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
+				00481BDB1AC0C7FA00671115 /* RCTWebSocketDebugger.xcodeproj */,
 			);
 			name = Libraries;
 			sourceTree = "<group>";
@@ -287,9 +253,8 @@
 		83CBB9F61A601CBA00E9B192 = {
 			isa = PBXGroup;
 			children = (
-				13B07FAE1A68108700A75B9A /* <%= name %> */,
+				13B07FAE1A68108700A75B9A /* SampleApp */,
 				832341AE1AAA6A7D00B99B32 /* Libraries */,
-				00E356EF1AD99517003FC87E /* <%= name %>Tests */,
 				83CBBA001A601CBA00E9B192 /* Products */,
 			);
 			indentWidth = 2;
@@ -299,8 +264,7 @@
 		83CBBA001A601CBA00E9B192 /* Products */ = {
 			isa = PBXGroup;
 			children = (
-				13B07F961A680F5B00A75B9A /* <%= name %>.app */,
-				00E356EE1AD99517003FC87E /* <%= name %>Tests.xctest */,
+				13B07F961A680F5B00A75B9A /* SampleApp.app */,
 			);
 			name = Products;
 			sourceTree = "<group>";
@@ -308,40 +272,21 @@
 /* End PBXGroup section */

 /* Begin PBXNativeTarget section */
-		00E356ED1AD99517003FC87E /* <%= name %>Tests */ = {
+		13B07F861A680F5B00A75B9A /* SampleApp */ = {
 			isa = PBXNativeTarget;
-			buildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "<%= name %>Tests" */;
-			buildPhases = (
-				00E356EA1AD99517003FC87E /* Sources */,
-				00E356EB1AD99517003FC87E /* Frameworks */,
-				00E356EC1AD99517003FC87E /* Resources */,
-			);
-			buildRules = (
-			);
-			dependencies = (
-				00E356F51AD99517003FC87E /* PBXTargetDependency */,
-			);
-			name = <%= name %>Tests;
-			productName = <%= name %>Tests;
-			productReference = 00E356EE1AD99517003FC87E /* <%= name %>Tests.xctest */;
-			productType = "com.apple.product-type.bundle.unit-test";
-		};
-		13B07F861A680F5B00A75B9A /* <%= name %> */ = {
-			isa = PBXNativeTarget;
-			buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "<%= name %>" */;
+			buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "SampleApp" */;
 			buildPhases = (
 				13B07F871A680F5B00A75B9A /* Sources */,
 				13B07F8C1A680F5B00A75B9A /* Frameworks */,
 				13B07F8E1A680F5B00A75B9A /* Resources */,
-				00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
 			);
 			buildRules = (
 			);
 			dependencies = (
 			);
-			name = <%= name %>;
+			name = SampleApp;
 			productName = "Hello World";
-			productReference = 13B07F961A680F5B00A75B9A /* <%= name %>.app */;
+			productReference = 13B07F961A680F5B00A75B9A /* SampleApp.app */;
 			productType = "com.apple.product-type.application";
 		};
 /* End PBXNativeTarget section */
@@ -352,14 +297,8 @@
 			attributes = {
 				LastUpgradeCheck = 0610;
 				ORGANIZATIONNAME = Facebook;
-				TargetAttributes = {
-					00E356ED1AD99517003FC87E = {
-						CreatedOnToolsVersion = 6.2;
-						TestTargetID = 13B07F861A680F5B00A75B9A;
-					};
-				};
 			};
-			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "<%= name %>" */;
+			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "SampleApp" */;
 			compatibilityVersion = "Xcode 3.2";
 			developmentRegion = English;
 			hasScannedForEncodings = 0;
@@ -375,6 +314,10 @@
 					ProductGroup = 00C302A81ABCB8CE00DB3ED1 /* Products */;
 					ProjectRef = 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */;
 				},
+				{
+					ProductGroup = 00C302B01ABCB8E700DB3ED1 /* Products */;
+					ProjectRef = 00C302AF1ABCB8E700DB3ED1 /* RCTAdSupport.xcodeproj */;
+				},
 				{
 					ProductGroup = 00C302B61ABCB90400DB3ED1 /* Products */;
 					ProjectRef = 00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */;
@@ -391,10 +334,6 @@
 					ProductGroup = 00C302D41ABCB9D200DB3ED1 /* Products */;
 					ProjectRef = 00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */;
 				},
-				{
-					ProductGroup = 139105B71AF99BAD00B5F7CC /* Products */;
-					ProjectRef = 139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */;
-				},
 				{
 					ProductGroup = 832341B11AAA6A8300B99B32 /* Products */;
 					ProjectRef = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */;
@@ -404,8 +343,8 @@
 					ProjectRef = 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */;
 				},
 				{
-					ProductGroup = 139FDEE71B06529A00C62182 /* Products */;
-					ProjectRef = 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */;
+					ProductGroup = 00481BDC1AC0C7FA00671115 /* Products */;
+					ProjectRef = 00481BDB1AC0C7FA00671115 /* RCTWebSocketDebugger.xcodeproj */;
 				},
 				{
 					ProductGroup = 146834001AC3E56700842450 /* Products */;
@@ -414,13 +353,19 @@
 			);
 			projectRoot = "";
 			targets = (
-				13B07F861A680F5B00A75B9A /* <%= name %> */,
-				00E356ED1AD99517003FC87E /* <%= name %>Tests */,
+				13B07F861A680F5B00A75B9A /* SampleApp */,
 			);
 		};
 /* End PBXProject section */

 /* Begin PBXReferenceProxy section */
+		00481BE61AC0C7FA00671115 /* libRCTWebSocketDebugger.a */ = {
+			isa = PBXReferenceProxy;
+			fileType = archive.ar;
+			path = libRCTWebSocketDebugger.a;
+			remoteRef = 00481BE51AC0C7FA00671115 /* PBXContainerItemProxy */;
+			sourceTree = BUILT_PRODUCTS_DIR;
+		};
 		00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;
@@ -428,6 +373,13 @@
 			remoteRef = 00C302AB1ABCB8CE00DB3ED1 /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
+		00C302B41ABCB8E700DB3ED1 /* libRCTAdSupport.a */ = {
+			isa = PBXReferenceProxy;
+			fileType = archive.ar;
+			path = libRCTAdSupport.a;
+			remoteRef = 00C302B31ABCB8E700DB3ED1 /* PBXContainerItemProxy */;
+			sourceTree = BUILT_PRODUCTS_DIR;
+		};
 		00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;
@@ -456,20 +408,6 @@
 			remoteRef = 00C302E31ABCB9EE00DB3ED1 /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
-		139105C11AF99BAD00B5F7CC /* libRCTSettings.a */ = {
-			isa = PBXReferenceProxy;
-			fileType = archive.ar;
-			path = libRCTSettings.a;
-			remoteRef = 139105C01AF99BAD00B5F7CC /* PBXContainerItemProxy */;
-			sourceTree = BUILT_PRODUCTS_DIR;
-		};
-		139FDEF41B06529B00C62182 /* libRCTWebSocket.a */ = {
-			isa = PBXReferenceProxy;
-			fileType = archive.ar;
-			path = libRCTWebSocket.a;
-			remoteRef = 139FDEF31B06529B00C62182 /* PBXContainerItemProxy */;
-			sourceTree = BUILT_PRODUCTS_DIR;
-		};
 		146834041AC3E56700842450 /* libReact.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;
@@ -494,17 +432,11 @@
 /* End PBXReferenceProxy section */

 /* Begin PBXResourcesBuildPhase section */
-		00E356EC1AD99517003FC87E /* Resources */ = {
-			isa = PBXResourcesBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
 		13B07F8E1A680F5B00A75B9A /* Resources */ = {
 			isa = PBXResourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				008F07F31AC5B25A0029DE68 /* main.jsbundle in Resources */,
 				13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
 				13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */,
 			);
@@ -512,33 +444,7 @@
 		};
 /* End PBXResourcesBuildPhase section */

-/* Begin PBXShellScriptBuildPhase section */
-		00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputPaths = (
-			);
-			name = "Bundle React Native code and images";
-			outputPaths = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "export NODE_BINARY=node\n../node_modules/react-native/packager/react-native-xcode.sh";
-			showEnvVarsInLog = 1;
-		};
-/* End PBXShellScriptBuildPhase section */
-
 /* Begin PBXSourcesBuildPhase section */
-		00E356EA1AD99517003FC87E /* Sources */ = {
-			isa = PBXSourcesBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-				00E356F31AD99517003FC87E /* <%= name %>Tests.m in Sources */,
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
 		13B07F871A680F5B00A75B9A /* Sources */ = {
 			isa = PBXSourcesBuildPhase;
 			buildActionMask = 2147483647;
@@ -550,14 +456,6 @@
 		};
 /* End PBXSourcesBuildPhase section */

-/* Begin PBXTargetDependency section */
-		00E356F51AD99517003FC87E /* PBXTargetDependency */ = {
-			isa = PBXTargetDependency;
-			target = 13B07F861A680F5B00A75B9A /* <%= name %> */;
-			targetProxy = 00E356F41AD99517003FC87E /* PBXContainerItemProxy */;
-		};
-/* End PBXTargetDependency section */
-
 /* Begin PBXVariantGroup section */
 		13B07FB11A68108700A75B9A /* LaunchScreen.xib */ = {
 			isa = PBXVariantGroup;
@@ -565,63 +463,25 @@
 				13B07FB21A68108700A75B9A /* Base */,
 			);
 			name = LaunchScreen.xib;
-			path = <%= name %>;
+			path = iOS;
 			sourceTree = "<group>";
 		};
 /* End PBXVariantGroup section */

 /* Begin XCBuildConfiguration section */
-		00E356F61AD99517003FC87E /* Debug */ = {
-			isa = XCBuildConfiguration;
-			buildSettings = {
-				BUNDLE_LOADER = "$(TEST_HOST)";
-				FRAMEWORK_SEARCH_PATHS = (
-					"$(SDKROOT)/Developer/Library/Frameworks",
-					"$(inherited)",
-				);
-				GCC_PREPROCESSOR_DEFINITIONS = (
-					"DEBUG=1",
-					"$(inherited)",
-				);
-				INFOPLIST_FILE = <%= name %>Tests/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 8.2;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
-				PRODUCT_NAME = "$(TARGET_NAME)";
-				TEST_HOST = "$(BUILT_PRODUCTS_DIR)/<%= name %>.app/<%= name %>";
-			};
-			name = Debug;
-		};
-		00E356F71AD99517003FC87E /* Release */ = {
-			isa = XCBuildConfiguration;
-			buildSettings = {
-				BUNDLE_LOADER = "$(TEST_HOST)";
-				COPY_PHASE_STRIP = NO;
-				FRAMEWORK_SEARCH_PATHS = (
-					"$(SDKROOT)/Developer/Library/Frameworks",
-					"$(inherited)",
-				);
-				INFOPLIST_FILE = <%= name %>Tests/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 8.2;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
-				PRODUCT_NAME = "$(TARGET_NAME)";
-				TEST_HOST = "$(BUILT_PRODUCTS_DIR)/<%= name %>.app/<%= name %>";
-			};
-			name = Release;
-		};
 		13B07F941A680F5B00A75B9A /* Debug */ = {
 			isa = XCBuildConfiguration;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
-				DEAD_CODE_STRIPPING = NO;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../node_modules/react-native/React/**",
+					"$(SRCROOT)/../../React/**",
 				);
-				INFOPLIST_FILE = "<%= name %>/Info.plist";
+				INFOPLIST_FILE = "$(SRCROOT)/iOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				OTHER_LDFLAGS = "-ObjC";
-				PRODUCT_NAME = <%= name %>;
+				PRODUCT_NAME = SampleApp;
 			};
 			name = Debug;
 		};
@@ -632,12 +492,12 @@
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../node_modules/react-native/React/**",
+					"$(SRCROOT)/../../React/**",
 				);
-				INFOPLIST_FILE = "<%= name %>/Info.plist";
+				INFOPLIST_FILE = "$(SRCROOT)/iOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				OTHER_LDFLAGS = "-ObjC";
-				PRODUCT_NAME = <%= name %>;
+				PRODUCT_NAME = SampleApp;
 			};
 			name = Release;
 		};
@@ -678,7 +538,7 @@
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../node_modules/react-native/React/**",
+					"$(SRCROOT)/../../React/**",
 				);
 				IPHONEOS_DEPLOYMENT_TARGET = 7.0;
 				MTL_ENABLE_DEBUG_INFO = YES;
@@ -718,7 +578,7 @@
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
 					/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
-					"$(SRCROOT)/../node_modules/react-native/React/**",
+					"$(SRCROOT)/../../React/**",
 				);
 				IPHONEOS_DEPLOYMENT_TARGET = 7.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
@@ -730,16 +590,7 @@
 /* End XCBuildConfiguration section */

 /* Begin XCConfigurationList section */
-		00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "<%= name %>Tests" */ = {
-			isa = XCConfigurationList;
-			buildConfigurations = (
-				00E356F61AD99517003FC87E /* Debug */,
-				00E356F71AD99517003FC87E /* Release */,
-			);
-			defaultConfigurationIsVisible = 0;
-			defaultConfigurationName = Release;
-		};
-		13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "<%= name %>" */ = {
+		13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "SampleApp" */ = {
 			isa = XCConfigurationList;
 			buildConfigurations = (
 				13B07F941A680F5B00A75B9A /* Debug */,
@@ -748,7 +599,7 @@
 			defaultConfigurationIsVisible = 0;
 			defaultConfigurationName = Release;
 		};
-		83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "<%= name %>" */ = {
+		83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "SampleApp" */ = {
 			isa = XCConfigurationList;
 			buildConfigurations = (
 				83CBBA201A601CBA00E9B192 /* Debug */,
@@ -0,0 +1,88 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<Scheme
+   LastUpgradeVersion = "0620"
+   version = "1.3">
+   <BuildAction
+      parallelizeBuildables = "YES"
+      buildImplicitDependencies = "YES">
+      <BuildActionEntries>
+         <BuildActionEntry
+            buildForTesting = "YES"
+            buildForRunning = "YES"
+            buildForProfiling = "YES"
+            buildForArchiving = "YES"
+            buildForAnalyzing = "YES">
+            <BuildableReference
+               BuildableIdentifier = "primary"
+               BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+               BuildableName = "SampleApp.app"
+               BlueprintName = "SampleApp"
+               ReferencedContainer = "container:SampleApp.xcodeproj">
+            </BuildableReference>
+         </BuildActionEntry>
+      </BuildActionEntries>
+   </BuildAction>
+   <TestAction
+      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
+      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
+      shouldUseLaunchSchemeArgsEnv = "YES"
+      buildConfiguration = "Debug">
+      <Testables>
+      </Testables>
+      <MacroExpansion>
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+            BuildableName = "SampleApp.app"
+            BlueprintName = "SampleApp"
+            ReferencedContainer = "container:SampleApp.xcodeproj">
+         </BuildableReference>
+      </MacroExpansion>
+   </TestAction>
+   <LaunchAction
+      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
+      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
+      launchStyle = "0"
+      useCustomWorkingDirectory = "NO"
+      buildConfiguration = "Debug"
+      ignoresPersistentStateOnLaunch = "NO"
+      debugDocumentVersioning = "YES"
+      allowLocationSimulation = "YES">
+      <BuildableProductRunnable
+         runnableDebuggingMode = "0">
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+            BuildableName = "SampleApp.app"
+            BlueprintName = "SampleApp"
+            ReferencedContainer = "container:SampleApp.xcodeproj">
+         </BuildableReference>
+      </BuildableProductRunnable>
+      <AdditionalOptions>
+      </AdditionalOptions>
+   </LaunchAction>
+   <ProfileAction
+      shouldUseLaunchSchemeArgsEnv = "YES"
+      savedToolIdentifier = ""
+      useCustomWorkingDirectory = "NO"
+      buildConfiguration = "Release"
+      debugDocumentVersioning = "YES">
+      <BuildableProductRunnable
+         runnableDebuggingMode = "0">
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+            BuildableName = "SampleApp.app"
+            BlueprintName = "SampleApp"
+            ReferencedContainer = "container:SampleApp.xcodeproj">
+         </BuildableReference>
+      </BuildableProductRunnable>
+   </ProfileAction>
+   <AnalyzeAction
+      buildConfiguration = "Debug">
+   </AnalyzeAction>
+   <ArchiveAction
+      buildConfiguration = "Release"
+      revealArchiveInOrganizer = "YES">
+   </ArchiveAction>
+</Scheme>
@@ -17,37 +17,31 @@
 {
  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.
-   */
+  // Loading JavaScript code - uncomment the one you want.

-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
+  // 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, 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. The static bundle is automatically
-   * generated by "Bundle React Native code and images" build step.
-   */
-
-//   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+  // OPTION 2
+  // Load from pre-bundled file on disk. To re-generate the static bundle, run
+  //
+  // $ curl 'http://localhost:8081/Examples/SampleApp/index.ios.bundle?dev=false&minify=true' -o iOS/main.jsbundle
+  //
+  // and uncomment the next following line
+  // 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];
-  UIViewController *rootViewController = [UIViewController new];
+  UIViewController *rootViewController = [[UIViewController alloc] init];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
@@ -1,8 +1,8 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<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">
+<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">
    <dependencies>
        <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="7701"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6736"/>
        <capability name="Constraints with non-1.0 multipliers" minToolsVersion="5.1"/>
    </dependencies>
    <objects>
@@ -18,7 +18,7 @@
                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
                    <nil key="highlightedColor"/>
                </label>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="<%= name %>" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="kId-c2-rCX">
+                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="SampleApp" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="kId-c2-rCX">
                    <rect key="frame" x="20" y="140" width="441" height="43"/>
                    <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
@@ -38,11 +38,5 @@
 	<false/>
 	<key>NSLocationWhenInUseUsageDescription</key>
 	<string></string>
-  <key>NSAppTransportSecurity</key>
-  <dict>
-    <!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ -->
-    <key>NSAllowsArbitraryLoads</key>
-    <true/>
-  </dict>
 </dict>
 </plist>
@@ -0,0 +1,5 @@
+// Offline JS
+// To re-generate the offline bundle, run this from root of your project
+// $ curl 'http://localhost:8081/Examples/SampleApp/index.ios.bundle?dev=false&minify=true' -o iOS/main.jsbundle
+
+throw new Error('Offline JS file is empty. See iOS/main.jsbundle for instructions');
@@ -3,16 +3,17 @@
 * https://github.com/facebook/react-native
 */
 'use strict';
-import React, {
+
+var React = require('react-native');
+var {
  AppRegistry,
-  Component,
  StyleSheet,
  Text,
-  View
-} from 'react-native';
+  View,
+} = React;

-class <%= name %> extends Component {
-  render() {
+var SampleApp = React.createClass({
+  render: function() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
@@ -23,14 +24,14 @@ class <%= name %> extends Component {
        </Text>
        <Text style={styles.instructions}>
          Press Cmd+R to reload,{'\n'}
-          Cmd+D or shake for dev menu
+          Cmd+Control+Z for dev menu
        </Text>
      </View>
    );
  }
-}
+});

-const styles = StyleSheet.create({
+var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
@@ -49,4 +50,4 @@ const styles = StyleSheet.create({
  },
 });

-AppRegistry.registerComponent('<%= name %>', () => <%= name %>);
+AppRegistry.registerComponent('SampleApp', () => SampleApp);
@@ -14,8 +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 */

 /* Begin PBXContainerItemProxy section */
@@ -40,20 +38,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 */;
-			proxyType = 2;
-			remoteGlobalIDString = 134814201AA4EA6300B7C361;
-			remoteInfo = RCTSettings;
-		};
 /* End PBXContainerItemProxy section */

 /* Begin PBXFileReference section */
@@ -67,8 +51,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 */

 /* Begin PBXFrameworksBuildPhase section */
@@ -76,11 +58,9 @@
 			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 */,
-				832044981B492C2500E297FC /* libRCTSettings.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -119,10 +99,8 @@
 		58C572071AA6126D00CDF9C8 /* Libraries */ = {
 			isa = PBXGroup;
 			children = (
-				5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */,
 				144C5F631AC3E5D800B004E7 /* React.xcodeproj */,
 				134180381AA917ED003F314A /* RCTImage.xcodeproj */,
-				8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */,
 				587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */,
 			);
 			name = Libraries;
@@ -136,22 +114,6 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
-		5FF894291B8556F8007731BE /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
-		832044901B492C1E00E297FC /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				832044951B492C1E00E297FC /* libRCTSettings.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
 		83CBB9F61A601CBA00E9B192 = {
 			isa = PBXGroup;
 			children = (
@@ -197,7 +159,7 @@
 		83CBB9F71A601CBA00E9B192 /* Project object */ = {
 			isa = PBXProject;
 			attributes = {
-				LastUpgradeCheck = 0700;
+				LastUpgradeCheck = 0610;
 				ORGANIZATIONNAME = Facebook;
 			};
 			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "TicTacToe" */;
@@ -216,18 +178,10 @@
 					ProductGroup = 134180391AA917ED003F314A /* Products */;
 					ProjectRef = 134180381AA917ED003F314A /* RCTImage.xcodeproj */;
 				},
-				{
-					ProductGroup = 832044901B492C1E00E297FC /* Products */;
-					ProjectRef = 8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */;
-				},
 				{
 					ProductGroup = 58C572481AA6224300CDF9C8 /* Products */;
 					ProjectRef = 587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */;
 				},
-				{
-					ProductGroup = 5FF894291B8556F8007731BE /* Products */;
-					ProjectRef = 5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */;
-				},
 				{
 					ProductGroup = 144C5F641AC3E5D800B004E7 /* Products */;
 					ProjectRef = 144C5F631AC3E5D800B004E7 /* React.xcodeproj */;
@@ -262,20 +216,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;
-			path = libRCTSettings.a;
-			remoteRef = 832044941B492C1E00E297FC /* PBXContainerItemProxy */;
-			sourceTree = BUILT_PRODUCTS_DIR;
-		};
 /* End PBXReferenceProxy section */

 /* Begin PBXResourcesBuildPhase section */
@@ -328,7 +268,6 @@
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = "$(inherited)";
 				OTHER_LDFLAGS = "-ObjC";
-				PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = TicTacToe;
 			};
 			name = Debug;
@@ -346,7 +285,6 @@
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = "$(inherited)";
 				OTHER_LDFLAGS = "-ObjC";
-				PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = TicTacToe;
 			};
 			name = Release;
@@ -371,7 +309,6 @@
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
 				COPY_PHASE_STRIP = NO;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
-				ENABLE_TESTABILITY = YES;
 				GCC_C_LANGUAGE_STANDARD = gnu99;
 				GCC_DYNAMIC_NO_PIC = NO;
 				GCC_OPTIMIZATION_LEVEL = 0;
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
-   LastUpgradeVersion = "0700"
+   LastUpgradeVersion = "0610"
   version = "1.3">
   <BuildAction
      parallelizeBuildables = "YES"
@@ -38,8 +38,6 @@
            ReferencedContainer = "container:TicTacToe.xcodeproj">
         </BuildableReference>
      </MacroExpansion>
-      <AdditionalOptions>
-      </AdditionalOptions>
   </TestAction>
   <LaunchAction
      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
@@ -49,10 +47,8 @@
      buildConfiguration = "Debug"
      ignoresPersistentStateOnLaunch = "NO"
      debugDocumentVersioning = "YES"
-      debugServiceExtension = "internal"
      allowLocationSimulation = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
+      <BuildableProductRunnable>
         <BuildableReference
            BuildableIdentifier = "primary"
            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
@@ -70,8 +66,7 @@
      useCustomWorkingDirectory = "NO"
      buildConfiguration = "Release"
      debugDocumentVersioning = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
+      <BuildableProductRunnable>
         <BuildableReference
            BuildableIdentifier = "primary"
            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
@@ -22,41 +22,31 @@
 {
  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.
-   */
+  // Loading JavaScript code - uncomment the one you want.

-  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/TicTacToe/TicTacToeApp.bundle?platform=ios&dev=true"];
+  // 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, and make sure your computer and
+  // iOS device are on the same Wi-Fi network.
+  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/TicTacToe/TicTacToeApp.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/TicTacToe/TicTacToeApp.bundle?platform=ios' -o main.jsbundle
-   *
-   * then add the `main.jsbundle` file to your project and uncomment this line:
-   */
-
-//  jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+  // OPTION 2
+  // Load from pre-bundled file on disk. To re-generate the static bundle, run
+  //
+  // $ curl http://localhost:8081/Examples/TicTacToe/TicTacToeApp.includeRequire.runModule.bundle -o main.jsbundle
+  //
+  // and uncomment the next following line
+  // jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"TicTacToeApp"
-                                                initialProperties:nil
                                                   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];
@@ -7,7 +7,7 @@
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
-	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<string>com.facebook.$(PRODUCT_NAME:rfc1034identifier)</string>
 	<key>CFBundleInfoDictionaryVersion</key>
 	<string>6.0</string>
 	<key>CFBundleName</key>
@@ -36,11 +36,5 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<false/>
-	<key>NSAppTransportSecurity</key>
-  <dict>
-    <!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/-->
-    <key>NSAllowsArbitraryLoads</key>
-    <true/>
-  </dict>
 </dict>
 </plist>
@@ -17,6 +17,6 @@

 int main(int argc, char * argv[]) {
  @autoreleasepool {
-    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
+      return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
  }
 }
@@ -19,6 +19,7 @@
 var React = require('react-native');
 var {
  AppRegistry,
+  Image,
  StyleSheet,
  Text,
  TouchableHighlight,
@@ -89,6 +90,7 @@ class Board {
        }
      }
    }
+
    return this.winner() === null;
  }
 }
@@ -127,6 +129,17 @@ var Cell = React.createClass({
    }
  },

+  imageContents() {
+    switch (this.props.player) {
+      case 1:
+        return 'http://www.picgifs.com/alphabets/alphabets/children-5/alphabets-children-5-277623.gif';
+      case 2:
+        return 'http://www.picgifs.com/alphabets/alphabets/children-5/alphabets-children-5-730492.gif';
+      default:
+        return '';
+    }
+  },
+
  render() {
    return (
      <TouchableHighlight
@@ -134,9 +147,7 @@ var Cell = React.createClass({
        underlayColor="transparent"
        activeOpacity={0.5}>
        <View style={[styles.cell, this.cellStyle()]}>
-          <Text style={[styles.cellText, this.textStyle()]}>
-            {this.textContents()}
-          </Text>
+          <Image source={{uri: this.imageContents()}} />
        </View>
      </TouchableHighlight>
    );
@@ -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;
@@ -1,65 +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,
-  View,
-} = React;
-
-var AccessibilityIOSExample = React.createClass({
-  render() {
-    return (
-      <View>
-        <View
-          onAccessibilityTap={() => alert('onAccessibilityTap success')}
-          accessible={true}>
-          <Text>
-            Accessibility normal tap example
-          </Text>
-        </View>
-        <View onMagicTap={() => alert('onMagicTap success')}
-              accessible={true}>
-          <Text>
-            Accessibility magic tap example
-          </Text>
-        </View>
-        <View accessibilityLabel="Some announcement"
-              accessible={true}>
-          <Text>
-            Accessibility label example
-          </Text>
-        </View>
-        <View accessibilityTraits={['button', 'selected']}
-              accessible={true}>
-          <Text>
-            Accessibility traits example
-          </Text>
-        </View>
-      </View>
-    );
-  },
-});
-
-exports.title = 'AccessibilityIOS';
-exports.description = 'Interface to show iOS\' accessibility samples';
-exports.examples = [
-  {
-    title: 'Accessibility elements',
-    render(): ReactElement { return <AccessibilityIOSExample />; }
-  },
-];
@@ -17,17 +17,16 @@

 var React = require('react-native');
 var {
-  ActionSheetIOS,
  StyleSheet,
  Text,
  View,
 } = React;
-
+var ActionSheetIOS = require('ActionSheetIOS');
 var BUTTONS = [
-  'Option 0',
-  'Option 1',
-  'Option 2',
-  'Delete',
+  'Button Index: 0',
+  'Button Index: 1',
+  'Button Index: 2',
+  'Destruct',
  'Cancel',
 ];
 var DESTRUCTIVE_INDEX = 3;
@@ -47,7 +46,7 @@ var ActionSheetExample = React.createClass({
          Click to show the ActionSheet
        </Text>
        <Text>
-          Clicked button: {this.state.clicked}
+          Clicked button at index: "{this.state.clicked}"
        </Text>
      </View>
    );
@@ -65,40 +64,6 @@ var ActionSheetExample = React.createClass({
  }
 });

-var ActionSheetTintExample = React.createClass({
-  getInitialState() {
-    return {
-      clicked: 'none',
-    };
-  },
-
-  render() {
-    return (
-      <View>
-        <Text onPress={this.showActionSheet} style={style.button}>
-          Click to show the ActionSheet
-        </Text>
-        <Text>
-          Clicked button: {this.state.clicked}
-        </Text>
-      </View>
-    );
-  },
-
-  showActionSheet() {
-    ActionSheetIOS.showActionSheetWithOptions({
-      options: BUTTONS,
-      cancelButtonIndex: CANCEL_INDEX,
-      destructiveButtonIndex: DESTRUCTIVE_INDEX,
-      tintColor: 'green',
-    },
-    (buttonIndex) => {
-      this.setState({ clicked: BUTTONS[buttonIndex] });
-    });
-  }
-});
-
-
 var ShareActionSheetExample = React.createClass({
  getInitialState() {
    return {
@@ -122,11 +87,6 @@ var ShareActionSheetExample = React.createClass({
  showShareActionSheet() {
    ActionSheetIOS.showShareActionSheetWithOptions({
      url: 'https://code.facebook.com',
-      message: 'message to go with the shared url',
-      subject: 'a subject to go in the email heading',
-      excludedActivityTypes: [
-        'com.apple.UIKit.activity.PostToTwitter'
-      ]
    },
    (error) => {
      console.error(error);
@@ -138,7 +98,7 @@ var ShareActionSheetExample = React.createClass({
      } else {
        text = 'You didn\'t share';
      }
-      this.setState({text});
+      this.setState({text})
    });
  }
 });
@@ -157,10 +117,6 @@ exports.examples = [
    title: 'Show Action Sheet',
    render(): ReactElement { return <ActionSheetExample />; }
  },
-  {
-    title: 'Show Action Sheet with tinted buttons',
-    render(): ReactElement { return <ActionSheetTintExample />; }
-  },
  {
    title: 'Show Share Action Sheet',
    render(): ReactElement { return <ShareActionSheetExample />; }
@@ -57,7 +57,6 @@ var ToggleAnimatingActivityIndicator = React.createClass({
  }
 });

-exports.displayName = (undefined: ?string);
 exports.framework = 'React';
 exports.title = '<ActivityIndicatorIOS>';
 exports.description = 'Animated loading indicators.';
@@ -15,9 +15,10 @@
 */
 'use strict';

+var AdSupportIOS = require('AdSupportIOS');
+
 var React = require('react-native');
 var {
-  AdSupportIOS,
  StyleSheet,
  Text,
  View,
@@ -1,136 +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 {
-  Alert,
-  StyleSheet,
-  Text,
-  TouchableHighlight,
-  View,
-} = React;
-
-var UIExplorerBlock = require('./UIExplorerBlock');
-
-// corporate ipsum > lorem ipsum
-var alertMessage = 'Credibly reintermediate next-generation potentialities after goal-oriented ' +
-                   'catalysts for change. Dynamically revolutionize.';
-
-/**
- * Simple alert examples.
- */
-var SimpleAlertExampleBlock = React.createClass({
-
-  render: function() {
-    return (
-      <View>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => Alert.alert(
-            'Alert Title',
-            alertMessage,
-          )}>
-          <View style={styles.button}>
-            <Text>Alert with message and default button</Text>
-          </View>
-        </TouchableHighlight>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => Alert.alert(
-            'Alert Title',
-            alertMessage,
-            [
-              {text: 'OK', onPress: () => console.log('OK Pressed!')},
-            ]
-          )}>
-          <View style={styles.button}>
-            <Text>Alert with one button</Text>
-          </View>
-        </TouchableHighlight>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => Alert.alert(
-            'Alert Title',
-            alertMessage,
-            [
-              {text: 'Cancel', onPress: () => console.log('Cancel Pressed!')},
-              {text: 'OK', onPress: () => console.log('OK Pressed!')},
-            ]
-          )}>
-          <View style={styles.button}>
-            <Text>Alert with two buttons</Text>
-          </View>
-        </TouchableHighlight>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => Alert.alert(
-            'Alert Title',
-            null,
-            [
-              {text: 'Foo', onPress: () => console.log('Foo Pressed!')},
-              {text: 'Bar', onPress: () => console.log('Bar Pressed!')},
-              {text: 'Baz', onPress: () => console.log('Baz Pressed!')},
-            ]
-          )}>
-          <View style={styles.button}>
-            <Text>Alert with three buttons</Text>
-          </View>
-        </TouchableHighlight>
-        <TouchableHighlight style={styles.wrapper}
-          onPress={() => Alert.alert(
-            'Foo Title',
-            alertMessage,
-            '..............'.split('').map((dot, index) => ({
-              text: 'Button ' + index,
-              onPress: () => console.log('Pressed ' + index)
-            }))
-          )}>
-          <View style={styles.button}>
-            <Text>Alert with too many buttons</Text>
-          </View>
-        </TouchableHighlight>
-      </View>
-    );
-  },
-});
-
-var AlertExample = React.createClass({
-  statics: {
-    title: 'Alert',
-    description: 'Alerts display a concise and informative message ' +
-    'and prompt the user to make a decision.',
-  },
-  render: function() {
-    return (
-      <UIExplorerBlock title={'Alert'}>
-        <SimpleAlertExampleBlock />
-      </UIExplorerBlock>
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  wrapper: {
-    borderRadius: 5,
-    marginBottom: 5,
-  },
-  button: {
-    backgroundColor: '#eeeeee',
-    padding: 10,
-  },
-});
-
-module.exports = {
-  AlertExample,
-  SimpleAlertExampleBlock,
-};
@@ -24,144 +24,80 @@ var {
  AlertIOS,
 } = React;

-var { SimpleAlertExampleBlock } = require('./AlertExample');
-
 exports.framework = 'React';
 exports.title = 'AlertIOS';
 exports.description = 'iOS alerts and action sheets';
 exports.examples = [{
  title: 'Alerts',
-  render() {
-    return <SimpleAlertExampleBlock />;
-  }
-},
-{
-  title: 'Prompt Options',
-  render(): React.Component {
-    return <PromptOptions />;
-  }
-},
-{
-  title: 'Prompt Types',
  render() {
    return (
      <View>
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Plain Text Entry')}>
-
+        <TouchableHighlight style={styles.wrapper}
+          onPress={() => AlertIOS.alert(
+            'Foo Title',
+            'My Alert Msg'
+          )}>
          <View style={styles.button}>
-            <Text>
-              plain-text
-            </Text>
+            <Text>Alert with message and default button</Text>
          </View>
-
        </TouchableHighlight>
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Secure Text', null, null, 'secure-text')}>
-
+        <TouchableHighlight style={styles.wrapper}
+          onPress={() => AlertIOS.alert(
+            null,
+            null,
+            [
+              {text: 'Button', onPress: () => console.log('Button Pressed!')},
+            ]
+          )}>
          <View style={styles.button}>
-            <Text>
-              secure-text
-            </Text>
+            <Text>Alert with only one button</Text>
          </View>
-
        </TouchableHighlight>
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Login & Password', null, null, 'login-password')}>
-
+        <TouchableHighlight style={styles.wrapper}
+          onPress={() => AlertIOS.alert(
+            'Foo Title',
+            'My Alert Msg',
+            [
+              {text: 'Foo', onPress: () => console.log('Foo Pressed!')},
+              {text: 'Bar', onPress: () => console.log('Bar Pressed!')},
+            ]
+          )}>
          <View style={styles.button}>
-            <Text>
-              login-password
-            </Text>
+            <Text>Alert with two buttons</Text>
+          </View>
+        </TouchableHighlight>
+        <TouchableHighlight style={styles.wrapper}
+          onPress={() => AlertIOS.alert(
+            'Foo Title',
+            null,
+            [
+              {text: 'Foo', onPress: () => console.log('Foo Pressed!')},
+              {text: 'Bar', onPress: () => console.log('Bar Pressed!')},
+              {text: 'Baz', onPress: () => console.log('Baz Pressed!')},
+            ]
+          )}>
+          <View style={styles.button}>
+            <Text>Alert with 3 buttons</Text>
+          </View>
+        </TouchableHighlight>
+        <TouchableHighlight style={styles.wrapper}
+          onPress={() => AlertIOS.alert(
+            'Foo Title',
+            'My Alert Msg',
+            '..............'.split('').map((dot, index) => ({
+              text: 'Button ' + index,
+              onPress: () => console.log('Pressed ' + index)
+            }))
+          )}>
+          <View style={styles.button}>
+            <Text>Alert with too many buttons</Text>
          </View>
-
        </TouchableHighlight>
      </View>
    );
-  }
+  },
 }];

-class PromptOptions extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.saveResponse = this.saveResponse.bind(this);
-
-    this.customButtons = [{
-      text: 'Custom OK',
-      onPress: this.saveResponse
-    }, {
-      text: 'Custom Cancel',
-      style: 'cancel',
-    }];
-
-    this.state = {
-      promptValue: undefined,
-    };
-  }
-
-  render() {
-    return (
-      <View>
-        <Text style={{marginBottom: 10}}>
-          <Text style={{fontWeight: 'bold'}}>Prompt value:</Text> {this.state.promptValue}
-        </Text>
-
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Type a value', null, this.saveResponse)}>
-
-          <View style={styles.button}>
-            <Text>
-              prompt with title & callback
-            </Text>
-          </View>
-        </TouchableHighlight>
-
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Type a value', null, this.customButtons)}>
-
-          <View style={styles.button}>
-            <Text>
-              prompt with title & custom buttons
-            </Text>
-          </View>
-        </TouchableHighlight>
-
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Type a value', null, this.saveResponse, undefined, 'Default value')}>
-
-          <View style={styles.button}>
-            <Text>
-              prompt with title, callback & default value
-            </Text>
-          </View>
-        </TouchableHighlight>
-
-        <TouchableHighlight
-          style={styles.wrapper}
-          onPress={() => AlertIOS.prompt('Type a value', null, this.customButtons, 'login-password', 'admin@site.com')}>
-
-          <View style={styles.button}>
-            <Text>
-              prompt with title, custom buttons, login/password & default value
-            </Text>
-          </View>
-        </TouchableHighlight>
-      </View>
-    );
-  }
-
-  saveResponse(promptValue) {
-    this.setState({ promptValue: JSON.stringify(promptValue) });
-  }
-}
-
 var styles = StyleSheet.create({
  wrapper: {
    borderRadius: 5,
@@ -1,231 +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 {
-  Animated,
-  Easing,
-  StyleSheet,
-  Text,
-  View,
-} = React;
-var UIExplorerButton = require('./UIExplorerButton');
-
-exports.framework = 'React';
-exports.title = 'Animated - Examples';
-exports.description = 'Animated provides a powerful ' +
-  'and easy-to-use API for building modern, ' +
-  'interactive user experiences.';
-
-exports.examples = [
-  {
-    title: 'FadeInView',
-    description: 'Uses a simple timing animation to ' +
-      'bring opacity from 0 to 1 when the component ' +
-      'mounts.',
-    render: function() {
-      class FadeInView extends React.Component {
-        constructor(props) {
-          super(props);
-          this.state = {
-            fadeAnim: new Animated.Value(0), // opacity 0
-          };
-        }
-        componentDidMount() {
-          Animated.timing(       // Uses easing functions
-            this.state.fadeAnim, // The value to drive
-            {
-              toValue: 1,        // Target
-              duration: 2000,    // Configuration
-            },
-          ).start();             // Don't forget start!
-        }
-        render() {
-          return (
-            <Animated.View   // Special animatable View
-              style={{
-                opacity: this.state.fadeAnim,  // Binds
-              }}>
-              {this.props.children}
-            </Animated.View>
-          );
-        }
-      }
-      class FadeInExample extends React.Component {
-        constructor(props) {
-          super(props);
-          this.state = {
-            show: true,
-          };
-        }
-        render() {
-          return (
-            <View>
-              <UIExplorerButton onPress={() => {
-                  this.setState((state) => (
-                    {show: !state.show}
-                  ));
-                }}>
-                Press to {this.state.show ?
-                  'Hide' : 'Show'}
-              </UIExplorerButton>
-              {this.state.show && <FadeInView>
-                <View style={styles.content}>
-                  <Text>FadeInView</Text>
-                </View>
-              </FadeInView>}
-            </View>
-          );
-        }
-      }
-      return <FadeInExample />;
-    },
-  },
-  {
-    title: 'Transform Bounce',
-    description: 'One `Animated.Value` is driven by a ' +
-      'spring with custom constants and mapped to an ' +
-      'ordered set of transforms.  Each transform has ' +
-      'an interpolation to convert the value into the ' +
-      'right range and units.',
-    render: function() {
-      this.anim = this.anim || new Animated.Value(0);
-      return (
-        <View>
-          <UIExplorerButton onPress={() => {
-            Animated.spring(this.anim, {
-              toValue: 0,   // Returns to the start
-              velocity: 3,  // Velocity makes it move
-              tension: -10, // Slow
-              friction: 1,  // Oscillate a lot
-            }).start(); }}>
-            Press to Fling it!
-          </UIExplorerButton>
-          <Animated.View
-            style={[styles.content, {
-              transform: [   // Array order matters
-                {scale: this.anim.interpolate({
-                  inputRange: [0, 1],
-                  outputRange: [1, 4],
-                })},
-                {translateX: this.anim.interpolate({
-                  inputRange: [0, 1],
-                  outputRange: [0, 500],
-                })},
-                {rotate: this.anim.interpolate({
-                  inputRange: [0, 1],
-                  outputRange: [
-                    '0deg', '360deg' // 'deg' or 'rad'
-                  ],
-                })},
-              ]}
-            ]}>
-            <Text>Transforms!</Text>
-          </Animated.View>
-        </View>
-      );
-    },
-  },
-  {
-    title: 'Composite Animations with Easing',
-    description: 'Sequence, parallel, delay, and ' +
-      'stagger with different easing functions.',
-    render: function() {
-      this.anims = this.anims || [1,2,3].map(
-        () => new Animated.Value(0)
-      );
-      return (
-        <View>
-          <UIExplorerButton onPress={() => {
-            var timing = Animated.timing;
-            Animated.sequence([ // One after the other
-              timing(this.anims[0], {
-                toValue: 200,
-                easing: Easing.linear,
-              }),
-              Animated.delay(400), // Use with sequence
-              timing(this.anims[0], {
-                toValue: 0,
-                easing: Easing.elastic(2), // Springy
-              }),
-              Animated.delay(400),
-              Animated.stagger(200,
-                this.anims.map((anim) => timing(
-                  anim, {toValue: 200}
-                )).concat(
-                this.anims.map((anim) => timing(
-                  anim, {toValue: 0}
-                ))),
-              ),
-              Animated.delay(400),
-              Animated.parallel([
-                Easing.inOut(Easing.quad), // Symmetric
-                Easing.back(1.5),  // Goes backwards first
-                Easing.ease        // Default bezier
-              ].map((easing, ii) => (
-                timing(this.anims[ii], {
-                  toValue: 320, easing, duration: 3000,
-                })
-              ))),
-              Animated.delay(400),
-              Animated.stagger(200,
-                this.anims.map((anim) => timing(anim, {
-                  toValue: 0,
-                  easing: Easing.bounce, // Like a ball
-                  duration: 2000,
-                })),
-              ),
-            ]).start(); }}>
-            Press to Animate
-          </UIExplorerButton>
-          {['Composite', 'Easing', 'Animations!'].map(
-            (text, ii) => (
-              <Animated.View
-                key={text}
-                style={[styles.content, {
-                  left: this.anims[ii]
-                }]}>
-                <Text>{text}</Text>
-              </Animated.View>
-            )
-          )}
-        </View>
-      );
-    },
-  },
-  {
-    title: 'Continuous Interactions',
-    description: 'Gesture events, chaining, 2D ' +
-      'values, interrupting and transitioning ' +
-      'animations, etc.',
-    render: () => (
-      <Text>Checkout the Gratuitous Animation App!</Text>
-    ),
-  }
-];
-
-var styles = StyleSheet.create({
-  content: {
-    backgroundColor: 'deepskyblue',
-    borderWidth: 1,
-    borderColor: 'dodgerblue',
-    padding: 20,
-    margin: 20,
-    borderRadius: 10,
-    alignItems: 'center',
-  },
-});
@@ -1,321 +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 AnExApp
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Animated,
-  LayoutAnimation,
-  PanResponder,
-  StyleSheet,
-  View,
-} = React;
-
-var AnExSet = require('AnExSet');
-
-var CIRCLE_SIZE = 80;
-var CIRCLE_MARGIN = 18;
-var NUM_CIRCLES = 30;
-
-class Circle extends React.Component {
-  _onLongPress: () => void;
-  _toggleIsActive: () => void;
-  constructor(props: Object): void {
-    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)
-    };
-  }
-
-  _onLongPress(): void {
-    var config = {tension: 40, friction: 3};
-    this.state.pan.addListener((value) => {  // Async listener for state changes  (step1: uncomment)
-      this.props.onMove && this.props.onMove(value);
-    });
-    Animated.spring(this.state.pop, {
-      toValue: 1,                  //  Pop to larger size.                      (step2b: uncomment)
-      ...config,                   //  Reuse config for convenient consistency  (step2b: uncomment)
-    }).start();
-    this.setState({panResponder: PanResponder.create({
-      onPanResponderMove: Animated.event([
-        null,                                         // native event - ignore      (step1: uncomment)
-        {dx: this.state.pan.x, dy: this.state.pan.y}, // links pan to gestureState  (step1: uncomment)
-      ]),
-      onPanResponderRelease: (e, gestureState) => {
-        LayoutAnimation.easeInEaseOut();  // @flowfixme animates layout update as one batch (step3: uncomment)
-        Animated.spring(this.state.pop, {
-          toValue: 0,                     // Pop back to 0                       (step2c: uncomment)
-          ...config,
-        }).start();
-        this.setState({panResponder: undefined});
-        this.props.onMove && this.props.onMove({
-          x: gestureState.dx + this.props.restLayout.x,
-          y: gestureState.dy + this.props.restLayout.y,
-        });
-        this.props.onDeactivate();
-      },
-    })}, () => {
-      this.props.onActivate();
-    });
-  }
-
-  render(): ReactElement {
-    if (this.state.panResponder) {
-      var handlers = this.state.panResponder.panHandlers;
-      var dragStyle = {                 //  Used to position while dragging
-        position: 'absolute',           //  Hoist out of layout                    (step1: uncomment)
-        ...this.state.pan.getLayout(),  //  Convenience converter                  (step1: uncomment)
-      };
-    } else {
-      handlers = {
-        onStartShouldSetResponder: () => !this.state.isActive,
-        onResponderGrant: () => {
-          this.state.pan.setValue({x: 0, y: 0});           // reset                (step1: uncomment)
-          this.state.pan.setOffset(this.props.restLayout); // offset from onLayout (step1: uncomment)
-          this.longTimer = setTimeout(this._onLongPress, 300);
-        },
-        onResponderRelease: () => {
-          if (!this.state.panResponder) {
-            clearTimeout(this.longTimer);
-            this._toggleIsActive();
-          }
-        }
-      };
-    }
-    var animatedStyle: Object = {
-      shadowOpacity: this.state.pop,    // no need for interpolation            (step2d: uncomment)
-      transform: [
-        {scale: this.state.pop.interpolate({
-          inputRange: [0, 1],
-          outputRange: [1, 1.3]         // scale up from 1 to 1.3               (step2d: uncomment)
-        })},
-      ],
-    };
-    var openVal = this.props.openVal;
-    if (this.props.dummy) {
-      animatedStyle.opacity = 0;
-    } else if (this.state.isActive) {
-      var innerOpenStyle = [styles.open, {                                 // (step4: uncomment)
-        left: openVal.interpolate({inputRange: [0, 1], outputRange: [this.props.restLayout.x, 0]}),
-        top: openVal.interpolate({inputRange: [0, 1], outputRange: [this.props.restLayout.y, 0]}),
-        width: openVal.interpolate({inputRange: [0, 1], outputRange: [CIRCLE_SIZE, this.props.containerLayout.width]}),
-        height: openVal.interpolate({inputRange: [0, 1], outputRange: [CIRCLE_SIZE, this.props.containerLayout.height]}),
-        margin: openVal.interpolate({inputRange: [0, 1], outputRange: [CIRCLE_MARGIN, 0]}),
-        borderRadius: openVal.interpolate({inputRange: [-0.15, 0, 0.5, 1], outputRange: [0, CIRCLE_SIZE / 2, CIRCLE_SIZE * 1.3, 0]}),
-      }];
-    }
-    return (
-      <Animated.View
-        onLayout={this.props.onLayout}
-        style={[styles.dragView, dragStyle, animatedStyle, this.state.isActive ? styles.open : null]}
-        {...handlers}>
-        <Animated.View style={[styles.circle, innerOpenStyle]}>
-          <AnExSet
-            containerLayout={this.props.containerLayout}
-            id={this.props.id}
-            isActive={this.state.isActive}
-            openVal={this.props.openVal}
-            onDismiss={this._toggleIsActive}
-          />
-        </Animated.View>
-      </Animated.View>
-    );
-  }
-  _toggleIsActive(velocity) {
-    var config = {tension: 30, friction: 7};
-    if (this.state.isActive) {
-      Animated.spring(this.props.openVal, {toValue: 0, ...config}).start(() => { // (step4: uncomment)
-        this.setState({isActive: false}, this.props.onDeactivate);
-      });                                                                        // (step4: uncomment)
-    } else {
-      this.props.onActivate();
-      this.setState({isActive: true, panResponder: undefined}, () => {
-        // this.props.openVal.setValue(1);                                             // (step4: comment)
-        Animated.spring(this.props.openVal, {toValue: 1, ...config}).start();    // (step4: uncomment)
-      });
-    }
-  }
-}
-
-class AnExApp extends React.Component {
-  _onMove: (position: Point) => void;
-  constructor(props: any): void {
-    super(props);
-    var keys = [];
-    for (var idx = 0; idx < NUM_CIRCLES; idx++) {
-      keys.push('E' + idx);
-    }
-    this.state = {
-      keys,
-      restLayouts: [],
-      openVal: new Animated.Value(0),
-    };
-    this._onMove = this._onMove.bind(this);
-  }
-
-  render(): ReactElement {
-    var circles = this.state.keys.map((key, idx) => {
-      if (key === this.state.activeKey) {
-        return <Circle key={key + 'd'} dummy={true} />;
-      } else {
-        if (!this.state.restLayouts[idx]) {
-          var onLayout = function(index, e) {
-            var layout = e.nativeEvent.layout;
-            this.setState((state) => {
-              state.restLayouts[index] = layout;
-              return state;
-            });
-          }.bind(this, idx);
-        }
-        return (
-          <Circle
-            key={key}
-            id={key}
-            openVal={this.state.openVal}
-            onLayout={onLayout}
-            restLayout={this.state.restLayouts[idx]}
-            onActivate={this.setState.bind(this, {
-              activeKey: key,
-              activeInitialLayout: this.state.restLayouts[idx],
-            })}
-          />
-        );
-      }
-    });
-    if (this.state.activeKey) {
-      circles.push(
-        <Animated.View key="dark" style={[styles.darkening, {opacity: this.state.openVal}]} />
-      );
-      circles.push(
-        <Circle
-          openVal={this.state.openVal}
-          key={this.state.activeKey}
-          id={this.state.activeKey}
-          restLayout={this.state.activeInitialLayout}
-          containerLayout={this.state.layout}
-          onMove={this._onMove}
-          onDeactivate={() => { this.setState({activeKey: undefined}); }}
-        />
-      );
-    }
-    return (
-      <View style={styles.container}>
-        <View style={styles.grid} onLayout={(e) => this.setState({layout: e.nativeEvent.layout})}>
-          {circles}
-        </View>
-      </View>
-    );
-  }
-
-  _onMove(position: Point): void {
-    var newKeys = moveToClosest(this.state, position);
-    if (newKeys !== this.state.keys) {
-      LayoutAnimation.easeInEaseOut();  // animates layout update as one batch (step3: uncomment)
-      this.setState({keys: newKeys});
-    }
-  }
-}
-
-type Point = {x: number, y: number};
-function distance(p1: Point, p2: Point): number {
-  var dx = p1.x - p2.x;
-  var dy = p1.y - p2.y;
-  return dx * dx + dy * dy;
-}
-
-function moveToClosest({activeKey, keys, restLayouts}, position) {
-  var activeIdx = -1;
-  var closestIdx = activeIdx;
-  var minDist = Infinity;
-  var newKeys = [];
-  keys.forEach((key, idx) => {
-    var dist = distance(position, restLayouts[idx]);
-    if (key === activeKey) {
-      idx = activeIdx;
-    } else {
-      newKeys.push(key);
-    }
-    if (dist < minDist) {
-      minDist = dist;
-      closestIdx = idx;
-    }
-  });
-  if (closestIdx === activeIdx) {
-    return keys; // nothing changed
-  } else {
-    newKeys.splice(closestIdx, 0, activeKey);
-    return newKeys;
-  }
-}
-
-AnExApp.title = 'Animated - Gratuitous App';
-AnExApp.description = 'Bunch of Animations - tap a circle to ' +
-  'open a view with more animations, or longPress and drag to reorder circles.';
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    paddingTop: 64, // push content below nav bar
-  },
-  grid: {
-    flex: 1,
-    justifyContent: 'center',
-    flexDirection: 'row',
-    flexWrap: 'wrap',
-    backgroundColor: 'transparent',
-  },
-  circle: {
-    width: CIRCLE_SIZE,
-    height: CIRCLE_SIZE,
-    borderRadius: CIRCLE_SIZE / 2,
-    borderWidth: 1,
-    borderColor: 'black',
-    margin: CIRCLE_MARGIN,
-    overflow: 'hidden',
-  },
-  dragView: {
-    shadowRadius: 10,
-    shadowColor: 'rgba(0,0,0,0.7)',
-    shadowOffset: {height: 8},
-    alignSelf: 'flex-start',
-    backgroundColor: 'transparent',
-  },
-  open: {
-    position: 'absolute',
-    left: 0,
-    top: 0,
-    right: 0,
-    bottom: 0,
-    width: undefined, // unset value from styles.circle
-    height: undefined, // unset value from styles.circle
-    borderRadius: 0, // unset value from styles.circle
-  },
-  darkening: {
-    backgroundColor: 'black',
-    position: 'absolute',
-    left: 0,
-    top: 0,
-    right: 0,
-    bottom: 0,
-  },
-});
-
-module.exports = AnExApp;
@@ -1,163 +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 AnExBobble
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Animated,
-  Image,
-  PanResponder,
-  StyleSheet,
-  View,
-} = React;
-
-var NUM_BOBBLES = 5;
-var RAD_EACH = Math.PI / 2 / (NUM_BOBBLES - 2);
-var RADIUS = 160;
-var BOBBLE_SPOTS = [...Array(NUM_BOBBLES)].map((_, i) => {  // static positions
-  return i === 0 ? {x: 0, y: 0} : {                         // first bobble is the selector
-    x: -Math.cos(RAD_EACH * (i - 1)) * RADIUS,
-    y: -Math.sin(RAD_EACH * (i - 1)) * RADIUS,
-  };
-});
-
-class AnExBobble extends React.Component {
-  constructor(props: Object) {
-    super(props);
-    this.state = {};
-    this.state.bobbles = BOBBLE_SPOTS.map((_, i) => {
-      return new Animated.ValueXY();
-    });
-    this.state.selectedBobble = null;
-    var bobblePanListener = (e, gestureState) => {     // async events => change selection
-      var newSelected = computeNewSelected(gestureState);
-      if (this.state.selectedBobble !== newSelected) {
-        if (this.state.selectedBobble !== null) {
-          var restSpot = BOBBLE_SPOTS[this.state.selectedBobble];
-          Animated.spring(this.state.bobbles[this.state.selectedBobble], {
-            toValue: restSpot,       // return previously selected bobble to rest position
-          }).start();
-        }
-        if (newSelected !== null && newSelected !== 0) {
-          Animated.spring(this.state.bobbles[newSelected], {
-            toValue: this.state.bobbles[0],    // newly selected should track the selector
-          }).start();
-        }
-        this.state.selectedBobble = newSelected;
-      }
-    };
-    var releaseBobble = () => {
-      this.state.bobbles.forEach((bobble, i) => {
-        Animated.spring(bobble, {
-          toValue: {x: 0, y: 0}           // all bobbles return to zero
-        }).start();
-      });
-    };
-    this.state.bobbleResponder = PanResponder.create({
-      onStartShouldSetPanResponder: () => true,
-      onPanResponderGrant: () => {
-        BOBBLE_SPOTS.forEach((spot, idx) => {
-          Animated.spring(this.state.bobbles[idx], {
-            toValue: spot,                // spring each bobble to its spot
-            friction: 3,                  // less friction => bouncier
-          }).start();
-        });
-      },
-      onPanResponderMove: Animated.event(
-        [ null, {dx: this.state.bobbles[0].x, dy: this.state.bobbles[0].y} ],
-        {listener: bobblePanListener}     // async state changes with arbitrary logic
-      ),
-      onPanResponderRelease: releaseBobble,
-      onPanResponderTerminate: releaseBobble,
-    });
-  }
-
-  render(): ReactElement {
-    return (
-      <View style={styles.bobbleContainer}>
-        {this.state.bobbles.map((_, i) => {
-          var j = this.state.bobbles.length - i - 1; // reverse so lead on top
-          var handlers = j > 0 ? {} : this.state.bobbleResponder.panHandlers;
-          return (
-            <Animated.Image
-              {...handlers}
-              key={i}
-              source={{uri: BOBBLE_IMGS[j]}}
-              style={[styles.circle, {
-                backgroundColor: randColor(),                             // re-renders are obvious
-                transform: this.state.bobbles[j].getTranslateTransform(), // simple conversion
-              }]}
-            />
-          );
-        })}
-      </View>
-    );
-  }
-}
-
-var styles = StyleSheet.create({
-  circle: {
-    position: 'absolute',
-    height: 60,
-    width: 60,
-    borderRadius: 30,
-    borderWidth: 0.5,
-  },
-  bobbleContainer: {
-    top: -68,
-    paddingRight: 66,
-    flexDirection: 'row',
-    flex: 1,
-    justifyContent: 'flex-end',
-    backgroundColor: 'transparent',
-  },
-});
-
-function computeNewSelected(
-  gestureState: Object,
-): ?number {
-  var {dx, dy} = gestureState;
-  var minDist = Infinity;
-  var newSelected = null;
-  var pointRadius = Math.sqrt(dx * dx + dy * dy);
-  if (Math.abs(RADIUS - pointRadius) < 80) {
-    BOBBLE_SPOTS.forEach((spot, idx) => {
-      var delta = {x: spot.x - dx, y: spot.y - dy};
-      var dist = delta.x * delta.x + delta.y * delta.y;
-      if (dist < minDist) {
-        minDist = dist;
-        newSelected = idx;
-      }
-    });
-  }
-  return newSelected;
-}
-
-function randColor(): string {
-  var colors = [0,1,2].map(() => Math.floor(Math.random() * 150 + 100));
-  return 'rgb(' + colors.join(',') + ')';
-}
-
-var BOBBLE_IMGS = [
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xpf1/t39.1997-6/10173489_272703316237267_1025826781_n.png',
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/l/t39.1997-6/p240x240/851578_631487400212668_2087073502_n.png',
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/p240x240/851583_654446917903722_178118452_n.png',
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/p240x240/851565_641023175913294_875343096_n.png',
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/851562_575284782557566_1188781517_n.png',
-];
-
-module.exports = AnExBobble;
@@ -1,115 +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 AnExChained
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Animated,
-  Image,
-  PanResponder,
-  StyleSheet,
-  View,
-} = React;
-
-class AnExChained extends React.Component {
-  constructor(props: Object) {
-    super(props);
-    this.state = {
-      stickers: [new Animated.ValueXY()],                    // 1 leader
-    };
-    var stickerConfig = {tension: 2, friction: 3};           // soft spring
-    for (var i = 0; i < 4; i++) {                            // 4 followers
-      var sticker = new Animated.ValueXY();
-      Animated.spring(sticker, {
-        ...stickerConfig,
-        toValue: this.state.stickers[i],               // Animated toValue's are tracked
-      }).start();
-      this.state.stickers.push(sticker);               // push on the followers
-    }
-    var releaseChain = (e, gestureState) => {
-      this.state.stickers[0].flattenOffset();          // merges offset into value and resets
-      Animated.sequence([                              // spring to start after decay finishes
-        Animated.decay(this.state.stickers[0], {       // coast to a stop
-          velocity: {x: gestureState.vx, y: gestureState.vy},
-          deceleration: 0.997,
-        }),
-        Animated.spring(this.state.stickers[0], {
-          toValue: {x: 0, y: 0}                        // return to start
-        }),
-      ]).start();
-    };
-    this.state.chainResponder = PanResponder.create({
-      onStartShouldSetPanResponder: () => true,
-      onPanResponderGrant: () => {
-        this.state.stickers[0].stopAnimation((value) => {
-          this.state.stickers[0].setOffset(value);           // start where sticker animated to
-          this.state.stickers[0].setValue({x: 0, y: 0});     // avoid flicker before next event
-        });
-      },
-      onPanResponderMove: Animated.event(
-        [null, {dx: this.state.stickers[0].x, dy: this.state.stickers[0].y}] // map gesture to leader
-      ),
-      onPanResponderRelease: releaseChain,
-      onPanResponderTerminate: releaseChain,
-    });
-  }
-
-  render() {
-    return (
-      <View style={styles.chained}>
-        {this.state.stickers.map((_, i) => {
-          var j = this.state.stickers.length - i - 1; // reverse so leader is on top
-          var handlers = (j === 0) ? this.state.chainResponder.panHandlers : {};
-          return (
-            <Animated.Image
-              {...handlers}
-              key={i}
-              source={{uri: CHAIN_IMGS[j]}}
-              style={[styles.sticker, {
-                transform: this.state.stickers[j].getTranslateTransform(), // simple conversion
-              }]}
-            />
-          );
-        })}
-      </View>
-    );
-  }
-}
-
-var styles = StyleSheet.create({
-  chained: {
-    alignSelf: 'flex-end',
-    top: -160,
-    right: 126
-  },
-  sticker: {
-    position: 'absolute',
-    height: 120,
-    width: 120,
-    backgroundColor: 'transparent',
-  },
-});
-
-var CHAIN_IMGS = [
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xpf1/t39.1997-6/p160x160/10574705_1529175770666007_724328156_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/p160x160/851575_392309884199657_1917957497_n.png',
-  'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/p160x160/851567_555288911225630_1628791128_n.png',
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xfa1/t39.1997-6/p160x160/851583_531111513625557_903469595_n.png',
-  'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xpa1/t39.1997-6/p160x160/851577_510515972354399_2147096990_n.png',
-];
-
-module.exports = AnExChained;
@@ -1,115 +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 AnExScroll
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Animated,
-  Image,
-  ScrollView,
-  StyleSheet,
-  Text,
-  View,
-} = React;
-
-class AnExScroll extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      scrollX: new Animated.Value(0),
-    };
-  }
-
-  render() {
-    var width = this.props.panelWidth;
-    return (
-      <View style={styles.container}>
-        <ScrollView
-          automaticallyAdjustContentInsets={false}
-          scrollEventThrottle={16 /* get all events */ }
-          onScroll={Animated.event(
-            [{nativeEvent: {contentOffset: {x: this.state.scrollX}}}]  // nested event mapping
-          )}
-          contentContainerStyle={{flex: 1, padding: 10}}
-          pagingEnabled={true}
-          horizontal={true}>
-          <View style={[styles.page, {width}]}>
-            <Image
-              style={{width: 180, height: 180}}
-              source={HAWK_PIC}
-            />
-            <Text style={styles.text}>
-              {'I\'ll find something to put here.'}
-            </Text>
-          </View>
-          <View style={[styles.page, {width}]}>
-            <Text style={styles.text}>{'And here.'}</Text>
-          </View>
-          <View style={[styles.page, {width}]}>
-            <Text>{'But not here.'}</Text>
-          </View>
-        </ScrollView>
-        <Animated.Image
-          pointerEvents="none"
-          style={[styles.bunny, {transform: [
-            {translateX: this.state.scrollX.interpolate({
-              inputRange: [0, width, 2 * width],
-              outputRange: [0, 0, width / 3]}),          //  multi-part ranges
-              extrapolate: 'clamp'},                     //  default is 'extend'
-            {translateY: this.state.scrollX.interpolate({
-              inputRange: [0, width, 2 * width],
-              outputRange: [0, -200, -260]}),
-              extrapolate: 'clamp'},
-            {scale: this.state.scrollX.interpolate({
-              inputRange: [0, width, 2 * width],
-              outputRange: [0.5, 0.5, 2]}),
-              extrapolate: 'clamp'},
-          ]}]}
-          source={BUNNY_PIC}
-        />
-      </View>
-    );
-  }
-}
-
-var styles = StyleSheet.create({
-  container: {
-    backgroundColor: 'transparent',
-    flex: 1,
-  },
-  text: {
-    padding: 4,
-    paddingBottom: 10,
-    fontWeight: 'bold',
-    fontSize: 18,
-    backgroundColor: 'transparent',
-  },
-  bunny: {
-    backgroundColor: 'transparent',
-    position: 'absolute',
-    height: 160,
-    width: 160,
-  },
-  page: {
-    alignItems: 'center',
-    justifyContent: 'flex-end',
-  },
-});
-
-var HAWK_PIC = {uri: 'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xfa1/t39.1997-6/10734304_1562225620659674_837511701_n.png'};
-var BUNNY_PIC = {uri: 'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/851564_531111380292237_1898871086_n.png'};
-
-module.exports = AnExScroll;
@@ -1,150 +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 AnExSet
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Animated,
-  PanResponder,
-  StyleSheet,
-  Text,
-  View,
-} = React;
-
-var AnExBobble = require('./AnExBobble');
-var AnExChained = require('./AnExChained');
-var AnExScroll = require('./AnExScroll');
-var AnExTilt = require('./AnExTilt');
-
-class AnExSet extends React.Component {
-  constructor(props: Object) {
-    super(props);
-    function randColor() {
-      var colors = [0,1,2].map(() => Math.floor(Math.random() * 150 + 100));
-      return 'rgb(' + colors.join(',') + ')';
-    }
-    this.state = {
-      closeColor: randColor(),
-      openColor: randColor(),
-    };
-  }
-  render(): ReactElement {
-    var backgroundColor = this.props.openVal ?
-      this.props.openVal.interpolate({
-        inputRange: [0, 1],
-        outputRange: [
-          this.state.closeColor,  // interpolates color strings
-          this.state.openColor
-        ],
-      }) :
-      this.state.closeColor;
-    var panelWidth = this.props.containerLayout && this.props.containerLayout.width || 320;
-    return (
-      <View style={styles.container}>
-        <Animated.View
-          style={[styles.header, { backgroundColor }]}
-          {...this.state.dismissResponder.panHandlers}>
-          <Text style={[styles.text, styles.headerText]}>
-            {this.props.id}
-          </Text>
-        </Animated.View>
-        {this.props.isActive &&
-          <View style={styles.stream}>
-            <View style={styles.card}>
-              <Text style={styles.text}>
-                July 2nd
-              </Text>
-              <AnExTilt isActive={this.props.isActive} />
-              <AnExBobble />
-            </View>
-            <AnExScroll panelWidth={panelWidth}/>
-            <AnExChained />
-          </View>
-        }
-      </View>
-    );
-  }
-
-  componentWillMount() {
-    this.state.dismissY = new Animated.Value(0);
-    this.state.dismissResponder = PanResponder.create({
-      onStartShouldSetPanResponder: () => this.props.isActive,
-      onPanResponderGrant: () => {
-        Animated.spring(this.props.openVal, {          // Animated value passed in.
-          toValue: this.state.dismissY.interpolate({   // Track dismiss gesture
-            inputRange: [0, 300],                      // and interpolate pixel distance
-            outputRange: [1, 0],                       // to a fraction.
-          })
-        }).start();
-      },
-      onPanResponderMove: Animated.event(
-        [null, {dy: this.state.dismissY}]              // track pan gesture
-      ),
-      onPanResponderRelease: (e, gestureState) => {
-        if (gestureState.dy > 100) {
-          this.props.onDismiss(gestureState.vy);  // delegates dismiss action to parent
-        } else {
-          Animated.spring(this.props.openVal, {
-            toValue: 1,                           // animate back open if released early
-          }).start();
-        }
-      },
-    });
-  }
-}
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-  header: {
-    alignItems: 'center',
-    paddingTop: 18,
-    height: 90,
-  },
-  stream: {
-    flex: 1,
-    backgroundColor: 'rgb(230, 230, 230)',
-  },
-  card: {
-    margin: 8,
-    padding: 8,
-    borderRadius: 6,
-    backgroundColor: 'white',
-    shadowRadius: 2,
-    shadowColor: 'black',
-    shadowOpacity: 0.2,
-    shadowOffset: {height: 0.5},
-  },
-  text: {
-    padding: 4,
-    paddingBottom: 10,
-    fontWeight: 'bold',
-    fontSize: 18,
-    backgroundColor: 'transparent',
-  },
-  headerText: {
-    fontSize: 25,
-    color: 'white',
-    shadowRadius: 3,
-    shadowColor: 'black',
-    shadowOpacity: 1,
-    shadowOffset: {height: 1},
-  },
-});
-
-module.exports = AnExSet;
@@ -1,107 +0,0 @@
-<br /><br />
-# React Native: Animated
-
-ReactEurope 2015, Paris - Spencer Ahrens - Facebook
-
-<br /><br />
-
-## Fluid Interactions
-
- People expect smooth, delightful experiences
- Complex interactions are hard
- Common patterns can be optimized
-
-<br /><br />
-
-
-## Declarative Interactions
-
- Wire up inputs (events) to outputs (props) + transforms (springs, easing, etc.)
- Arbitrary code can define/update this config
- Config can be serialized -> native/main thread
- No refs or lifecycle to worry about
-
-<br /><br />
-
-
-## var { Animated } = require('react-native');
-
- New library soon to be released for React Native
- 100% JS implementation -> X-Platform
- Per-platform native optimizations planned
- This talk -> usage examples, not implementation
-
-<br /><br />
-
-
-## Gratuitous Animation Demo App
-
- Layout uses `flexWrap: 'wrap'`
- longPress -> drag to reorder
- Tap to open example sets
-
-<br /><br />
-
-## Gratuitous Animation Codez
-
- Step 1: 2D tracking pan gesture
- Step 2: Simple pop-out spring on select
- Step 3: Animate grid reordering with `LayoutAnimation`
- Step 4: Opening animation
-
-<br /><br />
-
-## Animation Example Set
-
- `Animated.Value` `this.props.open` passed in from parent
- `interpolate` works with string "shapes," e.g. `'rgb(0, 0, 255)'`, `'45deg'`
- Examples easily composed as separate components
- Dismissing tracks interpolated gesture
- Custom release logic
-
-<br /><br />
-
-
-## Tilting Photo
-
- Pan -> translateX * 2, rotate, opacity (via tracking)
- Gesture release triggers separate animations
- `addListener` for async, arbitrary logic on animation progress
- `interpolate` easily creates parallax and other effects
-
-<br /><br />
-
-## Bobbles
-
- Static positions defined
- Listens to events to maybe change selection
- - Springs previous selection back
- - New selection tracks selector
- `getTranslateTransform` adds convenience
-
-<br /><br />
-
-## Chained
-
- Classic "Chat Heads" animation
- Each sticker tracks the one before it with a soft spring
- `decay` maintains gesture velocity, followed by `spring` to home
- `stopAnimation` provides the last value for `setOffset`
-
-<br /><br />
-
-## Scrolling
-
- `Animated.event` can track all sorts of stuff
- Multi-part ranges and extrapolation options
- Transforms decompose into ordered components
-
-<br /><br />
-
-# React Native: Animated
-
- Landing soon in master (days)
- GitHub: @vjeux, @sahrens
- Questions?
-
-<br />
@@ -1,139 +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 AnExTilt
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  Animated,
-  Image,
-  PanResponder,
-  StyleSheet,
-  View,
-} = React;
-
-class AnExTilt extends React.Component {
-  constructor(props: Object) {
-    super(props);
-    this.state = {
-      panX: new Animated.Value(0),
-      opacity: new Animated.Value(1),
-      burns: new Animated.Value(1.15),
-    };
-    this.state.tiltPanResponder = PanResponder.create({
-      onStartShouldSetPanResponder: () => true,
-      onPanResponderGrant: () => {
-        Animated.timing(this.state.opacity, {
-          toValue: this.state.panX.interpolate({
-            inputRange: [-300, 0, 300],            // pan is in pixels
-            outputRange: [0, 1, 0],                // goes to zero at both edges
-          }),
-          duration: 0,                             // direct tracking
-        }).start();
-      },
-      onPanResponderMove: Animated.event(
-        [null, {dx: this.state.panX}]              // panX is linked to the gesture
-      ),
-      onPanResponderRelease: (e, gestureState) => {
-        var toValue = 0;
-        if (gestureState.dx > 100) {
-          toValue = 500;
-        } else if (gestureState.dx < -100) {
-          toValue = -500;
-        }
-        Animated.spring(this.state.panX, {
-          toValue,                         // animate back to center or off screen
-          velocity: gestureState.vx,       // maintain gesture velocity
-          tension: 10,
-          friction: 3,
-        }).start();
-        this.state.panX.removeAllListeners();
-        var id = this.state.panX.addListener(({value}) => { // listen until offscreen
-          if (Math.abs(value) > 400) {
-            this.state.panX.removeListener(id);             // offscreen, so stop listening
-            Animated.timing(this.state.opacity, {
-              toValue: 1,   // Fade back in.  This unlinks it from tracking this.state.panX
-            }).start();
-            this.state.panX.setValue(0);                    // Note: stops the spring animation
-            toValue !== 0 && this._startBurnsZoom();
-          }
-        });
-      },
-    });
-  }
-
-  _startBurnsZoom() {
-    this.state.burns.setValue(1);     // reset to beginning
-    Animated.decay(this.state.burns, {
-      velocity: 1,                    // sublte zoom
-      deceleration: 0.9999,           // slow decay
-    }).start();
-  }
-
-  componentWillMount() {
-    this._startBurnsZoom();
-  }
-
-  render(): ReactElement {
-    return (
-      <Animated.View
-        {...this.state.tiltPanResponder.panHandlers}
-        style={[styles.tilt, {
-          opacity: this.state.opacity,
-          transform: [
-            {rotate: this.state.panX.interpolate({
-              inputRange: [-320, 320],
-              outputRange: ['-15deg', '15deg']})},  // interpolate string "shapes"
-            {translateX: this.state.panX},
-          ],
-        }]}>
-        <Animated.Image
-          pointerEvents="none"
-          style={{
-            flex: 1,
-            transform: [
-              {translateX: this.state.panX.interpolate({
-                inputRange: [-3, 3],     // small range is extended by default
-                outputRange: [2, -2]})   // parallax
-              },
-              {scale: this.state.burns.interpolate({
-                inputRange: [1, 3000],
-                outputRange: [1, 1.25]}) // simple multiplier
-              },
-            ],
-          }}
-          source={NATURE_IMAGE}
-        />
-      </Animated.View>
-    );
-  }
-}
-
-var styles = StyleSheet.create({
-  tilt: {
-    overflow: 'hidden',
-    height: 200,
-    marginBottom: 4,
-    backgroundColor: 'rgb(130, 130, 255)',
-    borderColor: 'rgba(0, 0, 0, 0.2)',
-    borderWidth: 1,
-    borderRadius: 20,
-  },
-});
-
-var NATURE_IMAGE = {uri: 'http://www.deshow.net/d/file/travel/2009-04/scenic-beauty-of-nature-photography-2-504-4.jpg'};
-
-module.exports = AnExTilt;
@@ -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.
- *
- * @providesModule AppStateExample
- * @flow
- */
-'use strict';
-
-var React = require('react-native');
-var {
-  AppState,
-  Text,
-  View
-} = React;
-
-var AppStateSubscription = React.createClass({
-  getInitialState() {
-    return {
-      appState: AppState.currentState,
-      previousAppStates: [],
-    };
-  },
-  componentDidMount: function() {
-    AppState.addEventListener('change', this._handleAppStateChange);
-  },
-  componentWillUnmount: function() {
-    AppState.removeEventListener('change', this._handleAppStateChange);
-  },
-  _handleAppStateChange: function(appState) {
-    var previousAppStates = this.state.previousAppStates.slice();
-    previousAppStates.push(this.state.appState);
-    this.setState({
-      appState,
-      previousAppStates,
-    });
-  },
-  render() {
-    if (this.props.showCurrentOnly) {
-      return (
-        <View>
-          <Text>{this.state.appState}</Text>
-        </View>
-      );
-    }
-    return (
-      <View>
-        <Text>{JSON.stringify(this.state.previousAppStates)}</Text>
-      </View>
-    );
-  }
-});
-
-exports.title = 'AppState';
-exports.description = 'app background status';
-exports.examples = [
-  {
-    title: 'AppState.currentState',
-    description: 'Can be null on app initialization',
-    render() { return <Text>{AppState.currentState}</Text>; }
-  },
-  {
-    title: 'Subscribed AppState:',
-    description: 'This changes according to the current state, so you can only ever see it rendered as "active"',
-    render(): ReactElement { return <AppStateSubscription showCurrentOnly={true} />; }
-  },
-  {
-    title: 'Previous states:',
-    render(): ReactElement { return <AppStateSubscription showCurrentOnly={false} />; }
-  },
-];
@@ -28,19 +28,13 @@ var AppStateSubscription = React.createClass({
    return {
      appState: AppStateIOS.currentState,
      previousAppStates: [],
-      memoryWarnings: 0,
    };
  },
  componentDidMount: function() {
    AppStateIOS.addEventListener('change', this._handleAppStateChange);
-    AppStateIOS.addEventListener('memoryWarning', this._handleMemoryWarning);
  },
  componentWillUnmount: function() {
    AppStateIOS.removeEventListener('change', this._handleAppStateChange);
-    AppStateIOS.removeEventListener('memoryWarning', this._handleMemoryWarning);
-  },
-  _handleMemoryWarning: function() {
-    this.setState({memoryWarnings: this.state.memoryWarnings + 1});
  },
  _handleAppStateChange: function(appState) {
    var previousAppStates = this.state.previousAppStates.slice();
@@ -51,13 +45,6 @@ var AppStateSubscription = React.createClass({
    });
  },
  render() {
-    if (this.props.showMemoryWarnings) {
-      return (
-        <View>
-          <Text>{this.state.memoryWarnings}</Text>
-        </View>
-      );
-    }
    if (this.props.showCurrentOnly) {
      return (
        <View>
@@ -90,9 +77,4 @@ exports.examples = [
    title: 'Previous states:',
    render(): ReactElement { return <AppStateSubscription showCurrentOnly={false} />; }
  },
-  {
-    title: 'Memory Warnings',
-    description: 'In the simulator, hit Shift+Command+M to simulate a memory warning.',
-    render(): ReactElement { return <AppStateSubscription showMemoryWarnings={true} />; }
-  },
 ];
@@ -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;
@@ -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],
@@ -80,28 +75,24 @@ var BasicStorageExample = React.createClass({
        </Text>
        <Text>{' '}</Text>
        <Text>Messages:</Text>
-        {this.state.messages.map((m) => <Text key={m}>{m}</Text>)}
+        {this.state.messages.map((m) => <Text>{m}</Text>)}
      </View>
    );
  },

-  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) {
@@ -57,51 +57,10 @@ var styles = StyleSheet.create({
    borderLeftWidth: 40,
    borderLeftColor: 'blue',
  },
-  border5: {
-    borderRadius: 50,
-    borderTopWidth: 10,
-    borderTopColor: 'red',
-    borderRightWidth: 20,
-    borderRightColor: 'yellow',
-    borderBottomWidth: 30,
-    borderBottomColor: 'green',
-    borderLeftWidth: 40,
-    borderLeftColor: 'blue',
-  },
-  border6: {
-    borderTopWidth: 10,
-    borderTopColor: 'red',
-    borderRightWidth: 20,
-    borderRightColor: 'yellow',
-    borderBottomWidth: 30,
-    borderBottomColor: 'green',
-    borderLeftWidth: 40,
-    borderLeftColor: 'blue',
-
-    borderTopLeftRadius: 100,
-  },
-  border7: {
-    borderWidth: 10,
-    borderColor: '#f007',
-    borderRadius: 30,
-    overflow: 'hidden',
-  },
-  border7_inner: {
-    backgroundColor: 'blue',
-    width: 100,
-    height: 100
-  },
-  border8: {
-    width: 60,
-    height: 60,
-    borderColor: 'black',
-    marginRight: 10,
-    backgroundColor: 'lightgrey',
-  },
 });

 exports.title = 'Border';
-exports.description = 'Demonstrates some of the border styles available to Views.';
+exports.description = 'View borders';
 exports.examples = [
  {
    title: 'Equal-Width / Same-Color',
@@ -112,7 +71,7 @@ exports.examples = [
  },
  {
    title: 'Equal-Width / Same-Color',
-    description: 'borderWidth & borderColor & borderRadius',
+    description: 'borderWidth & borderColor',
    render() {
      return <View style={[styles.box, styles.borderRadius]} />;
    }
@@ -138,46 +97,4 @@ exports.examples = [
      return <View style={[styles.box, styles.border4]} />;
    }
  },
-  {
-    title: 'Custom Borders',
-    description: 'border*Width & border*Color',
-    platform: 'ios',
-    render() {
-      return <View style={[styles.box, styles.border5]} />;
-    }
-  },
-  {
-    title: 'Custom Borders',
-    description: 'border*Width & border*Color',
-    platform: 'ios',
-    render() {
-      return <View style={[styles.box, styles.border6]} />;
-    }
-  },
-  {
-    title: 'Custom Borders',
-    description: 'borderRadius & clipping',
-    platform: 'ios',
-    render() {
-      return (
-        <View style={[styles.box, styles.border7]}>
-          <View style={styles.border7_inner} />
-        </View>
-      );
-    }
-  },
-  {
-    title: 'Single Borders',
-    description: 'top, left, bottom right',
-    render() {
-      return (
-        <View style={{flexDirection: 'row'}}>
-          <View style={[styles.box, styles.border8, {borderTopWidth: 5}]} />
-          <View style={[styles.box, styles.border8, {borderLeftWidth: 5}]} />
-          <View style={[styles.box, styles.border8, {borderBottomWidth: 5}]} />
-          <View style={[styles.box, styles.border8, {borderRightWidth: 5}]} />
-        </View>
-      );
-    }
-  },
 ];
@@ -1,85 +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 {
-  Image,
-  StyleSheet,
-  View
-} = React;
-
-var styles = StyleSheet.create({
-  box: {
-    width: 100,
-    height: 100,
-    borderWidth: 2,
-  },
-  shadow1: {
-    shadowOpacity: 0.5,
-    shadowRadius: 3,
-    shadowOffset: {width: 2, height: 2},
-  },
-  shadow2: {
-    shadowOpacity: 1.0,
-    shadowColor: 'red',
-    shadowRadius: 0,
-    shadowOffset: {width: 3, height: 3},
-  },
-});
-
-exports.title = 'Box Shadow';
-exports.description = 'Demonstrates some of the shadow styles available to Views.';
-exports.examples = [
-  {
-    title: 'Basic shadow',
-    description: 'shadowOpacity: 0.5, shadowOffset: {2, 2}',
-    render() {
-      return <View style={[styles.box, styles.shadow1]} />;
-    }
-  },
-  {
-    title: 'Colored shadow',
-    description: 'shadowColor: \'red\', shadowRadius: 0',
-    render() {
-      return <View style={[styles.box, styles.shadow2]} />;
-    }
-  },
-  {
-    title: 'Shaped shadow',
-    description: 'borderRadius: 50',
-    render() {
-      return <View style={[styles.box, styles.shadow1, {borderRadius: 50}]} />;
-    }
-  },
-  {
-    title: 'Image shadow',
-    description: 'Image shadows are derived exactly from the pixels.',
-    render() {
-      return <Image
-        source={require('./hawk.png')}
-        style={[styles.box, styles.shadow1, {borderWidth: 0, overflow: 'visible'}]}
-      />;
-    }
-  },
-  {
-    title: 'Child shadow',
-    description: 'For views without an opaque background color, shadow will be derived from the subviews.',
-    render() {
-      return <View style={[styles.box, styles.shadow1, {backgroundColor: 'transparent'}]}>
-        <View style={[styles.box, {width: 80, height: 80, borderRadius: 40, margin: 8, backgroundColor: 'red'}]}/>
-      </View>;
-    }
-  },
-];
@@ -15,25 +15,22 @@
 */
 'use strict';

-const React = require('react-native');
-const {
+var React = require('react-native');
+var {
  CameraRoll,
  Image,
  SliderIOS,
  StyleSheet,
-  Switch,
+  SwitchIOS,
  Text,
  View,
-  TouchableOpacity
 } = React;

-const CameraRollView = require('./CameraRollView');
+var CameraRollView = require('./CameraRollView.ios');

-const AssetScaledImageExampleView = require('./AssetScaledImageExample');
+var CAMERA_ROLL_VIEW = 'camera_roll_view';

-const CAMERA_ROLL_VIEW = 'camera_roll_view';
-
-const CameraRollExample = React.createClass({
+var CameraRollExample = React.createClass({

  getInitialState() {
    return {
@@ -46,7 +43,7 @@ const CameraRollExample = React.createClass({
  render() {
    return (
      <View>
-        <Switch
+        <SwitchIOS
          onValueChange={this._onSwitchChange}
          value={this.state.bigImages} />
        <Text>{(this.state.bigImages ? 'Big' : 'Small') + ' Images'}</Text>
@@ -57,7 +54,7 @@ const 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}
        />
@@ -65,44 +62,31 @@ const CameraRollExample = React.createClass({
    );
  },

-  loadAsset(asset){
-    if (this.props.navigator) {
-      this.props.navigator.push({
-        title: 'Camera Roll Image',
-        component: AssetScaledImageExampleView,
-        backButtonTitle: 'Back',
-        passProps: { asset: asset },
-      });
-    }
-  },
-
  _renderImage(asset) {
-    const imageSize = this.state.bigImages ? 150 : 75;
-    const imageStyle = [styles.image, {width: imageSize, height: imageSize}];
-    const location = asset.node.location.longitude ?
+    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 key={asset} onPress={ this.loadAsset.bind( this, asset ) }>
-        <View 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>
    );
  },

  _onSliderChange(value) {
-    const options = CameraRoll.GroupTypesOptions;
-    const index = Math.floor(value * options.length * 0.99);
-    const groupTypes = options[index];
+    var options = CameraRoll.GroupTypesOptions;
+    var index = Math.floor(value * options.length * 0.99);
+    var groupTypes = options[index];
    if (groupTypes !== this.state.groupTypes) {
      this.setState({groupTypes: groupTypes});
    }
@@ -114,7 +98,7 @@ const CameraRollExample = React.createClass({
  }
 });

-const styles = StyleSheet.create({
+var styles = StyleSheet.create({
  row: {
    flexDirection: 'row',
    flex: 1,
@@ -131,7 +115,7 @@ const styles = StyleSheet.create({
  },
 });

-exports.title = 'Camera Roll';
+exports.title = '<CameraRollView>';
 exports.description = 'Example component that uses CameraRoll to list user\'s photos';
 exports.examples = [
  {
@@ -22,7 +22,6 @@ var {
  CameraRoll,
  Image,
  ListView,
-  Platform,
  StyleSheet,
  View,
 } = React;
@@ -60,16 +59,6 @@ var propTypes = {
   * imagesPerRow: Number of images to be shown in each row.
   */
  imagesPerRow: React.PropTypes.number,
-
-   /**
-   * The asset type, one of 'Photos', 'Videos' or 'All'
-   */
-  assetType: React.PropTypes.oneOf([
-    'Photos',
-    'Videos',
-    'All',
-  ]),
-
 };

 var CameraRollView = React.createClass({
@@ -80,7 +69,6 @@ var CameraRollView = React.createClass({
      groupTypes: 'SavedPhotos',
      batchSize: 5,
      imagesPerRow: 1,
-      assetType: 'Photos',
      renderImage: function(asset) {
        var imageSize = 150;
        var imageStyle = [styles.image, {width: imageSize, height: imageSize}];
@@ -101,7 +89,6 @@ var CameraRollView = React.createClass({
      assets: ([]: Array<Image>),
      groupTypes: this.props.groupTypes,
      lastCursor: (null : ?string),
-      assetType: this.props.assetType,
      noMore: false,
      loadingMore: false,
      dataSource: ds,
@@ -137,13 +124,8 @@ var CameraRollView = React.createClass({

    var fetchParams: Object = {
      first: this.props.batchSize,
-      groupTypes: this.props.groupTypes,
-      assetType: this.props.assetType,
+      groupTypes: this.props.groupTypes
    };
-    if (Platform.OS === "android") {
-      // not supported in android
-      delete fetchParams.groupTypes;
-    }
    if (this.state.lastCursor) {
      fetchParams.after = this.state.lastCursor;
    }
@@ -1,65 +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 {
-  Clipboard,
-  View,
-  Text,
-} = React;
-
-var ClipboardExample = React.createClass({
-  getInitialState() {
-    return {
-      content: 'Content will appear here'
-    };
-  },
-
-  async _setClipboardContent(){
-    Clipboard.setString('Hello World');
-    try {
-      var content = await Clipboard.getString();
-      this.setState({content});
-    } catch (e) {
-      this.setState({content:e.message});
-    }
-  },
-
-  render() {
-    return (
-      <View>
-        <Text onPress={this._setClipboardContent} style={{color: 'blue'}}>
-          Tap to put "Hello World" in the clipboard
-        </Text>
-        <Text style={{color: 'red', marginTop: 20}}>
-          {this.state.content}
-        </Text>
-      </View>
-    );
-  }
-});
-
-exports.title = 'Clipboard';
-exports.description = 'Show Clipboard contents.';
-exports.examples = [
-  {
-    title: 'Clipboard.setString() and getString()',
-    render() {
-      return <ClipboardExample/>;
-    }
-  }
-];
@@ -1,117 +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 {
-  DatePickerAndroid,
-  StyleSheet,
-  Text,
-  TouchableWithoutFeedback,
-} = React;
-
-var UIExplorerBlock = require('./UIExplorerBlock');
-var UIExplorerPage = require('./UIExplorerPage');
-
-var DatePickerAndroidExample = React.createClass({
-
-  statics: {
-    title: 'DatePickerAndroid',
-    description: 'Standard Android date picker dialog',
-  },
-
-  getInitialState() {
-    return {
-      presetDate: new Date(2020, 4, 5),
-      allDate: new Date(2020, 4, 5),
-      simpleText: 'pick a date',
-      minText: 'pick a date, no earlier than today',
-      maxText: 'pick a date, no later than today',
-      presetText: 'pick a date, preset to 2020/5/5',
-      allText: 'pick a date between 2020/5/1 and 2020/5/10',
-    };
-  },
-
-  async showPicker(stateKey, options) {
-    try {
-      var newState = {};
-      const {action, year, month, day} = await DatePickerAndroid.open(options);      
-      if (action === DatePickerAndroid.dismissedAction) {
-        newState[stateKey + 'Text'] = 'dismissed';
-      } else {
-        var date = new Date(year, month, day);
-        newState[stateKey + 'Text'] = date.toLocaleDateString();
-        newState[stateKey + 'Date'] = date;
-      }
-      this.setState(newState);
-    } catch ({code, message}) {
-      console.warn(`Error in example '${stateKey}': `, message);
-    }
-  },
-
-  render() {
-    return (
-      <UIExplorerPage title="DatePickerAndroid">
-        <UIExplorerBlock title="Simple date picker">
-          <TouchableWithoutFeedback
-            onPress={this.showPicker.bind(this, 'simple', {date: this.state.simpleDate})}>
-            <Text style={styles.text}>{this.state.simpleText}</Text>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Date picker with pre-set date">
-          <TouchableWithoutFeedback
-            onPress={this.showPicker.bind(this, 'preset', {date: this.state.presetDate})}>
-            <Text style={styles.text}>{this.state.presetText}</Text>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Date picker with minDate">
-          <TouchableWithoutFeedback
-            onPress={this.showPicker.bind(this, 'min', {
-              date: this.state.minDate,
-              minDate: new Date(),
-            })}>
-            <Text style={styles.text}>{this.state.minText}</Text>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Date picker with maxDate">
-          <TouchableWithoutFeedback
-            onPress={this.showPicker.bind(this, 'max', {
-              date: this.state.maxDate,
-              maxDate: new Date(),
-            })}>
-            <Text style={styles.text}>{this.state.maxText}</Text>
-          </TouchableWithoutFeedback>
-        </UIExplorerBlock>
-        <UIExplorerBlock title="Date picker with all options">
-          <TouchableWithoutFeedback
-            onPress={this.showPicker.bind(this, 'all', {
-              date: this.state.allDate,
-              minDate: new Date(2020, 4, 1),
-              maxDate: new Date(2020, 4, 10),
-            })}>
-            <Text style={styles.text}>{this.state.allText}</Text>
-          </TouchableWithoutFeedback>
-          </UIExplorerBlock>
-      </UIExplorerPage>
-    );
-  },
-});
-
-var styles = StyleSheet.create({
-  text: {
-    color: 'black',
-  },
-});
-
-module.exports = DatePickerAndroidExample;
@@ -125,7 +125,6 @@ var Heading = React.createClass({
  }
 });

-exports.displayName = (undefined: ?string);
 exports.title = '<DatePickerIOS>';
 exports.description = 'Select dates and times using the native UIDatePicker.';
 exports.examples = [
@@ -1,31 +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 ExampleTypes
- * @flow
- */
-'use strict';
-
-export type Example = {
-  title: string,
-  render: () => ?ReactElement<any, any, any>,
-  description?: string,
-  platform?: string;
-};
-
-export type ExampleModule = {
-  title: string;
-  description: string;
-  examples: Array<Example>;
-  external?: bool;
-};
@@ -49,15 +49,10 @@ var GeolocationExample = React.createClass({

  componentDidMount: function() {
    navigator.geolocation.getCurrentPosition(
-      (position) => {
-        var initialPosition = JSON.stringify(position);
-        this.setState({initialPosition});
-      },
-      (error) => alert(error.message),
-      {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}
+      (initialPosition) => this.setState({initialPosition}),
+      (error) => console.error(error)
    );
-    this.watchID = navigator.geolocation.watchPosition((position) => {
-      var lastPosition = JSON.stringify(position);
+    this.watchID = navigator.geolocation.watchPosition((lastPosition) => {
      this.setState({lastPosition});
    });
  },
@@ -71,11 +66,11 @@ var GeolocationExample = React.createClass({
      <View>
        <Text>
          <Text style={styles.title}>Initial position: </Text>
-          {this.state.initialPosition}
+          {JSON.stringify(this.state.initialPosition)}
        </Text>
        <Text>
          <Text style={styles.title}>Current position: </Text>
-          {this.state.lastPosition}
+          {JSON.stringify(this.state.lastPosition)}
        </Text>
      </View>
    );
@@ -35,7 +35,6 @@ var ImageCapInsetsExample = React.createClass({
          <Image
            source={require('image!story-background')}
            style={styles.storyBackground}
-            resizeMode={Image.resizeMode.stretch}
            capInsets={{left: 0, right: 0, bottom: 0, top: 0}}
          />
        </View>
@@ -46,7 +45,6 @@ var ImageCapInsetsExample = React.createClass({
          <Image
            source={require('image!story-background')}
            style={styles.storyBackground}
-            resizeMode={Image.resizeMode.stretch}
            capInsets={{left: 15, right: 15, bottom: 15, top: 15}}
          />
        </View>
@@ -68,6 +66,7 @@ var styles = StyleSheet.create({
    width: 250,
    height: 150,
    borderWidth: 1,
+    resizeMode: Image.resizeMode.stretch,
  },
  text: {
    fontSize: 13.5,
@@ -1,324 +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,
-  ImageEditor,
-  NativeModules,
-  Platform,
-  ScrollView,
-  StyleSheet,
-  Text,
-  TouchableHighlight,
-  UIManager,
-  View,
-} = React;
-
-var PAGE_SIZE = 20;
-
-type ImageOffset = {
-  x: number;
-  y: number;
-};
-
-type ImageSize = {
-  width: number;
-  height: number;
-};
-
-type ImageCropData = {
-  offset: ImageOffset;
-  size: ImageSize;
-  displaySize?: ?ImageSize;
-  resizeMode?: ?any; 
-};
-
-class SquareImageCropper extends React.Component {
-  _isMounted: boolean;
-  _transformData: ImageCropData;
-
-  constructor(props) {
-    super(props);
-    this._isMounted = true;
-    this.state = {
-      randomPhoto: null,
-      measuredSize: null,
-      croppedImageURI: null,
-      cropError: null,
-    };
-    this._fetchRandomPhoto();
-  }
-
-  async _fetchRandomPhoto() {
-    try {
-      const data = await CameraRoll.getPhotos({first: PAGE_SIZE});
-      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});
-      }
-    } catch (error) {
-      console.warn("Can't get a photo from camera roll", error);
-    }
-  }
-
-  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() {
-    ImageEditor.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 {
-  _contentOffset: ImageOffset;
-  _maximumZoomScale: number;
-  _minimumZoomScale: number;
-  _scaledImageSize: ImageSize;
-  _horizontal: boolean;
-
-  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;
-    this._horizontal = widthRatio > heightRatio;
-    if (this._horizontal) {
-      this._scaledImageSize = {
-        width: this.props.image.width / heightRatio,
-        height: this.props.size.height,
-      };
-    } else {
-      this._scaledImageSize = {
-        width: this.props.size.width,
-        height: this.props.image.height / widthRatio,
-      };
-      if (Platform.OS === 'android') {
-        // hack to work around Android ScrollView a) not supporting zoom, and
-        // b) not supporting vertical scrolling when nested inside another
-        // vertical ScrollView (which it is, when displayed inside UIExplorer)
-        this._scaledImageSize.width *= 2;
-        this._scaledImageSize.height *= 2;
-        this._horizontal = true;
-      }
-    }
-    this._contentOffset = {
-      x: (this._scaledImageSize.width - this.props.size.width) / 2,
-      y: (this._scaledImageSize.height - this.props.size.height) / 2,
-    };
-    this._maximumZoomScale = Math.min(
-      this.props.image.width / this._scaledImageSize.width,
-      this.props.image.height / this._scaledImageSize.height
-    );
-    this._minimumZoomScale = Math.max(
-      this.props.size.width / this._scaledImageSize.width,
-      this.props.size.height / this._scaledImageSize.height 
-    );
-    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;
-
-    var cropData: ImageCropData = {
-      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,
-      },
-    };
-    this.props.onTransformDataChange && this.props.onTransformDataChange(cropData);
-  }
-
-  render() {
-    return (
-      <ScrollView
-        alwaysBounceVertical={true}
-        automaticallyAdjustContentInsets={false}
-        contentOffset={this._contentOffset}
-        decelerationRate="fast"
-        horizontal={this._horizontal}
-        maximumZoomScale={this._maximumZoomScale}
-        minimumZoomScale={this._minimumZoomScale}
-        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 = 'ImageEditor';
-exports.description = 'Cropping and scaling with ImageEditor';
-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',
-  },
-});
@@ -21,113 +21,10 @@ var {
  StyleSheet,
  Text,
  View,
-  ActivityIndicatorIOS
 } = 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 ImageCapInsetsExample = require('./ImageCapInsetsExample');

-var NetworkImageCallbackExample = React.createClass({
-  getInitialState: function() {
-    return {
-      events: [],
-      mountTime: new Date(),
-    };
-  },
-
-  componentWillMount() {
-    this.setState({mountTime: new Date()});
-  },
-
-  render: function() {
-    var { mountTime } = this.state;
-
-    return (
-      <View>
-        <Image
-          source={this.props.source}
-          style={[styles.base, {overflow: 'visible'}]}
-          onLoadStart={() => this._loadEventFired(`✔ onLoadStart (+${new Date() - mountTime}ms)`)}
-          onLoad={() => this._loadEventFired(`✔ onLoad (+${new Date() - mountTime}ms)`)}
-          onLoadEnd={() => this._loadEventFired(`✔ onLoadEnd (+${new Date() - mountTime}ms)`)}
-        />
-
-        <Text style={{marginTop: 20}}>
-          {this.state.events.join('\n')}
-        </Text>
-      </View>
-    );
-  },
-
-  _loadEventFired(event) {
-    this.setState((state) => {
-      return state.events = [...state.events, event];
-    });
-  }
-});
-
-var NetworkImageExample = React.createClass({
-  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>;
-  }
-});
-
-var ImageSizeExample = React.createClass({
-  getInitialState: function() {
-    return {
-      width: 0,
-      height: 0,
-    };
-  },
-  componentDidMount: function() {
-    Image.getSize(this.props.source.uri, (width, height) => {
-      this.setState({width, height});
-    });
-  },
-  render: function() {
-    return (
-      <View style={{flexDirection: 'row'}}>
-        <Image
-          style={{
-            width: 60,
-            height: 60,
-            backgroundColor: 'transparent',
-            marginRight: 10,
-          }}
-          source={this.props.source} />
-        <Text>
-          Actual dimensions:{'\n'}
-          Width: {this.state.width}, Height: {this.state.height}
-        </Text>
-      </View>
-    );
-  },
-});
-
-exports.displayName = (undefined: ?string);
 exports.framework = 'React';
 exports.title = '<Image>';
 exports.description = 'Base component for displaying different types of images.';
@@ -148,59 +45,19 @@ exports.examples = [
  },
  {
    title: 'Plain Static Image',
-    description: 'Static assets should be placed in the source code tree, and ' +
-    'required in the same way as JavaScript modules.',
+    description: 'Static assets should be required by prefixing with `image!` ' +
+      'and are located in the app bundle.',
    render: function() {
      return (
        <View style={styles.horizontal}>
-          <Image source={require('./uie_thumb_normal.png')} style={styles.icon} />
-          <Image source={require('./uie_thumb_selected.png')} style={styles.icon} />
-          <Image source={require('./uie_comment_normal.png')} style={styles.icon} />
-          <Image source={require('./uie_comment_highlighted.png')} style={styles.icon} />
+          <Image source={require('image!uie_thumb_normal')} style={styles.icon} />
+          <Image source={require('image!uie_thumb_selected')} style={styles.icon} />
+          <Image source={require('image!uie_comment_normal')} style={styles.icon} />
+          <Image source={require('image!uie_comment_highlighted')} style={styles.icon} />
        </View>
      );
    },
  },
-  {
-    title: 'Image Loading Events',
-    render: function() {
-      return (
-        <NetworkImageCallbackExample source={{uri: 'http://facebook.github.io/origami/public/images/blog-hero.jpg?r=1'}}/>
-      );
-    },
-  },
-  {
-    title: 'Error Handler',
-    render: function() {
-      return (
-        <NetworkImageExample source={{uri: 'http://TYPO_ERROR_facebook.github.io/react/img/logo_og.png'}} />
-      );
-    },
-    platform: 'ios',
-  },
-  {
-    title: 'Image Download Progress',
-    render: function() {
-      return (
-        <NetworkImageExample source={{uri: 'http://facebook.github.io/origami/public/images/blog-hero.jpg?r=1'}}/>
-      );
-    },
-    platform: 'ios',
-  },
-  {
-    title: 'defaultSource',
-    description: 'Show a placeholder image when a network image is loading',
-    render: function() {
-      return (
-        <Image
-          defaultSource={require('./bunny.png')}
-          source={{uri: 'http://facebook.github.io/origami/public/images/birds.jpg'}}
-          style={styles.base}
-        />
-      );
-    },
-    platform: 'ios',
-  },
  {
    title: 'Border Color',
    render: function() {
@@ -241,12 +98,17 @@ exports.examples = [
      return (
        <View style={styles.horizontal}>
          <Image
-            style={[styles.base, {borderRadius: 5}]}
-            source={fullImage}
+            style={[styles.base, styles.background, {borderRadius: 5}]}
+            source={smallImage}
          />
          <Image
-            style={[styles.base, styles.leftMargin, {borderRadius: 19}]}
-            source={fullImage}
+            style={[
+              styles.base,
+              styles.background,
+              styles.leftMargin,
+              {borderRadius: 19}
+            ]}
+            source={smallImage}
          />
        </View>
      );
@@ -331,46 +193,23 @@ exports.examples = [
      'pixels to the tint color.',
    render: function() {
      return (
-        <View>
-          <View style={styles.horizontal}>
-            <Image
-              source={require('./uie_thumb_normal.png')}
-              style={[styles.icon, {borderRadius: 5, tintColor: '#5ac8fa' }]}
-            />
-            <Image
-              source={require('./uie_thumb_normal.png')}
-              style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#4cd964' }]}
-            />
-            <Image
-              source={require('./uie_thumb_normal.png')}
-              style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#ff2d55' }]}
-            />
-            <Image
-              source={require('./uie_thumb_normal.png')}
-              style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#8e8e93' }]}
-            />
-          </View>
-          <Text style={styles.sectionText}>
-            It also works with downloaded images:
-          </Text>
-          <View style={styles.horizontal}>
-            <Image
-              source={smallImage}
-              style={[styles.base, {borderRadius: 5, tintColor: '#5ac8fa' }]}
-            />
-            <Image
-              source={smallImage}
-              style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#4cd964' }]}
-            />
-            <Image
-              source={smallImage}
-              style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#ff2d55' }]}
-            />
-            <Image
-              source={smallImage}
-              style={[styles.base, styles.leftMargin, {borderRadius: 5, 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>
      );
    },
@@ -387,8 +226,10 @@ exports.examples = [
              Contain
            </Text>
            <Image
-              style={styles.resizeMode}
-              resizeMode={Image.resizeMode.contain}
+              style={[
+                styles.resizeMode,
+                {resizeMode: Image.resizeMode.contain}
+              ]}
              source={fullImage}
            />
          </View>
@@ -397,8 +238,10 @@ exports.examples = [
              Cover
            </Text>
            <Image
-              style={styles.resizeMode}
-              resizeMode={Image.resizeMode.cover}
+              style={[
+                styles.resizeMode,
+                {resizeMode: Image.resizeMode.cover}
+              ]}
              source={fullImage}
            />
          </View>
@@ -407,8 +250,10 @@ exports.examples = [
              Stretch
            </Text>
            <Image
-              style={styles.resizeMode}
-              resizeMode={Image.resizeMode.stretch}
+              style={[
+                styles.resizeMode,
+                {resizeMode: Image.resizeMode.stretch}
+              ]}
              source={fullImage}
            />
          </View>
@@ -416,30 +261,6 @@ exports.examples = [
      );
    },
  },
-  {
-    title: 'Animated GIF',
-    render: function() {
-      return (
-        <Image
-          style={styles.gif}
-          source={{uri: 'http://38.media.tumblr.com/9e9bd08c6e2d10561dd1fb4197df4c4e/tumblr_mfqekpMktw1rn90umo1_500.gif'}}
-        />
-      );
-    },
-    platform: 'ios',
-  },
-  {
-    title: 'Base64 image',
-    render: function() {
-      return (
-        <Image
-          style={styles.base64}
-          source={{uri: base64Icon, scale: 3}}
-        />
-      );
-    },
-    platform: 'ios',
-  },
  {
    title: 'Cap Insets',
    description:
@@ -450,40 +271,23 @@ exports.examples = [
    render: function() {
      return <ImageCapInsetsExample />;
    },
-    platform: 'ios',
-  },
-  {
-    title: 'Image Size',
-    render: function() {
-      return <ImageSizeExample source={fullImage} />; 
-    },
-    platform: 'ios',
  },
 ];

 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,
@@ -506,14 +310,5 @@ var styles = StyleSheet.create({
  },
  horizontal: {
    flexDirection: 'row',
-  },
-  gif: {
-    flex: 1,
-    height: 200,
-  },
-  base64: {
-    flex: 1,
-    height: 50,
-    resizeMode: 'contain',
-  },
+  }
 });
@@ -13,31 +13,29 @@
 *
 * @flow
 */
-
 'use strict';

-var React = require('React');
-var Text = require('Text');
-var View = require('View');
+declare module 'image!story-background' {
+  declare var uri: string;
+  declare var isStatic: boolean;
+}

-var SetPropertiesExampleApp = React.createClass({
+declare module 'image!uie_comment_highlighted' {
+  declare var uri: string;
+  declare var isStatic: boolean;
+}

-  render: function() {
-    var wrapperStyle = {
-      backgroundColor: this.props.color,
-      flex: 1,
-      alignItems: 'center',
-      justifyContent: 'center'
-    };
+declare module 'image!uie_comment_normal' {
+  declare var uri: string;
+  declare var isStatic: boolean;
+}

-    return (
-      <View style={wrapperStyle}>
-        <Text>
-          Embedded React Native view
-        </Text>
-      </View>
-    );
-  },
-});
+declare module 'image!uie_thumb_normal' {
+  declare var uri: string;
+  declare var isStatic: boolean;
+}

-module.exports = SetPropertiesExampleApp;
+declare module 'image!uie_thumb_selected' {
+  declare var uri: string;
+  declare var isStatic: boolean;
+}
@@ -1,90 +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 {
-  IntentAndroid,
-  StyleSheet,
-  Text,
-  TouchableNativeFeedback,
-  View,
-} = React;
-var UIExplorerBlock = require('./UIExplorerBlock');
-
-var OpenURLButton = React.createClass({
-
-  propTypes: {
-    url: React.PropTypes.string,
-  },
-
-  handleClick: function() {
-    IntentAndroid.canOpenURL(this.props.url, (supported) => {
-      if (supported) {
-        IntentAndroid.openURL(this.props.url);
-      } else {
-        console.log('Don\'t know how to open URI: ' + this.props.url);
-      }
-    });
-  },
-
-  render: function() {
-    return (
-      <TouchableNativeFeedback
-        onPress={this.handleClick}>
-        <View style={styles.button}>
-          <Text style={styles.text}>Open {this.props.url}</Text>
-        </View>
-      </TouchableNativeFeedback>
-    );
-  }
-});
-
-var IntentAndroidExample = React.createClass({
-
-  statics: {
-    title: 'IntentAndroid',
-    description: 'Shows how to use Android Intents to open URLs.',
-  },
-
-  render: function() {
-    return (
-      <UIExplorerBlock title="Open external URLs">
-        <OpenURLButton url={'https://www.facebook.com'} />
-        <OpenURLButton url={'http://www.facebook.com'} />
-        <OpenURLButton url={'http://facebook.com'} />
-        <OpenURLButton url={'geo:37.484847,-122.148386'} />
-      </UIExplorerBlock>
-    );
-  },
-});
-
-var styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: 'white',
-    padding: 10,
-    paddingTop: 30,
-  },
-  button: {
-    padding: 10,
-    backgroundColor: '#3B5998',
-    marginBottom: 10,
-  },
-  text: {
-    color: 'white',
-  },
-});
-
-module.exports = IntentAndroidExample;
@@ -1,163 +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,
-  LayoutAnimation,
-  StyleSheet,
-  Text,
-  View,
-} = React;
-
-type Layout = {
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-};
-
-type LayoutEvent = {
-  nativeEvent: {
-    layout: Layout,
-  };
-};
-
-type State = {
-  containerStyle?: { width: number },
-  extraText?: string,
-  imageLayout?: Layout,
-  textLayout?: Layout,
-  viewLayout?: Layout,
-  viewStyle: { margin: number },
-};
-
-var LayoutEventExample = React.createClass({
-  getInitialState(): State {
-    return {
-      viewStyle: {
-        margin: 20,
-      },
-    };
-  },
-  animateViewLayout: function() {
-    LayoutAnimation.configureNext(
-      LayoutAnimation.Presets.spring,
-      () => {
-        console.log('layout animation done.');
-        this.addWrapText();
-      }
-    );
-    this.setState({
-      viewStyle: {
-        margin: this.state.viewStyle.margin > 20 ? 20 : 60,
-      }
-    });
-  },
-  addWrapText: function() {
-    this.setState(
-      {extraText: '  And a bunch more text to wrap around a few lines.'},
-      this.changeContainer
-    );
-  },
-  changeContainer: function() {
-    this.setState({containerStyle: {width: 280}});
-  },
-  onViewLayout: function(e: LayoutEvent) {
-    console.log('received view layout event\n', e.nativeEvent);
-    this.setState({viewLayout: e.nativeEvent.layout});
-  },
-  onTextLayout: function(e: LayoutEvent) {
-    console.log('received text layout event\n', e.nativeEvent);
-    this.setState({textLayout: e.nativeEvent.layout});
-  },
-  onImageLayout: function(e: LayoutEvent) {
-    console.log('received image layout event\n', e.nativeEvent);
-    this.setState({imageLayout: e.nativeEvent.layout});
-  },
-  render: function() {
-    var viewStyle = [styles.view, this.state.viewStyle];
-    var textLayout = this.state.textLayout || {width: '?', height: '?'};
-    var imageLayout = this.state.imageLayout || {x: '?', y: '?'};
-    return (
-      <View style={this.state.containerStyle}>
-        <Text>
-          layout events are called on mount and whenever layout is recalculated. Note that the layout event will typically be received <Text style={styles.italicText}>before</Text> the layout has updated on screen, especially when using layout animations.{'  '}
-          <Text style={styles.pressText} onPress={this.animateViewLayout}>
-            Press here to change layout.
-          </Text>
-        </Text>
-        <View ref="view" onLayout={this.onViewLayout} style={viewStyle}>
-          <Image
-            ref="img"
-            onLayout={this.onImageLayout}
-            style={styles.image}
-            source={{uri: 'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851561_767334496626293_1958532586_n.png'}}
-          />
-          <Text>
-            ViewLayout: {JSON.stringify(this.state.viewLayout, null, '  ') + '\n\n'}
-          </Text>
-          <Text ref="txt" onLayout={this.onTextLayout} style={styles.text}>
-            A simple piece of text.{this.state.extraText}
-          </Text>
-          <Text>
-            {'\n'}
-            Text w/h: {textLayout.width}/{textLayout.height + '\n'}
-            Image x/y: {imageLayout.x}/{imageLayout.y}
-          </Text>
-        </View>
-      </View>
-    );
-  }
-});
-
-var styles = StyleSheet.create({
-  view: {
-    padding: 12,
-    borderColor: 'black',
-    borderWidth: 0.5,
-    backgroundColor: 'transparent',
-  },
-  text: {
-    alignSelf: 'flex-start',
-    borderColor: 'rgba(0, 0, 255, 0.2)',
-    borderWidth: 0.5,
-  },
-  image: {
-    width: 50,
-    height: 50,
-    marginBottom: 10,
-    alignSelf: 'center',
-  },
-  pressText: {
-    fontWeight: 'bold',
-  },
-  italicText: {
-    fontStyle: 'italic',
-  },
-});
-
-exports.title = 'Layout Events';
-exports.description = 'Examples that show how Layout events can be used to ' +
-  'measure view size and position.';
-exports.examples = [
-{
-  title: 'LayoutEventExample',
-  render: function(): ReactElement {
-    return <LayoutEventExample />;
-  },
-}];
@@ -62,11 +62,8 @@ var CircleBlock = React.createClass({
 var LayoutExample = React.createClass({
  statics: {
    title: 'Layout - Flexbox',
-    description: 'Examples of using the flexbox API to layout views.',
+    description: 'Examples of using the flexbox API to layout views.'
  },
-
-  displayName: 'LayoutExample',
-
  render: function() {
    return (
      <UIExplorerPage title={this.props.navigator ? null : 'Layout'}>
@@ -21,7 +21,6 @@ var {
  ListView,
  TouchableHighlight,
  StyleSheet,
-  RecyclerViewBackedScrollView,
  Text,
  View,
 } = React;
@@ -30,7 +29,7 @@ var UIExplorerPage = require('./UIExplorerPage');

 var ListViewSimpleExample = React.createClass({
  statics: {
-    title: '<ListView>',
+    title: '<ListView> - Simple',
    description: 'Performant, scrollable list of data.'
  },

@@ -50,14 +49,12 @@ var ListViewSimpleExample = React.createClass({
  render: function() {
    return (
      <UIExplorerPage
-        title={this.props.navigator ? null : '<ListView>'}
+        title={this.props.navigator ? null : '<ListView> - Simple'}
        noSpacer={true}
        noScroll={true}>
        <ListView
          dataSource={this.state.dataSource}
          renderRow={this._renderRow}
-          renderScrollComponent={props => <RecyclerViewBackedScrollView {...props} />}
-          renderSeparator={(sectionID, rowID) => <View key={`${sectionID}-${rowID}`} style={styles.separator} />}
        />
      </UIExplorerPage>
    );
@@ -65,7 +62,9 @@ var ListViewSimpleExample = React.createClass({

  _renderRow: function(rowData: string, sectionID: number, rowID: number) {
    var rowHash = Math.abs(hashCode(rowData));
-    var imgSource = THUMB_URLS[rowHash % THUMB_URLS.length];
+    var imgSource = {
+      uri: THUMB_URLS[rowHash % THUMB_URLS.length],
+    };
    return (
      <TouchableHighlight onPress={() => this._pressRow(rowID)}>
        <View>
@@ -75,6 +74,7 @@ var ListViewSimpleExample = React.createClass({
              {rowData + ' - ' + LOREM_IPSUM.substr(0, rowHash % 301 + 10)}
            </Text>
          </View>
+          <View style={styles.separator} />
        </View>
      </TouchableHighlight>
    );
@@ -97,20 +97,7 @@ var ListViewSimpleExample = React.createClass({
  },
 });

-var THUMB_URLS = [
-  require('./Thumbnails/like.png'),
-  require('./Thumbnails/dislike.png'),
-  require('./Thumbnails/call.png'),
-  require('./Thumbnails/fist.png'),
-  require('./Thumbnails/bandaged.png'),
-  require('./Thumbnails/flowers.png'),
-  require('./Thumbnails/heart.png'),
-  require('./Thumbnails/liking.png'),
-  require('./Thumbnails/party.png'),
-  require('./Thumbnails/poke.png'),
-  require('./Thumbnails/superlike.png'),
-  require('./Thumbnails/victory.png'),
-  ];
+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 LOREM_IPSUM = 'Lorem ipsum dolor sit amet, ius ad pertinax oportere accommodare, an vix civibus corrumpit referrentur. Te nam case ludus inciderint, te mea facilisi adipiscing. Sea id integre luptatum. In tota sale consequuntur nec. Erat ocurreret mei ei. Eu paulo sapientem vulputate est, vel an accusam intellegam interesset. Nam eu stet pericula reprimique, ea vim illud modus, putant invidunt reprehendunt ne qui.';

 /* eslint no-bitwise: 0 */
--- a/Show More
+++ b/Show More