ListItem title can now be a View tag

flyingcircle · Jan 28, 2017 · 9fa8047 · 9fa8047
1 parent d797844
commit 9fa8047
Showing 1 changed file with 27 additions and 17 deletions.
diff --git a/src/list/ListItem.js b/src/list/ListItem.js
@@ -22,6 +22,7 @@ const ListItem = ({
   containerStyle,
   wrapperStyle,
   titleStyle,
+  titleContainerStyle,
   hideChevron,
   chevronColor,
   roundAvatar,
@@ -73,29 +74,37 @@ const ListItem = ({
               />
           )
         }
-        <View style={styles.titleContainer}>
-          <Text
-            style={[
-              styles.title,
-              titleStyle && titleStyle,
-              !leftIcon && {marginLeft: 10},
-              fontFamily && {fontFamily}
-            ]}>{title}</Text>
-          {(subtitle && (typeof subtitle === 'string')) ? (
-            <View style={subtitleContainerStyle}>
+        <View style={styles.titleSubtitleContainer}>
+          <View style={titleContainerStyle}>
+            {(title && (typeof title === 'string')) ? (
+              <Text
+                style={[
+                  styles.title,
+                  !leftIcon && {marginLeft: 10},
+                  titleStyle && titleStyle,
+                  fontFamily && {fontFamily}
+                ]}>{title}</Text>
+            ) : (
+              <View>
+                {title}
+              </View>
+            )}
+          </View>
+          <View style={subtitleContainerStyle}>
+            {(subtitle && (typeof subtitle === 'string')) ? (
               <Text
                 style={[
                   styles.subtitle,
                   !leftIcon && {marginLeft: 10},
                   subtitleStyle && subtitleStyle,
                   fontFamily && {fontFamily}
                 ]}>{subtitle}</Text>
-            </View>
-          ) : (
-            <View style={subtitleContainerStyle}>
-              {subtitle}
-            </View>
-          )}
+            ) : (
+              <View>
+                {subtitle}
+              </View>
+            )}
+          </View>
         </View>
         {
           !hideChevron && !rightTitle && (
@@ -151,6 +160,7 @@ ListItem.propTypes = {
   containerStyle: PropTypes.any,
   wrapperStyle: PropTypes.any,
   titleStyle: PropTypes.any,
+  titleContainerStyle: PropTypes.any,
   hideChevron: PropTypes.bool,
   chevronColor: PropTypes.string,
   roundAvatar: PropTypes.bool,
@@ -194,7 +204,7 @@ styles = StyleSheet.create({
       }
     })
   },
-  titleContainer: {
+  titleSubtitleContainer: {
     justifyContent: 'center',
     flex: 1,
   },