react-native-touchable-action 1.0.10 → 1.0.12

package/FloatingActionButton.js

@@ -295,4 +295,4 @@ const styles = StyleSheet.create({
   }
 })
 
-export default FloatingActionButton;
+export default FloatingActionButton;

package/LICENSE

@@ -0,0 +1,19 @@
+Copyright © 2026 Eric Cartagena
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -11,11 +11,11 @@ iOS                 | Android
 
 ## Installation
 
-```
+```js
 npm install --save react-native-touchable-action
 ```
 or
-```
+```js
 yarn add react-native-touchable-action
 ```
 
@@ -29,32 +29,76 @@ yarn add react-native-touchable-action
 
 ##
 
-#### Basic Usage
-
-> To position your floating action, use the React Native style prop
-```
+#### Import the FloatingActionButton component
+```js
 import FloatingActionButton from 'react-native-touchable-action';
 ```
-```
-<FloatingActionButton
-  IconSource='Ionicons'
-  iconName='rocket'
-  onPress={() => {
-    console.log('You pressed the rocket button');
-  }}
-  style={{
-    position='absolute',
-    bottom=75,
-    right=50,
-  }}
-/>
-```
+#### Usage
+```js
+import React from 'react';
+import {
+  Text,
+  View,
+  StyleSheet,
+} from 'react-native';
+
+import FloatingActionButton from 'react-native-touchable-action';
+
+const App = () => {
+  return (
+    <View
+      style={styles.container}
+    >
+      <Text>React Native Touchable Action</Text>
+
+      <FloatingActionButton
+        IconSource='Ionicons'
+        iconName='rocket'
+        onPress={() => {
+          console.log('You pressed the rocket button');
+        }}
+        style={{
+          position: 'absolute',
+          bottom: 75,
+          right: 50,
+        }}
+      />
+    </View>
+  )
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+})
 
+export default App;
+```
+##
 ### Props:
+
+| Prop               | Type                                 | Required  | Description
+| :---               | :---                                 | :---      | :---
+| IconSource         | *String*                             | ***Yes*** | The source of the icon
+| iconName           | *String*                             | ***Yes*** | The name of the icon
+| onPress            | *Object({Function})*                 | No        | The action when the user presses the button
+| buttonColor        | *String* - Default: #480ca8        | No        | The color of the button
+| buttonColorPressed | *String* - Default: #6a4c93        | No        | The color of the button when pressed in
+| buttonSize         | *Object({Number})* - Default: 65     | No        | The size of the button
+| iconSize           | *Object({Number})* - Default: 40     | No        | The size of the icon inside the button
+| iconColor          | *String* - Default: #edf6f9        | No        | The color of the icon inside the button
+| iconColorPressed   | *String* - Default: #e2eafc        | No        | The color of the icon color when the button is pressed
+| shaded             | *Object({Boolean})* - Default: false | No        | The shadow underneath the button when not pressed in. Works best in Light Mode
+##
+
 #### IconSource (required)
 > type: String
 ###### The source of the icon
-```
+```js
 IconSource='Ionicons'
 ```
 ##
@@ -62,7 +106,7 @@ IconSource='Ionicons'
 #### iconName (required)
 > type: String
 ###### The name of the icon
-```
+```js
 iconName='rocket'
 ```
 ##
@@ -70,7 +114,7 @@ iconName='rocket'
 #### onPress
 > type: Object({Function})
 ###### The action when the user presses the button
-```
+```js
 onPress={() => {
   console.log('You pressed the rocket button');
 }
@@ -80,11 +124,11 @@ onPress={() => {
 #### buttonColor
 > type: String - Default: #480ca8
 ###### The color of the button
-```
+```js
 buttonColor='#0F044C'
 ```
-##### Example:
-```
+
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -99,7 +143,6 @@ buttonColor='#0F044C'
   buttonColor='#0F044C'
 />
 ```
-
 ##
 
 #### buttonColorPressed
@@ -110,12 +153,11 @@ buttonColor='#0F044C'
 :------------------:|:------------------:
  ButtonColor        | ButtonColorPressed
 
-```
+```js
 buttonColorPressed='#693C72'
 ```
 
-##### Example:
-```
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -131,7 +173,6 @@ buttonColorPressed='#693C72'
   buttonColorPressed='#693C72'
 />
 ```
-
 ##
 
 #### buttonSize
@@ -142,12 +183,11 @@ buttonColorPressed='#693C72'
 :--------------:|:--------------:
  Button Size 75 | Button Size 55
 
-```
+```js
 buttonSize={75}
 ```
 
-##### Example
-```
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -164,24 +204,22 @@ buttonSize={75}
   buttonSize={75}
 />
 ```
-
 ##
 
 #### iconSize
 > type: Object({Number}) - Default: 40
-###### The size of the icon inside the button.
+###### The size of the icon inside the button
 ###### This only changes the size of the icon inside the button, not the size of the button itself
 
 <img width="105" alt="Icon50" src="https://github.com/cartagenae/react-native-touchable-action/assets/6395465/ab76f0b2-039d-4cb6-89a1-cb4b4be367c3"> | <img width="105" alt="Icon35" src="https://github.com/cartagenae/react-native-touchable-action/assets/6395465/63220fcd-b598-4ab1-94f2-5b46f6184d67">
 :------------:|:------------:
  Icon Size 50 | Icon Size 35
 
-```
+```js
 iconSize={35}
 ```
 
-##### Example
-```
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -199,18 +237,16 @@ iconSize={35}
   iconSize={35}
 />
 ```
-
 ##
 
 #### iconColor
 > type: String - Default: #edf6f9
 ###### The color of the icon inside the button
-```
+```js
 iconColor='#edf6f9'
 ```
 
-##### Example
-```
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -229,7 +265,6 @@ iconColor='#edf6f9'
   iconColor='#edf6f9'
 />
 ```
-
 ##
 
 #### iconColorPressed
@@ -240,12 +275,11 @@ iconColor='#edf6f9'
 :------------------:|:------------------:
  Icon color         | Icon Color Pressed
 
-```
+```js
 iconColorPressed='#c9ccd5'
 ```
 
-##### Example
-```
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -265,7 +299,6 @@ iconColorPressed='#c9ccd5'
   iconColorPressed='#c9ccd5'
 />
 ```
-
 ##
 
 #### shaded
@@ -276,12 +309,11 @@ iconColorPressed='#c9ccd5'
 :----------:|:----------:
  Shaded     | Not Shaded
 
-```
+```js
 shaded={true}
 ```
 
-##### Example
-```
+```js
 <FloatingActionButton
   IconSource='Ionicons'
   iconName='rocket'
@@ -302,7 +334,7 @@ shaded={true}
   shaded={true}
 />
 ```
-
+---
 ## License
 
-React Native Floating Action Button is under the **MIT License**. See bundled <a href='https://github.com/cartagenae/react-native-touchable-action/blob/main/LICENSE' alt='license file'>**LICENSE**</a> file for details.
+React Native Floating Action Button is under the **MIT License**. See bundled <a href='https://github.com/cartagenae/react-native-touchable-action/blob/main/LICENSE' alt='license file'>**LICENSE**</a> file for details.

package/package.json

@@ -1,13 +1,15 @@
 {
   "name": "react-native-touchable-action",
-  "version": "1.0.10",
+  "version": "1.0.12",
   "description": "A simple floating action button component for any React Native project using Expo",
   "main": "FloatingActionButton.js",
   "author": "Eric Cartagena",
   "license": "MIT",
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-native": "^0.79.5"
+  },
   "dependencies": {
-    "@expo/vector-icons": "^13.0.0",
-    "react": "^18.2.0",
-    "react-native": "^0.72.4"
+    "@expo/vector-icons": "^14.1.0"
   }
 }