From a6b6ea51dd48b505118895bf6c50ea0cec7c854e Mon Sep 17 00:00:00 2001
From: alvaro <me@alvaromb.com>
Date: Tue, 15 Dec 2015 23:27:46 +0100
Subject: [PATCH] fixes #13 Added support for TouchableNativeFeedback

Added full Android support
---
 Button.js    | 35 +++++++++++++++++++++++++----------
 README.md    |  6 ++++--
 package.json |  5 +----
 3 files changed, 30 insertions(+), 16 deletions(-)

diff --git a/Button.js b/Button.js
index 6cfc25c..ef4dcaa 100644
--- a/Button.js
+++ b/Button.js
@@ -9,6 +9,7 @@ var {
   PropTypes,
   ActivityIndicatorIOS,
   ProgressBarAndroid,
+  TouchableNativeFeedback,
   Platform
 } = React;
 var StyleSheetPropType = require('react-native/Libraries/StyleSheet/StyleSheetPropType');
@@ -16,12 +17,15 @@ var TextStylePropTypes = require('react-native/Libraries/Text/TextStylePropTypes
 
 var Button = React.createClass({
   propTypes: Object.assign({},
-    TouchableOpacity.propTypes,
     {textStyle: StyleSheetPropType(TextStylePropTypes),
     children: PropTypes.string.isRequired,
     isLoading: PropTypes.bool,
     isDisabled: PropTypes.bool,
-    activityIndicatorColor: PropTypes.string},
+    activityIndicatorColor: PropTypes.string,
+    onPress: PropTypes.func,
+    onLongPress: PropTypes.func,
+    onPressIn: PropTypes.func,
+    onPressOut: PropTypes.func},
   ),
 
   _renderInnerText: function () {
@@ -42,6 +46,7 @@ var Button = React.createClass({
               height: 20,
             }, styles.spinner]}
             styleAttr='Inverse'
+            color={this.props.activityIndicatorColor || 'black'}
           />
         );
       }
@@ -54,14 +59,13 @@ var Button = React.createClass({
   },
 
   render: function () {
-    // Extract TouchableOpacity props
+    // Extract Touchable props
     var touchableProps = {
       onPress: this.props.onPress,
       onPressIn: this.props.onPressIn,
       onPressOut: this.props.onPressOut,
       onLongPress: this.props.onLongPress
     };
-
     if (this.props.isDisabled === true || this.props.isLoading === true) {
       return (
         <View style={[styles.button, this.props.style, styles.opacity]}>
@@ -69,12 +73,23 @@ var Button = React.createClass({
         </View>
       );
     } else {
-      return (
-        <TouchableOpacity {...touchableProps}
-          style={[styles.button, this.props.style]}>
-          {this._renderInnerText()}
-        </TouchableOpacity>
-      );
+      if (Platform.OS !== 'android') {
+        return (
+          <TouchableOpacity {...touchableProps}
+            style={[styles.button, this.props.style]}>
+            {this._renderInnerText()}
+          </TouchableOpacity>
+        );
+      } else {
+        return (
+          <TouchableNativeFeedback {...touchableProps}
+            background={TouchableNativeFeedback.Ripple()}>
+            <Text style={[styles.button, this.props.style]}>
+              {this._renderInnerText()}
+            </Text>
+          </TouchableNativeFeedback>
+        );
+      }
     }
   }
 });
diff --git a/README.md b/README.md
index 4ace60b..69c95eb 100644
--- a/README.md
+++ b/README.md
@@ -6,6 +6,8 @@ A React Native button component customizable via ``style`` props.
 <img src="https://raw.githubusercontent.com/wiki/APSL/react-native-button/button.png" alt="Button component screenshot" width="400">
 </p>
 
+Renders a ``TouchableOpacity`` under iOS and a ``TouchableNativeFeedback`` under Android.
+
 ## Install
 
 Install the package:
@@ -22,7 +24,7 @@ import Button from 'apsl-react-native-button'
 
 ## Usage
 
-Provide ``TouchableOpacity``' props to the component (including ``style``),
+Provide ``TouchableWithoutFeedback``' props to the component (including ``style``),
 ``textStyle``'s ``StyleSheet`` to customize the inner text and a children node
 to render. You can also provide the ``isLoading`` prop that will dim the button
 and disable it to prevent accidental taps.
@@ -45,7 +47,7 @@ and disable it to prevent accidental taps.
 | ``children`` | ``string`` | The ``string`` to render as the text button. |
 | ``isLoading`` | ``bool`` | Renders an inactive state dimmed button with a spinner if ``true``. |
 | ``isDisabled`` | ``bool`` | Renders an inactive state dimmed button if ``true``. |
-| ``activityIndicatorColor`` | ``string`` | **iOS only**. Sets the button of the ``ActivityIndicatorIOS`` in the loading state. |
+| ``activityIndicatorColor`` | ``string`` | Sets the button of the ``ActivityIndicatorIOS`` or ``ProgressBarAndroid`` in the loading state. |
 
 Check the included example for more options.
 
diff --git a/package.json b/package.json
index 7280529..9946995 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "apsl-react-native-button",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "React Native button component with rounded corners.",
   "main": "Button.js",
   "scripts": {
@@ -24,7 +24,4 @@
     "url": "https://github.com/APSL/react-native-button/issues"
   },
   "homepage": "https://github.com/APSL/react-native-button#readme",
-  "peerDependencies": {
-    "react-native": ">=0.11.0"
-  }
 }