Setup gulp with eslint and fixed all the raised issues

.eslintrc

@@ -0,0 +1,15 @@
+{
+  "extends": "airbnb",
+  "parser": "babel-eslint",
+  "rules": {
+    "comma-dangle": 0,
+    "object-curly-spacing": 0,
+    "no-underscore-dangle": 0,
+    "no-console": 0,
+    "react/jsx-filename-extension": 0,
+  },
+  "globals": {
+    "expect": true,
+    "test": true
+  }
+}

Components/Col.js

@@ -1,51 +1,54 @@
-'use strict';
-
 import React, {Component} from 'react';
 import {View, TouchableOpacity} from 'react-native';
 import computeProps from '../Utils/computeProps';
-import _ from 'lodash';
-
 
 export default class ColumnNB extends Component {
-    prepareRootProps() {
-
-        var type = {
-        	flexDirection: 'column',
-        	flex: (this.props.size) ? this.props.size : (this.props.style && this.props.style.width) ? 0 : 1,
-        }
-
-        var defaultProps = {
-            style: type
-        }
-        return computeProps(this.props, defaultProps);
+  setNativeProps(nativeProps) {
+    this._root.setNativeProps(nativeProps);
+  }
 
-    }
+  props: {
+    style: Object,
+    size: number,
+    children: Object,
+    onPress: Function
+  };
+
+  prepareRootProps() {
+    const flex = (this.props.style && this.props.style.width) ? 0 : 1;
+    const defaultProps = {
+      style: {
+        flexDirection: 'column',
+        flex: this.props.size ? this.props.size : flex,
+      }
+    };
+
+    return computeProps(this.props, defaultProps);
+  }
 
-    setNativeProps(nativeProps) {
-      this._root.setNativeProps(nativeProps);
-    }
+  renderCol() {
+    return (
+      <View
+        ref={(component) => {
+          this._root = component;
+        }}
+        {...this.props}
+        {...this.prepareRootProps()}
+      >
+        {this.props.children}
+      </View>
+    );
+  }
 
   render() {
-    if(this.props.onPress){
-      return(
+    if (this.props.onPress) {
+      return (
         <TouchableOpacity onPress={this.props.onPress}>
-    <View
-      ref={component => this._root = component}
-      {...this.props}
-      {...this.prepareRootProps()}
-    >{this.props.children}</View>
-      </TouchableOpacity>
-    );
+          {this.renderCol()}
+        </TouchableOpacity>
+      );
     }
-    else{
-      return(
-        <View
-      ref={component => this._root = component}
-      {...this.props}
-      {...this.prepareRootProps()}
-    >{this.props.children}</View>
-    );
-    }
-  }
 
+    return this.renderCol();
+  }
 }

Components/Grid.js

@@ -1,63 +1,58 @@
-'use strict';
-
 import React, {Component} from 'react';
 import {View, TouchableOpacity} from 'react-native';
+import {reduce} from 'lodash';
 import computeProps from '../Utils/computeProps';
-import _ from 'lodash';
-import Col from './Col';
 import Row from './Row';
 
+const ifRow = () =>
+  reduce(React.Children, (initial, child) =>
+    (child && child.type === Row) || initial
+  , false);
 
 export default class GridNB extends Component {
-    prepareRootProps() {
-
-        var type = {
-            flex: 1,
-            flexDirection: this.ifRow() ? 'column' : 'row'
-        }
-
-        var defaultProps = {
-            style: type
-        }
+  setNativeProps(nativeProps) {
+    this._root.setNativeProps(nativeProps);
+  }
 
-        return computeProps(this.props, defaultProps);
+  props: {
+    children: Object,
+    onPress: Function
+  };
 
-    }
+  prepareRootProps() {
+    const defaultProps = {
+      style: {
+        flex: 1,
+        flexDirection: ifRow() ? 'column' : 'row'
+      }
+    };
 
-    ifRow() {
-        var row = false;
-        React.Children.forEach(this.props.children, function (child) {
-            if(child && child.type == Row)
-                row = true;
-        })
-        return row;
-    }
+    return computeProps(this.props, defaultProps);
+  }
 
-    setNativeProps(nativeProps) {
-      this._root.setNativeProps(nativeProps);
-    }
+  renderGrid() {
+    return (
+      <View
+        ref={(component) => {
+          this._root = component;
+        }}
+        {...this.props}
+        {...this.prepareRootProps()}
+      >
+        {this.props.children}
+      </View>
+    );
+  }
 
   render() {
-    if(this.props.onPress){
-      return(
+    if (this.props.onPress) {
+      return (
         <TouchableOpacity onPress={this.props.onPress}>
-    <View
-      ref={component => this._root = component}
-      {...this.props}
-      {...this.prepareRootProps()}
-    >{this.props.children}</View>
-      </TouchableOpacity>
-    );
+          {this.renderGrid()}
+        </TouchableOpacity>
+      );
     }
-    else{
-      return(
-        <View
-      ref={component => this._root = component}
-      {...this.props}
-      {...this.prepareRootProps()}
-    >{this.props.children}</View>
-    );
-    }
-  }
 
+    return this.renderGrid();
+  }
 }

Components/Row.js

@@ -1,53 +1,54 @@
-'use strict';
-
 import React, {Component} from 'react';
 import {View, TouchableOpacity} from 'react-native';
-
 import computeProps from '../Utils/computeProps';
-import _ from 'lodash';
-
 
 export default class RowNB extends Component {
-    prepareRootProps() {
-
-        var type = {
-        	flexDirection: 'row',
-        	flex: (this.props.size) ? this.props.size : (this.props.style && this.props.style.height) ? 0 : 1,
-        }
-
-        var defaultProps = {
-            style: type
-        }
-        return computeProps(this.props, defaultProps);
-
-    }
+  setNativeProps(nativeProps) {
+    this._root.setNativeProps(nativeProps);
+  }
+
+  props: {
+    style: Object,
+    size: number,
+    children: Object,
+    onPress: Function
+  };
+
+  prepareRootProps() {
+    const flex = (this.props.style && this.props.style.height) ? 0 : 1;
+    const defaultProps = {
+      style: {
+        flexDirection: 'row',
+        flex: this.props.size ? this.props.size : flex
+      }
+    };
 
-    setNativeProps(nativeProps) {
-      this._root.setNativeProps(nativeProps);
-    }
+    return computeProps(this.props, defaultProps);
+  }
 
-    render() {
-      if(this.props.onPress){
-        return(
-            <TouchableOpacity onPress={this.props.onPress}>
-          <View
-        ref={component => this._root = component}
+  renderView() {
+    return (
+      <View
+        ref={(component) => {
+          this._root = component;
+        }}
         {...this.props}
         {...this.prepareRootProps()}
-      >{this.props.children}</View>
-          </TouchableOpacity>
+      >
+        {this.props.children}
+      </View>
+    );
+  }
+
+  render() {
+    if (this.props.onPress) {
+      return (
+        <TouchableOpacity onPress={this.props.onPress}>
+          {this.renderView()}
+        </TouchableOpacity>
       );
-      }
-      else{
-        return(
-          <View
-            ref={component => this._root = component}
-            {...this.props}
-            {...this.prepareRootProps()}
-          >{this.props.children}</View>
-        );
-      }
     }
 
-
+    return this.renderView();
+  }
 }

Components/_tests_/Col.test.js

@@ -1,9 +1,9 @@
-import "react-native";
-import React from "react";
-import Col from "../Col";
-import renderer from "react-test-renderer";
+import 'react-native';
+import React from 'react';
+import renderer from 'react-test-renderer';
+import Col from '../Col';
 
-test("renders correctly", () => {
+test('renders correctly', () => {
   const tree = renderer.create(<Col />).toJSON();
   expect(tree).toMatchSnapshot();
 });

Components/_tests_/Grid.test.js

@@ -1,9 +1,9 @@
-import "react-native";
-import React from "react";
-import Grid from "../Grid";
-import renderer from "react-test-renderer";
+import 'react-native';
+import React from 'react';
+import renderer from 'react-test-renderer';
+import Grid from '../Grid';
 
-test("renders correctly", () => {
+test('renders correctly', () => {
   const tree = renderer.create(<Grid />).toJSON();
   expect(tree).toMatchSnapshot();
 });

Components/_tests_/Row.test.js

@@ -1,9 +1,9 @@
-import "react-native";
-import React from "react";
-import Row from "../Row";
-import renderer from "react-test-renderer";
+import 'react-native';
+import React from 'react';
+import renderer from 'react-test-renderer';
+import Row from '../Row';
 
-test("renders correctly", () => {
+test('renders correctly', () => {
   const tree = renderer.create(<Row />).toJSON();
   expect(tree).toMatchSnapshot();
 });