merged

Sankhadeep Roy · Sankhadeep Roy · commit 45741db05d3a · 2016-04-25T16:50:27.000+05:30
diff --git a/Components/Widgets/Card.js b/Components/Widgets/Card.js
@@ -0,0 +1,38 @@
+/* @flow */
+'use strict';
+
+import React, {View} from 'react-native';
+import NativeBaseComponent from '../Base/NativeBaseComponent';
+import _ from 'lodash';
+import computeProps from '../../Utils/computeProps';
+
+export default class CardNB extends NativeBaseComponent {
+
+    getInitialStyle() {
+        return {
+            card: {
+                borderWidth: 1,
+                borderRadius: 8
+            }
+        }
+    }
+
+    prepareRootProps() {
+
+        var defaultProps = {
+            style: this.getInitialStyle().card
+        };
+
+        return computeProps(this.props, defaultProps);
+
+    }
+    
+    render() { 
+        return(
+          <View {...this.prepareRootProps()} >
+            {this.props.children}
+          </View>
+        );
+    }
+
+}
diff --git a/Components/Widgets/ListItem.js b/Components/Widgets/ListItem.js
@@ -1,14 +1,15 @@
 /* @flow */
 'use strict';
 
-import React from 'react-native';
+import React, {Image} from 'react-native';
 import NativeBaseComponent from '../Base/NativeBaseComponent';
 import _ from 'lodash';
 import computeProps from '../../Utils/computeProps';
 import Icon from './Icon';
 import Text from './Text';
 import View from './View';
 import Button from './Button';
+import Thumbnail from './Thumbnail';
 
 export default class ListItemNB extends NativeBaseComponent {
 
@@ -21,7 +22,8 @@ export default class ListItemNB extends NativeBaseComponent {
                 paddingLeft: 10,
                 flex: 1,
                 flexDirection: 'row',
-                justifyContent: 'space-between'
+                justifyContent: 'space-between',
+                alignItems: 'center'
             },
             listItemDivider: {
                 borderBottomWidth: 1,
@@ -50,31 +52,83 @@ export default class ListItemNB extends NativeBaseComponent {
                 flex: 1,
                 textAlign: 'right',
 
+            },
+            itemSubNote: {
+                fontSize: 15,
+                color: '#999'
+            },
+            thumbnail: {
+
+            },
+            fullImage: {
+                width: 300,
+                height: 300
             }
         }
     }
 
+    isThumbnail() {
+        var thumbnailComponentPresent = false;
+        React.Children.forEach(this.props.children, function (child) {
+            if(child.type == Thumbnail)
+                thumbnailComponentPresent = true;
+        })
+
+        return thumbnailComponentPresent;
+    }
+
     getChildStyle(child) {
         var mergedStyle = {};
         if(child.type == Icon) {
             return _.merge(mergedStyle, this.getInitialStyle().itemIcon, child.props.style);
         }
 
         else if(child.type == Text) {
-            if(child.props.note)
+            if(child.props.note && this.isThumbnail())
+                return _.merge(mergedStyle, this.getInitialStyle().itemSubNote, child.props.style);
+            else if(child.props.note)
                 return _.merge(mergedStyle, this.getInitialStyle().itemNote, child.props.style);
-            else 
+            else
                 return _.merge(mergedStyle, this.getInitialStyle().itemText, child.props.style);
         }
 
         else if(child.type == Button) {
             return _.merge(mergedStyle, this.getInitialStyle().itemButton, child.props.style);
         }
 
+        else if(child.type == Thumbnail) {
+            return _.merge(mergedStyle, this.getInitialStyle().thumbnail, child.props.style);
+        }
+
+        else if(child.type == Image && !Array.isArray(this.props.children))
+            return _.merge(mergedStyle, this.getInitialStyle().fullImage, child.props.style);
         else 
             return child.props.style;
     }
 
+    getChildProps(child) {
+        var defaultProps = {};
+        if(child.type == Image && !Array.isArray(this.props.children)) {
+            defaultProps = {
+                resizeMode: 'stretch', 
+                style: this.getChildStyle(child)
+            }
+        }
+        else if(child.type == Button) {
+            defaultProps = {
+                small: true,
+                style: this.getChildStyle(child)
+            }
+        }
+        else {
+            defaultProps = {
+                style: this.getChildStyle(child)
+            }
+        }
+
+        return computeProps(child.props, defaultProps);
+    }  
+
     prepareRootProps() {
         if(this.props.itemDivider)
             var defaultProps = {
@@ -93,7 +147,7 @@ export default class ListItemNB extends NativeBaseComponent {
 
     renderChildren() {
         var newChildren = React.Children.map(this.props.children, (child) => {
-          return React.cloneElement(child, {style: this.getChildStyle(child)})
+          return React.cloneElement(child, this.getChildProps(child));
         });
 
         console.log(newChildren);
diff --git a/index.js b/index.js
@@ -21,6 +21,7 @@ import Input from './Components/Widgets/Input';
 import InputGroup from './Components/Widgets/InputGroup';
 import Icon from './Components/Widgets/Icon';
 import Thumbnail from './Components/Widgets/Thumbnail';
+import Card from './Components/Widgets/Card';
 
 module.exports = {
 	Header: Header,
@@ -41,5 +42,6 @@ module.exports = {
 	View: View,
 	InputGroup: InputGroup,
 	Icon: Icon,
-	Thumbnail: Thumbnail
+	Thumbnail: Thumbnail,
+	Card: Card
 };
