feat: add onpress prop for appbar content (#700)

callstack · Dec 18, 2018 · 79e1ef2 · 79e1ef2
1 parent c80ca3f
commit 79e1ef2
Showing 1 changed file with 35 additions and 22 deletions.
diff --git a/src/components/Appbar/AppbarContent.js b/src/components/Appbar/AppbarContent.js
@@ -1,7 +1,12 @@
 /* @flow */
 
 import * as React from 'react';
-import { View, StyleSheet, Platform } from 'react-native';
+import {
+  View,
+  StyleSheet,
+  Platform,
+  TouchableWithoutFeedback,
+} from 'react-native';
 import color from 'color';
 
 import Text from '../Typography/Text';
@@ -32,6 +37,10 @@ type Props = $RemoveChildren<typeof View> & {|
    * Style for the subtitle.
    */
   subtitleStyle?: any,
+  /**
+   * Function to execute on press.
+   */
+  onPress?: () => mixed,
   style?: any,
   /**
    * @optional
@@ -50,6 +59,7 @@ class AppbarContent extends React.Component<Props> {
       color: titleColor = black,
       subtitle,
       subtitleStyle,
+      onPress,
       style,
       titleStyle,
       theme,
@@ -64,31 +74,34 @@ class AppbarContent extends React.Component<Props> {
       .string();
 
     return (
-      <View style={[styles.container, style]} {...rest}>
-        <Text
-          style={[
-            {
-              color: titleColor,
-              fontFamily: Platform.OS === 'ios' ? fonts.regular : fonts.medium,
-            },
-            styles.title,
-            titleStyle,
-          ]}
-          numberOfLines={1}
-          accessibilityTraits="header"
-          accessibilityRole="header"
-        >
-          {title}
-        </Text>
-        {subtitle ? (
+      <TouchableWithoutFeedback onPress={onPress}>
+        <View style={[styles.container, style]} {...rest}>
           <Text
-            style={[styles.subtitle, { color: subtitleColor }, subtitleStyle]}
+            style={[
+              {
+                color: titleColor,
+                fontFamily:
+                  Platform.OS === 'ios' ? fonts.regular : fonts.medium,
+              },
+              styles.title,
+              titleStyle,
+            ]}
             numberOfLines={1}
+            accessibilityTraits="header"
+            accessibilityRole="header"
           >
-            {subtitle}
+            {title}
           </Text>
-        ) : null}
-      </View>
+          {subtitle ? (
+            <Text
+              style={[styles.subtitle, { color: subtitleColor }, subtitleStyle]}
+              numberOfLines={1}
+            >
+              {subtitle}
+            </Text>
+          ) : null}
+        </View>
+      </TouchableWithoutFeedback>
     );
   }
 }