add onPress to show method

Author: calintamas

CHANGELOG.md

@@ -9,6 +9,13 @@ Headers are one of:
 
 - `Added`, `Changed`, `Removed` or `Fixed`.
 
+## [next]
+
+### Added
+
+- Add `onPress` to `Toast.show` method
+- Export `BaseToast` component to allow styling
+
 ## [1.3.7]
 
 ### Added

README.md

@@ -71,7 +71,8 @@ Toast.show({
   topOffset: 30,
   bottomOffset: 40,
   onShow: () => {},
-  onHide: () => {}
+  onHide: () => {},
+  onPress: () => {}
 });
 ```
 

src/components/base/index.js

@@ -11,6 +11,7 @@ function BaseToast({
   trailingIcon,
   text1,
   text2,
+  onPress,
   onLeadingIconPress,
   onTrailingIconPress,
   style,
@@ -20,15 +21,19 @@ function BaseToast({
   trailingIconStyle,
   contentContainerStyle,
   text1Style,
-  text2Style
+  text2Style,
+  activeOpacity
 }) {
   return (
-    <View style={[styles.base, styles.borderLeft, style]}>
+    <TouchableOpacity
+      style={[styles.base, styles.borderLeft, style]}
+      onPress={onPress}
+      activeOpacity={activeOpacity}>
       {leadingIcon && (
         <TouchableOpacity
           style={[styles.leadingIconContainer, leadingIconContainerStyle]}
           onPress={onLeadingIconPress}
-          activeOpacity={1}>
+          activeOpacity={activeOpacity}>
           <Icon
             style={[styles.leadingIcon, leadingIconStyle]}
             source={leadingIcon}
@@ -57,14 +62,14 @@ function BaseToast({
         <TouchableOpacity
           style={[styles.trailingIconContainer, trailingIconContainerStyle]}
           onPress={onTrailingIconPress}
-          activeOpacity={1}>
+          activeOpacity={activeOpacity}>
           <Icon
             style={[styles.trailingIcon, trailingIconStyle]}
             source={trailingIcon}
           />
         </TouchableOpacity>
       )}
-    </View>
+    </TouchableOpacity>
   );
 }
 
@@ -75,6 +80,7 @@ BaseToast.propTypes = {
   trailingIcon: Icon.propTypes.source,
   text1: PropTypes.string,
   text2: PropTypes.string,
+  onPress: PropTypes.func,
   onTrailingIconPress: PropTypes.func,
   onLeadingIconPress: PropTypes.func,
   style: ViewPropTypes.style,
@@ -84,14 +90,16 @@ BaseToast.propTypes = {
   trailingIconStyle: ViewPropTypes.style,
   contentContainerStyle: ViewPropTypes.style,
   text1Style: ViewPropTypes.style,
-  text2Style: ViewPropTypes.style
+  text2Style: ViewPropTypes.style,
+  activeOpacity: PropTypes.number
 };
 
 BaseToast.defaultProps = {
   leadingIcon: undefined,
   trailingIcon: icons.close,
   text1: undefined,
   text2: undefined,
+  onPress: undefined,
   onLeadingIconPress: undefined,
   onTrailingIconPress: undefined,
   style: undefined,
@@ -101,7 +109,8 @@ BaseToast.defaultProps = {
   trailingIconStyle: undefined,
   contentContainerStyle: undefined,
   text1Style: undefined,
-  text2Style: undefined
+  text2Style: undefined,
+  activeOpacity: 0.8
 };
 
 export default BaseToast;

src/index.js

@@ -11,14 +11,14 @@ import styles from './styles';
 const FRICTION = 8;
 
 const defaultComponentsConfig = {
-  success: ({ hide, text1, text2 }) => (
-    <SuccessToast onTrailingIconPress={hide} text1={text1} text2={text2} />
+  success: ({ hide, ...rest }) => (
+    <SuccessToast {...rest} onTrailingIconPress={hide} />
   ),
-  error: ({ hide, text1, text2 }) => (
-    <ErrorToast onTrailingIconPress={hide} text1={text1} text2={text2} />
+  error: ({ hide, ...rest }) => (
+    <ErrorToast {...rest} onTrailingIconPress={hide} />
   ),
-  info: ({ hide, text1, text2 }) => (
-    <InfoToast onTrailingIconPress={hide} text1={text1} text2={text2} />
+  info: ({ hide, ...rest }) => (
+    <InfoToast {...rest} onTrailingIconPress={hide} />
   )
 };
 
@@ -47,6 +47,7 @@ const getInitialState = (props) => {
     text1: undefined,
     text2: undefined,
 
+    onPress: undefined,
     onShow,
     onHide
   };
@@ -98,7 +99,7 @@ class Toast extends Component {
     };
 
     this.panResponder = PanResponder.create({
-      onStartShouldSetPanResponder: () => true,
+      onMoveShouldSetPanResponder: () => true,
       onPanResponderMove: (event, gesture) => {
         this._animateMovement(gesture);
       },
@@ -272,7 +273,8 @@ class Toast extends Component {
           'text1',
           'text2',
           'hide',
-          'show'
+          'show',
+          'onPress'
         ]
       }),
       props: { ...customProps },