Update css-layout dependency (#565)

A second attempt at updating the css-layout dependency. This commit
includes the changes from these 2 commits:
  - 104aa49: Update css-layout dependency
  - 4501096: Clean up warnings due to project.json

It also includes a fix for #561 (horizontal scrolling broken) which was
introduced by the previous attempt at upgrading the layout engine.
Facebook already found and fixed this bug in their repo so I imported
their fix: facebook/react-native@6603cef

The updated version of css-layout includes significant
changes which make the layout engine conform closer to
the W3C spec. For details, see facebook/yoga#185

The inline view implementation had to be modified slightly
due to a change in the layout engine. In the updated layout
engine, nodes with a measure function are treated as leaves.
Consequently, nodes with a mesaure function (e.g. Text) do
not have their children laid out automatically.

To fix this, Text nodes now manually invoke the layout engine
on each of their inline views.

Libraries/Components/ScrollView/ScrollView.windows.js

@@ -485,12 +485,14 @@ const ScrollView = React.createClass({
       this.props.alwaysBounceVertical !== undefined ?
         this.props.alwaysBounceVertical :
         !this.props.horizontal;
+
+    const baseStyle = this.props.horizontal ? styles.baseHorizontal : styles.baseVertical;
 
     const props = {
       ...this.props,
       alwaysBounceHorizontal,
       alwaysBounceVertical,
-      style: ([styles.base, this.props.style]: ?Array<any>),
+      style: ([baseStyle, this.props.style]: ?Array<any>),
       onTouchStart: this.scrollResponderHandleTouchStart,
       onTouchMove: this.scrollResponderHandleTouchMove,
       onTouchEnd: this.scrollResponderHandleTouchEnd,
@@ -557,7 +559,7 @@ const ScrollView = React.createClass({
         return React.cloneElement(
           refreshControl,
           {style: props.style},
-          <ScrollViewClass {...props} style={styles.base} ref={this._setScrollViewRef}>
+          <ScrollViewClass {...props} style={baseStyle} ref={this._setScrollViewRef}>
             {contentContainer}
           </ScrollViewClass>
         );
@@ -572,11 +574,14 @@ const ScrollView = React.createClass({
 });
 
 const styles = StyleSheet.create({
-  base: {
+  baseVertical: {
     flex: 1,
   },
+  baseHorizontal: {
+    flex: 1,
+    flexDirection: 'row',
+  },
   contentContainerHorizontal: {
-    alignSelf: 'flex-start',
     flexDirection: 'row',
   },
 });

ReactWindows/Playground/project.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "Facebook.CSSLayout": "2.0.0-pre",
+    "Facebook.CSSLayout": "2.0.1-pre",
     "Microsoft.ApplicationInsights": "1.0.0",
     "Microsoft.ApplicationInsights.PersistenceChannel": "1.0.0",
     "Microsoft.ApplicationInsights.WindowsApps": "1.0.0",

ReactWindows/ReactNative.Tests/project.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "Facebook.CSSLayout": "2.0.0-pre",
+    "Facebook.CSSLayout": "2.0.1-pre",
     "Microsoft.NETCore.UniversalWindowsPlatform": "5.2.2"
   },
   "frameworks": {

ReactWindows/ReactNative/Views/Text/ReactSpanShadowNode.cs

@@ -127,5 +127,23 @@ public override void UpdateInline(Inline inline)
             inline.FontWeight = _fontWeight ?? FontWeights.Normal;
             inline.FontFamily = _fontFamily != null ? new FontFamily(_fontFamily) : FontFamily.XamlAutoFontFamily;
         }
+
+        /// <summary>
+        /// This method will be called by <see cref="UIManagerModule"/> once
+        /// per batch, before calculating layout. This will only be called for
+        /// nodes that are marked as updated with <see cref="ReactShadowNode.MarkUpdated"/> or
+        /// require layout (i.e., marked with <see cref="ReactShadowNode.dirty"/> ).
+        /// </summary>
+        public override void OnBeforeLayout()
+        {
+            // Run flexbox on the children which are inline views.
+            foreach (var child in this.Children)
+            {
+                if (!(child is ReactInlineShadowNode))
+                {
+                    child.CalculateLayout();
+                }
+            }
+        }
     }
 }

ReactWindows/ReactNative/Views/Text/ReactTextShadowNode.cs

@@ -267,5 +267,23 @@ private void UpdateTextBlockCore(RichTextBlock textBlock, bool measureOnly)
                     0);
             }
         }
+
+        /// <summary>
+        /// This method will be called by <see cref="UIManagerModule"/> once
+        /// per batch, before calculating layout. This will only be called for
+        /// nodes that are marked as updated with <see cref="MarkUpdated"/> or
+        /// require layout (i.e., marked with <see cref="ReactShadowNode.dirty"/>).
+        /// </summary>
+        public override void OnBeforeLayout()
+        {
+            // Run flexbox on the children which are inline views.
+            foreach (var child in this.Children)
+            {
+                if (!(child is ReactInlineShadowNode))
+                {
+                    child.CalculateLayout();
+                }
+            }
+        }
     }
 }

ReactWindows/ReactNative/project.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "Facebook.CSSLayout": "2.0.0-pre",
+    "Facebook.CSSLayout": "2.0.1-pre",
     "Microsoft.NETCore.UniversalWindowsPlatform": "5.2.2",
     "Newtonsoft.Json": "9.0.1",
     "System.Reactive": "3.0.0",