- [react-packager] Switch from Q to Bluebird as promises library | Pi…

…lwon Huh

- [Touchable] Change default `activeOpacity` to 0.2 to match iOS | James Ide
- [ReactNative] Normalize name for examples | Christopher Chedeau
- [ReactNative] Added support for 3 digit hex colors | Arthur Lee
- [react-packager] Fix EISDIR error | Amjad Masad
- make renderError and renderLoading props optional for WebView | Don Yu

Examples/UIExplorer/ListViewPagingExample.js

@@ -11,7 +11,6 @@
  * 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 ListViewPagingExample
  * @flow
  */
 'use strict';

Examples/UIExplorer/UIExplorerList.js

@@ -33,19 +33,19 @@ var { TestModule } = React.addons;
 var createExamplePage = require('./createExamplePage');
 
 var COMPONENTS = [
-  require('./ActivityIndicatorExample'),
-  require('./DatePickerExample'),
+  require('./ActivityIndicatorIOSExample'),
+  require('./DatePickerIOSExample'),
   require('./ImageExample'),
+  require('./ListViewExample'),
   require('./ListViewPagingExample'),
-  require('./ListViewSimpleExample'),
   require('./MapViewExample'),
   require('./NavigatorIOSExample'),
   NavigatorExample,
-  require('./PickerExample'),
+  require('./PickerIOSExample'),
   require('./ScrollViewExample'),
   require('./SliderIOSExample'),
-  require('./SwitchExample'),
-  require('./TabBarExample'),
+  require('./SwitchIOSExample'),
+  require('./TabBarIOSExample'),
   require('./TextExample.ios'),
   require('./TextInputExample'),
   require('./TouchableExample'),

Examples/UIExplorer/WebViewExample.js

@@ -18,7 +18,6 @@
 var React = require('react-native');
 var StyleSheet = require('StyleSheet');
 var {
-  ActivityIndicatorIOS,
   StyleSheet,
   Text,
   TextInput,
@@ -95,8 +94,6 @@ var WebViewExample = React.createClass({
           automaticallyAdjustContentInsets={false}
           style={styles.webView}
           url={this.state.url}
-          renderError={this.renderError}
-          renderLoading={this.renderLoading}
           onNavigationStateChange={this.onNavigationStateChange}
           startInLoadingState={true}
         />
@@ -129,33 +126,6 @@ var WebViewExample = React.createClass({
     });
   },
 
-  renderError: function(errorDomain, errorCode, errorDesc) {
-    return (
-      <View style={styles.errorContainer}>
-        <Text style={styles.errorTextTitle}>
-          Error loading page
-        </Text>
-        <Text style={styles.errorText}>
-          {'Domain: ' + errorDomain}
-        </Text>
-        <Text style={styles.errorText}>
-          {'Error Code: ' + errorCode}
-        </Text>
-        <Text style={styles.errorText}>
-          {'Description: ' + errorDesc}
-        </Text>
-      </View>
-    );
-  },
-
-  renderLoading: function() {
-    return (
-      <View style={styles.loadingView}>
-        <ActivityIndicatorIOS />
-      </View>
-    );
-  },
-
   onSubmitEditing: function(event) {
     this.pressGoButton();
   },
@@ -230,28 +200,6 @@ var styles = StyleSheet.create({
     borderRadius: 3,
     alignSelf: 'stretch',
   },
-  loadingView: {
-    backgroundColor: BGWASH,
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  errorContainer: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: BGWASH,
-  },
-  errorTextTitle: {
-    fontSize: 15,
-    fontWeight: '500',
-    marginBottom: 10,
-  },
-  errorText: {
-    fontSize: 14,
-    textAlign: 'center',
-    marginBottom: 2,
-  },
   statusBar: {
     flexDirection: 'row',
     alignItems: 'center',

IntegrationTests/IntegrationTests.xcodeproj/xcshareddata/xcschemes/IntegrationTests.xcscheme

@@ -22,7 +22,7 @@
          </BuildActionEntry>
          <BuildActionEntry
             buildForTesting = "YES"
-            buildForRunning = "YES"
+            buildForRunning = "NO"
             buildForProfiling = "NO"
             buildForArchiving = "NO"
             buildForAnalyzing = "YES">

Libraries/Components/Touchable/TouchableOpacity.js

@@ -59,7 +59,7 @@ var TouchableOpacity = React.createClass({
 
   getDefaultProps: function() {
     return {
-      activeOpacity: 0.5,
+      activeOpacity: 0.2,
     };
   },
 

Libraries/Components/WebView/WebView.ios.js

@@ -11,10 +11,12 @@
  */
 'use strict';
 
+var ActivityIndicatorIOS = require('ActivityIndicatorIOS');
 var EdgeInsetsPropType = require('EdgeInsetsPropType');
 var React = require('React');
 var ReactIOSViewAttributes = require('ReactIOSViewAttributes');
 var StyleSheet = require('StyleSheet');
+var Text = require('Text');
 var View = require('View');
 
 var createReactIOSNativeComponentClass = require('createReactIOSNativeComponentClass');
@@ -27,6 +29,7 @@ var RCTWebViewManager = require('NativeModules').WebViewManager;
 
 var invariant = require('invariant');
 
+var BGWASH = 'rgba(255,255,255,0.8)';
 var RCT_WEBVIEW_REF = 'webview';
 
 var WebViewState = keyMirror({
@@ -52,16 +55,38 @@ type ErrorEvent = {
 
 type Event = Object;
 
+var defaultRenderLoading = () => (
+  <View style={styles.loadingView}>
+    <ActivityIndicatorIOS />
+  </View>
+);
+var defaultRenderError = (errorDomain, errorCode, errorDesc) => (
+  <View style={styles.errorContainer}>
+    <Text style={styles.errorTextTitle}>
+      Error loading page
+    </Text>
+    <Text style={styles.errorText}>
+      {'Domain: ' + errorDomain}
+    </Text>
+    <Text style={styles.errorText}>
+      {'Error Code: ' + errorCode}
+    </Text>
+    <Text style={styles.errorText}>
+      {'Description: ' + errorDesc}
+    </Text>
+  </View>
+);
+
 var WebView = React.createClass({
   statics: {
     NavigationType: NavigationType,
   },
 
   propTypes: {
-    renderError: PropTypes.func.isRequired, // view to show if there's an error
-    renderLoading: PropTypes.func.isRequired, // loading indicator to show
     url: PropTypes.string,
     html: PropTypes.string,
+    renderError: PropTypes.func, // view to show if there's an error
+    renderLoading: PropTypes.func, // loading indicator to show
     automaticallyAdjustContentInsets: PropTypes.bool,
     shouldInjectAJAXHandler: PropTypes.bool,
     contentInset: EdgeInsetsPropType,
@@ -87,20 +112,23 @@ var WebView = React.createClass({
   render: function() {
     var otherView = null;
 
-   if (this.state.viewState === WebViewState.LOADING) {
-      otherView = this.props.renderLoading();
+    if (this.state.viewState === WebViewState.LOADING) {
+      otherView = (this.props.renderLoading || defaultRenderLoading)();
     } else if (this.state.viewState === WebViewState.ERROR) {
       var errorEvent = this.state.lastErrorEvent;
       invariant(
         errorEvent != null,
         'lastErrorEvent expected to be non-null'
       );
-      otherView = this.props.renderError(
+      otherView = (this.props.renderError || defaultRenderError)(
         errorEvent.domain,
         errorEvent.code,
-        errorEvent.description);
+        errorEvent.description
+      );
     } else if (this.state.viewState !== WebViewState.IDLE) {
-      console.error('RCTWebView invalid state encountered: ' + this.state.loading);
+      console.error(
+        'RCTWebView invalid state encountered: ' + this.state.loading
+      );
     }
 
     var webViewStyles = [styles.container, this.props.style];
@@ -196,10 +224,32 @@ var styles = StyleSheet.create({
   container: {
     flex: 1,
   },
+  errorContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: BGWASH,
+  },
+  errorText: {
+    fontSize: 14,
+    textAlign: 'center',
+    marginBottom: 2,
+  },
+  errorTextTitle: {
+    fontSize: 15,
+    fontWeight: '500',
+    marginBottom: 10,
+  },
   hidden: {
     height: 0,
     flex: 0, // disable 'flex:1' when hiding a View
   },
+  loadingView: {
+    backgroundColor: BGWASH,
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
 });
 
 module.exports = WebView;

React/Base/RCTConvert.m

@@ -459,7 +459,17 @@ + (UIColor *)UIColor:(id)json
     NSUInteger blue = -1;
     CGFloat alpha = 1.0;
     if ([colorString hasPrefix:@"#"]) {
-      sscanf([colorString UTF8String], "#%02tX%02tX%02tX", &red, &green, &blue);
+      if (colorString.length == 4) { // 3 digit hex
+        sscanf([colorString UTF8String], "#%01tX%01tX%01tX", &red, &green, &blue);
+        // expand to 6 digit hex
+        red = red | (red << 4);
+        green = green | (green << 4);
+        blue = blue | (blue << 4);
+      } else if (colorString.length == 7) { // normal 6 digit hex
+        sscanf([colorString UTF8String], "#%02tX%02tX%02tX", &red, &green, &blue);
+      } else {
+        RCTLogError(@"Invalid hex color %@. Hex colors should be 3 or 6 digits long", colorString);
+      }
     } else if ([colorString hasPrefix:@"rgba("]) {
       double tmpAlpha;
       sscanf([colorString UTF8String], "rgba(%zd,%zd,%zd,%lf)", &red, &green, &blue, &tmpAlpha);

package.json

@@ -53,13 +53,13 @@
     "joi": "~5.1.0",
     "module-deps": "3.5.6",
     "optimist": "0.6.1",
-    "q": "1.0.1",
     "sane": "1.0.1",
     "uglify-js": "~2.4.16",
     "underscore": "1.7.0",
     "worker-farm": "1.1.0",
     "yargs": "1.3.2",
-    "ws": "0.4.31"
+    "ws": "0.4.31",
+    "bluebird": "^2.9.21"
   },
   "devDependencies": {
     "jest-cli": "0.2.1",

packager/react-packager/__mocks__/bluebird.js

@@ -0,0 +1,5 @@
+'use strict';
+
+jest.autoMockOff();
+module.exports = require.requireActual('bluebird');
+jest.autoMockOn();

packager/react-packager/src/DependencyResolver/haste/DependencyGraph/__tests__/DependencyGraph-test.js

@@ -10,7 +10,6 @@
 
 jest
   .dontMock('../index')
-  .dontMock('q')
   .dontMock('path')
   .dontMock('absolute-path')
   .dontMock('../docblock')